!188 feat: 支付管理/应用信息

Merge pull request !188 from dhb52/master

src/api/pay/channel/index.ts

@@ -7,7 +7,6 @@ export interface ChannelVO {
   status: number
   remark: string
   feeRate: number
-  merchantId: number
   appId: number
   createTime: Date
 }
@@ -18,13 +17,12 @@ export const getChannelPage = (params: PageParam) => {
 }
 
 // 查询详情支付渠道
-export const getChannel = (merchantId: number, appId: string, code: string) => {
+export const getChannel = (appId: string, code: string) => {
   const params = {
-    merchantId: merchantId,
     appId: appId,
     code: code
   }
-  return request.get({ url: '/pay/channel/get-channel', params: params })
+  return request.get({ url: '/pay/channel/get', params: params })
 }
 
 // 新增支付渠道

src/utils/constants.ts

@@ -118,6 +118,10 @@ export const PayChannelEnum = {
   ALIPAY_BAR: {
     code: 'alipay_bar',
     name: '支付宝条码支付'
+  },
+  MOCK: {
+    code: 'mock',
+    name: '模拟支付'
   }
 }
 
@@ -126,7 +130,8 @@ export const PayChannelEnum = {
  */
 export const PayType = {
   WECHAT: 'WECHAT',
-  ALIPAY: 'ALIPAY'
+  ALIPAY: 'ALIPAY',
+  MOCK: 'MOCK'
 }
 
 /**

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

@@ -10,16 +10,6 @@
       <el-form-item label="应用名" prop="name">
         <el-input v-model="formData.name" placeholder="请输入应用名" />
       </el-form-item>
-      <el-form-item label="所属商户" prop="merchantId">
-        <el-select v-model="formData.merchantId" placeholder="请选择所属商户">
-          <el-option
-            v-for="item in merchantList"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          />
-        </el-select>
-      </el-form-item>
       <el-form-item label="开启状态" prop="status">
         <el-radio-group v-model="formData.status">
           <el-radio
@@ -47,10 +37,10 @@
     </template>
   </Dialog>
 </template>
+
 <script lang="ts" setup>
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import * as AppApi from '@/api/pay/app'
-import * as MerchantApi from '@/api/pay/merchant'
 import { CommonStatusEnum } from '@/utils/constants'
 
 defineOptions({ name: 'PayAppForm' })
@@ -77,11 +67,9 @@ const formRules = reactive({
   name: [{ required: true, message: '应用名不能为空', trigger: 'blur' }],
   status: [{ required: true, message: '开启状态不能为空', trigger: 'blur' }],
   payNotifyUrl: [{ required: true, message: '支付结果的回调地址不能为空', trigger: 'blur' }],
-  refundNotifyUrl: [{ required: true, message: '退款结果的回调地址不能为空', trigger: 'blur' }],
-  merchantId: [{ required: true, message: '商户编号不能为空', trigger: 'blur' }]
+  refundNotifyUrl: [{ required: true, message: '退款结果的回调地址不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
-const merchantList = ref([]) // 商户列表
 
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
@@ -98,8 +86,6 @@ const open = async (type: string, id?: number) => {
       formLoading.value = false
     }
   }
-  // 加载商户列表
-  merchantList.value = await MerchantApi.getMerchantListByName()
 }
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
@@ -137,8 +123,7 @@ const resetForm = () => {
     status: CommonStatusEnum.ENABLE,
     remark: undefined,
     payNotifyUrl: undefined,
-    refundNotifyUrl: undefined,
-    merchantId: undefined
+    refundNotifyUrl: undefined
   }
   formRef.value?.resetFields()
 }

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

+<template>
+  <div>
+    <el-dialog
+      v-model:visible="dialogVisible"
+      :title="title"
+      @closed="close"
+      append-to-body
+      destroy-on-close
+      width="800px"
+    >
+      <el-form
+        ref="formRef"
+        :model="formData"
+        :rules="rules"
+        label-width="100px"
+        v-loading="formLoading"
+      >
+        <el-form-item label-width="180px" label="渠道状态" prop="status">
+          <el-radio-group v-model="formData.status">
+            <el-radio
+              v-for="dict in getDictOptions(DICT_TYPE.COMMON_STATUS)"
+              :key="parseInt(dict.value)"
+              :label="parseInt(dict.value)"
+            >
+              {{ dict.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label-width="180px" label="备注" prop="remark">
+          <el-input v-model="formData.remark" :style="{ width: '100%' }" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="close">取消</el-button>
+        <el-button type="primary" @click="submitForm">确定</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+<script lang="ts" setup name="MockChannelForm">
+import { createChannel, getChannel, updateChannel } from '@/api/pay/channel'
+import { CommonStatusEnum } from '@/utils/constants'
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false)
+const formLoading = ref(false)
+const title = ref('')
+const formData = ref<any>({
+  appId: '',
+  code: '',
+  status: undefined,
+  feeRate: 0,
+  remark: '',
+  config: {
+    name: 'mock-conf'
+  }
+})
+
+const rules = {
+  status: [{ required: true, message: '渠道状态不能为空', trigger: 'blur' }]
+}
+
+const formRef = ref()
+
+const emit = defineEmits(['success'])
+
+const open = async (appId, code) => {
+  dialogVisible.value = true
+  formLoading.value = true
+  reset(appId, code)
+
+  try {
+    const data = await getChannel(appId, code)
+
+    if (data && data.id) {
+      formData.value = data
+      formData.value.config = JSON.parse(data.config)
+    }
+    title.value = !formData.value.id ? '创建支付渠道' : '编辑支付渠道'
+  } finally {
+    formLoading.value = false
+  }
+}
+
+const close = () => {
+  dialogVisible.value = false
+  reset(undefined, undefined)
+}
+
+const submitForm = async () => {
+  const valid = await formRef.value?.validate()
+  if (!valid) {
+    return
+  }
+  const data = { ...formData.value }
+  data.config = JSON.stringify(formData.value.config)
+  if (!data.id) {
+    createChannel(data).then(() => {
+      message.success('新增成功')
+      emit('success')
+      close()
+    })
+  } else {
+    updateChannel(data).then(() => {
+      message.success('修改成功')
+      emit('success')
+      close()
+    })
+  }
+}
+
+/** 重置表单 */
+const reset = (appId, code) => {
+  formData.value = {
+    appId: appId,
+    code: code,
+    status: CommonStatusEnum.ENABLE,
+    remark: '',
+    feeRate: 0,
+    config: {
+      name: 'mock-conf'
+    }
+  }
+  formRef.value?.resetFields()
+}
+
+defineExpose({ open })
+</script>

src/views/pay/order/index.vue

@@ -325,7 +325,7 @@ const openDetail = (id: number) => {
 onMounted(async () => {
   await getList()
   // 加载商户列表
-  merchantList.value = await MerchantApi.getMerchantListByName()
+  // merchantList.value = await MerchantApi.getMerchantListByName()
   // 加载 App 列表
   // TODO 芋艿：候选少一个查询应用列表的接口
   // appList.value = await AppApi.getAppListByMerchantId()