luoJunYong.123
3 years ago
parent
5e20f89f92
commit
614f4662a0
31 changed files with 1208 additions and 100 deletions
@ -0,0 +1,193 @@ |
|||||||
|
// 个人客户 |
||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="flex mt-8 ml-12 text-xl"> |
||||||
|
<p>客户信息</p> |
||||||
|
<i class="el-icon-arrow-right text-xl"></i> |
||||||
|
<p>个人客户信息建立</p> |
||||||
|
</div> |
||||||
|
<div class="body"> |
||||||
|
<el-row :gutter="20"> |
||||||
|
<el-form ref="form" :model="form" label-width="140px"> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item prop="userName" label="出票人账号" required> |
||||||
|
<el-input v-model="form.accountNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="出票人名称"> |
||||||
|
<el-input v-model="form.accountName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="收款人账号" required> |
||||||
|
<el-input v-model="form.collectionNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="收款人名称"> |
||||||
|
<el-input v-model="form.collectionName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="币种"> |
||||||
|
<el-input disabled v-model="form.currencyType"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="汇票号码" required> |
||||||
|
<el-input v-model="form.moneyOrderNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="到期日期" required> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.expireDate" |
||||||
|
type="date" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="汇划费金额"> |
||||||
|
<el-input :value="form.moneyOrderMoney" @input="val => ismoney(val, form, 'moneyOrderMoney')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item prop="userName" label="出票人行名"> |
||||||
|
<el-input v-model="form.accountTradeName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="出票行地址"> |
||||||
|
<el-input v-model="form.tradeAddress"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="收款人行名"> |
||||||
|
<el-input v-model="form.collectionTradeName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="票据类型"> |
||||||
|
<el-select v-model="form.billType" placeholder="请选择"> |
||||||
|
<el-option value="银行承兑汇票">银行承兑汇票</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="money" label="金额" required> |
||||||
|
<el-input :value="form.money" @input="val => ismoney(val, form, 'money')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="出票日期"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.drawBillDate" |
||||||
|
type="date" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="是否转让"> |
||||||
|
<el-select v-model="form.isTransfer" placeholder="请选择"> |
||||||
|
<el-option value="是">是</el-option> |
||||||
|
<el-option value="否">否</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="userName" label="手续费金额"> |
||||||
|
<el-input :value="form.serviceCharge" @input="val => ismoney(val, form, 'serviceCharge')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
|
||||||
|
</el-form> |
||||||
|
</el-row> |
||||||
|
</div> |
||||||
|
<el-button @click="submitForm" type="primary" class="submitBtn">提交</el-button> |
||||||
|
<!-- <el-dialog |
||||||
|
style="margin-top:10vh" |
||||||
|
:visible.sync="visible" |
||||||
|
:modal="false" |
||||||
|
width="40%" |
||||||
|
:close-on-click-modal="false" |
||||||
|
:show-close="false" |
||||||
|
custom-class="data-dia"> |
||||||
|
<div slot="title" class="dia-header"> |
||||||
|
<div class="data-title">提交</div> |
||||||
|
</div> |
||||||
|
<div class="popBody" v-if="!authorization&&!success"> |
||||||
|
<h2>本业务需要授权</h2> |
||||||
|
</div> |
||||||
|
<div class="popBody" v-if="authorization&&!success"> |
||||||
|
<el-form ref="form" :model="disForm" label-width="80px"> |
||||||
|
<el-form-item label="授权柜员"> |
||||||
|
<el-input disabled v-model="disForm.name"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="授权柜员"> |
||||||
|
<el-input type="password" disabled v-model="disForm.pass"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
</div> |
||||||
|
<div class="popBody" v-if="success"> |
||||||
|
<h2>完成表单form</h2> |
||||||
|
</div> |
||||||
|
<div class="popBtns"> |
||||||
|
<el-button class="close btn" @click="[visible = false,authorization=false,success=false]">取 消</el-button> |
||||||
|
<el-button class="sure btn" type="primary" @click="popSure">确 定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> --> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { vername, vermob } from '@/utils/verify.js' |
||||||
|
import { checkRequired, ismoney } from '@/utils/utilFunction.js' |
||||||
|
|
||||||
|
export default { |
||||||
|
name: 'index', |
||||||
|
data() { |
||||||
|
return { |
||||||
|
visible: false, |
||||||
|
form:{ |
||||||
|
// 必填项 |
||||||
|
accountNumber: '', // 出票人账号 |
||||||
|
collectionNumber: '', // 收款人账号 |
||||||
|
moneyOrderNumber: '', // 汇票号码 |
||||||
|
expireDate: '', // 到期日期 |
||||||
|
money: '', // 金额 |
||||||
|
// 非必填项 |
||||||
|
accountName: '', // 出票人名称 |
||||||
|
collectionName: '', // 收款人名称 |
||||||
|
currencyType: 'CYC人民币', // 币种 |
||||||
|
moneyOrderMoney: '', // 汇划费金额 |
||||||
|
accountTradeName: '', // 出票人行名 |
||||||
|
tradeAddress: '', // 出票行地址 |
||||||
|
collectionTradeName: '', // 收款人行名 |
||||||
|
billType: '', // 票据类型 |
||||||
|
drawBillDate: '', // 出票日期 |
||||||
|
isTransfer: '否', // 是否转让 |
||||||
|
serviceCharge: '' // 手续费金额 |
||||||
|
}, |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//提交个人用户信息 |
||||||
|
submitForm(){ |
||||||
|
const requiredField = { |
||||||
|
accountNumber: '出票人账号', // |
||||||
|
collectionNumber: '收款人账号', // |
||||||
|
moneyOrderNumber: '汇票号码', // |
||||||
|
expireDate: '到期日期', // |
||||||
|
money: '金额', // |
||||||
|
} |
||||||
|
if(checkRequired(this.form, requiredField)) { |
||||||
|
console.log('校验成功') |
||||||
|
} |
||||||
|
}, |
||||||
|
ismoney: ismoney |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap{ |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
overflow: auto; |
||||||
|
.title{ |
||||||
|
height: 60px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
font-size: 20px; |
||||||
|
padding-left: 50px; |
||||||
|
} |
||||||
|
.body{ |
||||||
|
margin-top: 50px; |
||||||
|
} |
||||||
|
.submitBtn{ |
||||||
|
width: 300px; |
||||||
|
margin-top: 10vh; |
||||||
|
font-size: 18px; |
||||||
|
height: 68px; |
||||||
|
border-radius: 10px; |
||||||
|
left: 50%; |
||||||
|
transform: translateX(-50%); |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,243 @@ |
|||||||
|
// 存款 |
||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="title"> |
||||||
|
<p>公司业务</p> |
||||||
|
<i class="el-icon-arrow-right"></i> |
||||||
|
<p>{{text}}</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- 存款 --> |
||||||
|
<div class="body"> |
||||||
|
<el-row :gutter="20" style="margin: 0"> |
||||||
|
<el-form ref="form" :model="form" label-width="150px"> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="本行收款账号" required> |
||||||
|
<el-input v-model="form.shroffAccountNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="金额" required> |
||||||
|
<el-input :value="form.money" @input="val => ismoney(val, form, 'money')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="提入日期"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.insertDate" |
||||||
|
type="date" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="他行收款户名"> |
||||||
|
<el-input v-model="form.otherAccountUsername"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="交换行号"> |
||||||
|
<el-input v-model="form.exchangeNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="报单号"> |
||||||
|
<el-input v-model="form.customsNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="收款户名" required> |
||||||
|
<el-input v-model="form.accountUsername"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="币种"> |
||||||
|
<el-input v-model="form.currency"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="提出场次"> |
||||||
|
<el-input :value="form.proposeTime" @input="val => inputListen(val, form, 'proposeTime')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="票据类型" required> |
||||||
|
<el-select v-model="form.billTyoe" placeholder="请选择"> |
||||||
|
<el-option label="银行本票" value="银行本票"> </el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="他行收款账号" required> |
||||||
|
<el-input v-model="form.otherAccountNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="凭证号码" required> |
||||||
|
<el-input v-model="form.voucherNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="交换行名"> |
||||||
|
<el-input v-model="form.exchangeName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="摘要"> |
||||||
|
<el-input v-model="form.abstract"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-form> |
||||||
|
</el-row> |
||||||
|
<el-button @click="submitForm" type="primary" class="submitBtn">提交</el-button> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-dialog |
||||||
|
style="margin-top:10vh" |
||||||
|
:visible.sync="visible" |
||||||
|
:modal="false" |
||||||
|
width="40%" |
||||||
|
:close-on-click-modal="false" |
||||||
|
:show-close="false" |
||||||
|
custom-class="data-dia" |
||||||
|
> |
||||||
|
<div slot="title" class="dia-header"> |
||||||
|
<div class="data-title">提交</div> |
||||||
|
</div> |
||||||
|
<div class="popBody"> |
||||||
|
<h2>本业务需要授权</h2> |
||||||
|
</div> |
||||||
|
<div class="popBtns"> |
||||||
|
<el-button class="close btn" @click="visible = false">取 消</el-button> |
||||||
|
<el-button class="sure btn" type="primary" @click="visible = false">确 定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { mapState } from 'vuex' |
||||||
|
import { checkRequired, ismoney, inputListen } from '@/utils/utilFunction.js' |
||||||
|
export default { |
||||||
|
name: 'index', |
||||||
|
components:{}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
text:'存款',/* 顶部文字 */ |
||||||
|
form:{ |
||||||
|
// 必填项 |
||||||
|
shroffAccountNumber: '', // 本行收款账号 |
||||||
|
money: '', // 金额 |
||||||
|
accountUsername: '', // 收款户名 |
||||||
|
billTyoe: '银行本票', // 票据类型 |
||||||
|
otherAccountNumber: '', // 他行收款账号 |
||||||
|
voucherNumber: '', // 凭证号码 |
||||||
|
// 非必填项 |
||||||
|
currency: 'CYC人民币', // 币种 |
||||||
|
proposeTime: '', // 提出场次 |
||||||
|
insertDate: '', // 提入日期 |
||||||
|
otherAccountUsername: '', // 他行收款户名 |
||||||
|
exchangeNumber: '', // 交换行号 |
||||||
|
abstract: '', // 摘要 |
||||||
|
customsNumber: '', // 报单号 |
||||||
|
exchangeName: '' // 交换行名 |
||||||
|
}, |
||||||
|
visible:false |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
submitForm() { |
||||||
|
const requiredField = { |
||||||
|
shroffAccountNumber: '本行收款账号', // |
||||||
|
money: '金额', // |
||||||
|
accountUsername: '收款户名', // |
||||||
|
billTyoe: '票据类型', // |
||||||
|
otherAccountNumber: '他行收款账号', // |
||||||
|
voucherNumber: '凭证号码', // |
||||||
|
} |
||||||
|
if(checkRequired(this.form, requiredField)) { |
||||||
|
console.log('检验成功') |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
ismoney: ismoney, |
||||||
|
inputListen: inputListen |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap{ |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
overflow: hidden; |
||||||
|
padding: 24px 0 24px 24px; |
||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.body{ |
||||||
|
margin-top: 50px; |
||||||
|
overflow: auto; |
||||||
|
.idCard{ |
||||||
|
border-radius: 5px; |
||||||
|
background: #CFDDFF; |
||||||
|
text-align: center; |
||||||
|
height: 40px; |
||||||
|
line-height: 40px; |
||||||
|
font-size: 18px; |
||||||
|
color: #6191FF; |
||||||
|
} |
||||||
|
.add{ |
||||||
|
position: relative; |
||||||
|
&::after{ |
||||||
|
content: ''; |
||||||
|
display: block; |
||||||
|
position: absolute; |
||||||
|
right: 3%; |
||||||
|
top: -4%; |
||||||
|
border: 1px dashed #CFDDFF; |
||||||
|
width: 88%; |
||||||
|
height: 268px; |
||||||
|
} |
||||||
|
.addBtn{ |
||||||
|
position: absolute; |
||||||
|
left: 0; |
||||||
|
top: 50%; |
||||||
|
transform: translate(50%,-50%); |
||||||
|
font-size: 22px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.submitBtn{ |
||||||
|
position: relative; |
||||||
|
width: 300px; |
||||||
|
font-size: 18px; |
||||||
|
height: 68px; |
||||||
|
margin-top: 50px; |
||||||
|
border-radius: 10px; |
||||||
|
bottom: 10px; |
||||||
|
left: 50%; |
||||||
|
transform: translate(-50%,-0%); |
||||||
|
} |
||||||
|
.popBody{ |
||||||
|
min-height: 200px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
.popBtns{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
.btn{ |
||||||
|
width: 180px; |
||||||
|
border-radius: 10px; |
||||||
|
font-size: 18px; |
||||||
|
} |
||||||
|
.close{ |
||||||
|
background: #CFDEFF; |
||||||
|
color: #6191FF; |
||||||
|
} |
||||||
|
.sure{ |
||||||
|
background: #6191FF; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,239 @@ |
|||||||
|
// 存款 |
||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="title"> |
||||||
|
<p>公司业务</p> |
||||||
|
<i class="el-icon-arrow-right"></i> |
||||||
|
<p>{{text}}</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- 存款 --> |
||||||
|
<div class="body"> |
||||||
|
<el-row :gutter="20" style="margin: 0"> |
||||||
|
<el-form ref="form" :model="form" label-width="150px"> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="本行收款账号" required> |
||||||
|
<el-input v-model="form.shroffAccountNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="金额" required> |
||||||
|
<el-input :value="form.money" @input="val => ismoney(val, form, 'money')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="提出日期"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.proposeDate" |
||||||
|
type="date" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="他行收款户名"> |
||||||
|
<el-input v-model="form.otherAccountUsername"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="出票日期"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.drawBillDate" |
||||||
|
type="date" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="本行收款户名" required> |
||||||
|
<el-input v-model="form.shroffAccountUsername"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="币种"> |
||||||
|
<el-input v-model="form.currency"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="提出场次"> |
||||||
|
<el-input :value="form.proposeTime" @input="val => inputListen(val, form, 'proposeTime')"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="票据类型" required> |
||||||
|
<el-select v-model="form.billTyoe" placeholder="请选择"> |
||||||
|
<el-option label="银行本票" value="银行本票"> </el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="他行收款账号" required> |
||||||
|
<el-input v-model="form.otherAccountNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="凭证号码" required> |
||||||
|
<el-input v-model="form.voucherNumber"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="摘要"> |
||||||
|
<el-input v-model="form.abstract"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-form> |
||||||
|
</el-row> |
||||||
|
<el-button @click="submitForm" type="primary" class="submitBtn">提交</el-button> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-dialog |
||||||
|
style="margin-top:10vh" |
||||||
|
:visible.sync="visible" |
||||||
|
:modal="false" |
||||||
|
width="40%" |
||||||
|
:close-on-click-modal="false" |
||||||
|
:show-close="false" |
||||||
|
custom-class="data-dia" |
||||||
|
> |
||||||
|
<div slot="title" class="dia-header"> |
||||||
|
<div class="data-title">提交</div> |
||||||
|
</div> |
||||||
|
<div class="popBody"> |
||||||
|
<h2>本业务需要授权</h2> |
||||||
|
</div> |
||||||
|
<div class="popBtns"> |
||||||
|
<el-button class="close btn" @click="visible = false">取 消</el-button> |
||||||
|
<el-button class="sure btn" type="primary" @click="visible = false">确 定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { mapState } from 'vuex' |
||||||
|
import { checkRequired, ismoney, inputListen } from '@/utils/utilFunction.js' |
||||||
|
export default { |
||||||
|
name: 'index', |
||||||
|
components:{}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
text:'存款',/* 顶部文字 */ |
||||||
|
form:{ |
||||||
|
// 必填项 |
||||||
|
shroffAccountNumber: '', // 本行收款账号 |
||||||
|
money: '', // 金额 |
||||||
|
shroffAccountUsername: '', // 本行收款户名 |
||||||
|
billTyoe: '银行本票', // 票据类型 |
||||||
|
otherAccountNumber: '', // 他行收款账号 |
||||||
|
voucherNumber: '', // 凭证号码 |
||||||
|
// 非必填项 |
||||||
|
currency: 'CYC人民币', // 币种 |
||||||
|
proposeTime: '', // 提出场次 |
||||||
|
proposeDate: '', // 提出日期 |
||||||
|
otherAccountUsername: '', // 其他收款户名 |
||||||
|
drawBillDate: '', // 出票日期 |
||||||
|
abstract: '', // 摘要 |
||||||
|
}, |
||||||
|
visible:false |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
submitForm() { |
||||||
|
const requiredField = { |
||||||
|
shroffAccountNumber: '本行收款账号', // |
||||||
|
money: '金额', // |
||||||
|
shroffAccountUsername: '本行收款户名', // |
||||||
|
billTyoe: '票据类型', // |
||||||
|
otherAccountNumber: '他行收款账号', // |
||||||
|
voucherNumber: '凭证号码', // |
||||||
|
} |
||||||
|
if(checkRequired(this.form, requiredField)) { |
||||||
|
console.log('检验成功') |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
ismoney: ismoney, |
||||||
|
inputListen: inputListen |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap{ |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
overflow: hidden; |
||||||
|
padding: 24px 0 24px 24px; |
||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.body{ |
||||||
|
margin-top: 50px; |
||||||
|
overflow: auto; |
||||||
|
.idCard{ |
||||||
|
border-radius: 5px; |
||||||
|
background: #CFDDFF; |
||||||
|
text-align: center; |
||||||
|
height: 40px; |
||||||
|
line-height: 40px; |
||||||
|
font-size: 18px; |
||||||
|
color: #6191FF; |
||||||
|
} |
||||||
|
.add{ |
||||||
|
position: relative; |
||||||
|
&::after{ |
||||||
|
content: ''; |
||||||
|
display: block; |
||||||
|
position: absolute; |
||||||
|
right: 3%; |
||||||
|
top: -4%; |
||||||
|
border: 1px dashed #CFDDFF; |
||||||
|
width: 88%; |
||||||
|
height: 268px; |
||||||
|
} |
||||||
|
.addBtn{ |
||||||
|
position: absolute; |
||||||
|
left: 0; |
||||||
|
top: 50%; |
||||||
|
transform: translate(50%,-50%); |
||||||
|
font-size: 22px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.submitBtn{ |
||||||
|
position: relative; |
||||||
|
width: 300px; |
||||||
|
font-size: 18px; |
||||||
|
height: 68px; |
||||||
|
margin-top: 50px; |
||||||
|
border-radius: 10px; |
||||||
|
bottom: 10px; |
||||||
|
left: 50%; |
||||||
|
transform: translate(-50%,-0%); |
||||||
|
} |
||||||
|
.popBody{ |
||||||
|
min-height: 200px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
.popBtns{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
.btn{ |
||||||
|
width: 180px; |
||||||
|
border-radius: 10px; |
||||||
|
font-size: 18px; |
||||||
|
} |
||||||
|
.close{ |
||||||
|
background: #CFDEFF; |
||||||
|
color: #6191FF; |
||||||
|
} |
||||||
|
.sure{ |
||||||
|
background: #6191FF; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,139 @@ |
|||||||
|
<template> |
||||||
|
<div class="changePassword"> |
||||||
|
<div class="title"> |
||||||
|
<p>账户服务</p> |
||||||
|
<i class="el-icon-arrow-right"></i> |
||||||
|
<p>密码修改</p> |
||||||
|
</div> |
||||||
|
<div class="body"> |
||||||
|
<el-row :gutter="20" style="margin: 0"> |
||||||
|
<el-form ref="form" :model="form" label-width="120px"> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="账号" required> |
||||||
|
<div class="idCard" @click="popUp('银行扫描器')"> |
||||||
|
<p>请刷银行卡</p> |
||||||
|
</div> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="证件类型"> |
||||||
|
<el-select v-model="form.certificateType"> |
||||||
|
<el-option label="身份证" value="身份证"> </el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="客户姓名" prop="customerName" :rules="rules.customerName"> |
||||||
|
<el-input v-model="form.customerName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="身份证" required> |
||||||
|
<div class="idCard" @click="popUp('身份证扫描器')"> |
||||||
|
<p>请刷身份证</p> |
||||||
|
</div> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="20" :offset="1"> |
||||||
|
<el-form-item label="备注"> |
||||||
|
<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="form.remark"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-form> |
||||||
|
</el-row> |
||||||
|
<el-button @click="submitForm" type="primary" class="submitBtn">提交</el-button> |
||||||
|
<el-dialog |
||||||
|
style="margin-top:10vh" |
||||||
|
:visible.sync="visible" |
||||||
|
:modal="false" |
||||||
|
width="40%" |
||||||
|
:close-on-click-modal="false" |
||||||
|
:show-close="false" |
||||||
|
custom-class="data-dia" |
||||||
|
> |
||||||
|
<div slot="title" class="dia-header"> |
||||||
|
<div class="data-title">提交</div> |
||||||
|
</div> |
||||||
|
<div class="popBody"> |
||||||
|
<h2 v-if='dialogChange'>本业务需要授权</h2> |
||||||
|
</div> |
||||||
|
<div class="popBtns"> |
||||||
|
<el-button class="close btn" @click="visible = false">取 消</el-button> |
||||||
|
<el-button class="sure btn" type="primary" @click="visible = false">确 定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { EventBus } from "@/utils/event-bus.js"; |
||||||
|
import { checkRequired, ismoney } from '@/utils/utilFunction.js' |
||||||
|
import { vername, verrate } from '@/utils/verify.js' |
||||||
|
export default{ |
||||||
|
name:'', |
||||||
|
props:{}, |
||||||
|
data(){ |
||||||
|
return{ |
||||||
|
form:{ |
||||||
|
// 必填项 |
||||||
|
customerName: '', // 客户姓名 |
||||||
|
// 非必填项 |
||||||
|
certificateType: '身份证', // 证件类型 |
||||||
|
remark: '', // 备注 |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
customerName: vername |
||||||
|
}, |
||||||
|
visible: false |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
popUp(text) { |
||||||
|
this.$store.commit('system/changePop',{show:true,id:'test66',id: 'test'}) |
||||||
|
EventBus.$emit("changeShowGoods", true); |
||||||
|
}, |
||||||
|
submitForm() { |
||||||
|
const requiredField = { |
||||||
|
} |
||||||
|
if(checkRequired(this.form, requiredField)) { |
||||||
|
this.visible = true |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
<style lang='scss' scoped> |
||||||
|
.changePassword{ |
||||||
|
width: 100%; |
||||||
|
.title{ |
||||||
|
margin-left: 80px; |
||||||
|
height: 60px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
font-size: 20px; |
||||||
|
padding-left: 0px; |
||||||
|
margin-top: 10px; |
||||||
|
} |
||||||
|
.body{ |
||||||
|
margin-top: 70px; |
||||||
|
.idCard{ |
||||||
|
border-radius: 5px; |
||||||
|
background: #CFDDFF; |
||||||
|
text-align: center; |
||||||
|
height: 40px; |
||||||
|
line-height: 40px; |
||||||
|
font-size: 18px; |
||||||
|
color: #6191FF; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
.submitBtn{ |
||||||
|
position: absolute; |
||||||
|
width: 300px; |
||||||
|
font-size: 18px; |
||||||
|
height: 68px; |
||||||
|
border-radius: 10px; |
||||||
|
bottom: 10px; |
||||||
|
left: 50%; |
||||||
|
transform: translate(-50%,-20%); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,144 @@ |
|||||||
|
<template> |
||||||
|
<div class="changePassword"> |
||||||
|
<div class="title"> |
||||||
|
<p>账户服务</p> |
||||||
|
<i class="el-icon-arrow-right"></i> |
||||||
|
<p>密码修改</p> |
||||||
|
</div> |
||||||
|
<div class="body"> |
||||||
|
<el-row :gutter="20" style="margin: 0"> |
||||||
|
<el-form ref="form" :model="form" label-width="120px"> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="账号" required> |
||||||
|
<div class="idCard" @click="popUp('银行扫描器')"> |
||||||
|
<p>请刷银行卡</p> |
||||||
|
</div> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="证件类型"> |
||||||
|
<el-select v-model="form.certificateType"> |
||||||
|
<el-option label="身份证" value="身份证"> </el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="支取密码" required> |
||||||
|
<div class="idCard" @click="popUp('密码器')"> |
||||||
|
<p>请输入密码</p> |
||||||
|
</div> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="10" :offset="1"> |
||||||
|
<el-form-item label="客户姓名" prop="customerName" :rules="rules.customerName"> |
||||||
|
<el-input v-model="form.customerName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="身份证" required> |
||||||
|
<div class="idCard" @click="popUp('身份证扫描器')"> |
||||||
|
<p>请刷身份证</p> |
||||||
|
</div> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="备注"> |
||||||
|
<el-input v-model="form.remark"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-form> |
||||||
|
</el-row> |
||||||
|
<el-button @click="submitForm" type="primary" class="submitBtn">提交</el-button> |
||||||
|
<el-dialog |
||||||
|
style="margin-top:10vh" |
||||||
|
:visible.sync="visible" |
||||||
|
:modal="false" |
||||||
|
width="40%" |
||||||
|
:close-on-click-modal="false" |
||||||
|
:show-close="false" |
||||||
|
custom-class="data-dia" |
||||||
|
> |
||||||
|
<div slot="title" class="dia-header"> |
||||||
|
<div class="data-title">提交</div> |
||||||
|
</div> |
||||||
|
<div class="popBody"> |
||||||
|
<h2 v-if='dialogChange'>本业务需要授权</h2> |
||||||
|
</div> |
||||||
|
<div class="popBtns"> |
||||||
|
<el-button class="close btn" @click="visible = false">取 消</el-button> |
||||||
|
<el-button class="sure btn" type="primary" @click="visible = false">确 定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { EventBus } from "@/utils/event-bus.js"; |
||||||
|
import { checkRequired, ismoney } from '@/utils/utilFunction.js' |
||||||
|
import { vername, verrate } from '@/utils/verify.js' |
||||||
|
export default{ |
||||||
|
name:'', |
||||||
|
props:{}, |
||||||
|
data(){ |
||||||
|
return{ |
||||||
|
form:{ |
||||||
|
// 必填项 |
||||||
|
customerName: '', // 客户姓名 |
||||||
|
// 非必填项 |
||||||
|
certificateType: '身份证', // 证件类型 |
||||||
|
remark: '', // 备注 |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
customerName: vername |
||||||
|
}, |
||||||
|
visible: false |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
|
||||||
|
popUp(text) { |
||||||
|
// 银行扫描器 密码器 |
||||||
|
this.$store.commit('system/changePop',{show: true,id:'62,3xxx',text}) |
||||||
|
EventBus.$emit("changeShowGoods", true); |
||||||
|
}, |
||||||
|
submitForm() { |
||||||
|
const requiredField = { |
||||||
|
} |
||||||
|
if(checkRequired(this.form, requiredField)) { |
||||||
|
this.visible = true |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
<style lang='scss' scoped> |
||||||
|
.changePassword{ |
||||||
|
width: 100%; |
||||||
|
.title{ |
||||||
|
margin-left: 80px; |
||||||
|
height: 60px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
font-size: 20px; |
||||||
|
padding-left: 0px; |
||||||
|
margin-top: 10px; |
||||||
|
} |
||||||
|
.body{ |
||||||
|
margin-top: 70px; |
||||||
|
.idCard{ |
||||||
|
border-radius: 5px; |
||||||
|
background: #CFDDFF; |
||||||
|
text-align: center; |
||||||
|
height: 40px; |
||||||
|
line-height: 40px; |
||||||
|
font-size: 18px; |
||||||
|
color: #6191FF; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
.submitBtn{ |
||||||
|
position: absolute; |
||||||
|
width: 300px; |
||||||
|
font-size: 18px; |
||||||
|
height: 68px; |
||||||
|
border-radius: 10px; |
||||||
|
bottom: 10px; |
||||||
|
left: 50%; |
||||||
|
transform: translate(-50%,-20%); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue