【功能优化】支付：支付应用，增加 appKey 标识，用于不同接入方的标识

Author: YunaiV

src/api/pay/app/index.ts

@@ -2,6 +2,7 @@ import request from '@/config/axios'
 
 export interface AppVO {
   id: number
+  appKey: string
   name: string
   status: number
   remark: string

src/views/pay/app/components/AppForm.vue

@@ -10,6 +10,9 @@
       <el-form-item label="应用名" prop="name">
         <el-input v-model="formData.name" placeholder="请输入应用名" />
       </el-form-item>
+      <el-form-item label="应用标识" prop="name">
+        <el-input v-model="formData.appKey" placeholder="请输入应用标识" />
+      </el-form-item>
       <el-form-item label="开启状态" prop="status">
         <el-radio-group v-model="formData.status">
           <el-radio
@@ -55,16 +58,15 @@ const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref({
   id: undefined,
   name: undefined,
-  packageId: undefined,
-  contactName: undefined,
-  contactMobile: undefined,
-  accountCount: undefined,
-  expireTime: undefined,
-  domain: undefined,
-  status: CommonStatusEnum.ENABLE
+  appKey: undefined,
+  status: CommonStatusEnum.ENABLE,
+  remark: undefined,
+  orderNotifyUrl: undefined,
+  refundNotifyUrl: undefined
 })
 const formRules = reactive({
   name: [{ required: true, message: '应用名不能为空', trigger: 'blur' }],
+  appKey: [{ required: true, message: '应用标识不能为空', trigger: 'blur' }],
   status: [{ required: true, message: '开启状态不能为空', trigger: 'blur' }],
   orderNotifyUrl: [{ required: true, message: '支付结果的回调地址不能为空', trigger: 'blur' }],
   refundNotifyUrl: [{ required: true, message: '退款结果的回调地址不能为空', trigger: 'blur' }]
@@ -123,7 +125,8 @@ const resetForm = () => {
     status: CommonStatusEnum.ENABLE,
     remark: undefined,
     orderNotifyUrl: undefined,
-    refundNotifyUrl: undefined
+    refundNotifyUrl: undefined,
+    appKey: undefined
   }
   formRef.value?.resetFields()
 }

src/views/pay/app/index.vue

@@ -64,8 +64,8 @@
   <!-- 列表 -->
   <ContentWrap>
     <el-table v-loading="loading" :data="list">
-      <el-table-column label="应用编号" align="center" prop="id" />
-      <el-table-column label="应用名" align="center" prop="name" />
+      <el-table-column label="应用标识" align="center" prop="appKey" />
+      <el-table-column label="应用名" align="center" prop="name" min-width="90" />
       <el-table-column label="开启状态" align="center" prop="status">
         <template #default="scope">
           <el-switch
@@ -78,7 +78,7 @@
       </el-table-column>
       <el-table-column label="支付宝配置" align="center">
         <el-table-column
-          :label="channel.name"
+          :label="channel.name.replace('支付宝', '')"
           align="center"
           v-for="channel in alipayChannels"
           :key="channel.code"
@@ -89,13 +89,15 @@
               v-if="isChannelExists(scope.row.channelCodes, channel.code)"
               @click="openChannelForm(scope.row, channel.code)"
               circle
+              size="small"
             >
               <Icon icon="ep:check" />
             </el-button>
             <el-button
               v-else
               type="danger"
               circle
+              size="small"
               @click="openChannelForm(scope.row, channel.code)"
             >
               <Icon icon="ep:close" />
@@ -105,7 +107,7 @@
       </el-table-column>
       <el-table-column label="微信配置" align="center">
         <el-table-column
-          :label="channel.name"
+          :label="channel.name.replace('微信', '')"
           align="center"
           v-for="channel in wxChannels"
           :key="channel.code"
@@ -116,13 +118,15 @@
               v-if="isChannelExists(scope.row.channelCodes, channel.code)"
               @click="openChannelForm(scope.row, channel.code)"
               circle
+              size="small"
             >
               <Icon icon="ep:check" />
             </el-button>
             <el-button
               v-else
               type="danger"
               circle
+              size="small"
               @click="openChannelForm(scope.row, channel.code)"
             >
               <Icon icon="ep:close" />
@@ -136,6 +140,7 @@
             <el-button
               type="success"
               circle
+              size="small"
               v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.WALLET.code)"
               @click="openChannelForm(scope.row, PayChannelEnum.WALLET.code)"
             >
@@ -145,6 +150,7 @@
               v-else
               type="danger"
               circle
+              size="small"
               @click="openChannelForm(scope.row, PayChannelEnum.WALLET.code)"
             >
               <Icon icon="ep:close" />
@@ -158,6 +164,7 @@
             <el-button
               type="success"
               circle
+              size="small"
               v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.MOCK.code)"
               @click="openChannelForm(scope.row, PayChannelEnum.MOCK.code)"
             >
@@ -167,6 +174,7 @@
               v-else
               type="danger"
               circle
+              size="small"
               @click="openChannelForm(scope.row, PayChannelEnum.MOCK.code)"
             >
               <Icon icon="ep:close" />
@@ -255,7 +263,7 @@ const wxChannels = [
   PayChannelEnum.WX_APP,
   PayChannelEnum.WX_NATIVE,
   PayChannelEnum.WX_WAP,
-  PayChannelEnum.WX_BAR,
+  PayChannelEnum.WX_BAR
 ]
 
 /** 查询列表 */