|
|
@@ -1,7 +1,7 @@
|
|
|
<!-- 账户管理-签约账号管理-签约 -->
|
|
|
<template>
|
|
|
- <app-drawer :title="bankInfo?.signstatus != undefined ? '修改签约账户' : '添加签约账户'" :width="800" v-model:show="show" :loading="loading"
|
|
|
- :refresh="refresh">
|
|
|
+ <app-drawer :title="bankInfo?.signstatus != undefined ? '修改签约账户' : '添加签约账户'" :width="800" v-model:show="show"
|
|
|
+ :loading="loading" :refresh="refresh">
|
|
|
<el-form ref="formRef" class="el-form--horizontal" label-width="120px" :model="formData" :rules="formRules">
|
|
|
<el-form-item label="开户银行" prop="OpenBankAccId">
|
|
|
<el-select v-model="formData.OpenBankAccId">
|
|
|
@@ -9,21 +9,24 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="银行卡号" prop="BankAccountNo">
|
|
|
- <el-input type="number" name="BankAccountNo" placeholder="银行卡号" :maxlength="30" v-model="formData.BankAccountNo"
|
|
|
- :rules="formRules.BankAccountNo" />
|
|
|
+ <el-input type="number" name="BankAccountNo" placeholder="银行卡号" :maxlength="30"
|
|
|
+ v-model="formData.BankAccountNo" :rules="formRules.BankAccountNo" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="名称" prop="AccountName">
|
|
|
<el-input name="AccountName" readonly placeholder="银行卡账户名" v-model="formData.AccountName"
|
|
|
:rules="formRules.AccountName" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="手机号码" prop="MobilePhone">
|
|
|
- <el-input name="MobilePhone" :readonly="userStore.userInfo?.mobile2 != ''" maxlength="50" placeholder="请输入手机号码" v-model="formData.MobilePhone" />
|
|
|
+ <el-input name="MobilePhone" :readonly="userStore.userInfo?.mobile2 != ''" maxlength="50"
|
|
|
+ placeholder="请输入手机号码" v-model="formData.MobilePhone" />
|
|
|
</el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-form ref="extendRef" class="el-form--horizontal" label-width="120px" :model="extendModel" :rules="formRules">
|
|
|
<template v-for="(item, index) in configs" :key="index">
|
|
|
<template v-if="(item.fieldcode === 'verify_code')">
|
|
|
- <el-form-item :label="item.fieldname" :prop="item.fieldcode"
|
|
|
- v-if="bankInfo === undefined && showExtendInfo(item)">
|
|
|
- <el-input placeholder="请必须输入" type="number" v-model="item.value" :rules="formRules.vcode">
|
|
|
+ <el-form-item :label="item.fieldname" :prop="item.fieldcode"
|
|
|
+ v-if="bankInfo === undefined && showExtendInfo(item)">
|
|
|
+ <el-input placeholder="请输入" type="number" v-model="item.value" :rules="formRules.vcode">
|
|
|
<template #append>
|
|
|
<el-button size="small" type="primary" :disabled="isCountdown" @click="sendVerifyCode">
|
|
|
<span v-if="isCountdown">重新发送({{ seconds }})</span>
|
|
|
@@ -34,21 +37,24 @@
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
<template v-else-if="(item.fieldcode === 'bank_branch_name')">
|
|
|
- <el-form-item :label="item.fieldname" prop="OpenBankName"
|
|
|
- v-if="showExtendInfo(item)">
|
|
|
- <el-input maxlength="50" :name="item.fieldcode" placeholder="请必须输入" v-model="item.value" />
|
|
|
+ <el-form-item :label="item.fieldname" :prop="item.fieldcode" v-if="showExtendInfo(item)">
|
|
|
+ <el-select placeholder="请输入" v-model="item.value" value-key="branchnum" :loading="searchLoading"
|
|
|
+ :remote-method="remoteMethod" filterable remote clearable allow-create @change="onBankChange">
|
|
|
+ <template v-for="(item, index) in dataList" :key="index">
|
|
|
+ <el-option :label="item.branchname" :value="item" />
|
|
|
+ </template>
|
|
|
+ </el-select>
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
<template v-else-if="(item.fieldcode === '100')">
|
|
|
- <el-form-item :label="item.fieldname" prop="OpenBankNo"
|
|
|
- v-if="showExtendInfo(item)">
|
|
|
- <el-input maxlength="50" :name="item.fieldcode" placeholder="请必须输入" v-model="item.value" />
|
|
|
+ <el-form-item :label="item.fieldname" :prop="item.fieldcode" v-if="showExtendInfo(item)">
|
|
|
+ <el-input maxlength="50" placeholder="请f输入" v-model="item.value" />
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
- <el-form-item :label="item.fieldname" :prop="item.fieldcode"
|
|
|
- v-if="showExtendInfo(item)">
|
|
|
- <el-input :readonly="item.fieldcode === 'legal_name' && userStore.userInfo?.legalpersonname != ''" maxlength="50" :name="item.fieldcode" placeholder="请必须输入" v-model="item.value" />
|
|
|
+ <el-form-item :label="item.fieldname" :prop="item.fieldcode" v-if="showExtendInfo(item)">
|
|
|
+ <el-input :readonly="item.fieldcode === 'legal_name' && userStore.userInfo?.legalpersonname != ''"
|
|
|
+ maxlength="50" placeholder="请输入" v-model="item.value" />
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
</template>
|
|
|
@@ -61,11 +67,12 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref } from 'vue'
|
|
|
-import { ElMessage } from 'element-plus'
|
|
|
-import type { FormInstance, FormRules } from 'element-plus'
|
|
|
-import { useDoBankSign, useDoCusBankExtendConfigs, useT2bSMSVerificationCode } from '@/business/bank'
|
|
|
+import { ref, computed } from 'vue'
|
|
|
+import { ElMessage, FormInstance, FormRules } from 'element-plus'
|
|
|
import { validateRules } from '@/constants/regex'
|
|
|
+import { useRequest } from '@/hooks/request'
|
|
|
+import { queryBankBranChnumInfo } from '@/services/api/bank'
|
|
|
+import { useDoBankSign, useDoCusBankExtendConfigs, useT2bSMSVerificationCode } from '@/business/bank'
|
|
|
import { useUserStore } from '@/stores'
|
|
|
import service from '@/services'
|
|
|
import AppDrawer from '@pc/components/base/drawer/index.vue'
|
|
|
@@ -79,57 +86,98 @@ const userStore = useUserStore()
|
|
|
const show = ref(true)
|
|
|
const refresh = ref(false)
|
|
|
const formRef = ref<FormInstance>()
|
|
|
+const extendRef = ref<FormInstance>()
|
|
|
const seconds = ref(60) //倒计时剩余时间
|
|
|
const isCountdown = ref(false) // 是否正在倒计时
|
|
|
/// 短信验证码交易中心信息
|
|
|
const CenterErrMsg = shallowRef('')
|
|
|
|
|
|
-const formRules: FormRules = {
|
|
|
- OpenBankAccId: [{
|
|
|
- message: '请选择银行信息',
|
|
|
- validator: () => {
|
|
|
- return !!formData.OpenBankAccId
|
|
|
+// 表单数据对象
|
|
|
+const extendModel = computed(() => {
|
|
|
+ const obj = Object.create(null)
|
|
|
+ configs.value.forEach((e) => {
|
|
|
+ if (e.fieldcode) {
|
|
|
+ obj[e.fieldcode] = e.value
|
|
|
}
|
|
|
- }],
|
|
|
- BankAccountNo: [{
|
|
|
- required: true,
|
|
|
- message: '请输入银行卡账号'
|
|
|
- }],
|
|
|
- MobilePhone: [{
|
|
|
- required: true,
|
|
|
- message: '请输入手机号码',
|
|
|
- validator: (rule, value, callback) => {
|
|
|
- if (validateRules.phone.validate(value)) {
|
|
|
- callback()
|
|
|
- } else {
|
|
|
- callback(new Error(validateRules.phone.message))
|
|
|
+ })
|
|
|
+ return obj
|
|
|
+})
|
|
|
+
|
|
|
+const formRules = computed(() => {
|
|
|
+ const rules: FormRules = {
|
|
|
+ OpenBankAccId: [{
|
|
|
+ message: '请选择银行信息',
|
|
|
+ validator: () => {
|
|
|
+ return !!formData.OpenBankAccId
|
|
|
}
|
|
|
+ }],
|
|
|
+ BankAccountNo: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入银行卡账号'
|
|
|
+ }],
|
|
|
+ MobilePhone: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入手机号码',
|
|
|
+ validator: (rule, value, callback) => {
|
|
|
+ if (validateRules.phone.validate(value)) {
|
|
|
+ callback()
|
|
|
+ } else {
|
|
|
+ callback(new Error(validateRules.phone.message))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }],
|
|
|
+ AccountName: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入行卡账户名',
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ configs.value.forEach((e) => {
|
|
|
+ if (e.fieldcode) {
|
|
|
+ rules[e.fieldcode] = [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入' + e.fieldname,
|
|
|
+ }]
|
|
|
}
|
|
|
- }],
|
|
|
- AccountName: [{
|
|
|
- required: true,
|
|
|
- message: '请输入行卡账户名',
|
|
|
- }],
|
|
|
- OpenBankName: [{
|
|
|
- required: true,
|
|
|
- message: '请输入开户行支行名称',
|
|
|
- }],
|
|
|
- OpenBankNo: [{
|
|
|
- required: true,
|
|
|
- message: '请输入开户行支行号',
|
|
|
- }],
|
|
|
- legal_name: [{
|
|
|
- required: true,
|
|
|
- message: '请输入法人姓名',
|
|
|
- }],
|
|
|
- agent_name: [{
|
|
|
- required: true,
|
|
|
- message: '请输入经办人姓名',
|
|
|
- }],
|
|
|
- business_num_addr: [{
|
|
|
- required: true,
|
|
|
- message: '请输入营业执照地址',
|
|
|
- }]
|
|
|
+ })
|
|
|
+ return rules
|
|
|
+})
|
|
|
+
|
|
|
+const { loading: searchLoading, dataList, runAsync: searchBankBranChnumInfo } = useRequest(queryBankBranChnumInfo, {
|
|
|
+ manual: true,
|
|
|
+ params: {
|
|
|
+ pagesize: 30
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+// 远程搜索银行支行
|
|
|
+const remoteMethod = (query: string) => {
|
|
|
+ if (query.length >= 3) {
|
|
|
+ searchBankBranChnumInfo({
|
|
|
+ branchname: query
|
|
|
+ }).then((res) => {
|
|
|
+ dataList.value = res.data
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 选择支行时触发
|
|
|
+const onBankChange = (item: Model.BankBranChnumInfoRsp) => {
|
|
|
+ configs.value.forEach((e) => {
|
|
|
+ switch (e.fieldcode) {
|
|
|
+ case 'bank_branch_name':
|
|
|
+ e.value = typeof item === 'string' ? item : item.branchname
|
|
|
+ break
|
|
|
+ case '100':
|
|
|
+ e.value = item.branchnum
|
|
|
+ break
|
|
|
+ case '101':
|
|
|
+ e.value = item.branchprovince
|
|
|
+ break
|
|
|
+ case '102':
|
|
|
+ e.value = item.branchcity
|
|
|
+ break
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
const onCancel = (isRefresh = false) => {
|
|
|
@@ -139,9 +187,9 @@ const onCancel = (isRefresh = false) => {
|
|
|
|
|
|
/// 是否显示拓展信息
|
|
|
const showExtendInfo = (item: Model.BankCusBankExtendConfigRsp) => {
|
|
|
- return (item.usabletype === 1) ||
|
|
|
- (item.usabletype === 2 && userStore.userInfo?.userinfotype === 2) ||
|
|
|
- (item.usabletype === 3 && userStore.userInfo?.userinfotype === 1)
|
|
|
+ return (item.usabletype === 1) ||
|
|
|
+ (item.usabletype === 2 && userStore.userInfo?.userinfotype === 2) ||
|
|
|
+ (item.usabletype === 3 && userStore.userInfo?.userinfotype === 1)
|
|
|
}
|
|
|
|
|
|
// 发送手机验证码
|
|
|
@@ -173,44 +221,47 @@ const sendVerifyCode = () => {
|
|
|
}
|
|
|
|
|
|
const formSubmit = () => {
|
|
|
- formRef.value?.validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- if (formData.CusBankID) {
|
|
|
- const obj: { [key: string]: unknown } = Object.create({})
|
|
|
- configs.value.forEach((e) => {
|
|
|
- if (e.value) {
|
|
|
- obj[e.fieldcode] = e.value
|
|
|
- }
|
|
|
- if (e.fieldcode === 'bank_branch_name') {
|
|
|
- formData.OpenBankName = e.value
|
|
|
- }
|
|
|
- if (e.fieldcode === '100') {
|
|
|
- formData.OpenBankNo = e.value
|
|
|
- }
|
|
|
- if (e.fieldcode === '101') {
|
|
|
- formData.BankProvince = e.value
|
|
|
- }
|
|
|
- if (e.fieldcode === '102') {
|
|
|
- formData.BankCity = e.value
|
|
|
+ formRef.value?.validate((formValid) => {
|
|
|
+ if (formValid) {
|
|
|
+ extendRef.value?.validate((extendValid) => {
|
|
|
+ if (extendValid) {
|
|
|
+ if (formData.CusBankID) {
|
|
|
+ const obj: { [key: string]: unknown } = Object.create({})
|
|
|
+ configs.value.forEach((e) => {
|
|
|
+ if (e.value) {
|
|
|
+ obj[e.fieldcode] = e.value
|
|
|
+ }
|
|
|
+ if (e.fieldcode === 'bank_branch_name') {
|
|
|
+ formData.OpenBankName = e.value
|
|
|
+ }
|
|
|
+ if (e.fieldcode === '100') {
|
|
|
+ formData.OpenBankNo = e.value
|
|
|
+ }
|
|
|
+ if (e.fieldcode === '101') {
|
|
|
+ formData.BankProvince = e.value
|
|
|
+ }
|
|
|
+ if (e.fieldcode === '102') {
|
|
|
+ formData.BankCity = e.value
|
|
|
+ }
|
|
|
+ })
|
|
|
+ /// 如果需要短信验证码
|
|
|
+ if (CenterErrMsg.value != '') {
|
|
|
+ obj['smsSerialNo'] = CenterErrMsg.value
|
|
|
+ }
|
|
|
+ formData.extendInfo = JSON.stringify(obj)
|
|
|
+
|
|
|
+ onSubmit().then(() => {
|
|
|
+ ElMessage.success(bankInfo.value?.signstatus != undefined ? '签约信息修改成功' : '签约提交成功，请耐心等待审核。')
|
|
|
+ onCancel(true)
|
|
|
+ }).catch((err) => {
|
|
|
+ ElMessage.error('提交失败:' + err)
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ ElMessage.error('未签约')
|
|
|
}
|
|
|
- })
|
|
|
- /// 如果需要短信验证码
|
|
|
- if (CenterErrMsg.value != '') {
|
|
|
- obj['smsSerialNo'] = CenterErrMsg.value
|
|
|
}
|
|
|
- formData.extendInfo = JSON.stringify(obj)
|
|
|
-
|
|
|
- onSubmit().then(() => {
|
|
|
- ElMessage.success(bankInfo.value?.signstatus != undefined ? '签约信息修改成功' : '签约提交成功，请耐心等待审核。')
|
|
|
- onCancel(true)
|
|
|
- }).catch((err) => {
|
|
|
- ElMessage.error('提交失败:' + err)
|
|
|
- })
|
|
|
- } else {
|
|
|
- ElMessage.error('未签约')
|
|
|
- }
|
|
|
+ })
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
</script>
|
