From 83f368a99f48e84b7aefed6d5ca45e9990ede82e Mon Sep 17 00:00:00 2001
From: DaxPay <xxm1995@outlook.com>
Date: Fri, 21 Jun 2024 18:03:05 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=E8=8E=B7=E5=8F=96OpenId=E6=BC=94?=
 =?UTF-8?q?=E7=A4=BA=E7=95=8C=E9=9D=A2,=20=E4=BC=98=E5=8C=96=E8=AE=A4?=
 =?UTF-8?q?=E8=AF=81=E6=8E=88=E6=9D=83=E5=9C=B0=E5=9D=80=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/demo/cashier/Cashier.vue            |   1 +
 src/views/demo/openid/OpenId.api.ts           |  66 ++++++++++
 src/views/demo/openid/OpenIdDemo.vue          | 122 ++++++++++++++++++
 .../receiver/AllocationReceiverEdit.vue       |   6 +-
 .../channel/alipay/config/AlipayConfig.api.ts |   2 +
 .../alipay/config/AlipayConfigEdit.vue        |  23 +++-
 .../wechat/config/WechatPayConfig.api.ts      |   2 +
 .../wechat/config/WechatPayConfigEdit.vue     |  19 ++-
 .../system/platform/PayPlatformConfig.vue     |   8 +-
 9 files changed, 233 insertions(+), 16 deletions(-)
 create mode 100644 src/views/demo/openid/OpenId.api.ts
 create mode 100644 src/views/demo/openid/OpenIdDemo.vue

diff --git a/src/views/demo/cashier/Cashier.vue b/src/views/demo/cashier/Cashier.vue
index 7a7fb3990..19e41dbe9 100644
--- a/src/views/demo/cashier/Cashier.vue
+++ b/src/views/demo/cashier/Cashier.vue
@@ -1,5 +1,6 @@
 <template>
   <div style="background-color: #f5f5f7">
+    <!--  云闪付表单方式专用  -->
     <div v-html="payForm"></div>
     <div class="page paydemo">
       <div class="blog-container" id="container">
diff --git a/src/views/demo/openid/OpenId.api.ts b/src/views/demo/openid/OpenId.api.ts
new file mode 100644
index 000000000..1f06ac7fd
--- /dev/null
+++ b/src/views/demo/openid/OpenId.api.ts
@@ -0,0 +1,66 @@
+import { defHttp } from '/@/utils/http/axios'
+import { PageResult, Result } from '/#/axios'
+import { BaseEntity } from '/#/web'
+
+/**
+ * 微信 返回获取OpenId授权页面地址和标识码
+ */
+export function wxGenerateAuthUrl() {
+  return defHttp.post<Result<AuthUrlResult>>({
+    url: '/wechat/auth/generateAuthUrl',
+  })
+}
+
+/**
+ * 根据标识码查询OpenId
+ */
+export function wxGetOpenId(code) {
+  return defHttp.get<Result<OpenIdResult>>({
+    url: '/wechat/auth/queryOpenId',
+    params: { code },
+  })
+}
+
+/**
+ * 支付宝 返回获取OpenId授权页面地址和标识码
+ */
+export function aliGenerateAuthUrl() {
+  return defHttp.post<Result<AuthUrlResult>>({
+    url: '/alipay/auth/generateAuthUrl',
+  })
+}
+
+/**
+ * 支付宝 根据标识码查询OpenId
+ */
+export function aliGetOpenId(code) {
+  return defHttp.get<Result<OpenIdResult>>({
+    url: '/alipay/auth/queryOpenId',
+    params: { code },
+  })
+}
+
+/**
+ * 获取授权访问链接和标识码
+ */
+export interface AuthUrlResult {
+  // 授权访问链接
+  authUrl: string
+  // 标识码, 用于查询是否获取到了OpenId
+  code: string
+}
+
+/**
+ * OpenId结果类
+ */
+export interface OpenIdResult {
+  // OpenId
+  openId: string
+  /**
+   * 状态
+   * pending:查询中
+   * success:查询成功
+   * fail:查询失败
+   */
+  status: string
+}
diff --git a/src/views/demo/openid/OpenIdDemo.vue b/src/views/demo/openid/OpenIdDemo.vue
new file mode 100644
index 000000000..03169332b
--- /dev/null
+++ b/src/views/demo/openid/OpenIdDemo.vue
@@ -0,0 +1,122 @@
+<template>
+  <div style="display: flex; height: 768px; margin: 20px; flex-direction: column; align-items: center; background: white; padding: 15px">
+    <div class="mt-15px mb-15px" style="display: flex; font-size: 32px; flex-direction: row; align-items: center; justify-content: center">
+      <a-form-item label="支付通道">
+        <a-radio-group v-model:value="channel" button-style="solid" @change="getUrl">
+          <a-radio-button :value="payChannelEnum.WECHAT">微信</a-radio-button>
+          <a-radio-button :value="payChannelEnum.ALI">支付宝</a-radio-button>
+        </a-radio-group>
+      </a-form-item> </div
+    ><qr-code :options="{ margin: 0 }" :width="250" :value="url" />
+    <div style="font-size: 26px"> {{}} </div>
+    <a-form-item label="" style="margin-top: 30px">
+      <a-input v-model:value="openId" disabled placeholder="请扫码获取OpenID" style="width: 350px" />
+      <a-button type="primary" :disabled="!openId" @click="copy">复制OpenID</a-button>
+    </a-form-item>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { onMounted, ref, unref } from 'vue'
+  import { payChannelEnum } from '/@/enums/payment/payChannelEnum'
+  import { aliGenerateAuthUrl, aliGetOpenId, wxGenerateAuthUrl, wxGetOpenId } from '/@/views/demo/openid/OpenId.api'
+  import { useIntervalFn } from '@vueuse/shared'
+  import QrCode from '/@/components/Qrcode/src/Qrcode.vue'
+  import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard'
+  import { useMessage } from '/@/hooks/web/useMessage'
+
+  const { createMessage } = useMessage()
+
+  const channel = ref(payChannelEnum.WECHAT)
+  const code = ref('')
+  const url = ref('null')
+  const openId = ref('')
+  let pause: any = () => {}
+
+  function copy() {
+    useCopyToClipboard(openId.value)
+    createMessage.info('已复制到剪贴板中')
+  }
+
+  onMounted(() => {
+    getUrl()
+  })
+
+  /**
+   * 获取扫码链接
+   */
+  function getUrl() {
+    openId.value = ''
+    if (channel.value === payChannelEnum.ALI) {
+      aliGenerateAuthUrl().then((res) => {
+        code.value = res.data.code
+        url.value = res.data.authUrl
+        alipayGet()
+      })
+    } else {
+      wxGenerateAuthUrl().then((res) => {
+        code.value = res.data.code
+        url.value = res.data.authUrl
+        wxGet()
+      })
+    }
+  }
+
+  /**
+   * 微信查询
+   */
+  function wxGet() {
+    pause()
+    let intervalFn = useIntervalFn(
+      () => {
+        wxGetOpenId(code.value)
+          .then((res) => {
+            // 成功
+            if (res.data.status === 'success') {
+              createMessage.success('获取OpenID成功')
+              openId.value = res.data.openId
+              pause()
+            }
+          })
+          .catch((err) => {
+            // 失败
+            createMessage.error(err.message)
+            pause()
+          })
+      },
+      1000 * 3,
+      { immediate: false },
+    )
+    pause = intervalFn.pause
+    intervalFn.resume()
+  }
+  /**
+   * 支付宝查询
+   */
+  function alipayGet() {
+    pause()
+    let intervalFn = useIntervalFn(
+      () => {
+        aliGetOpenId(code.value)
+          .then((res) => {
+            // 成功
+            if (res.data.status === 'success') {
+              createMessage.success('获取OpenID成功')
+              openId.value = res.data.openId
+              pause()
+            }
+          })
+          .catch((err) => {
+            // 失败
+            createMessage.error(err.message)
+            pause()
+          })
+      },
+      1000 * 3,
+      { immediate: false },
+    )
+    pause = intervalFn.pause
+    intervalFn.resume()
+  }
+</script>
+<style scoped lang="less"></style>
diff --git a/src/views/payment/allocation/receiver/AllocationReceiverEdit.vue b/src/views/payment/allocation/receiver/AllocationReceiverEdit.vue
index 902d3150a..df20ddf03 100644
--- a/src/views/payment/allocation/receiver/AllocationReceiverEdit.vue
+++ b/src/views/payment/allocation/receiver/AllocationReceiverEdit.vue
@@ -88,11 +88,7 @@
   import { useDict } from '/@/hooks/bootx/useDict'
   import { LabeledValue } from 'ant-design-vue/lib/select'
   import Icon from '/@/components/Icon'
-  import {
-    generateAliAuthUrl,
-    generateWxAuthUrl, queryAliOpenId,
-    queryWxOpenId
-  } from "/@/api/payment/WechatOpenId.api";
+  import { generateAliAuthUrl, generateWxAuthUrl, queryAliOpenId, queryWxOpenId } from '/@/api/payment/WechatOpenId.api'
   import OpenIdQrCode from './OpenIdQrCode.vue'
   import { useIntervalFn } from '@vueuse/shared'
 
diff --git a/src/views/payment/channel/alipay/config/AlipayConfig.api.ts b/src/views/payment/channel/alipay/config/AlipayConfig.api.ts
index 49dedb17b..27df0f390 100644
--- a/src/views/payment/channel/alipay/config/AlipayConfig.api.ts
+++ b/src/views/payment/channel/alipay/config/AlipayConfig.api.ts
@@ -61,6 +61,8 @@ export interface AlipayConfig extends BaseEntity {
   limitAmount?: number
   // 商户账号ID
   alipayUserId?: string
+  // 授权回调地址
+  redirectUrl?: string
   // 服务器异步通知页面路径
   notifyUrl?: string
   // 页面跳转同步通知页面路径
diff --git a/src/views/payment/channel/alipay/config/AlipayConfigEdit.vue b/src/views/payment/channel/alipay/config/AlipayConfigEdit.vue
index 8e7b3f5c5..d94ec3807 100644
--- a/src/views/payment/channel/alipay/config/AlipayConfigEdit.vue
+++ b/src/views/payment/channel/alipay/config/AlipayConfigEdit.vue
@@ -47,22 +47,33 @@
           </template>
           <a-input v-model:value="form.alipayUserId" placeholder="请输入合作者身份ID" />
         </a-form-item>
+        <a-form-item name="wxRedirectUrl">
+          <template #label>
+            <basic-title
+              helpMessage="不填写时默认使用平台配置中的系统地址，受到支付宝授权回调地址只可以配置一个个的限制，我们有时需要通过代理转发来绕过这个限制，
+                  此时回调地址就会与系统地址不一致"
+            >
+              授权回调地址
+            </basic-title>
+          </template>
+          <a-input placeholder="请输入支付宝授权回调地址" v-model:value="form.redirectUrl" />
+        </a-form-item>
         <a-form-item name="notifyUrl">
           <template #label>
-            <basic-title helpMessage="此处为本网关接收通知的地址, 而不是客户系统接收通知所需的地址"> 异步通知地址 </basic-title>
+            <basic-title helpMessage="为本网关接收支付宝相关的异步回调数据的地址, 而不是业务系统所需的地址"> 异步通知地址 </basic-title>
           </template>
-          <a-input v-model:value="form.notifyUrl" placeholder="请输入异步通知URL" style="width: calc(100% - 80px)" />
+          <a-input v-model:value="form.notifyUrl" placeholder="请输入异步通知地址" style="width: calc(100% - 80px)" />
           <a-button class="w-80px" type="primary" @click="genNotifyUrl">自动生成</a-button>
         </a-form-item>
         <a-form-item name="returnUrl">
           <template #label>
-            <basic-title helpMessage="此处为本网关接收通知的地址, 而不是客户系统接收通知所需的地址"> 同步通知地址 </basic-title>
+            <basic-title helpMessage="此处为本网关接收支付宝同步跳转通知的地址, 而不是业务系统所需的地址"> 同步通知地址 </basic-title>
           </template>
-          <a-input v-model:value="form.returnUrl" placeholder="请输入同步通知URL" style="width: calc(100% - 80px)" />
+          <a-input v-model:value="form.returnUrl" placeholder="请输入同步通知地址" style="width: calc(100% - 80px)" />
           <a-button class="w-80px" type="primary" @click="genReturnUrl">自动生成</a-button>
         </a-form-item>
-        <a-form-item label="支付网关URL" name="serverUrl">
-          <a-input v-model:value="form.serverUrl" placeholder="请输入支付网关URL" />
+        <a-form-item label="支付网关U地址" name="serverUrl">
+          <a-input v-model:value="form.serverUrl" placeholder="请输入支付网关地址" />
         </a-form-item>
         <a-form-item label="支持支付方式" name="payWays">
           <a-select
diff --git a/src/views/payment/channel/wechat/config/WechatPayConfig.api.ts b/src/views/payment/channel/wechat/config/WechatPayConfig.api.ts
index 302e6a4a5..6b86d2f4b 100644
--- a/src/views/payment/channel/wechat/config/WechatPayConfig.api.ts
+++ b/src/views/payment/channel/wechat/config/WechatPayConfig.api.ts
@@ -73,6 +73,8 @@ export interface WechatPayConfig extends BaseEntity {
   p12?: string | null
   // 应用域名，回调中会使用此参数
   domain?: string
+  // 授权回调地址
+  redirectUrl?: string
   // 服务器异步通知页面路径
   notifyUrl?: string
   // 页面跳转同步通知页面路径
diff --git a/src/views/payment/channel/wechat/config/WechatPayConfigEdit.vue b/src/views/payment/channel/wechat/config/WechatPayConfigEdit.vue
index ba0a05571..82403f2cc 100644
--- a/src/views/payment/channel/wechat/config/WechatPayConfigEdit.vue
+++ b/src/views/payment/channel/wechat/config/WechatPayConfigEdit.vue
@@ -36,18 +36,29 @@
           </template>
           <a-input-number :precision="2" :min="0.01" v-model:value="form.limitAmount" placeholder="请输入支付限额(元)" />
         </a-form-item>
+        <a-form-item name="wxRedirectUrl">
+          <template #label>
+            <basic-title
+              helpMessage="不填写时默认使用平台配置中的系统地址，受到微信授权回调地址只可以配置两个的限制，我们有时需要通过代理转发来绕过这个限制，
+                  此时回调地址就会与系统地址不一致"
+            >
+              授权回调地址
+            </basic-title>
+          </template>
+          <a-input placeholder="请输入微信授权回调地址" v-model:value="form.redirectUrl" />
+        </a-form-item>
         <a-form-item name="notifyUrl">
           <template #label>
-            <basic-title helpMessage="此处为本网关接收通知的地址, 而不是客户系统接收通知所需的地址"> 异步通知地址 </basic-title>
+            <basic-title helpMessage="此处为本网关接收微信支付相关的回调数据的地址, 而不是业务系统所需的地址"> 异步通知地址 </basic-title>
           </template>
-          <a-input v-model:value="form.notifyUrl" placeholder="请输入异步通知URL" style="width: calc(100% - 80px)" />
+          <a-input v-model:value="form.notifyUrl" placeholder="请输入异步通知地址" style="width: calc(100% - 80px)" />
           <a-button class="w-80px" type="primary" @click="genNotifyUrl">自动生成</a-button>
         </a-form-item>
         <a-form-item name="returnUrl">
           <template #label>
-            <basic-title helpMessage="此处为本网关接收通知的地址, 而不是客户系统接收通知所需的地址"> 同步通知地址 </basic-title>
+            <basic-title helpMessage="此处为本网关接收微信支付同步跳转通知的地址, 而不是业务系统所需的地址"> 同步通知地址 </basic-title>
           </template>
-          <a-input v-model:value="form.returnUrl" placeholder="请输入同步通知URL" style="width: calc(100% - 80px)" />
+          <a-input v-model:value="form.returnUrl" placeholder="请输入同步通知地址" style="width: calc(100% - 80px)" />
           <a-button class="w-80px" type="primary" @click="genReturnUrl">自动生成</a-button>
         </a-form-item>
         <a-form-item label="支持支付方式" name="payWays">
diff --git a/src/views/payment/system/platform/PayPlatformConfig.vue b/src/views/payment/system/platform/PayPlatformConfig.vue
index e71b20edc..06991c266 100644
--- a/src/views/payment/system/platform/PayPlatformConfig.vue
+++ b/src/views/payment/system/platform/PayPlatformConfig.vue
@@ -61,7 +61,13 @@
                     订单限额(元)
                   </basic-title>
                 </template>
-                <a-input-number placeholder="请输入订单限额" v-model:value="form.limitAmount" :min="0.01" precision="2" :disabled="!edit" />
+                <a-input-number
+                  placeholder="请输入订单限额"
+                  v-model:value="form.limitAmount"
+                  :min="0.01"
+                  :precision="2"
+                  :disabled="!edit"
+                />
               </a-form-item>
             </a-col>
             <a-col :span="20">