huoran
/
FE_bankTeaching
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

页面路由修改

Browse Source
20240205
yujialong 3 years ago
parent afd039c117
commit 4365ca211c
9 changed files with 609 additions and 607 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 122
      src/pages/bank/list/index.vue
  2. 448
      src/pages/counter/list/index.vue
  3. 468
      src/pages/index/list/index.vue
  4. 2
      src/pages/manage/index/index.vue
  5. 16
      src/pages/manage/navbar/index.vue
  6. 23
      src/router/modules/bank.js
  7. 77
      src/router/modules/counter.js
  8. 56
      src/router/modules/index.js
  9. 4
      src/router/routes.js

122
src/pages/bank/list/index.vue
Unescape View File

@ -1,122 +0,0 @@
<template>
<div class="wrap">
<img class="sth bg" src="@/assets/img/index-bg.png" alt="">
<div class="case">项目案例</div>
<div class="sth integrated-counter">
<img width="100%" src="@/assets/img/integrated-counter.png" alt="">
<div class="name">综合柜台</div>
</div>
<img class="sth international" src="@/assets/img/international.png" alt="">
<img class="sth manager" src="@/assets/img/manager.png" alt="">
<img class="sth credit-dep" src="@/assets/img/credit-dep.png" alt="">
<img class="sth company-finance" src="@/assets/img/company-finance.png" alt="">
<img class="sth personal-finance" src="@/assets/img/personal-finance.png" alt="">
<vCase></vCase>
</div>
</template>
<script>
import vCase from '@/components/case'
export default {
name: 'index',
data() {
return {
caseVisible: true,
}
},
components: {
vCase
},
mounted() {
},
methods: {
}
};
</script>
<style lang="scss" scoped>
.wrap{
.sth{
position: absolute;
&.cp{
cursor: pointer;
}
}
.bg{
top: 0;
left: 0;
width: 100%;
}
.integrated-counter{
top: 0;
left: 20%;
width: 35%;
img{
transition: all .5s;
&:hover{
margin-top: -10px;
}
}
.name{
position: absolute;
top: 43%;
left: -23%;
width: 280px;
height: 100px;
line-height: 94px;
text-align: center;
color: #fff;
font-size: 28px;
background: url(../../../assets/img/index-btn-bg.png) 0 0/cover no-repeat;
}
}
.international{
top: 0;
left: 72%;
width: 28%;
}
.manager{
top: 57%;
left: 65%;
width: 34%;
transition: all .5s;
&:hover{
top: calc(57% - 10px);
}
}
.credit-dep{
top: 38%;
left: 0;
width: 21%;
}
.company-finance{
top: 62%;
left: 10%;
width: 30%;
}
.personal-finance{
top: 80%;
left: 31%;
width: 30%;
}
.case{
position: absolute;
top: 80px;
left: 40px;
width: 250px;
height: 106px;
line-height: 106px;
text-align: center;
color: #fff;
font-size: 26px;
background: url(../../../assets/img/case.png) 0 0 /cover no-repeat;
cursor: pointer;
}
}
</style>

448
src/pages/counter/list/index.vue
Unescape View File

@ -0,0 +1,448 @@
<template>
<div class="wrap">
<img class="sth bg" src="@/assets/img/integrated-counter-bg.png" alt="">
<img class="sth guide" src="@/assets/img/guide.png" alt="">
<img class="sth man" src="@/assets/img/man.png" alt="">
<img class="sth counter" src="@/assets/img/counter.png" alt="">
<img class="sth glass" src="@/assets/img/glass.png" alt="">
<!-- 系统录入 -->
<el-tooltip placement="top" popper-class="sth-popper">
<div slot="content">
<img style="height: 145px" src="@/assets/img/tooltip/system.png" alt="">
</div>
<img @click="showManage" class="sth computer cp" src="@/assets/img/computer.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="50">
<div slot="content">
<img src="@/assets/img/tooltip/cpl.png" alt="">
</div>
<img class="sth summons cp" src="@/assets/img/summons.png" alt="">
</el-tooltip>
<el-tooltip placement="top-start" popper-class="sth-popper" offset="250">
<div slot="content">
<img src="@/assets/img/tooltip/ptpzx.png" alt="">
</div>
<img class="sth voucher-box cp" src="@/assets/img/voucher-box.png" alt="">
</el-tooltip>
<el-tooltip placement="top-start" popper-class="sth-popper" offset="250">
<div slot="content">
<img src="@/assets/img/tooltip/zk.png" alt="">
</div>
<img class="sth important cp" src="@/assets/img/important.png" alt="">
</el-tooltip>
<el-tooltip placement="left-start" popper-class="sth-popper">
<div slot="content">
<img src="@/assets/img/tooltip/qx.png" alt="">
</div>
<img class="sth money-box cp" src="@/assets/img/money-box.png" alt="" @click="showData('钱箱')">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-100">
<div slot="content">
<img src="@/assets/img/tooltip/yzh.png" alt="">
</div>
<img class="sth seal-box cp" src="@/assets/img/seal-box.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-100">
<div slot="content">
<img src="@/assets/img/tooltip/ycj.png" alt="">
</div>
<img class="sth currency-detector cp" src="@/assets/img/currency-detector.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-400">
<div slot="content">
<img src="@/assets/img/tooltip/dyj.png" alt="">
</div>
<img class="sth printer cp" src="@/assets/img/printer.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="50">
<div slot="content">
<img src="@/assets/img/tooltip/mmq.png" alt="">
</div>
<img class="sth cipher-machine cp" src="@/assets/img/cipher-machine.png" alt="">
</el-tooltip>
<img class="sth employee" src="@/assets/img/employee.png" alt="">
<el-tooltip placement="top" popper-class="sth-popper" offset="50">
<div slot="content">
<img src="@/assets/img/tooltip/skj.png" alt="">
</div>
<img class="sth card-machine cp" src="@/assets/img/card-machine.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-100">
<div slot="content">
<img src="@/assets/img/tooltip/sfz.png" alt="">
</div>
<img class="sth idCard-scanner cp" src="@/assets/img/idCard-scanner.png" alt="">
</el-tooltip>
<div class="goods-dia" :class="{active: showGoods}">
<img src="@/assets/img/idCard.png" alt="">
<img src="@/assets/img/open-account.png" alt="">
<img src="@/assets/img/cash.png" alt="">
</div>
<div class="goods" :class="{active: showGoods}" @click="toggleGoods">
<span>物品栏</span>
<img class="icon" src="@/assets/svg/arrow-right.svg" alt="">
</div>
<el-dialog :visible.sync="dataVisible" width="1280px" @close="closeData" :close-on-click-modal="false" :show-close="false" custom-class="data-dia">
<div slot="title" class="dia-header">
<div class="data-title">{{dataTitle}}</div>
<img class="close" src="@/assets/svg/close.svg" alt="" @click="closeDataDia">
</div>
<p class="tips">- 请单击选中所需材料、双击可放大预览 -</p>
<ul class="list">
<li :class="{checked: checkList.includes(1)}" @click="checkData(1)">
<img src="@/assets/img/idCard-sm.png" alt="">
<p>身份证</p>
</li>
<li :class="{checked: checkList.includes(2)}" @click="checkData(2)">
<img src="@/assets/img/idCard-copy-sm.png" alt="">
<p>身份证复印件</p>
</li>
<li :class="{checked: checkList.includes(3)}" @click="checkData(3)">
<img style="margin-top: 0" src="@/assets/img/open-account-apply-sm.png" alt="">
<p>开户申请书</p>
</li>
<li :class="{checked: checkList.includes(4)}" @click="checkData(4)">
<img style="margin-top: 32px" src="@/assets/img/cash-sm.png" alt="">
<p>现金</p>
</li>
</ul>
<div class="dia-footer">
<button type="button">确定</button>
</div>
</el-dialog>
<div class="system" style="margin-top:-8vh" v-if="manageVisible" width="1280px">
<router-view></router-view>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
import manage from '../../manage/index'
export default {
name: 'index',
components:{
manage:manage
},
data() {
return {
showGoods: false,
dataTitle: '',
dataVisible: false,
manageVisible:false,// 显示系统录入
checkList: []
}
},
watch: {
'$route.path':function(val){ // 控制弹框显隐
let arr = val.split('/').slice(-2)
if(arr.pop()==="manage"||arr[0]==='manage'){
this.manageVisible = true
}else{
this.manageVisible = false
}
}
},
created(){
let arr = this.$route.path.split('/').slice(-2)
if(arr.pop()==="manage"||arr[0]==='manage'){
this.manageVisible = true
}else{
this.manageVisible = false
}
},
mounted() {
},
methods: {
toggleGoods(){
this.showGoods = !this.showGoods
},
showData(type){
this.dataTitle = type
this.dataVisible = true
},
checkData(id){
this.checkList.includes(id) ? this.checkList.splice(this.checkList.indexOf(id),1) : this.checkList.push(id)
},
closeDataDia(){
this.dataVisible = false
},
closeData(){
this.checkList = []
},
// 展示系统管理
showManage(){
this.manageVisible=true
this.$router.push('/counter/list/manage/consumerClient')
}
}
};
</script>
<style lang="scss" scoped>
.wrap{
position: relative;
width: 100%;
height: calc(100vh - 68px);
overflow: hidden;
.sth{
position: absolute;
&.cp{
cursor: pointer;
}
}
.guide{
top: 90px;
left: 0;
width: 222px;
cursor: pointer;
&:hover{
opacity: .9;
}
}
.bg{
top: 0;
left: 0;
width: 100%;
}
.counter{
top: 116px;
left: 357px;
width: 1555px;
}
.glass{
top: -135px;
left: 956px;
width: 50%;
}
.employee{
top: 371px;
left: 920px;
width: 388px;
}
.man{
top: 82px;
right: 150px;
width: 262px;
}
.money-box{
top: 406px;
left: 445px;
width: 197px;
}
.important{
top: 372px;
left: 582px;
width: 175px;
}
.voucher-box{
top: 216px;
left: 718px;
width: 160px;
}
.summons{
top: 250px;
left: 844px;
width: 139px;
}
.computer{
top: 120px;
left: 955px;
width: 219px;
}
.card-machine{
top: 377px;
left: 1147px;
width: 110px;
}
.idCard-scanner{
top: 443px;
left: 1229px;
width: 82px;
}
.seal-box{
top: 486px;
left: 1340px;
width: 97px;
}
.currency-detector{
top: 492px;
left: 1421px;
width: 151px;
}
.printer{
top: 550px;
left: 1531px;
width: 205px;
}
.cipher-machine{
top: 324px;
left: 1298px;
width: 100px;
}
.goods{
position: fixed;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 94px;
height: 200px;
cursor: pointer;
background: url(../../../assets/img/sth-bg.png) 0 0/cover no-repeat;
span{
width: 30px;
margin-bottom: 10px;
color: #fff;
font-size: 30px;
text-align: center;
}
.icon{
width: 30px;
transition: all .5s;
}
&:hover{
opacity: .9;
}
&.active{
.icon{
transform: rotate(180deg);
}
}
}
.goods-dia{
display: flex;
position: fixed;
bottom: 0;
left: -100%;
justify-content: center;
align-items: center;
width: 100%;
padding: 20px 0;
transition: all .5s;
background-color: rgba(255,255,255,.7);
&.active{
left: 0;
}
img{
margin-right: 50px;
&:last-child{
margin-right: 0;
}
}
}
}
/deep/.data-dia{
border-radius: 16px;
margin-top: 11vh!important;
.el-dialog__header{
padding: 0;
border-bottom: 0;
.dia-header{
position: relative;
.data-title{
width: 300px;
margin: 0 auto;
line-height: 72px;
text-align: center;
color: #fff;
font-size: 24px;
background: url(../../../assets/img/dia-title.png) 0 0/cover no-repeat;
}
.close{
position: absolute;
top: 15px;
right: 15px;
cursor: pointer;
}
}
}
.tips{
margin: 20px 0 100px;
text-align: center;
font-size: 20px;
color: #000;
}
.list{
width: 940px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
li{
position: relative;
width: 204px;
height: 204px;
text-align: center;
background: url(../../../assets/img/data-frame.png) 0 0/cover no-repeat;
cursor: pointer;
img{
margin-top: 45px;
}
p{
position: absolute;
bottom: 0;
width: 100%;
line-height: 54px;
text-align: center;
font-size: 18px;
color: #000;
}
&.checked{
background: url(../../../assets/img/data-frame-checked.png) 0 0/cover no-repeat,
url(../../../assets/svg/checked.svg) 165px 7%/auto no-repeat;
p{
color: #fff;
}
}
}
}
.dia-footer{
margin-top: 140px;
text-align: center;
button{
width: 300px;
line-height: 60px;
color: #fff;
font-size: 24px;
background-color: rgb(81,147,255);
border: 0;
border-radius: 20px;
cursor: pointer;
&:hover{
opacity: .9;
}
}
}
}
.system{
position: absolute;
top: 12%;
left: 50%;
z-index: 9;
transform: translate(-50%,0);
// display: flex;
}
/deep/ .view .el-dialog__body{
padding: 0!important;
}
</style>

468
src/pages/index/list/index.vue
Unescape View File

@ -1,448 +1,124 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<img class="sth bg" src="@/assets/img/integrated-counter-bg.png" alt=""> <img class="sth bg" src="@/assets/img/index-bg.png" alt="">
<img class="sth guide" src="@/assets/img/guide.png" alt=""> <div class="case">项目案例</div>
<img class="sth man" src="@/assets/img/man.png" alt="">
<img class="sth counter" src="@/assets/img/counter.png" alt="">
<img class="sth glass" src="@/assets/img/glass.png" alt="">
<!-- 系统录入 -->
<el-tooltip placement="top" popper-class="sth-popper">
<div slot="content">
<img style="height: 145px" src="@/assets/img/tooltip/system.png" alt="">
</div>
<img @click="showManage" class="sth computer cp" src="@/assets/img/computer.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="50">
<div slot="content">
<img src="@/assets/img/tooltip/cpl.png" alt="">
</div>
<img class="sth summons cp" src="@/assets/img/summons.png" alt="">
</el-tooltip>
<el-tooltip placement="top-start" popper-class="sth-popper" offset="250">
<div slot="content">
<img src="@/assets/img/tooltip/ptpzx.png" alt="">
</div>
<img class="sth voucher-box cp" src="@/assets/img/voucher-box.png" alt="">
</el-tooltip>
<el-tooltip placement="top-start" popper-class="sth-popper" offset="250">
<div slot="content">
<img src="@/assets/img/tooltip/zk.png" alt="">
</div>
<img class="sth important cp" src="@/assets/img/important.png" alt="">
</el-tooltip>
<el-tooltip placement="left-start" popper-class="sth-popper">
<div slot="content">
<img src="@/assets/img/tooltip/qx.png" alt="">
</div>
<img class="sth money-box cp" src="@/assets/img/money-box.png" alt="" @click="showData('钱箱')">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-100"> <div class="sth integrated-counter">
<div slot="content"> <img width="100%" src="@/assets/img/integrated-counter.png" alt="" @click="toPart('/counter')">
<img src="@/assets/img/tooltip/yzh.png" alt=""> <div class="name">综合柜台</div>
</div>
<img class="sth seal-box cp" src="@/assets/img/seal-box.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-100">
<div slot="content">
<img src="@/assets/img/tooltip/ycj.png" alt="">
</div>
<img class="sth currency-detector cp" src="@/assets/img/currency-detector.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-400">
<div slot="content">
<img src="@/assets/img/tooltip/dyj.png" alt="">
</div>
<img class="sth printer cp" src="@/assets/img/printer.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="50">
<div slot="content">
<img src="@/assets/img/tooltip/mmq.png" alt="">
</div>
<img class="sth cipher-machine cp" src="@/assets/img/cipher-machine.png" alt="">
</el-tooltip>
<img class="sth employee" src="@/assets/img/employee.png" alt="">
<el-tooltip placement="top" popper-class="sth-popper" offset="50">
<div slot="content">
<img src="@/assets/img/tooltip/skj.png" alt="">
</div>
<img class="sth card-machine cp" src="@/assets/img/card-machine.png" alt="">
</el-tooltip>
<el-tooltip placement="top" popper-class="sth-popper" offset="-100">
<div slot="content">
<img src="@/assets/img/tooltip/sfz.png" alt="">
</div>
<img class="sth idCard-scanner cp" src="@/assets/img/idCard-scanner.png" alt="">
</el-tooltip>
<div class="goods-dia" :class="{active: showGoods}">
<img src="@/assets/img/idCard.png" alt="">
<img src="@/assets/img/open-account.png" alt="">
<img src="@/assets/img/cash.png" alt="">
</div>
<div class="goods" :class="{active: showGoods}" @click="toggleGoods">
<span>物品栏</span>
<img class="icon" src="@/assets/svg/arrow-right.svg" alt="">
</div>
<el-dialog :visible.sync="dataVisible" width="1280px" @close="closeData" :close-on-click-modal="false" :show-close="false" custom-class="data-dia">
<div slot="title" class="dia-header">
<div class="data-title">{{dataTitle}}</div>
<img class="close" src="@/assets/svg/close.svg" alt="" @click="closeDataDia">
</div>
<p class="tips">- 请单击选中所需材料、双击可放大预览 -</p>
<ul class="list">
<li :class="{checked: checkList.includes(1)}" @click="checkData(1)">
<img src="@/assets/img/idCard-sm.png" alt="">
<p>身份证</p>
</li>
<li :class="{checked: checkList.includes(2)}" @click="checkData(2)">
<img src="@/assets/img/idCard-copy-sm.png" alt="">
<p>身份证复印件</p>
</li>
<li :class="{checked: checkList.includes(3)}" @click="checkData(3)">
<img style="margin-top: 0" src="@/assets/img/open-account-apply-sm.png" alt="">
<p>开户申请书</p>
</li>
<li :class="{checked: checkList.includes(4)}" @click="checkData(4)">
<img style="margin-top: 32px" src="@/assets/img/cash-sm.png" alt="">
<p>现金</p>
</li>
</ul>
<div class="dia-footer">
<button type="button">确定</button>
</div>
</el-dialog>
<div class="system" style="margin-top:-8vh" v-if="manageVisible" width="1280px">
<router-view></router-view>
</div> </div>
<img class="sth international" src="@/assets/img/international.png" alt="">
<img class="sth manager" src="@/assets/img/manager.png" alt="" @click="toPart('/lobbyManager')">
<img class="sth credit-dep" src="@/assets/img/credit-dep.png" alt="">
<img class="sth company-finance" src="@/assets/img/company-finance.png" alt="">
<img class="sth personal-finance" src="@/assets/img/personal-finance.png" alt="">
<vCase></vCase>
</div> </div>
</template> </template>
<script> <script>
import { mapState } from 'vuex' import vCase from '@/components/case'
import manage from '../../manage/index'
export default { export default {
name: 'index', name: 'index',
components:{
manage:manage
},
data() { data() {
return { return {
showGoods: false, caseVisible: true,
dataTitle: '',
dataVisible: false,
manageVisible:false,// 显示系统录入
checkList: []
} }
}, },
watch: { components: {
'$route.path':function(val){ // 控制弹框显隐 vCase
let arr = val.split('/').slice(-2)
if(arr.pop()==="manage"||arr[0]==='manage'){
this.manageVisible = true
}else{
this.manageVisible = false
}
}
},
created(){
let arr = this.$route.path.split('/').slice(-2)
if(arr.pop()==="manage"||arr[0]==='manage'){
this.manageVisible = true
}else{
this.manageVisible = false
}
}, },
mounted() { mounted() {
}, },
methods: { methods: {
toggleGoods(){ toPart(path){
this.showGoods = !this.showGoods this.$router.push(path)
},
showData(type){
this.dataTitle = type
this.dataVisible = true
}, },
checkData(id){
this.checkList.includes(id) ? this.checkList.splice(this.checkList.indexOf(id),1) : this.checkList.push(id)
},
closeDataDia(){
this.dataVisible = false
},
closeData(){
this.checkList = []
},
// 展示系统管理
showManage(){
this.manageVisible=true
this.$router.push('/index/list/manage/consumerClient')
}
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.wrap{ .wrap{
position: relative;
width: 100%;
height: calc(100vh - 68px);
overflow: hidden;
.sth{ .sth{
position: absolute; position: absolute;
&.cp{ &.cp{
cursor: pointer; cursor: pointer;
} }
} }
.guide{
top: 90px;
left: 0;
width: 222px;
cursor: pointer;
&:hover{
opacity: .9;
}
}
.bg{ .bg{
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
} }
.counter{ .integrated-counter{
top: 116px; top: 0;
left: 357px; left: 20%;
width: 1555px; width: 35%;
} img{
.glass{
top: -135px;
left: 956px;
width: 50%;
}
.employee{
top: 371px;
left: 920px;
width: 388px;
}
.man{
top: 82px;
right: 150px;
width: 262px;
}
.money-box{
top: 406px;
left: 445px;
width: 197px;
}
.important{
top: 372px;
left: 582px;
width: 175px;
}
.voucher-box{
top: 216px;
left: 718px;
width: 160px;
}
.summons{
top: 250px;
left: 844px;
width: 139px;
}
.computer{
top: 120px;
left: 955px;
width: 219px;
}
.card-machine{
top: 377px;
left: 1147px;
width: 110px;
}
.idCard-scanner{
top: 443px;
left: 1229px;
width: 82px;
}
.seal-box{
top: 486px;
left: 1340px;
width: 97px;
}
.currency-detector{
top: 492px;
left: 1421px;
width: 151px;
}
.printer{
top: 550px;
left: 1531px;
width: 205px;
}
.cipher-machine{
top: 324px;
left: 1298px;
width: 100px;
}
.goods{
position: fixed;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 94px;
height: 200px;
cursor: pointer;
background: url(../../../assets/img/sth-bg.png) 0 0/cover no-repeat;
span{
width: 30px;
margin-bottom: 10px;
color: #fff;
font-size: 30px;
text-align: center;
}
.icon{
width: 30px;
transition: all .5s; transition: all .5s;
} &:hover{
&:hover{ margin-top: -10px;
opacity: .9;
}
&.active{
.icon{
transform: rotate(180deg);
} }
} }
.name{
position: absolute;
top: 43%;
left: -23%;
width: 280px;
height: 100px;
line-height: 94px;
text-align: center;
color: #fff;
font-size: 28px;
background: url(../../../assets/img/index-btn-bg.png) 0 0/cover no-repeat;
}
} }
.goods-dia{ .international{
display: flex; top: 0;
position: fixed; left: 72%;
bottom: 0; width: 28%;
left: -100%; }
justify-content: center; .manager{
align-items: center; top: 57%;
width: 100%; left: 65%;
padding: 20px 0; width: 34%;
transition: all .5s; transition: all .5s;
background-color: rgba(255,255,255,.7); &:hover{
&.active{ top: calc(57% - 10px);
left: 0;
}
img{
margin-right: 50px;
&:last-child{
margin-right: 0;
}
} }
} }
} .credit-dep{
/deep/.data-dia{ top: 38%;
border-radius: 16px; left: 0;
margin-top: 11vh!important; width: 21%;
.el-dialog__header{
padding: 0;
border-bottom: 0;
.dia-header{
position: relative;
.data-title{
width: 300px;
margin: 0 auto;
line-height: 72px;
text-align: center;
color: #fff;
font-size: 24px;
background: url(../../../assets/img/dia-title.png) 0 0/cover no-repeat;
}
.close{
position: absolute;
top: 15px;
right: 15px;
cursor: pointer;
}
}
} }
.tips{ .company-finance{
margin: 20px 0 100px; top: 62%;
text-align: center; left: 10%;
font-size: 20px; width: 30%;
color: #000;
} }
.list{ .personal-finance{
width: 940px; top: 80%;
margin: 0 auto; left: 31%;
display: flex; width: 30%;
justify-content: space-between;
align-items: center;
li{
position: relative;
width: 204px;
height: 204px;
text-align: center;
background: url(../../../assets/img/data-frame.png) 0 0/cover no-repeat;
cursor: pointer;
img{
margin-top: 45px;
}
p{
position: absolute;
bottom: 0;
width: 100%;
line-height: 54px;
text-align: center;
font-size: 18px;
color: #000;
}
&.checked{
background: url(../../../assets/img/data-frame-checked.png) 0 0/cover no-repeat,
url(../../../assets/svg/checked.svg) 165px 7%/auto no-repeat;
p{
color: #fff;
}
}
}
} }
.dia-footer{ .case{
margin-top: 140px; position: absolute;
top: 80px;
left: 40px;
width: 250px;
height: 106px;
line-height: 106px;
text-align: center; text-align: center;
button{ color: #fff;
width: 300px; font-size: 26px;
line-height: 60px; background: url(../../../assets/img/case.png) 0 0 /cover no-repeat;
color: #fff; cursor: pointer;
font-size: 24px;
background-color: rgb(81,147,255);
border: 0;
border-radius: 20px;
cursor: pointer;
&:hover{
opacity: .9;
}
}
} }
} }
.system{
position: absolute;
top: 12%;
left: 50%;
z-index: 9;
transform: translate(-50%,0);
// display: flex;
}
/deep/ .view .el-dialog__body{
padding: 0!important;
}
</style> </style>

2
src/pages/manage/index/index.vue
Unescape View File

@ -35,7 +35,7 @@ export default {
}, },
methods: { methods: {
close(){ close(){
this.$router.push('/index/list/') this.$router.push('/counter/list/')
} }
} }
}; };

16
src/pages/manage/navbar/index.vue
Unescape View File

@ -45,7 +45,7 @@ import Setting from '@/setting';
export default { export default {
data() { data() {
return { return {
onRoutes:'/index/list/manage/consumerClient', onRoutes:'/counter/list/manage/consumerClient',
menus: [ menus: [
{ {
icon: 'menu-icon icon-index', icon: 'menu-icon icon-index',
@ -53,10 +53,10 @@ export default {
title: '客户信息', title: '客户信息',
children: [ children: [
{ {
index: '/index/list/manage/consumerClient', index: '/counter/list/manage/consumerClient',
title: '个人客户信息建立', title: '个人客户信息建立',
},{ },{
index: '/index/list/manage/corporateClient', index: '/counter/list/manage/corporateClient',
title: '公司客户信息建立', title: '公司客户信息建立',
}, },
] ]
@ -67,23 +67,23 @@ export default {
title: '个人业务', title: '个人业务',
children:[ children:[
{ {
index: '/index/list/manage/currentAccount', index: '/counter/list/manage/currentAccount',
title: '活期业务', title: '活期业务',
}, },
{ {
index: '/index/list/manage/timeDeposit', index: '/counter/list/manage/timeDeposit',
title: '整存整取', title: '整存整取',
}, },
{ {
index: '/index/list/manage/usefulPhrases', index: '/counter/list/manage/usefulPhrases',
title: '零存整取', title: '零存整取',
}, },
{ {
index: '/index/list/manage/callDeposits', index: '/counter/list/manage/callDeposits',
title: '通知存款', title: '通知存款',
}, },
{ {
index: '/index/list/manage/accountService', index: '/counter/list/manage/accountService',
title: '账户服务', title: '账户服务',
}, },
] ]

23
src/router/modules/bank.js
Unescape View File

@ -1,23 +0,0 @@
import BasicLayout from '@/layouts/home';
const meta = {};
const pre = 'bank-';
export default {
path: '/bank',
name: 'bank',
redirect: {
name: `${pre}list`
},
meta,
component: BasicLayout,
children: [
{
name: `${pre}list`,
path: `list`,
component: () => import('@/pages/bank/list'),
meta: { title: '首页' }
},
]
};

77
src/router/modules/counter.js
Unescape View File

@ -0,0 +1,77 @@
import BasicLayout from '@/layouts/home';
const meta = {};
const pre = 'counter-';
export default {
path: '/counter',
name: 'counter',
redirect: {
name: `${pre}list`
},
meta,
component: BasicLayout,
children: [
{
name: `${pre}list`,
path: `list`,
component: () => import('@/pages/counter/list'),
meta: { title: '综合柜台' },
children:[
{
name: `${pre}manager`,
path: `manage`,
component: () => import('@/pages/manage/index'),
meta: { title: '系统管理' },
children:[
// 客户信息
{
name: `${pre}consumerClient`,
path: `consumerClient`,
component: () => import('@/pages/manage/list/client/consumerClient.vue'),
meta: { title: '个人客户信息建立' },
},
{
name: `${pre}corporateClient`,
path: `corporateClient`,
component: () => import('@/pages/manage/list/client/corporateClient.vue'),
meta: { title: '公司客户信息建立' },
},
// 个人业务
{
name: `${pre}currentAccount`,
path: `currentAccount`,
component: () => import('@/pages/manage/list/personal/currentAccount.vue'),
meta: { title: '活期业务' },
},
{
name: `${pre}timeDeposit`,
path: `timeDeposit`,
component: () => import('@/pages/manage/list/personal/timeDeposit.vue'),
meta: { title: '整存整取' }
},
{
name: `${pre}usefulPhrases`,
path: `usefulPhrases`,
component: () => import('@/pages/manage/list/personal/usefulPhrases.vue'),
meta: { title: '零存整取' },
},
{
name: `${pre}callDeposits`,
path: `callDeposits`,
component: () => import('@/pages/manage/list/personal/callDeposits.vue'),
meta: { title: '通知存款' },
},
{
name: `${pre}accountService`,
path: `accountService`,
component: () => import('@/pages/manage/list/personal/accountService.vue'),
meta: { title: '账户服务' },
},
]
}
]
},
]
};

56
src/router/modules/index.js
Unescape View File

@ -18,61 +18,7 @@ export default {
name: `${pre}list`, name: `${pre}list`,
path: `list`, path: `list`,
component: () => import('@/pages/index/list'), component: () => import('@/pages/index/list'),
meta: { title: '首页' }, meta: { title: '首页' }
children:[
{
name: `${pre}manager`,
path: `manage`,
component: () => import('@/pages/manage/index'),
meta: { title: '系统管理' },
children:[
// 客户信息
{
name: `${pre}consumerClient`,
path: `consumerClient`,
component: () => import('@/pages/manage/list/client/consumerClient.vue'),
meta: { title: '个人客户信息建立' },
},
{
name: `${pre}corporateClient`,
path: `corporateClient`,
component: () => import('@/pages/manage/list/client/corporateClient.vue'),
meta: { title: '公司客户信息建立' },
},
// 个人业务
{
name: `${pre}currentAccount`,
path: `currentAccount`,
component: () => import('@/pages/manage/list/personal/currentAccount.vue'),
meta: { title: '活期业务' },
},
{
name: `${pre}timeDeposit`,
path: `timeDeposit`,
component: () => import('@/pages/manage/list/personal/timeDeposit.vue'),
meta: { title: '整存整取' }
},
{
name: `${pre}usefulPhrases`,
path: `usefulPhrases`,
component: () => import('@/pages/manage/list/personal/usefulPhrases.vue'),
meta: { title: '零存整取' },
},
{
name: `${pre}callDeposits`,
path: `callDeposits`,
component: () => import('@/pages/manage/list/personal/callDeposits.vue'),
meta: { title: '通知存款' },
},
{
name: `${pre}accountService`,
path: `accountService`,
component: () => import('@/pages/manage/list/personal/accountService.vue'),
meta: { title: '账户服务' },
},
]
}
]
}, },
] ]
}; };

4
src/router/routes.js
Unescape View File

@ -1,5 +1,5 @@
import index from './modules/index' import index from './modules/index'
import bank from './modules/bank' import counter from './modules/counter'
import lobbyManager from './modules/lobbyManager' import lobbyManager from './modules/lobbyManager'
import BasicLayout from '@/layouts/home' import BasicLayout from '@/layouts/home'
@ -16,7 +16,7 @@ const frameIn = [
children: [] children: []
}, },
index, index,
bank, counter,
lobbyManager lobbyManager
] ]

Write Preview
Loading…
Cancel
Save