支付代码更新

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

@@ -27,6 +27,9 @@
       <el-form-item label="退款结果的回调地址" prop="refundNotifyUrl">
         <el-input v-model="formData.refundNotifyUrl" placeholder="请输入退款结果的回调地址" />
       </el-form-item>
+      <el-form-item label="转账结果的回调地址" prop="transferNotifyUrl">
+        <el-input v-model="formData.transferNotifyUrl" placeholder="请输入转账结果的回调地址" />
+      </el-form-item>
       <el-form-item label="备注" prop="remark">
         <el-input v-model="formData.remark" placeholder="请输入备注" />
       </el-form-item>
@@ -67,7 +70,8 @@ const formRules = reactive({
   name: [{ required: true, message: '应用名不能为空', trigger: 'blur' }],
   status: [{ required: true, message: '开启状态不能为空', trigger: 'blur' }],
   orderNotifyUrl: [{ required: true, message: '支付结果的回调地址不能为空', trigger: 'blur' }],
-  refundNotifyUrl: [{ required: true, message: '退款结果的回调地址不能为空', trigger: 'blur' }]
+  refundNotifyUrl: [{ required: true, message: '退款结果的回调地址不能为空', trigger: 'blur' }],
+  transferNotifyUrl: [{ required: true, message: '转账结果的回调地址不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
 
@@ -123,7 +127,8 @@ const resetForm = () => {
     status: CommonStatusEnum.ENABLE,
     remark: undefined,
     orderNotifyUrl: undefined,
-    refundNotifyUrl: undefined
+    refundNotifyUrl: undefined,
+    transferNotifyUrl: undefined
   }
   formRef.value?.resetFields()
 }

src/views/pay/app/components/channel/WeixinChannelForm.vue

@@ -52,9 +52,6 @@
               v-model="formData.config.mchKey"
               placeholder="请输入商户密钥"
               clearable
-              :style="{ width: '100%' }"
-              type="textarea"
-              :autosize="{ minRows: 8, maxRows: 8 }"
             />
           </el-form-item>
           <el-form-item
@@ -80,7 +77,8 @@
               :http-request="keyContentUpload"
             >
               <el-button type="primary">
-                <Icon icon="ep:upload" class="mr-5px" /> 点击上传
+                <Icon icon="ep:upload" class="mr-5px" />
+                点击上传
               </el-button>
             </el-upload>
           </el-form-item>
@@ -91,9 +89,6 @@
               v-model="formData.config.apiV3Key"
               placeholder="请输入 API V3 密钥"
               clearable
-              :style="{ width: '100%' }"
-              type="textarea"
-              :autosize="{ minRows: 8, maxRows: 8 }"
             />
           </el-form-item>
           <el-form-item
@@ -120,38 +115,18 @@
               :http-request="privateKeyContentUpload"
             >
               <el-button type="primary">
-                <Icon icon="ep:upload" class="mr-5px" /> 点击上传
+                <Icon icon="ep:upload" class="mr-5px" />
+                点击上传
               </el-button>
             </el-upload>
           </el-form-item>
-          <el-form-item
-            label-width="180px"
-            label="apiclient_cert.pem证书"
-            prop="config.privateCertContent"
-          >
+          <el-form-item label-width="180px" label="证书序列号" prop="config.certSerialNo">
             <el-input
-              v-model="formData.config.privateCertContent"
-              type="textarea"
-              placeholder="请上传apiclient_cert.pem证书"
-              readonly
-              :autosize="{ minRows: 8, maxRows: 8 }"
-              :style="{ width: '100%' }"
+              v-model="formData.config.certSerialNo"
+              placeholder="请输入证书序列号"
+              clearable
             />
           </el-form-item>
-          <el-form-item label-width="180px" label="" prop="privateCertContentFile">
-            <el-upload
-              ref="privateCertContentFile"
-              :limit="1"
-              accept=".pem"
-              action=""
-              :before-upload="pemFileBeforeUpload"
-              :http-request="privateCertContentUpload"
-            >
-              <el-button type="primary">
-                <Icon icon="ep:upload" class="mr-5px" /> 点击上传
-              </el-button>
-            </el-upload>
-          </el-form-item>
         </div>
         <el-form-item label-width="180px" label="备注" prop="remark">
           <el-input v-model="formData.remark" :style="{ width: '100%' }" />
@@ -190,7 +165,7 @@ const formData = ref<any>({
     mchKey: '',
     keyContent: '',
     privateKeyContent: '',
-    privateCertContent: '',
+    certSerialNo: '',
     apiV3Key: ''
   }
 })
@@ -207,8 +182,8 @@ const formRules = {
   'config.privateKeyContent': [
     { required: true, message: '请上传 apiclient_key.pem 证书', trigger: 'blur' }
   ],
-  'config.privateCertContent': [
-    { required: true, message: '请上传 apiclient_cert.pem证 书', trigger: 'blur' }
+  'config.certSerialNo': [
+    { required: true, message: '请输入证书序列号', trigger: 'blur' }
   ],
   'config.apiV3Key': [{ required: true, message: '请上传 api V3 密钥值', trigger: 'blur' }]
 }
@@ -275,7 +250,7 @@ const resetForm = (appId, code) => {
       mchKey: '',
       keyContent: '',
       privateKeyContent: '',
-      privateCertContent: '',
+      certSerialNo: '',
       apiV3Key: ''
     }
   }
@@ -283,7 +258,7 @@ const resetForm = (appId, code) => {
 }
 
 /**
- * apiclient_cert.p12、apiclient_cert.pem、apiclient_key.pem 上传前的校验
+ * apiclient_cert.p12、apiclient_key.pem 上传前的校验
  */
 const fileBeforeUpload = (file, fileAccept) => {
   let format = '.' + file.name.split('.')[1]
@@ -310,7 +285,7 @@ const pemFileBeforeUpload = (file) => {
 /**
  * 读取 apiclient_key.pem 到 privateKeyContent 字段
  */
-const privateKeyContentUpload = (event) => {
+const privateKeyContentUpload = async (event) => {
   const readFile = new FileReader()
   readFile.onload = (e: any) => {
     formData.value.config.privateKeyContent = e.target.result
@@ -318,21 +293,10 @@ const privateKeyContentUpload = (event) => {
   readFile.readAsText(event.file)
 }
 
-/**
- * 读取 apiclient_cert.pem 到 privateCertContent 字段
- */
-const privateCertContentUpload = (event) => {
-  const readFile = new FileReader()
-  readFile.onload = (e: any) => {
-    formData.value.config.privateCertContent = e.target.result
-  }
-  readFile.readAsText(event.file)
-}
-
 /**
  * 读取 apiclient_cert.p12 到 keyContent 字段
  */
-const keyContentUpload = (event) => {
+const keyContentUpload = async (event) => {
   const readFile = new FileReader()
   readFile.onload = (e: any) => {
     formData.value.config.keyContent = e.target.result.split(',')[1]

src/views/pay/app/index.vue

@@ -44,10 +44,17 @@
         />
       </el-form-item>
       <el-form-item>
-        <el-button @click="handleQuery"> <Icon icon="ep:search" class="mr-5px" />搜索 </el-button>
-        <el-button @click="resetQuery"> <Icon icon="ep:refresh" class="mr-5px" />重置 </el-button>
+        <el-button @click="handleQuery">
+          <Icon icon="ep:search" class="mr-5px" />
+          搜索
+        </el-button>
+        <el-button @click="resetQuery">
+          <Icon icon="ep:refresh" class="mr-5px" />
+          重置
+        </el-button>
         <el-button type="primary" plain @click="openForm('create')" v-hasPermi="['pay:app:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
+          <Icon icon="ep:plus" class="mr-5px" />
+          新增
         </el-button>
       </el-form-item>
     </el-form>
@@ -69,93 +76,18 @@
         </template>
       </el-table-column>
       <el-table-column label="支付宝配置" align="center">
-        <el-table-column :label="PayChannelEnum.ALIPAY_APP.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.ALIPAY_APP.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_APP.code)"
-              circle
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_APP.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.ALIPAY_PC.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.ALIPAY_PC.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_PC.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_PC.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.ALIPAY_WAP.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.ALIPAY_WAP.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_WAP.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_WAP.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.ALIPAY_QR.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.ALIPAY_QR.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_QR.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_QR.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.ALIPAY_BAR.name" align="center">
+        <el-table-column
+          :label="channel.name"
+          align="center"
+          v-for="channel in alipayChannels"
+          :key="channel.code"
+        >
           <template #default="scope">
             <el-button
               type="success"
+              v-if="isChannelExists(scope.row.channelCodes, channel.code)"
+              @click="openChannelForm(scope.row, channel.code)"
               circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.ALIPAY_BAR.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_BAR.code)"
             >
               <Icon icon="ep:check" />
             </el-button>
@@ -163,7 +95,7 @@
               v-else
               type="danger"
               circle
-              @click="openChannelForm(scope.row, PayChannelEnum.ALIPAY_BAR.code)"
+              @click="openChannelForm(scope.row, channel.code)"
             >
               <Icon icon="ep:close" />
             </el-button>
@@ -171,93 +103,18 @@
         </el-table-column>
       </el-table-column>
       <el-table-column label="微信配置" align="center">
-        <el-table-column :label="PayChannelEnum.WX_LITE.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.WX_LITE.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_LITE.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_LITE.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.WX_PUB.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.WX_PUB.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_PUB.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_PUB.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.WX_APP.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.WX_APP.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_APP.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_APP.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.WX_BAR.name" align="center">
-          <template #default="scope">
-            <el-button
-              type="success"
-              circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.WX_BAR.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_BAR.code)"
-            >
-              <Icon icon="ep:check" />
-            </el-button>
-            <el-button
-              v-else
-              type="danger"
-              circle
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_BAR.code)"
-            >
-              <Icon icon="ep:close" />
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column :label="PayChannelEnum.WX_NATIVE.name" align="center">
+        <el-table-column
+          :label="channel.name"
+          align="center"
+          v-for="channel in wxChannels"
+          :key="channel.code"
+        >
           <template #default="scope">
             <el-button
               type="success"
+              v-if="isChannelExists(scope.row.channelCodes, channel.code)"
+              @click="openChannelForm(scope.row, channel.code)"
               circle
-              v-if="isChannelExists(scope.row.channelCodes, PayChannelEnum.WX_NATIVE.code)"
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_NATIVE.code)"
             >
               <Icon icon="ep:check" />
             </el-button>
@@ -265,7 +122,7 @@
               v-else
               type="danger"
               circle
-              @click="openChannelForm(scope.row, PayChannelEnum.WX_NATIVE.code)"
+              @click="openChannelForm(scope.row, channel.code)"
             >
               <Icon icon="ep:close" />
             </el-button>
@@ -357,12 +214,11 @@
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import * as AppApi from '@/api/pay/app'
 import AppForm from './components/AppForm.vue'
-import { PayChannelEnum } from '@/utils/constants'
+import { CommonStatusEnum, PayChannelEnum } from '@/utils/constants'
 import AlipayChannelForm from './components/channel/AlipayChannelForm.vue'
 import WeixinChannelForm from './components/channel/WeixinChannelForm.vue'
 import MockChannelForm from './components/channel/MockChannelForm.vue'
 import WalletChannelForm from './components/channel/WalletChannelForm.vue'
-import { CommonStatusEnum } from '@/utils/constants'
 
 defineOptions({ name: 'PayApp' })
 
@@ -384,6 +240,23 @@ const queryParams = reactive({
 })
 const queryFormRef = ref() // 搜索的表单
 
+const alipayChannels = [
+  PayChannelEnum.ALIPAY_APP,
+  PayChannelEnum.ALIPAY_PC,
+  PayChannelEnum.ALIPAY_WAP,
+  PayChannelEnum.ALIPAY_QR,
+  PayChannelEnum.ALIPAY_BAR
+]
+
+const wxChannels = [
+  PayChannelEnum.WX_LITE,
+  PayChannelEnum.WX_PUB,
+  PayChannelEnum.WX_APP,
+  PayChannelEnum.WX_NATIVE,
+  // PayChannelEnum.WX_WAP,
+  PayChannelEnum.WX_BAR,
+]
+
 /** 查询列表 */
 const getList = async () => {
   loading.value = true

src/views/pay/demo/order/index.vue

@@ -1,5 +1,4 @@
 <template>
-
   <!-- 操作工具栏 -->
   <el-row :gutter="10" class="mb8">
     <el-col :span="1.5">
@@ -143,7 +142,7 @@ const handlePay = (row: any) => {
     name: 'PayCashier',
     query: {
       id: row.payOrderId,
-      returnUrl: encodeURIComponent('/pay/demo-order?id=' + row.id)
+      returnUrl: encodeURIComponent('/pay/demo/order?id=' + row.id)
     }
   })
 }

src/views/pay/notify/index.vue

@@ -1,5 +1,4 @@
 <template>
-
   <!-- 搜索工作栏 -->
   <ContentWrap>
     <el-form

src/views/pay/order/OrderDetail.vue

@@ -62,7 +62,9 @@
     <el-divider />
     <el-descriptions :column="1" label-class-name="desc-label" direction="vertical" border>
       <el-descriptions-item label="支付通道异步回调内容">
-        <el-text>{{ detailData.extension.channelNotifyData }}</el-text>
+        <el-text style="white-space: pre-wrap; word-break: break-word">
+          {{ detailData.extension.channelNotifyData }}
+        </el-text>
       </el-descriptions-item>
     </el-descriptions>
   </Dialog>

src/views/pay/order/index.vue

@@ -1,5 +1,4 @@
 <template>
-
   <ContentWrap>
     <el-form
       class="-mb-15px"

src/views/pay/refund/RefundDetail.vue

@@ -62,7 +62,9 @@
     </el-descriptions>
     <el-descriptions :column="1" label-class-name="desc-label" direction="vertical" border>
       <el-descriptions-item label="支付通道异步回调内容">
-        {{ refundDetail.channelNotifyData }}
+        <el-text style="white-space: pre-wrap; word-break: break-word">
+          {{ refundDetail.channelNotifyData }}
+        </el-text>
       </el-descriptions-item>
     </el-descriptions>
   </Dialog>

src/views/pay/refund/index.vue

@@ -1,5 +1,4 @@
 <template>
-
   <!-- 搜索工作栏 -->
   <ContentWrap>
     <el-form

src/views/pay/wallet/balance/index.vue

@@ -8,15 +8,30 @@
       :inline="true"
       label-width="68px"
     >
-      <el-form-item label="用户昵称" prop="nickname">
+      <el-form-item label="用户编号" prop="userId">
         <el-input
-          v-model="queryParams.nickname"
-          placeholder="请输入用户昵称"
+          v-model="queryParams.userId"
+          placeholder="请输入用户编号"
           clearable
           @keyup.enter="handleQuery"
           class="!w-240px"
         />
       </el-form-item>
+      <el-form-item label="用户类型" prop="userType">
+        <el-select
+          v-model="queryParams.userType"
+          placeholder="请选择用户类型"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.USER_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
       <el-form-item label="创建时间" prop="createTime">
         <el-date-picker
           v-model="queryParams.createTime"
@@ -39,12 +54,7 @@
   <ContentWrap>
     <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
       <el-table-column label="编号" align="center" prop="id" />
-      <el-table-column label="用户昵称" align="center" prop="nickname" />
-      <el-table-column label="头像" align="center" prop="avatar" width="80px">
-        <template #default="scope">
-          <img :src="scope.row.avatar" style="width: 40px" />
-        </template>
-      </el-table-column>
+      <el-table-column label="用户编号" align="center" prop="userId" />
       <el-table-column label="用户类型" align="center" prop="userType">
         <template #default="scope">
           <dict-tag :type="DICT_TYPE.USER_TYPE" :value="scope.row.userType" />
@@ -97,20 +107,17 @@ import WalletForm from './WalletForm.vue'
 
 defineOptions({ name: 'WalletBalance' })
 
-const message = useMessage() // 消息弹窗
-const { t } = useI18n() // 国际化
-
 const loading = ref(true) // 列表的加载中
 const total = ref(0) // 列表的总页数
 const list = ref([]) // 列表的数据
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
-  nickname: null,
+  userId: null,
+  userType: null,
   createTime: []
 })
 const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
 /** 查询列表 */
 const getList = async () => {