From 7c9a5aa77eb4d537561ce074921616621400c80e Mon Sep 17 00:00:00 2001
From: ch <cwl_ch@163.com>
Date: Wed, 6 Jul 2022 19:08:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BA=94=E7=94=A8=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/pay/application.js           |  10 +-
 src/store/modules/pay/application.js |   4 +-
 src/views/pay/application/add.vue    |  11 --
 src/views/pay/application/detail.vue |  11 --
 src/views/pay/application/form.vue   | 199 +++++++++++++++++++++++++++
 src/views/pay/application/index.vue  |  12 +-
 6 files changed, 212 insertions(+), 35 deletions(-)
 delete mode 100644 src/views/pay/application/add.vue
 delete mode 100644 src/views/pay/application/detail.vue
 create mode 100644 src/views/pay/application/form.vue

diff --git a/src/api/pay/application.js b/src/api/pay/application.js
index 5aee88d..c0b8972 100644
--- a/src/api/pay/application.js
+++ b/src/api/pay/application.js
@@ -2,32 +2,32 @@
  * @Author: ch
  * @Date: 2022-07-04 15:20:02
  * @LastEditors: ch
- * @LastEditTime: 2022-07-06 14:27:54
+ * @LastEditTime: 2022-07-06 17:20:08
  * @Description: file content
  */
 import request from '@/utils/request.js';
 export const create = (data) => {
     return request({
-        url: '/payCenter/mchInfo',
+        url: '/payCenter/appInfo',
         method: 'post',
         data,
     });
 };
 export const del = (mchPrimaryId) => {
     return request({
-        url: `/payCenter/mchInfo/${mchPrimaryId}`,
+        url: `/payCenter/appInfo/${mchPrimaryId}`,
         method: 'delete',
     });
 };
 export const detail = (mchPrimaryId) => {
     return request({
-        url: `/payCenter/mchInfo/${mchPrimaryId}`,
+        url: `/payCenter/appInfo/${mchPrimaryId}`,
         method: 'get',
     });
 };
 export const update = (data) => {
     return request({
-        url: '/payCenter/mchInfo',
+        url: '/payCenter/appInfo',
         method: 'put',
         data,
     });
diff --git a/src/store/modules/pay/application.js b/src/store/modules/pay/application.js
index 6e33dfe..53ad07f 100644
--- a/src/store/modules/pay/application.js
+++ b/src/store/modules/pay/application.js
@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-07-04 15:21:30
  * @LastEditors: ch
- * @LastEditTime: 2022-07-06 14:31:27
+ * @LastEditTime: 2022-07-06 17:18:37
  * @Description: file content
  */
 import * as api from '@/api/pay/application.js';
@@ -48,7 +48,7 @@ const actions = {
         }
     },
     async save({ dispatch }, data) {
-        let save = data.mchPrimaryId ? api.update : api.create;
+        let save = data.appPrimaryId ? api.update : api.create;
         let res = await save(data);
         if (res) {
             ElMessage.success('保存成功');
diff --git a/src/views/pay/application/add.vue b/src/views/pay/application/add.vue
deleted file mode 100644
index 0563eff..0000000
--- a/src/views/pay/application/add.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<!--
- * @Author: ch
- * @Date: 2022-07-04 16:37:25
- * @LastEditors: ch
- * @LastEditTime: 2022-07-04 16:38:00
- * @Description: file content
--->
-<template>
-    <div></div>
-</template>
-<script setup lang="jsx"></script>
diff --git a/src/views/pay/application/detail.vue b/src/views/pay/application/detail.vue
deleted file mode 100644
index d39e58f..0000000
--- a/src/views/pay/application/detail.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<!--
- * @Author: ch
- * @Date: 2022-07-04 16:34:07
- * @LastEditors: ch
- * @LastEditTime: 2022-07-04 16:34:13
- * @Description: file content
--->
-<template></template>
-<script lang="jsx">
-    export default {};
-</script>
diff --git a/src/views/pay/application/form.vue b/src/views/pay/application/form.vue
new file mode 100644
index 0000000..412f8c5
--- /dev/null
+++ b/src/views/pay/application/form.vue
@@ -0,0 +1,199 @@
+<!--
+ * @Author: ch
+ * @Date: 2022-07-04 16:42:21
+ * @LastEditors: ch
+ * @LastEditTime: 2022-07-06 19:01:37
+ * @Description: file content
+-->
+<template>
+    <div>
+        <el-form ref="formEl" label-width="160px" :model="form" :rules="rules">
+            <el-form-item label="商户平台" prop="mchPrimaryId">
+                <el-select v-model="form.mchPrimaryId" @change="handleChangeMch" :disabled="isEdit">
+                    <el-option
+                        v-for="item in opts.merchant"
+                        :key="item.mchPrimaryId"
+                        :label="item.mchName"
+                        :value="item.mchPrimaryId"
+                    />
+                </el-select>
+            </el-form-item>
+            <el-form-item label="应用名称" prop="appName">
+                <el-input v-model="form.appName" maxlength="64" show-word-limit />
+            </el-form-item>
+            <el-form-item label="应用代号" prop="appCode">
+                <el-input v-model="form.appCode" maxlength="64" show-word-limit />
+            </el-form-item>
+            <el-form-item label="支付方式" prop="payCodes" v-if="form.mchInfo.mchCode">
+                <el-checkbox-group v-model="form.payCodes">
+                    <el-checkbox v-for="item in payTypeData" :label="item.code" :key="item.code">
+                        {{ item.text }}
+                    </el-checkbox>
+                </el-checkbox-group>
+            </el-form-item>
+            <el-form-item label="应用ID" prop="appId">
+                <el-input v-model="form.appId" maxlength="64" show-word-limit />
+            </el-form-item>
+            <el-form-item label="签名秘钥" prop="signKey">
+                <el-input v-model="form.signKey" maxlength="64" show-word-limit />
+            </el-form-item>
+            <el-form-item label="应用状态">
+                <el-select v-model="form.isDisabled" :clearable="false">
+                    <el-option v-for="item in opts.status" :key="item.value" :label="item.label" :value="item.value" />
+                </el-select>
+            </el-form-item>
+
+            <template v-if="form.mchInfo.mchCode === 'wxpay'">
+                <el-form-item label="应用Secret" prop="appSecret">
+                    <el-input
+                        type="textarea"
+                        maxlength="400"
+                        show-word-limit
+                        v-model="form.appSecret"
+                        :placeholder="form.wxAppData.appSecret"
+                    />
+                </el-form-item>
+            </template>
+            <template v-if="form.mchInfo.mchCode === 'alipay'">
+                <el-form-item label="应用私钥" prop="privateKey">
+                    <el-input
+                        type="textarea"
+                        maxlength="400"
+                        show-word-limit
+                        v-model="form.privateKey"
+                        :placeholder="form.aliAppData.privateKey"
+                    />
+                </el-form-item>
+                <el-form-item label="应用证书" prop="appCertUrl">
+                    <el-upload action="none" accept=".crt" :show-file-list="false" :http-request="handleUpload">
+                        <el-button type="success" v-if="form.aliAppData.hasAppCert || form.appCertUrl">
+                            已上传，点击重新上传
+                        </el-button>
+                        <el-button type="primary" v-else>上传</el-button>
+                    </el-upload>
+                </el-form-item>
+            </template>
+            <el-form-item>
+                <el-button @click="handleCancel">取消</el-button>
+                <el-button :disabled="loading" :loading="submitting" type="primary" @click="handleSave">保存</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+<script setup lang="jsx">
+    import { upload } from '@/api/file';
+    const store = useStore();
+    const router = useRouter();
+    const route = useRoute();
+    // 页面字典表数据
+    const opts = computed(() => store.state.application.opts);
+    const defaultForm = {
+        mchInfo: {},
+        mchPrimaryId: '',
+        appName: '',
+        appCode: '',
+        payCodes: [],
+        appId: '',
+        signKey: '',
+        isDisabled: false,
+        aliAppData: {
+            privateKey: '',
+            appCertUrl: '',
+        },
+        wxAppData: {
+            appSecret: '',
+        },
+    };
+    const defaultRules = {
+        mchPrimaryId: [{ required: true, message: '请选择商户平台' }],
+        appName: [{ required: true, message: '应用名称不能为空' }],
+        appCode: [{ required: true, message: '应用代号不能为空' }],
+        payCodes: [{ type: 'array', required: true, message: '至少选一个支付方式' }],
+        appId: [{ required: true, message: '应用ID不能为空' }],
+        signKey: [{ required: true, message: '签名秘钥不能为空' }],
+    };
+    const form = reactive({ ...defaultForm });
+    const isEdit = computed(() => Boolean(route.params.id));
+    const payTypeData = computed(() => {
+        return (
+            unref(opts).payType.filter((i) => {
+                return i.mchCode === form.mchInfo.mchCode;
+            }) || []
+        );
+    });
+    const rules = computed(() => {
+        let meRules = { ...defaultRules };
+        if (!isEdit.value) {
+            meRules.appSecret = [{ required: true, message: '应用Secret不能为空' }];
+            meRules.privateKey = [{ required: true, message: '应用私钥不能为空' }];
+            meRules.appCertUrl = [{ required: true, message: '应用证书不能为空' }];
+        }
+        return meRules;
+    });
+
+    const formEl = ref();
+
+    store.dispatch('application/getMerchantList');
+    store.dispatch('application/getPayType');
+    onActivated(() => {
+        handlelLoadData();
+    });
+    /**
+     * 如果是编辑需要加载初始数据加载
+     */
+    const handlelLoadData = async () => {
+        let id = route.params.id;
+        if (id && form.id !== id) {
+            let res = await store.dispatch('application/detail', id);
+            res.payCodes = res.payCodes.split(',');
+            Object.assign(form, res);
+        }
+    };
+    /**
+     * 切换商户时需要拿到当前商户信息，用来应用判断属于哪个平台
+     */
+    const handleChangeMch = (item) => {
+        if (!item) {
+            return false;
+        }
+        const mchCode = form.mchInfo.mchCode;
+        form.mchInfo = unref(opts).merchant.find((i) => i.mchPrimaryId === item);
+        if (mchCode !== form.mchInfo.mchCode) {
+            form.payCodes = [];
+        }
+    };
+
+    /**
+     * 上传阿里应用证书
+     */
+    const handleUpload = async ({ file }) => {
+        const res = await upload('payCenter', 'application/', file);
+        form.appCertUrl = res;
+    };
+    const handleSave = async () => {
+        try {
+            await formEl.value.validate();
+            let data = { ...form };
+            data.payCodes = data.payCodes.join(',');
+            if (data.privateKey) {
+                data.aliAppData.privateKey = data.privateKey;
+            }
+            if (data.appCertUrl) {
+                data.aliAppData.appCertUrl = data.appCertUrl;
+            }
+            if (data.appSecret) {
+                data.wxAppData.appSecret = data.appSecret;
+            }
+            const res = await store.dispatch('application/save', data);
+            if (res) {
+                handleCancel();
+            }
+        } catch (e) {}
+    };
+    const handleCancel = () => {
+        Object.assign(form, defaultForm);
+        formEl.value.resetFields();
+        router.push({ name: 'PayApplication' });
+    };
+</script>
+<style lang="less" scoped></style>
diff --git a/src/views/pay/application/index.vue b/src/views/pay/application/index.vue
index 0186278..eb21c8b 100644
--- a/src/views/pay/application/index.vue
+++ b/src/views/pay/application/index.vue
@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-06-15 17:29:32
  * @LastEditors: ch
- * @LastEditTime: 2022-07-06 14:31:59
+ * @LastEditTime: 2022-07-06 16:46:56
  * @Description: file content
 -->
 <template>
@@ -13,7 +13,7 @@
         :data="list"
         :operation="['create', 'search']"
         :reset="handleReset"
-        title="商户"
+        title="应用"
         :total="total"
         @create="handleCreate"
         @search="handleSearch"
@@ -103,7 +103,7 @@
         state.condition = { ..._condition };
     };
     const handleCreate = () => {
-        router.push('./create');
+        router.push({ name: 'CreateApplication' });
     };
     const handleShowHide = (row) => {
         store.dispatch('application/updateStatus', {
@@ -113,7 +113,7 @@
     };
     const handleEdit = (id) => {
         router.push({
-            path: './update',
+            name: 'UpdateApplication',
             params: {
                 id,
             },
@@ -169,10 +169,10 @@
                 slots: {
                     default: ({ row }) => (
                         <div>
-                            <ElButton type="text" onClick={() => handleEdit(row.mchPrimaryId)}>
+                            <ElButton type="text" onClick={() => handleEdit(row.appPrimaryId)}>
                                 编辑
                             </ElButton>
-                            <ElButton type="text" onClick={() => handleDelete(row.mchPrimaryId)}>
+                            <ElButton type="text" onClick={() => handleDelete(row.appPrimaryId)}>
                                 删除
                             </ElButton>
                         </div>