| New file |
| | |
| | | <template> |
| | | <view> |
| | | <u--form class="" labelWidth="80" :model="form" :rules="rules" ref="uForm"> |
| | | <view class="u-p-h-30"> |
| | | <u-form-item label="持卡人"> |
| | | <u--input v-model="form.acctName" readonly border="none"></u--input> |
| | | </u-form-item> |
| | | <u-form-item label="银行卡号"> |
| | | <u--input v-model="form.cardNo" readonly border="none"></u--input> |
| | | </u-form-item> |
| | | <u-form-item label="所属银行"> |
| | | <u--input v-model="form.bankName" readonly border="none"></u--input> |
| | | </u-form-item> |
| | | </view> |
| | | |
| | | <view class="bg-fff u-p-h-30 u-m-t-30"> |
| | | <block v-if="form.cardType=='CC'"> |
| | | <u-form-item label="有效期" borderBottom prop="validdate"> |
| | | <u--input v-model="form.validdate" border="none" placeholder="请输入信用卡有效期"> |
| | | </u--input> |
| | | </u-form-item> |
| | | <u-form-item label="安全码" borderBottom prop="cvv2"> |
| | | <u--input v-model="form.cvv2" border="none" placeholder="请输入信用卡安全码"></u--input> |
| | | </u-form-item> |
| | | </block> |
| | | <u-form-item label="身份证号" borderBottom prop="idNo"> |
| | | <u--input v-model="form.idNo" border="none" placeholder="请输入持卡人身份证号"></u--input> |
| | | </u-form-item> |
| | | <u-form-item label="手机号" prop="mobile"> |
| | | <u--input v-model="form.mobile" border="none" placeholder="请输入持卡人手机号"></u--input> |
| | | </u-form-item> |
| | | </view> |
| | | |
| | | </u--form> |
| | | <label @click="checked=!checked" class="u-flex u-font-24 color-999 u-m-h-30 u-m-t-30"> |
| | | <radio style="transform: scale(0.7);" color="#e93b3d" @change="radioChange" :checked="checked" />我已阅读并同意 |
| | | <view @click.stop="showAgreement=true" class="" style="color: #e93b3d;">《用户协议》</view> |
| | | </label> |
| | | <view class="u-p-40"> |
| | | <u-button @click="doNext" :loading="loading" :disabled="loading" type="error" text="下一步"></u-button> |
| | | </view> |
| | | <u-popup :show="showAgreement" mode="center" :round="30"> |
| | | <card-agreement @confirm="checked=true;showAgreement=false;doNext()"></card-agreement> |
| | | </u-popup> |
| | | |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | signUpToApply, |
| | | } from '@/common/api/index' |
| | | export default { |
| | | data() { |
| | | return { |
| | | showAgreement: false, |
| | | checked: true, |
| | | loading: false, |
| | | form: { |
| | | acctName: '', |
| | | cardNo: '', |
| | | bankName: '', |
| | | cardType: 'DC', |
| | | validdate: '', |
| | | cvv2: '', |
| | | idNo: '', |
| | | mobile: '' |
| | | }, |
| | | rules: { |
| | | validdate: [{ |
| | | required: true, |
| | | message: '有效期不能为空', |
| | | trigger: 'blur' |
| | | }], |
| | | cvv2: [{ |
| | | required: true, |
| | | message: '安全码不能为空', |
| | | trigger: 'blur' |
| | | }], |
| | | idNo: [{ |
| | | required: true, |
| | | message: '身份证号不能为空', |
| | | trigger: 'blur' |
| | | }, { |
| | | // 自定义验证函数,见上说明 |
| | | validator: (rule, value, callback) => { |
| | | // 上面有说,返回true表示校验通过,返回false表示不通过 |
| | | // uni.$u.test.mobile()就是返回true或者false的 |
| | | return uni.$u.test.idCard(value); |
| | | }, |
| | | message: '身份证号不正确', |
| | | trigger: 'change' |
| | | }], |
| | | mobile: [{ |
| | | required: true, |
| | | message: '手机号不能为空', |
| | | trigger: 'blur' |
| | | }, { |
| | | // 自定义验证函数,见上说明 |
| | | validator: (rule, value, callback) => { |
| | | // 上面有说,返回true表示校验通过,返回false表示不通过 |
| | | // uni.$u.test.mobile()就是返回true或者false的 |
| | | return uni.$u.test.mobile(value); |
| | | }, |
| | | message: '手机号不正确', |
| | | trigger: 'change' |
| | | }], |
| | | } |
| | | }; |
| | | }, |
| | | onLoad(opt) { |
| | | opt.acctName = decodeURIComponent(opt.acctName || '') |
| | | opt.bankName = decodeURIComponent(opt.bankName || '') |
| | | this.form = opt |
| | | }, |
| | | onReady() { |
| | | //如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则。 |
| | | this.$refs.uForm.setRules(this.rules) |
| | | }, |
| | | methods: { |
| | | doNext() { |
| | | this.$refs.uForm.validate().then(res => { |
| | | if (!this.checked) { |
| | | this.showAgreement = true |
| | | return |
| | | } |
| | | this.loading = true |
| | | const param = uni.$u.deepClone(this.form); |
| | | delete param.bankName |
| | | delete param.cardType |
| | | signUpToApply(param).then(res => { |
| | | const params = uni.$u.deepClone(this.form); |
| | | params.thpinfo = res |
| | | uni.$u.route({ |
| | | url: '/pages/pay/addCardCode', |
| | | params: params |
| | | }) |
| | | }).catch(() => { |
| | | this.loading = false |
| | | }) |
| | | }).catch(errors => { |
| | | |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | |
| | | </style> |