Kaynağa Gözat

修改支付方式

lex 1 yıl önce
ebeveyn
işleme
d0da48357f

+ 173 - 30
src/views/adapay/payment/index.tsx

@@ -5,11 +5,17 @@ import {
   Icon,
   RadioGroup,
   Radio,
-  showConfirmDialog
+  showConfirmDialog,
+  showLoadingToast,
+  closeToast,
+  showDialog
 } from 'vant';
-import { defineComponent, reactive } from 'vue';
+import { computed, defineComponent, reactive } from 'vue';
 import styles from './index.module.less';
 import { browser, moneyFormat } from '@/helpers/utils';
+import request from '@/helpers/request';
+import { listenerMessage, postMessage } from '@/helpers/native-message';
+import { useRouter } from 'vue-router';
 
 export default defineComponent({
   name: 'payment',
@@ -17,10 +23,15 @@ export default defineComponent({
     paymentConfig: {
       type: Object,
       default: {}
+    },
+    config: {
+      type: Object,
+      default: {}
     }
   },
   emits: ['backOut', 'close', 'confirm'],
   setup(props, { slots, attrs, emit }) {
+    const router = useRouter();
     const state = reactive({
       payType: 'wx',
       pay_channel: ''
@@ -39,10 +50,138 @@ export default defineComponent({
       });
     };
 
+    const isWxPay = computed(() => {
+      const paymentChannels = props.config.paymentChannel || '';
+      if (paymentChannels) {
+        if (paymentChannels.toUpperCase().indexOf('WX') !== -1) {
+          return true;
+        } else {
+          return false;
+        }
+      } else {
+        return true;
+      }
+    });
+
+    const isAliPay = computed(() => {
+      const paymentChannels = props.config.paymentChannel || '';
+      if (paymentChannels) {
+        if (paymentChannels.toUpperCase().indexOf('ALI') !== -1) {
+          return true;
+        } else {
+          return false;
+        }
+      } else {
+        return true;
+      }
+    });
+
     // 需要关闭订单
     const onCancel = async (noBack?: boolean) => {};
     const onSubmit = async () => {
       // 支付...
+
+      if (props.config.paymentType === 'original') {
+        submitNativePay();
+      } else {
+        submitQrCodePay();
+      }
+    };
+
+    const submitNativePay = async () => {
+      // 支付...
+      try {
+        // const payChannel = state.payType === 'zfb' ? 'alipay-app' : 'wxpay-app';
+        let paymentChannels = props.config.paymentChannel || '';
+        paymentChannels = paymentChannels.split(',');
+        // const payChannel = paymentChannels.map((item: any) => item.indexOf(''))
+        let payChannel = '';
+        paymentChannels.forEach((item: any) => {
+          if (
+            state.payType === 'zfb' &&
+            item.toUpperCase().indexOf('ALI') !== -1
+          ) {
+            payChannel = item;
+          } else if (
+            state.payType === 'wx' &&
+            item.toUpperCase().indexOf('WX') !== -1
+          ) {
+            payChannel = item;
+          }
+        });
+
+        console.log(state.payType, 'state.payType');
+        let paymentType = props.config.paymentType;
+
+        const payMap: any = {
+          merOrderNo: props.paymentConfig.orderNo,
+          paymentChannel: payChannel, // 支付渠道
+          paymentType: paymentType,
+          userId: props.paymentConfig.userId
+        };
+
+        const { data } = await request.post(
+          '/edu-app/open/userOrder/executePayment',
+          {
+            data: {
+              ...payMap
+            }
+          }
+        );
+
+        postMessage({
+          api: 'paymentOrder',
+          content: {
+            orderNo: props.paymentConfig.orderNo,
+            payChannel: state.payType === 'zfb' ? 'ali_app' : 'wx_app',
+            payInfo: data.reqParams.body || JSON.stringify(data.reqParams)
+          }
+        });
+        showLoadingToast({
+          message: '支付中...',
+          forbidClick: true,
+          duration: 3000,
+          loadingType: 'spinner'
+        });
+        emit('close');
+        // 唤起支付时状态
+        listenerMessage('paymentOperation', result => {
+          console.log(result, 'init paymentOperation');
+          paymentOperation(result?.content);
+        });
+      } catch (e: any) {
+        console.log(e);
+      }
+    };
+
+    const paymentOperation = (res: any) => {
+      console.log(res, 'paymentOperation');
+      // 支付状态
+      // paymentOperation  支付成功:success 支付失败:error 支付取消:cancel 未安装:fail
+      // error 只有安卓端有
+      closeToast();
+      if (res.status === 'success' || res.status === 'error') {
+        emit('close');
+        router.replace({
+          path: '/payment-result',
+          query: {
+            orderNo: props.paymentConfig.orderNo
+          }
+        });
+      } else if (res.status === 'cancel') {
+        emit('close');
+      } else if (res.status === 'fail') {
+        const message =
+          state.payType === 'zfb' ? '您尚未安装支付宝' : '您尚未安装微信';
+        showDialog({
+          title: '提示',
+          message
+        }).then(() => {
+          emit('close');
+        });
+      }
+    };
+    const submitQrCodePay = () => {
       const pt = state.payType;
       // 判断当前浏览器
       if (browser().weixin) {
@@ -96,34 +235,38 @@ export default defineComponent({
         </div>
         <RadioGroup v-model={state.payType}>
           <CellGroup border={false}>
-            <Cell
-              border={true}
-              center
-              onClick={() => {
-                state.payType = 'wx';
-              }}
-              v-slots={{
-                icon: () => (
-                  <Icon name="wechat-pay" color="#15c434" size={22} />
-                ),
-                'right-icon': () => <Radio name="wx" />,
-                title: () => (
-                  <div class={styles.payTypeRe}>
-                    微信支付 <span class={styles.recommend}>推荐</span>
-                  </div>
-                )
-              }}></Cell>
-            <Cell
-              title="支付宝支付"
-              border={true}
-              center
-              onClick={() => {
-                state.payType = 'zfb';
-              }}
-              v-slots={{
-                icon: () => <Icon name="alipay" color="#009fe9" size={22} />,
-                'right-icon': () => <Radio name="zfb" />
-              }}></Cell>
+            {isWxPay.value && (
+              <Cell
+                border={true}
+                center
+                onClick={() => {
+                  state.payType = 'wx';
+                }}
+                v-slots={{
+                  icon: () => (
+                    <Icon name="wechat-pay" color="#15c434" size={22} />
+                  ),
+                  'right-icon': () => <Radio name="wx" />,
+                  title: () => (
+                    <div class={styles.payTypeRe}>
+                      微信支付 <span class={styles.recommend}>推荐</span>
+                    </div>
+                  )
+                }}></Cell>
+            )}
+            {isAliPay.value && (
+              <Cell
+                title="支付宝支付"
+                border={true}
+                center
+                onClick={() => {
+                  state.payType = 'zfb';
+                }}
+                v-slots={{
+                  icon: () => <Icon name="alipay" color="#009fe9" size={22} />,
+                  'right-icon': () => <Radio name="zfb" />
+                }}></Cell>
+            )}
           </CellGroup>
         </RadioGroup>
 

+ 38 - 3
src/views/member-center/index.tsx

@@ -25,7 +25,9 @@ export default defineComponent({
       memberStatus: false,
       background: 'transparent',
       showTips: false,
-      showMessage: ''
+      showMessage: '',
+      paymentType: '', // 支付渠道
+      paymentChannel: '' // 支付类型
     };
   },
   computed: {
@@ -65,11 +67,40 @@ export default defineComponent({
         const { data } = await request.post(`/edu-app/cityFeeSetting/member`);
         this.selectMember = data;
 
+        this.getConfig();
         this.paymentOrderUnpaid();
       } catch {
         //
       }
     },
+    async getConfig() {
+      try {
+        const { data } = await request.get(
+          '/edu-app/open/paramConfig/queryByParamNameList',
+          {
+            requestType: 'form',
+            params: {
+              paramNames:
+                'vip_payment_service_provider,vip_payment_service_provider_channel'
+            }
+          }
+        );
+
+        if (data && Array.isArray(data)) {
+          data.forEach((item: any) => {
+            if (item.paramName === 'vip_payment_service_provider') {
+              this.paymentType = item.paramValue;
+            } else if (
+              item.paramName === 'vip_payment_service_provider_channel'
+            ) {
+              this.paymentChannel = item.paramValue;
+            }
+          });
+        }
+      } catch {
+        //
+      }
+    },
     // 查询未支付订单
     async paymentOrderUnpaid() {
       try {
@@ -92,6 +123,8 @@ export default defineComponent({
                 path: '/order-detail',
                 query: {
                   config: JSON.stringify(paymentConfig.paymentConfig),
+                  paymentType: paymentConfig.paymentType,
+                  paymentChannel: this.paymentChannel,
                   orderNo: paymentConfig.orderNo
                 }
               });
@@ -126,7 +159,7 @@ export default defineComponent({
         const selectMember = this.selectMember;
         const params: any = [
           {
-            giftVipDay: this.users.membershipGiftDays,
+            giftVipDay: selectMember.membershipDays,
             goodsId: selectMember.id,
             goodsNum: 1,
             goodsType: 'VIP',
@@ -141,6 +174,7 @@ export default defineComponent({
           {
             data: {
               orderType: 'VIP',
+              paymentType: this.paymentType,
               paymentCashAmount: this.selectMember.salePrice || 0,
               paymentCouponAmount: 0,
               goodsInfos: params,
@@ -173,7 +207,8 @@ export default defineComponent({
             query: {
               config: JSON.stringify({
                 ...data.paymentConfig,
-                paymentType: data.paymentType
+                paymentType: this.paymentType,
+                paymentChannel: this.paymentChannel
               }),
               orderNo: data.orderNo
             }

+ 2 - 1
src/views/student-register/order-detail.tsx

@@ -30,7 +30,7 @@ export default defineComponent({
     const route = useRoute();
     const router = useRouter();
     const state = reactive({
-      paymentType: 'adapay' as 'wxpay' | 'adapay', // 支付方式
+      paymentType: '' as any, // 'adapay' as 'wxpay' | 'adapay', // 支付方式
       orderTimer: null as any,
       paymentStatus: false,
       showQrcode: false,
@@ -470,6 +470,7 @@ export default defineComponent({
           style={{ minHeight: '30%' }}>
           <Payment
             paymentConfig={state.orderInfo}
+            config={state.config}
             onClose={() => (state.paymentStatus = false)}
             onBackOut={onBackOut}
             onConfirm={(val: any) => onConfirm(val)}

+ 1 - 1
vite.config.ts

@@ -16,7 +16,7 @@ function resolve(dir: string) {
 // const proxyUrl = 'https://test.lexiaoya.cn/';
 // const proxyUrl = 'https://kt.colexiu.com/';
 // const proxyUrl = 'http://192.168.3.143:7093/';
-const proxyUrl = 'https://test.kt.colexiu.com/';
+const proxyUrl = 'https://dev.kt.colexiu.com/';
 export default defineConfig({
   base: './',
   plugins: [