wupengfei
11 小时以前 ce7ff0effee22807c8d29a31d6f5f2713d3bf95c
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
<template>
  <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="form.enterpriseConfigureType"
          :value-enum="EnterpriseConfigureTypeText"
          buttonStyle
        />
      </ProFormItemV2>
      <!-- <template v-if="form.enterpriseConfigureType === EnterpriseConfigureType.Bank">
        <ProFormItemV2 label="开户总行:" prop="openBank">
          <ProFormText
            v-model.trim="form.openBank"
            placeholder="请输入开户总行"
            :maxlength="40"
          />
        </ProFormItemV2>
        <ProFormItemV2 label="开户支行:" prop="openBranchBank">
          <ProFormText
            v-model.trim="form.openBranchBank"
            placeholder="请输入开户支行"
            :maxlength="40"
          />
        </ProFormItemV2>
        <ProFormItemV2
          label="银行账户:"
          prop="bankAccount"
          :check-rules="[
            { message: '请输入银行账户' },
            { message: '银行账户仅支持数字', pattern: BoleRegExp.RegNumber },
          ]"
        >
          <ProFormText v-model.trim="form.bankAccount" placeholder="请输入银行账户" />
        </ProFormItemV2>
        <ProFormItemV2 label="银行账户:" prop="verifyStatus">
          {{ 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="form.enterpriseConfigureType === EnterpriseConfigureType.Electronic">
        <div class="configure-dialog-form-title">通道配置</div>
        <ProFormItemV2
          v-for="(item, index) in enabledElectronSignSettings"
          :label="item.accessName"
          :key="item.access"
          prop="electronSignAccesses"
          required
        >
          <ProFormSwitch
            v-model="form.electronSignAccesses[index]"
            :active-value="Number(item.access)"
            :inactive-value="null"
          ></ProFormSwitch>
        </ProFormItemV2>
      </template>
      <template v-if="form.enterpriseConfigureType === EnterpriseConfigureType.ShortMessage">
        <div class="configure-dialog-form-title">通道配置</div>
        <ProFormItemV2 label="名称:" prop="smsAccess" :checkRules="[{ message: '请选择短信通道' }]">
          <ProFormSelect
            v-model="form.smsAccess"
            :valueEnum="EnumSmsAccessText"
            placeholder="请选择短信通道"
          >
          </ProFormSelect>
        </ProFormItemV2>
        <div class="configure-dialog-form-title">费用配置</div>
        <ProFormItemV2 label="短信费用:" prop="smsCost">
          <ProFormInputNumber
            :controls="false"
            v-model="form.smsCost"
            placeholder="请输入"
            unit="元/条"
          />
        </ProFormItemV2>
      </template>
    </ProForm>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="emit('onCancel')">取 消</el-button>
        <el-button type="primary" @click="handleConfirm">确 定</el-button>
      </span>
    </template>
  </ProDialog>
  <AlipayWalletOpen v-bind="dialogQrcodeProps"></AlipayWalletOpen>
</template>
 
<script setup lang="ts">
import { FormInstance } from 'element-plus';
import {
  ProDialog,
  ProForm,
  ProFormItemV2,
  ProFormText,
  ProFormRadio,
  ProFormInputNumber,
  ProFormSelect,
  ProFormSwitch,
  useFormDialog,
  UploadUserFile,
  ProFormImageUpload,
  ProFormUpload,
} from '@bole-core/components';
import { BoleRegExp } from '@bole-core/core';
import {
  EnterpriseConfigureType,
  EnterpriseConfigureTypeText,
  ChargeTypeEnum,
  EnumElectronSignAccessText,
  EnumSmsAccessText,
  EnumElectronSignAccess,
  EnumEnterpriseWalletSignStatusText,
  EnumEnterpriseWalletExpandindirectOrderStatusText,
  EnumEnterpriseWalletExpandindirectOrderSceneText,
} from '@/constants';
import * as enterpriseWalletServices from '@/services/api/enterpriseWallet';
import AlipayWalletOpen from './AlipayWalletOpen.vue';
 
defineOptions({
  name: 'ConfigureDialog',
});
 
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 form = defineModel<Form>('form');
const visible = defineModel({ type: Boolean });
 
const emit = defineEmits<{
  (e: 'onConfirm'): void;
  (e: 'onCancel'): void;
}>();
 
const dialogForm = ref<FormInstance>();
 
const { enabledElectronSignSettings } = useEnabledElectronSignSettings({
  all: true,
});
 
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) {}
}
 
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;
  dialogForm.value.resetFields();
}
 
function handleConfirm() {
  if (!dialogForm.value) return;
  dialogForm.value.validate((valid) => {
    if (valid) {
      emit('onConfirm');
    } else {
      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 *;
 
.configure-dialog-form-title {
  margin-bottom: 10px;
  font-size: 15px;
  font-weight: bold;
  line-height: 36px;
}
</style>