Selaa lähdekoodia

Merge branch 'iteration-20240417-subject' into online

lex 1 vuosi sitten
vanhempi
commit
12de9e470f

+ 180 - 31
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'],
+  emits: ['backOut', 'close', 'confirm', 'confirmNative'],
   setup(props, { slots, attrs, emit }) {
+    const router = useRouter();
     const state = reactive({
       payType: 'wx',
       pay_channel: ''
@@ -39,10 +50,144 @@ 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
+            }
+          }
+        );
+
+        emit('confirmNative', { payChannel });
+
+        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' ||
+        res.status === 'ing'
+      ) {
+        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 +241,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>
 

+ 39 - 5
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,37 @@ 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'
+            }
+          }
+        );
+
+        if (data && Array.isArray(data)) {
+          data.forEach((item: any) => {
+            if (item.paramName === 'vip_payment_service_provider') {
+              const provider = JSON.parse(item.paramValue);
+              this.paymentType = provider.vendor;
+              this.paymentChannel = provider.channel;
+            }
+          });
+        }
+      } catch {
+        //
+      }
+    },
     // 查询未支付订单
     async paymentOrderUnpaid() {
       try {
@@ -91,7 +119,11 @@ export default defineComponent({
               this.$router.push({
                 path: '/order-detail',
                 query: {
-                  config: JSON.stringify(paymentConfig.paymentConfig),
+                  config: JSON.stringify({
+                    ...paymentConfig.paymentConfig
+                  }),
+                  paymentType: paymentConfig.paymentType,
+                  paymentChannel: this.paymentChannel,
                   orderNo: paymentConfig.orderNo
                 }
               });
@@ -126,7 +158,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 +173,7 @@ export default defineComponent({
           {
             data: {
               orderType: 'VIP',
+              paymentType: this.paymentType,
               paymentCashAmount: this.selectMember.salePrice || 0,
               paymentCouponAmount: 0,
               goodsInfos: params,
@@ -172,9 +205,10 @@ export default defineComponent({
             path: '/order-detail',
             query: {
               config: JSON.stringify({
-                ...data.paymentConfig,
-                paymentType: data.paymentType
+                ...data.paymentConfig
               }),
+              paymentType: this.paymentType,
+              paymentChannel: this.paymentChannel,
               orderNo: data.orderNo
             }
           });

+ 6 - 2
src/views/student-register/index-apply.tsx

@@ -123,6 +123,7 @@ export default defineComponent({
     const forms = reactive({
       schoolId: route.query.sId as any,
       paymentType: '', // 支付类型
+      paymentChannel: '',
       multi_user_limit: 1, // 限制注册学生数量
       // popupShow: false,
       registerDetails: {} as any,
@@ -1050,7 +1051,7 @@ export default defineComponent({
           // 直接去拉取微信支付
           onConfirm({
             payCode: 'payResult',
-            pay_channel: 'wx_pub'
+            pay_channel: forms.paymentChannel
           });
         }
       }
@@ -1288,7 +1289,10 @@ export default defineComponent({
             if (item.paramName === 'contract_sign') {
               forms.contract_sign = item.paramValue === '1' ? true : false;
             } else if (item.paramName === 'payment_service_provider') {
-              forms.paymentType = item.paramValue || '';
+              // forms.paymentType = item.paramValue || '';
+              const provider = JSON.parse(item.paramValue);
+              forms.paymentType = provider.vendor;
+              forms.paymentChannel = provider.channel;
             } else if (item.paramName === 'multi_user_limit') {
               forms.multi_user_limit = item.paramValue
                 ? Number(item.paramValue)

+ 6 - 2
src/views/student-register/index.tsx

@@ -122,6 +122,7 @@ export default defineComponent({
     const forms = reactive({
       schoolId: route.query.sId as any,
       paymentType: '', // 支付类型
+      paymentChannel: '',
       multi_user_limit: 1, // 限制注册学生数量
       // popupShow: false,
       registerDetails: {} as any,
@@ -1022,7 +1023,7 @@ export default defineComponent({
           // 直接去拉取微信支付
           onConfirm({
             payCode: 'payResult',
-            pay_channel: 'wx_pub'
+            pay_channel: forms.paymentChannel
           });
         }
       }
@@ -1260,7 +1261,10 @@ export default defineComponent({
             if (item.paramName === 'contract_sign') {
               forms.contract_sign = item.paramValue === '1' ? true : false;
             } else if (item.paramName === 'payment_service_provider') {
-              forms.paymentType = item.paramValue || '';
+              // forms.paymentType = item.paramValue || '';
+              const provider = JSON.parse(item.paramValue);
+              forms.paymentType = provider.vendor;
+              forms.paymentChannel = provider.channel;
             } else if (item.paramName === 'multi_user_limit') {
               forms.multi_user_limit = item.paramValue
                 ? Number(item.paramValue)

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

@@ -3,7 +3,18 @@ import { computed, defineComponent, onMounted, reactive, ref } from 'vue';
 import styles from './order-detail.module.less';
 import Addres from './component/addres';
 import OSticky from '@/components/m-sticky';
-import { Button, Cell, CellGroup, Image, Popup, showToast, Tag } from 'vant';
+import {
+  Button,
+  Cell,
+  CellGroup,
+  closeToast,
+  Image,
+  Popup,
+  showDialog,
+  showLoadingToast,
+  showToast,
+  Tag
+} from 'vant';
 import Payment from '@/views/adapay/payment';
 import { useRoute, useRouter } from 'vue-router';
 import request from '@/helpers/request';
@@ -17,6 +28,7 @@ import ODialog from '@/components/m-dialog';
 import { orderStatus } from '@/helpers/constant';
 import QrcodePayment from './qrcode-payment';
 import { beforeSubmit } from './order-state';
+import { listenerMessage, postMessage } from '@/helpers/native-message';
 
 /**
  * 接入jsdk
@@ -30,13 +42,15 @@ 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,
       qrCodeUrl: '',
       pay_channel: '',
       orderNo: route.query.orderNo,
+      paymentType: route.query.paymentType,
+      paymentChannel: route.query.paymentChannel,
       orderInfo: {} as any, // 订单信息
       goodsInfos: [] as any, // 订单信息列表
       config: route.query.config ? JSON.parse(route.query.config as any) : {},
@@ -113,6 +127,15 @@ export default defineComponent({
       const config: any = state.config;
       state.pay_channel = val.pay_channel;
 
+      // 判断是否为原生支付
+      if (
+        val.pay_channel.indexOf('wxpay-app') !== -1 ||
+        val.pay_channel.indexOf('alipay-app') !== -1
+      ) {
+        submitNativePay();
+        return;
+      }
+
       const params = qs.stringify({
         pay_channel: val.pay_channel,
         wxAppId: config.wxAppId,
@@ -172,6 +195,72 @@ export default defineComponent({
       }, 5000);
     };
 
+    const submitNativePay = async () => {
+      // 支付...
+      try {
+        const { data } = await request.post(
+          '/edu-app/open/userOrder/executePayment',
+          {
+            data: {
+              ...state.config
+            }
+          }
+        );
+
+        const payChannel = state.config.paymentChannel;
+        let payStr = payChannel.indexOf('wxpay') !== -1 ? 'wx_app' : 'ali_app';
+
+        postMessage({
+          api: 'paymentOrder',
+          content: {
+            orderNo: state.orderNo,
+            payChannel: payStr,
+            payInfo: data.reqParams.body || JSON.stringify(data.reqParams)
+          }
+        });
+        showLoadingToast({
+          message: '支付中...',
+          forbidClick: true,
+          duration: 3000,
+          loadingType: 'spinner'
+        });
+        // 唤起支付时状态
+        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') {
+        router.replace({
+          path: '/payment-result',
+          query: {
+            orderNo: state.orderNo
+          }
+        });
+      } else if (res.status === 'cancel') {
+      } else if (res.status === 'fail') {
+        const payChannel = state.config.paymentChannel;
+        const message =
+          payChannel.indexOf('wxpay') !== -1
+            ? '您尚未安装微信'
+            : '您尚未安装支付宝';
+        showDialog({
+          title: '提示',
+          message
+        });
+      }
+    };
+
     // 确定支付
     const onSubmit = async () => {
       clearInterval(state.orderTimer);
@@ -470,9 +559,16 @@ export default defineComponent({
           style={{ minHeight: '30%' }}>
           <Payment
             paymentConfig={state.orderInfo}
+            config={{
+              paymentType: state.paymentType,
+              paymentChannel: state.paymentChannel
+            }}
             onClose={() => (state.paymentStatus = false)}
             onBackOut={onBackOut}
             onConfirm={(val: any) => onConfirm(val)}
+            onConfirmNative={(val: any) => {
+              state.config.paymentChannel = val.payChannel;
+            }}
           />
         </Popup>