|
|
|
@ -1,17 +1,31 @@ |
|
|
|
|
// 活期业务 |
|
|
|
|
// 个人客户 |
|
|
|
|
<template> |
|
|
|
|
<div class="wrap"> |
|
|
|
|
<div class="nav"> |
|
|
|
|
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"> |
|
|
|
|
<el-menu-item index="1">开户</el-menu-item> |
|
|
|
|
<el-menu-item index="2">存款</el-menu-item> |
|
|
|
|
<el-menu-item index="3">取款</el-menu-item> |
|
|
|
|
<el-menu-item index="4">转账</el-menu-item> |
|
|
|
|
<el-menu-item index="5">结清</el-menu-item> |
|
|
|
|
<el-menu-item index="6">销户</el-menu-item> |
|
|
|
|
</el-menu> |
|
|
|
|
</div> |
|
|
|
|
<div class="title"> |
|
|
|
|
<p>客户信息</p> |
|
|
|
|
<p>个人业务</p> |
|
|
|
|
<i class="el-icon-arrow-right"></i> |
|
|
|
|
<p>活期业务</p> |
|
|
|
|
<i class="el-icon-arrow-right"></i> |
|
|
|
|
<p>个人客户信息建立</p> |
|
|
|
|
<p>开户</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="body"> |
|
|
|
|
<el-row :gutter="20"> |
|
|
|
|
<el-form ref="form" :model="form" label-width="120px"> |
|
|
|
|
<el-col :span="10" :offset="1"> |
|
|
|
|
<el-form-item label="证件类型"> |
|
|
|
|
<el-form-item label="客户号"> |
|
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="币种" required> |
|
|
|
|
<el-select v-model="form.x" placeholder="请选择"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in options" |
|
|
|
@ -21,10 +35,24 @@ |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="客户号" required> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="10" :offset="1"> |
|
|
|
|
<el-form-item label="客户姓名" required> |
|
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="币种" required> |
|
|
|
|
<el-form-item label="钞汇标识" required> |
|
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
</el-form> |
|
|
|
|
</el-row> |
|
|
|
|
<el-row :gutter="20"> |
|
|
|
|
<el-form ref="form" :model="form" label-width="120px"> |
|
|
|
|
<el-col :span="10" :offset="1"> |
|
|
|
|
<el-form-item label="账户性质"> |
|
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="账户类型" required> |
|
|
|
|
<el-select v-model="form.x" placeholder="请选择"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in options" |
|
|
|
@ -34,17 +62,7 @@ |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="通讯地址"> |
|
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="10" :offset="1"> |
|
|
|
|
<el-form-item label="证件号码" required> |
|
|
|
|
<div class="idCard"> |
|
|
|
|
<p>请刷身份证</p> |
|
|
|
|
</div> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="性别" required> |
|
|
|
|
<el-form-item label="支取方式" required> |
|
|
|
|
<el-select v-model="form.x" placeholder="请选择"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in options" |
|
|
|
@ -54,7 +72,9 @@ |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="民族"> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="10" :offset="1"> |
|
|
|
|
<el-form-item label="凭证类型" required> |
|
|
|
|
<el-select v-model="form.x" placeholder="请选择"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in options" |
|
|
|
@ -64,11 +84,10 @@ |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="联系电话" required> |
|
|
|
|
<el-form-item label="凭证号码" required> |
|
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
|
</el-form> |
|
|
|
|
</el-row> |
|
|
|
|
</div> |
|
|
|
@ -107,7 +126,8 @@ export default { |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
visible:false, |
|
|
|
|
options:[] |
|
|
|
|
options:[], |
|
|
|
|
activeIndex:'1', |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -117,7 +137,9 @@ export default { |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
|
|
|
|
|
handleSelect(val){ |
|
|
|
|
console.log(val,'xuanze'); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
@ -128,6 +150,23 @@ export default { |
|
|
|
|
display: flex; |
|
|
|
|
flex-direction: column; |
|
|
|
|
overflow: hidden; |
|
|
|
|
.nav{ |
|
|
|
|
/deep/ .el-menu.el-menu--horizontal{ |
|
|
|
|
border: 0; |
|
|
|
|
} |
|
|
|
|
/deep/ .el-menu--horizontal > .el-menu-item.is-active{ |
|
|
|
|
border:2px solid #568DF2; |
|
|
|
|
border-radius: 10px; |
|
|
|
|
color: #000; |
|
|
|
|
} |
|
|
|
|
/deep/ .el-menu--horizontal > .el-menu-item{ |
|
|
|
|
border: 2px solid transparent; |
|
|
|
|
border-radius: 10px; |
|
|
|
|
margin-right: 10px; |
|
|
|
|
height: 30px; |
|
|
|
|
line-height: 28px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.title{ |
|
|
|
|
height: 60px; |
|
|
|
|
display: flex; |
|
|
|
|