|  |  | 
 |  |  |   <ContentScrollView :paddingH="false"> | 
 |  |  |     <nut-form :model-value="form" ref="formRef" :rules="rules"> | 
 |  |  |       <nut-form-item label="持卡人:" class="bole-form-item" prop="name"> | 
 |  |  |         <nut-input v-model.trim="form.name" placeholder="请输入持卡人" /> | 
 |  |  |         <nut-input v-model.trim="form.name" placeholder="请输入持卡人" readonly /> | 
 |  |  |       </nut-form-item> | 
 |  |  |       <nut-form-item label="身份证号:" class="bole-form-item" prop="name"> | 
 |  |  |         <nut-input v-model.trim="form.name" placeholder="请输入身份证号" /> | 
 |  |  |       <nut-form-item label="身份证号:" class="bole-form-item" prop="identity"> | 
 |  |  |         <nut-input v-model.trim="form.identity" placeholder="请输入身份证号" readonly /> | 
 |  |  |       </nut-form-item> | 
 |  |  |       <nut-form-item label="银行卡号:" class="bole-form-item" prop="name"> | 
 |  |  |         <nut-input v-model.trim="form.name" placeholder="请输入银行卡号" /> | 
 |  |  |       <nut-form-item label="银行卡号:" class="bole-form-item" prop="code"> | 
 |  |  |         <nut-input | 
 |  |  |           v-model.trim="form.code" | 
 |  |  |           placeholder="请输入银行卡号" | 
 |  |  |           :formatter="(val:string)=>val.replace(/\s/g,'')" | 
 |  |  |         /> | 
 |  |  |       </nut-form-item> | 
 |  |  |       <nut-form-item label="开户行:" class="bole-form-item" prop="name"> | 
 |  |  |         <nut-input v-model.trim="form.name" placeholder="请输入开户行" /> | 
 |  |  |       <nut-form-item label="开户行:" class="bole-form-item" prop="bank"> | 
 |  |  |         <nut-input v-model.trim="form.bank" placeholder="请输入开户行" /> | 
 |  |  |       </nut-form-item> | 
 |  |  |       <nut-form-item label="手机号:" class="bole-form-item" prop="phoneNumber" required> | 
 |  |  |         <nut-input | 
 |  |  |           v-model.trim="form.phoneNumber" | 
 |  |  |           class="nut-input-text bole-input-text" | 
 |  |  |           placeholder="请填写经办人的手机号码" | 
 |  |  |           placeholder="请填写银行预留手机号" | 
 |  |  |           type="text" | 
 |  |  |         > | 
 |  |  |           <template #right> | 
 |  |  | 
 |  |  |           </template> | 
 |  |  |         </nut-input> | 
 |  |  |       </nut-form-item> | 
 |  |  |       <nut-form-item label="短信验证码:" class="bole-form-item" prop="verificationCode" required> | 
 |  |  |       <nut-form-item label="短信验证码:" class="bole-form-item" prop="verifyCode" required> | 
 |  |  |         <nut-input | 
 |  |  |           v-model.trim="form.verificationCode" | 
 |  |  |           v-model.trim="form.verifyCode" | 
 |  |  |           class="nut-input-text bole-input-text" | 
 |  |  |           placeholder="请输入验证码" | 
 |  |  |           type="number" | 
 |  |  | 
 |  |  | <script setup lang="ts"> | 
 |  |  | import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types'; | 
 |  |  | import { ProFormCaptcha } from 'senin-mini/components'; | 
 |  |  | import { Message } from '@12333/utils'; | 
 |  |  | import { VerificationCodeBusinessType } from '@12333/constants'; | 
 |  |  | import * as commonServices from '@12333/services/api/Common'; | 
 |  |  | // import * as userResumeServices from '@12333/services/api/userResume'; | 
 |  |  | import Taro from '@tarojs/taro'; | 
 |  |  | import { useQuery } from '@tanstack/vue-query'; | 
 |  |  |  | 
 |  |  | const userResumeServices = {}; | 
 |  |  | import { FormValidator, Message } from '@12333/utils'; | 
 |  |  | import * as userServices from '@12333/services/apiV2/user'; | 
 |  |  | import { EnumUserBankCardAccess } from '@12333/constants'; | 
 |  |  | import { goBack } from '@/utils'; | 
 |  |  |  | 
 |  |  | defineOptions({ | 
 |  |  |   name: 'InnerPage', | 
 |  |  | }); | 
 |  |  | const { userDetail, updateUserInfo } = useUser(); | 
 |  |  |  | 
 |  |  | const form = reactive({ | 
 |  |  |   name: '', | 
 |  |  |   name: userDetail.value?.name ?? '', | 
 |  |  |   identity: userDetail.value?.identity ?? '', | 
 |  |  |   phoneNumber: '', | 
 |  |  |   verificationCode: '', | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | const { | 
 |  |  |   isLoading, | 
 |  |  |   isError, | 
 |  |  |   data: detail, | 
 |  |  |   refetch, | 
 |  |  | } = useQuery({ | 
 |  |  |   queryKey: ['userResumeServices/getUserResumeBaseInfo'], | 
 |  |  |   queryFn: async () => { | 
 |  |  |     return await userResumeServices.getUserResumeBaseInfo({ | 
 |  |  |       showLoading: false, | 
 |  |  |     }); | 
 |  |  |   }, | 
 |  |  |   placeholderData: () => ({} as API.UserResumeBaseInfoOutput), | 
 |  |  |   onSuccess(data) { | 
 |  |  |     form.name = data.name; | 
 |  |  |     form.phoneNumber = data.phoneNumber; | 
 |  |  |   }, | 
 |  |  |   code: '', | 
 |  |  |   bank: '', | 
 |  |  |   bankBranch: '', | 
 |  |  |   verifyCode: '', | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | const rules = reactive<FormRules>({ | 
 |  |  |   name: [{ required: true, message: '请输入持卡人' }], | 
 |  |  |   phoneNumber: [{ required: true, message: '请输入手机号' }], | 
 |  |  |   code: [ | 
 |  |  |     { required: true, message: '请输入银行卡号' }, | 
 |  |  |     { message: '请输入正确的银行卡号', validator: FormValidator.validatorBankCard }, | 
 |  |  |   ], | 
 |  |  |   bank: [{ required: true, message: '请输入开户行' }], | 
 |  |  |   phoneNumber: [ | 
 |  |  |     { required: true, message: '请填写手机号码' }, | 
 |  |  |     { message: '请输入正确的手机号码', validator: FormValidator.validatorPhoneNumber }, | 
 |  |  |   ], | 
 |  |  |   verifyCode: [{ required: true, message: '请输入验证码' }], | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | async function onGetCaptcha(phoneNumber: string) { | 
 |  |  |   await commonServices.sendPhoneCertificationVerificationCode( | 
 |  |  |   await userServices.sendSavePersonalUserBankCardVerifyCode( | 
 |  |  |     { | 
 |  |  |       name: form.name, | 
 |  |  |       identity: form.name, | 
 |  |  |       mobile: form.phoneNumber, | 
 |  |  |       businessType: VerificationCodeBusinessType.UserCertificationPhoneCertification, | 
 |  |  |       phoneNumber: form.phoneNumber, | 
 |  |  |     }, | 
 |  |  |     { showLoading: false } | 
 |  |  |   ); | 
 |  |  | 
 |  |  |  | 
 |  |  | async function confirm() { | 
 |  |  |   try { | 
 |  |  |     let params: API.SaveUserResumeBaseInfoInput = { | 
 |  |  |       name: form.name, | 
 |  |  |     let params: API.SavePersonalUserBankCardCommand = { | 
 |  |  |       code: form.code, | 
 |  |  |       bank: form.bank, | 
 |  |  |       phoneNumber: form.phoneNumber, | 
 |  |  |       verifyCode: form.verifyCode, | 
 |  |  |       access: EnumUserBankCardAccess.Bank, | 
 |  |  |     }; | 
 |  |  |     let res = await userResumeServices.saveUserResumeBaseInfo(params); | 
 |  |  |     let res = await userServices.savePersonalUserBankCard(params); | 
 |  |  |     if (res) { | 
 |  |  |       Message.success('保存成功', { | 
 |  |  |       Message.success('绑定成功', { | 
 |  |  |         onClosed() { | 
 |  |  |           Taro.navigateTo({ | 
 |  |  |             url: `${RouterPath.mineCurriculumVitae}`, | 
 |  |  |           }); | 
 |  |  |           updateUserInfo(); | 
 |  |  |           goBack(); | 
 |  |  |         }, | 
 |  |  |       }); | 
 |  |  |     } |