支付宝子商户 扫码授权

jeepay-ui-manager/src/api/manage.js

@@ -291,3 +291,11 @@ export function mchNotifyResend (notifyId) {
     method: 'POST'
   })
 }
+
+/** 查询支付宝授权地址URL **/
+export function queryAlipayIsvsubMchAuthUrl (mchAppId) {
+  return request.request({
+    url: '/api/mch/payConfigs/alipayIsvsubMchAuthUrls/' + mchAppId,
+    method: 'GET'
+  })
+}

jeepay-ui-manager/src/main.js

@@ -15,6 +15,7 @@ import './utils/filter' // global filter
 import './global.less' // global style
 import 'ant-design-vue/dist/antd.less'
 import infoBox from '@/utils/infoBox'
+import VueClipboard from 'vue-clipboard2' // 复制插件
 
 Vue.config.productionTip = false
 
@@ -23,6 +24,7 @@ Vue.config.productionTip = false
 Vue.component('pro-layout', ProLayout)
 Vue.component('page-container', PageHeaderWrapper)
 Vue.component('page-header-wrapper', PageHeaderWrapper)
+Vue.use(VueClipboard) // 复制插件
 
 /**
  * @description 全局注册权限验证

jeepay-ui-manager/src/views/mchApp/AlipayAuth.vue

@@ -0,0 +1,60 @@
+<template>
+  <a-modal v-model="isShow" title="支付宝子商户扫码授权" @ok="handleOkFunc" @cancel="handleOkFunc">
+
+    <div style="text-align: center">
+      <p>方式1： <br/>  请商户扫码如下二维码, 按提示授权： </p>
+      <img style="margin-bottom: 10px" :src="apiResData.authQrImgUrl">
+      <hr/>
+
+      <p style="margin-top: 10px">
+        方式2： <br/> <a-button size="small" class="copy-btn" v-clipboard:copy="apiResData.authUrl" v-clipboard:success="onCopySuccess" >点击复制</a-button>
+        链接并发送给商户，商户进入链接，按照页面提示自主授权：
+      </p>
+      <a target="_blank" :href="apiResData.authUrl">{{ apiResData.authUrl }}</a>
+    </div>
+  </a-modal>
+
+</template>
+
+<script>
+import { queryAlipayIsvsubMchAuthUrl } from '@/api/manage'
+export default {
+
+  props: {
+    callbackFunc: { type: Function }
+  },
+
+  data () {
+    return {
+      isShow: false, // 是否显示弹层/抽屉
+      appId: '',
+      apiResData: {}
+    }
+  },
+  created () {
+  },
+  methods: {
+    show: function (appId) { // 弹层打开事件
+      this.apiResData = {}
+      this.appId = appId
+      const that = this
+      queryAlipayIsvsubMchAuthUrl(appId).then(res => {
+        that.apiResData = res
+        this.isShow = true
+      })
+    },
+
+    handleOkFunc: function () { // 点击【确认】按钮事件
+        this.isShow = false
+        if (this.callbackFunc) {
+          this.callbackFunc()
+        }
+    },
+
+    onCopySuccess () {
+      this.$message.success('复制成功')
+    }
+
+  }
+}
+</script>

jeepay-ui-manager/src/views/mchApp/MchPayIfConfigList.vue

@@ -34,8 +34,11 @@
             </div>
             <!-- 卡片底部操作栏 -->
             <div class="jeepay-card-ops">
+              <a v-if="record.mchType == 2 && record.ifCode == 'alipay' && $access('ENT_MCH_PAY_CONFIG_ADD')" @click="toAlipayAuthPageFunc(record)">扫码授权 <a-icon key="right" type="right" style="fontSize: 13px"></a-icon></a>
+
               <a v-if="$access('ENT_MCH_PAY_CONFIG_ADD')" @click="editPayIfConfigFunc(record)">填写参数 <a-icon key="right" type="right" style="fontSize: 13px"></a-icon></a>
               <a v-else>暂无操作</a>
+
             </div>
           </div>
         </div>
@@ -97,6 +100,9 @@
     <WxpayPayConfig ref="wxpayPayConfig" :callbackFunc="refCardList" />
     <!-- 支付通道配置页面组件  -->
     <MchPayPassageAddOrEdit ref="mchPayPassageAddOrEdit" :callbackFunc="searchFunc"/>
+    <!-- 支付宝授权弹层  -->
+    <AlipayAuth ref="alipayAuthPage" :callbackFunc="refCardList"/>
+
   </a-drawer>
 </template>
 
@@ -108,6 +114,7 @@ import { API_URL_MCH_PAYCONFIGS_LIST, API_URL_MCH_PAYPASSAGE_LIST, req, getAvail
 import MchPayConfigAddOrEdit from './MchPayConfigAddOrEdit'
 import MchPayPassageAddOrEdit from './MchPayPassageAddOrEdit'
 import WxpayPayConfig from './custom/WxpayPayConfig'
+import AlipayAuth from './AlipayAuth'
 
 // eslint-disable-next-line no-unused-vars
 const tableColumns = [
@@ -124,7 +131,8 @@ export default {
     JeepayTableColumns,
     MchPayConfigAddOrEdit,
     MchPayPassageAddOrEdit,
-    WxpayPayConfig
+    WxpayPayConfig,
+    AlipayAuth
   },
   data () {
     return {
@@ -202,6 +210,21 @@ export default {
     // 抽屉关闭
     onClose () {
       this.visible = false
+    },
+
+    // 支付宝子商户 扫码授权
+    toAlipayAuthPageFunc (record) {
+      if (!record) {
+        return
+      }
+      if (record.subMchIsvConfig === 0) {
+        this.$error({
+          title: '提示',
+          content: '当前应用所属商户为特约商户，请先配置服务商支付参数！'
+        })
+        return
+      }
+      this.$refs.alipayAuthPage.show(this.appId)
     }
   }
 }