| | |
| | | <template> |
| | | <ProDialog title="配置" v-model="innerVisible" @close="onDialogClose" destroy-on-close draggable> |
| | | <ProForm :model="innerForm" ref="dialogForm" label-width="100px"> |
| | | <ProDialog title="配置" v-model="visible" @close="onDialogClose" destroy-on-close draggable> |
| | | <ProForm :model="form" ref="dialogForm" label-width="120px"> |
| | | <ProFormItemV2 label="" prop="enterpriseConfigureType" label-width="0"> |
| | | <ProFormRadio |
| | | v-model="innerForm.enterpriseConfigureType" |
| | | v-model="form.enterpriseConfigureType" |
| | | :value-enum="EnterpriseConfigureTypeText" |
| | | buttonStyle |
| | | /> |
| | | </ProFormItemV2> |
| | | <template v-if="innerForm.enterpriseConfigureType === EnterpriseConfigureType.Bank"> |
| | | <!-- <template v-if="form.enterpriseConfigureType === EnterpriseConfigureType.Bank"> |
| | | <ProFormItemV2 label="开户总行:" prop="openBank"> |
| | | <ProFormText |
| | | v-model.trim="innerForm.openBank" |
| | | v-model.trim="form.openBank" |
| | | placeholder="请输入开户总行" |
| | | :maxlength="40" |
| | | /> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 label="开户支行:" prop="openBranchBank"> |
| | | <ProFormText |
| | | v-model.trim="innerForm.openBranchBank" |
| | | v-model.trim="form.openBranchBank" |
| | | placeholder="请输入开户支行" |
| | | :maxlength="40" |
| | | /> |
| | |
| | | { message: '银行账户仅支持数字', pattern: BoleRegExp.RegNumber }, |
| | | ]" |
| | | > |
| | | <ProFormText v-model.trim="innerForm.bankAccount" placeholder="请输入银行账户" /> |
| | | <ProFormText v-model.trim="form.bankAccount" placeholder="请输入银行账户" /> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 label="银行账户:" prop="verifyStatus"> |
| | | {{ VerifyStatusText[innerForm.verifyStatus] }} |
| | | <el-button style="margin-left: 40px" type="primary" link @click="handleCheckBankAccount" |
| | | {{ VerifyStatusText[form.verifyStatus] }} |
| | | <el-button style="margin-left: 10px" type="primary" link @click="handleCheckBankAccount" |
| | | >校验</el-button |
| | | > |
| | | </ProFormItemV2> |
| | | </template> --> |
| | | <template v-if="form.enterpriseConfigureType === EnterpriseConfigureType.AliPay"> |
| | | <ProFormItemV2 |
| | | label="支付宝账号:" |
| | | prop="alipayAccount" |
| | | :checkRules="[{ message: '请输入支付宝账号' }]" |
| | | > |
| | | <div style="display: flex; width: 100%"> |
| | | <ProFormText v-model.trim="form.alipayAccount" placeholder="请输入支付宝账号"> |
| | | </ProFormText> |
| | | <el-button style="margin-left: 10px" type="primary" link @click="openEnterpriseWallet" |
| | | >获取签约链接</el-button |
| | | > |
| | | </div> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 |
| | | label="支付宝姓名:" |
| | | prop="name" |
| | | :checkRules="[{ message: '请输入支付宝姓名' }]" |
| | | > |
| | | <ProFormText v-model.trim="form.name" placeholder="请输入支付宝姓名" /> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 |
| | | label="商户ID:" |
| | | prop="alipayMerchantId" |
| | | :checkRules="[{ message: '请输入商户ID' }]" |
| | | > |
| | | <ProFormText v-model.trim="form.alipayMerchantId" placeholder="请输入商户ID" disabled /> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 label="业务场景:" prop="scene" :checkRules="[{ message: '请选择业务场景' }]"> |
| | | <ProFormSelect |
| | | v-model="form.scene" |
| | | :valueEnum="EnumEnterpriseWalletExpandindirectOrderSceneText" |
| | | placeholder="请选择业务场景" |
| | | > |
| | | </ProFormSelect> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 |
| | | label="场景描述:" |
| | | prop="sceneDirections" |
| | | :checkRules="[{ message: '请输入场景描述' }]" |
| | | > |
| | | <ProFormText |
| | | v-model.trim="form.sceneDirections" |
| | | placeholder="谁/通过什么媒介(APP/web/小程序)/主要为谁提供什么服务/用于在什么场景给什么人群转账" |
| | | /> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 |
| | | label="转账场景截图:" |
| | | prop="sceneFiles" |
| | | :check-rules="[{ type: 'upload', message: '请上传转账场景截图' }]" |
| | | > |
| | | <ProFormUpload |
| | | v-model:file-url="form.sceneFiles" |
| | | :limit="5" |
| | | :limitFileSize="10" |
| | | accept="png,jpg,jpeg,pdf" |
| | | ></ProFormUpload> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 |
| | | label="资质文件:" |
| | | prop="sceneQualificationFiles" |
| | | :check-rules="[{ type: 'upload', message: '请上传资质文件' }]" |
| | | > |
| | | <ProFormUpload |
| | | v-model:file-url="form.sceneQualificationFiles" |
| | | :limit="5" |
| | | :limitFileSize="10" |
| | | accept="png,jpg,jpeg,pdf" |
| | | ></ProFormUpload> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 label="签约状态:" prop="signStatus" required> |
| | | <span>{{ EnumEnterpriseWalletSignStatusText[form.signStatus] }}</span> |
| | | <el-button style="margin-left: 10px" type="primary" link @click="handleCheckBankAccount" |
| | | >校验</el-button |
| | | > |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 label="进件状态:" prop="expandindirectOrderStatus" required> |
| | | <span>{{ |
| | | EnumEnterpriseWalletExpandindirectOrderStatusText[form.expandindirectOrderStatus] |
| | | }}</span> |
| | | <el-button style="margin-left: 10px" type="primary" link @click="handleCheckBankAccount" |
| | | >校验</el-button |
| | | > |
| | | </ProFormItemV2> |
| | | </template> |
| | | <template v-if="innerForm.enterpriseConfigureType === EnterpriseConfigureType.Electronic"> |
| | | <template v-if="form.enterpriseConfigureType === EnterpriseConfigureType.Electronic"> |
| | | <div class="configure-dialog-form-title">通道配置</div> |
| | | <ProFormItemV2 |
| | | label="名称:" |
| | | prop="signChannel" |
| | | :checkRules="[{ message: '请选择电子签通道' }]" |
| | | v-for="(item, index) in enabledElectronSignSettings" |
| | | :label="item.accessName" |
| | | :key="item.access" |
| | | prop="electronSignAccesses" |
| | | required |
| | | > |
| | | <ProFormSelect |
| | | v-model="form.signChannel" |
| | | :valueEnum="SignChannelEnumText" |
| | | placeholder="请选择电子签通道" |
| | | > |
| | | </ProFormSelect> |
| | | <ProFormSwitch |
| | | v-model="form.electronSignAccesses[index]" |
| | | :active-value="Number(item.access)" |
| | | :inactive-value="null" |
| | | ></ProFormSwitch> |
| | | </ProFormItemV2> |
| | | <div class="configure-dialog-form-title">费用配置</div> |
| | | <ProFormItemV2 |
| | | label="计费方式:" |
| | | prop="chargeType" |
| | | :checkRules="[{ message: '请选择计费方式' }]" |
| | | > |
| | | <ProFormRadio |
| | | :button-style="false" |
| | | v-model="innerForm.chargeType" |
| | | :value-enum="ChargeTypeEnumText" |
| | | /> |
| | | </ProFormItemV2> |
| | | <template v-if="innerForm.chargeType === ChargeTypeEnum.Group"> |
| | | <ProFormItemV2 label="实名费用:" prop="realVerifyCost"> |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | v-model="innerForm.realVerifyCost" |
| | | placeholder="请输入" |
| | | unit="元/条" |
| | | /> |
| | | </ProFormItemV2> |
| | | <ProFormItemV2 label="签约费用:" prop="signCost"> |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | v-model="innerForm.signCost" |
| | | placeholder="请输入" |
| | | unit="元/份" |
| | | /> |
| | | </ProFormItemV2> |
| | | </template> |
| | | <template v-if="innerForm.chargeType === ChargeTypeEnum.Merge"> |
| | | <ProFormItemV2 label="统一电子签:" prop="mergeSignCost"> |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | v-model="innerForm.mergeSignCost" |
| | | placeholder="请输入" |
| | | unit="元/份" |
| | | /> |
| | | </ProFormItemV2> |
| | | </template> |
| | | </template> |
| | | <template v-if="innerForm.enterpriseConfigureType === EnterpriseConfigureType.ShortMessage"> |
| | | <template v-if="form.enterpriseConfigureType === EnterpriseConfigureType.ShortMessage"> |
| | | <div class="configure-dialog-form-title">通道配置</div> |
| | | <ProFormItemV2 |
| | | label="名称:" |
| | | prop="messageChannel" |
| | | :checkRules="[{ message: '请选择短信通道' }]" |
| | | > |
| | | <ProFormItemV2 label="名称:" prop="smsAccess" :checkRules="[{ message: '请选择短信通道' }]"> |
| | | <ProFormSelect |
| | | v-model="form.messageChannel" |
| | | :valueEnum="MessageChannelEnumText" |
| | | v-model="form.smsAccess" |
| | | :valueEnum="EnumSmsAccessText" |
| | | placeholder="请选择短信通道" |
| | | > |
| | | </ProFormSelect> |
| | | </ProFormItemV2> |
| | | <div class="configure-dialog-form-title">费用配置</div> |
| | | <ProFormItemV2 label="短信费用:" prop="messageCost"> |
| | | <ProFormItemV2 label="短信费用:" prop="smsCost"> |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | v-model="innerForm.messageCost" |
| | | v-model="form.smsCost" |
| | | placeholder="请输入" |
| | | unit="元/条" |
| | | /> |
| | |
| | | </span> |
| | | </template> |
| | | </ProDialog> |
| | | <AlipayWalletOpen v-bind="dialogQrcodeProps"></AlipayWalletOpen> |
| | | </template> |
| | | |
| | | <script setup lang="ts"> |
| | |
| | | ProFormRadio, |
| | | ProFormInputNumber, |
| | | ProFormSelect, |
| | | ProFormSwitch, |
| | | useFormDialog, |
| | | UploadUserFile, |
| | | ProFormImageUpload, |
| | | ProFormUpload, |
| | | } from '@bole-core/components'; |
| | | import { BoleRegExp } from '@bole-core/core'; |
| | | import { |
| | | EnterpriseConfigureType, |
| | | EnterpriseConfigureTypeText, |
| | | ChargeTypeEnum, |
| | | ChargeTypeEnumText, |
| | | SignChannelEnum, |
| | | SignChannelEnumText, |
| | | VerifyStatusText, |
| | | VerifyStatusColor, |
| | | VerifyStatus, |
| | | MessageChannelEnum, |
| | | MessageChannelEnumText, |
| | | EnumElectronSignAccessText, |
| | | EnumSmsAccessText, |
| | | EnumElectronSignAccess, |
| | | EnumEnterpriseWalletSignStatusText, |
| | | EnumEnterpriseWalletExpandindirectOrderStatusText, |
| | | EnumEnterpriseWalletExpandindirectOrderSceneText, |
| | | } from '@/constants'; |
| | | import * as enterpriseWalletServices from '@/services/api/enterpriseWallet'; |
| | | import AlipayWalletOpen from './AlipayWalletOpen.vue'; |
| | | |
| | | defineOptions({ |
| | | name: 'ConfigureDialog', |
| | | }); |
| | | |
| | | type Props = { |
| | | modelValue: boolean; |
| | | form?: { |
| | | enterpriseConfigureType: EnterpriseConfigureType; |
| | | openBank: string; |
| | | openBranchBank: string; |
| | | bankAccount: string; |
| | | verifyStatus: VerifyStatus; |
| | | signChannel: SignChannelEnum; |
| | | chargeType: ChargeTypeEnum; |
| | | realVerifyCost: number; |
| | | signCost: number; |
| | | mergeSignCost: number; |
| | | messageCost: number; |
| | | messageChannel: MessageChannelEnum; |
| | | }; |
| | | type Form = { |
| | | enterpriseConfigureType: EnterpriseConfigureType; |
| | | // openBank: string; |
| | | // openBranchBank: string; |
| | | // bankAccount: string; |
| | | // verifyStatus: VerifyStatus; |
| | | electronSignAccesses: EnumElectronSignAccess[]; |
| | | smsAccess: EnumSmsAccess; |
| | | smsCost: number; |
| | | alipayAccount: string; |
| | | alipayMerchantId: string; |
| | | id: string; |
| | | |
| | | signStatus: EnumEnterpriseWalletSignStatus; |
| | | expandindirectOrderStatus: EnumEnterpriseWalletExpandindirectOrderStatus; |
| | | |
| | | name: string; |
| | | scene: EnumEnterpriseWalletExpandindirectOrderScene; |
| | | sceneDirections: string; |
| | | /**转账场景截图 */ |
| | | sceneFiles: UploadUserFile[]; |
| | | /**商户行业资质图片或协议文本 */ |
| | | sceneQualificationFiles: UploadUserFile[]; |
| | | }; |
| | | |
| | | const props = withDefaults(defineProps<Props>(), { |
| | | modelValue: false, |
| | | }); |
| | | const form = defineModel<Form>('form'); |
| | | const visible = defineModel({ type: Boolean }); |
| | | |
| | | const emit = defineEmits<{ |
| | | (e: 'update:modelValue', value: boolean): void; |
| | | (e: 'update:form', value: Props['form']): void; |
| | | (e: 'onConfirm'): void; |
| | | (e: 'onCancel'): void; |
| | | }>(); |
| | | |
| | | const dialogForm = ref<FormInstance>(); |
| | | |
| | | const innerVisible = computed({ |
| | | get() { |
| | | return props.modelValue; |
| | | }, |
| | | set(val) { |
| | | emit('update:modelValue', val); |
| | | }, |
| | | const { enabledElectronSignSettings } = useEnabledElectronSignSettings({ |
| | | all: true, |
| | | }); |
| | | |
| | | const innerForm = computed({ |
| | | get() { |
| | | return props.form; |
| | | }, |
| | | set(val) { |
| | | emit('update:form', val); |
| | | }, |
| | | }); |
| | | async function handleCheckBankAccount() { |
| | | try { |
| | | let alipayWallet = await enterpriseWalletServices.getEnterpriseWallet({ |
| | | enterpriseId: form.value.id, |
| | | access: EnumEnterpriseWalletAccess.Alipay, |
| | | }); |
| | | if (alipayWallet) { |
| | | form.value.signStatus = alipayWallet.signStatus; |
| | | form.value.expandindirectOrderStatus = alipayWallet.expandindirectOrderStatus; |
| | | } |
| | | } catch (error) {} |
| | | } |
| | | |
| | | function handleCheckBankAccount() {} |
| | | async function getEnterpriseWalletExpandindirectOrder() { |
| | | try { |
| | | let res = await enterpriseWalletServices.getEnterpriseWalletExpandindirectOrder({ |
| | | enterpriseId: form.value.id, |
| | | }); |
| | | if (res) { |
| | | form.value.expandindirectOrderStatus = res.orderStatus; |
| | | } |
| | | } catch (error) {} |
| | | } |
| | | |
| | | function onDialogClose() { |
| | | if (!dialogForm.value) return; |
| | |
| | | } |
| | | }); |
| | | } |
| | | |
| | | const { dialogProps: dialogQrcodeProps, handleAdd } = useFormDialog({ |
| | | defaultFormParams: { |
| | | alipayUrl: '', |
| | | }, |
| | | }); |
| | | |
| | | // async function handleOpenEnterpriseWallet() { |
| | | // try { |
| | | // if (!dialogForm.value) return; |
| | | // const valid = await dialogForm.value.validateField(['alipayAccount', 'alipayMerchantId']); |
| | | // if (valid) { |
| | | // openEnterpriseWallet(); |
| | | // } |
| | | // } catch (error) {} |
| | | // } |
| | | |
| | | async function openEnterpriseWallet() { |
| | | try { |
| | | let params: API.OpenEnterpriseWalletCommand = { |
| | | access: EnumEnterpriseWalletAccess.Alipay, |
| | | enterpriseId: form.value.id, |
| | | }; |
| | | let res = await enterpriseWalletServices.openEnterpriseWallet(params); |
| | | if (res) { |
| | | handleAdd({ |
| | | alipayUrl: res.signUrl, |
| | | }); |
| | | } |
| | | } catch (error) {} |
| | | } |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | @use '@/style/common.scss' as *; |