浏览代码

Merge branch 'iteration-20241115' into jenkins-test

lex-xin 8 月之前
父节点
当前提交
8e012b0dc7
共有 25 个文件被更改,包括 746 次插入99 次删除
  1. 2 2
      src/main.ts
  2. 9 1
      src/router/router-root.ts
  3. 二进制
      src/views/activation-code/activation-register/images/banner-bg.png
  4. 二进制
      src/views/activation-code/activation-register/images/btn1.png
  5. 二进制
      src/views/activation-code/activation-register/images/btn2.png
  6. 二进制
      src/views/activation-code/activation-register/images/btn3.png
  7. 二进制
      src/views/activation-code/activation-register/images/btn4.png
  8. 二进制
      src/views/activation-code/activation-register/images/btn5.png
  9. 二进制
      src/views/activation-code/activation-register/images/btn6.png
  10. 二进制
      src/views/activation-code/activation-register/images/title1.png
  11. 二进制
      src/views/activation-code/activation-register/images/title2.png
  12. 89 26
      src/views/activation-code/activation-register/index.module.less
  13. 49 44
      src/views/activation-code/activation-register/index.tsx
  14. 80 0
      src/views/activation-code/m-message-tip/index.module.less
  15. 127 0
      src/views/activation-code/m-message-tip/index.tsx
  16. 二进制
      src/views/activation-code/modal/code-dialog/images/title1.png
  17. 二进制
      src/views/activation-code/modal/code-dialog/images/title5.png
  18. 二进制
      src/views/activation-code/modal/code-dialog/images/title6.png
  19. 二进制
      src/views/activation-code/modal/code-dialog/images/title7.png
  20. 6 1
      src/views/activation-code/modal/code-dialog/index.module.less
  21. 10 2
      src/views/activation-code/modal/code-dialog/index.tsx
  22. 55 0
      src/views/adapay/pay-result-wechat/index.module.less
  23. 286 0
      src/views/adapay/pay-result-wechat/index.tsx
  24. 24 21
      src/views/student-register/modal/select-student/index.module.less
  25. 9 2
      src/views/student-register/modal/select-student/index.tsx

+ 2 - 2
src/main.ts

@@ -58,8 +58,8 @@ postMessage({ api: 'getNavHeight' }, (res: any) => {
   }
 });
 
-// import Vconsole from 'vconsole';
-// const vconsole = new Vconsole();
+import Vconsole from 'vconsole';
+const vconsole = new Vconsole();
 
 const app = createApp(App);
 

+ 9 - 1
src/router/router-root.ts

@@ -96,6 +96,14 @@ export default [
     }
   },
   {
+    path: '/payResultWechat',
+    name: 'payResult',
+    component: () => import('@/views/adapay/pay-result-wechat'),
+    meta: {
+      title: '支付'
+    }
+  },
+  {
     path: '/preview-protocol',
     name: 'preview-protocol',
     component: () => import('@/views/preview-protocol/index'),
@@ -276,7 +284,7 @@ export default [
     path: '/activationRegister',
     component: () => import('@/views/activation-code/activation-register/index'),
     meta: {
-      title: '音乐数字课堂激活'
+      title: '音乐数字课堂AI学练工具激活'
     }
   },
   {

二进制
src/views/activation-code/activation-register/images/banner-bg.png


二进制
src/views/activation-code/activation-register/images/btn1.png


二进制
src/views/activation-code/activation-register/images/btn2.png


二进制
src/views/activation-code/activation-register/images/btn3.png


二进制
src/views/activation-code/activation-register/images/btn4.png


二进制
src/views/activation-code/activation-register/images/btn5.png


二进制
src/views/activation-code/activation-register/images/btn6.png


二进制
src/views/activation-code/activation-register/images/title1.png


二进制
src/views/activation-code/activation-register/images/title2.png


+ 89 - 26
src/views/activation-code/activation-register/index.module.less

@@ -14,11 +14,21 @@
     // padding-top: 155px;
     // background: url('./images/banner-bg.png') no-repeat top center;
     // background-size: contain;
+
+    .title1 {
+      position: absolute;
+      position: absolute;
+      top: -6px;
+      left: 50%;
+      margin-left: -100.5px;
+      width: 201px;
+      height: 44px;
+    }
   }
 
   .bannerBg {
     width: 100%;
-    margin-bottom: -41%;
+    margin-bottom: -18.3%;
   }
 
 
@@ -36,39 +46,50 @@
 .paymentContainer {
   font-size: 14px;
   padding: 12px 25px calc(12px + env(safe-area-inset-bottom)) 25px;
-  background: #FFFFFF;
-  box-shadow: 0px -1px 0px 0px #F2F2F2, inset 0px 1px 3px 0px #FFFFFF;
-  border-radius: 18px 18px 0px 0px;
-
-  :global {
-    .van-button {
-      // height: 40px;
-      // line-height: 40px;
-      --van-button-default-height: 41px;
-      background: linear-gradient(135deg, #31C7FF 0%, #007AFE 100%);
-      font-size: 16px;
-      color: #fff;
-      font-weight: 500;
-      border: 0;
+  // background: #FFFFFF;
+  // box-shadow: 0px -1px 0px 0px #F2F2F2, inset 0px 1px 3px 0px #FFFFFF;
+  // border-radius: 18px 18px 0px 0px;
+
+  // :global {
+  //   .van-button {
+  //     // height: 40px;
+  //     // line-height: 40px;
+  //     // --van-button-default-height: 41px;
+  //     // background: linear-gradient(135deg, #31C7FF 0%, #007AFE 100%);
+  //     // font-size: 16px;
+  //     // color: #fff;
+  //     // font-weight: 500;
+  //     border: 0;
+  //     background: url('./images/btn1.png') no-repeat center;
+  //     background-size: contain;
+  //   }
+  // }
+  text-align: center;
+  .submitBtn {
+    // width: 100%;
+    height: 54px;
+    &.loading {
+      opacity: 0.8;
     }
   }
 
 }
 
 .studentSection {
-  margin: 0 14px 12px;
+  margin: 0 7px 12px;
   padding: 0;
   // background: linear-gradient(180deg, rgba(219, 246, 253) 0%, rgba(255, 255, 255) 3%);
-  background: linear-gradient(180deg, #DBF6FD 0%, #FFFFFF 4%, #FFFFFF 100%);
+  // background: linear-gradient(180deg, #DBF6FD 0%, #FFFFFF 4%, #FFFFFF 100%);
   border-radius: 16px;
-  border: 2px solid #FFFFFF;
-
+  border: 6px solid rgba(255,255,255,0.56);
 }
 
 .registerForm {
-  border-radius: 18px;
+  border-radius: 10px;
+  background: linear-gradient(180deg, #DBF6FD 0%, #FFFFFF 4%, #FFFFFF 100%);
   // margin: 0 12px;
   overflow: hidden;
+  padding-top: 28px;
 
   .selectStudentGroup {
     margin-left: 10px;
@@ -109,7 +130,7 @@
 
   :global {
     .van-cell {
-      padding: 14px 18px;
+      padding: 13px 14px;
     }
 
 
@@ -172,18 +193,49 @@
   }
 }
 
+.studentSectionPopup {
+  position: relative;
+  width: 305px;
+  background: linear-gradient( 181deg, #D0EFF7 0%, #81DEFE 100%);
+  position: relative;
+  padding: 6px;
+  border-radius: 12px;
+
+  .title2 {
+    width: 201px;
+    height: 44px;
+    left: 50%;
+    margin-left: -100px;
+    top: -6px;
+    position: absolute;
+    z-index: 1;
+  }
+}
 
 .studentInfo {
+  border-radius: 12px;
+  border: 1px solid #FFFFFF;
+  padding: 4px;
+  overflow: hidden;
+  .studentInner {
+    padding: 35px 15px 15px;
+    background-color: #fff;
+    border-radius: 12px;
+  }
   :global {
     .van-cell {
       padding: 10px 0;
 
       &:first-child {
         padding-top: 0;
+        border-top-left-radius: 12px;
+        border-top-right-radius: 12px;
       }
 
       &:last-child {
         padding-bottom: 0;
+        border-bottom-left-radius: 12px;
+        border-bottom-right-radius: 12px;
       }
     }
 
@@ -210,15 +262,24 @@
       }
     }
   }
-
-
 }
 
 .studentBtnGroup {
   display: flex;
-  align-items: center;
-  padding-top: 20px;
-  padding-bottom: 5px;
+  align-items: center;  
+  justify-content: center;
+  // padding-bottom: 5px;
+  padding-top: 10px;
+  margin-left: -15px;
+  margin-right: -15px;
+
+  .btn {
+    width: 128px;
+    // height: 40px;
+  }
+  .cancelBtn {
+    margin-right: 10px;
+  }
 
   :global {
     .van-button {
@@ -239,3 +300,5 @@
     padding-top: 280px;
   }
 }
+
+

+ 49 - 44
src/views/activation-code/activation-register/index.tsx

@@ -32,7 +32,7 @@ import { browser, checkPhone, getUrlCode, moneyFormat } from '@/helpers/utils';
 import OWxTip from '@/components/m-wx-tip';
 
 import MImgCode from '@/components/m-img-code';
-import MMessageTip from '@/components/m-message-tip';
+import MMessageTip from '../m-message-tip';
 import SelectStudent from '@/views/student-register/modal/select-student';
 import { api_sysAreaQueryAllProvince } from '@/views/school-register/api';
 import CodeDialog from '../modal/code-dialog';
@@ -42,6 +42,13 @@ import { storage } from '@/helpers/storage';
 import { ACCESS_TOKEN } from '@/store/mutation-types';
 import { api_verification } from '@/views/creation/api';
 import bannerBg from './images/banner-bg.png';
+import submitBtn from './images/btn1.png'
+import title1 from './images/title1.png'
+import title2 from './images/title2.png'
+import btn4 from './images/btn4.png'
+import btn5 from './images/btn5.png'
+import btn3 from './images/btn3.png'
+import btn6 from './images/btn6.png'
 
 const classList: any = [];
 for (let i = 1; i <= 40; i++) {
@@ -101,7 +108,7 @@ export default defineComponent({
       isLoginRegister: false, // 是否已经登录或已注册
       schoolId: null as any,
       schoolAreaId: null, // 学校区域编号
-      activationCode: null as any, // 互通
+      activationCode: null as any, // 激活
       paymentType: '', // 支付类型
       paymentChannel: '',
       multi_user_limit: 1, // 限制注册学生数量
@@ -295,7 +302,7 @@ export default defineComponent({
         status && showToast('请选择所在班级');
         return true;
       } else if (!forms.activationCode) {
-        status && showToast('请输入互通码');
+        status && showToast('请输入激活码');
         return true;
       }
       return false;
@@ -679,7 +686,7 @@ export default defineComponent({
       forms.schoolLoading = false;
     };
 
-    // 格式化互通
+    // 格式化激活
     const maskMiddleDigits = (str: string) => {
       if (!str) {
         return '';
@@ -781,6 +788,16 @@ export default defineComponent({
     };
 
     onMounted(async () => {
+      // otherParams.showOtherMessage = `同一手机号最多创建${forms.multi_user_limit}个学生`;
+      //             otherParams.showOtherSchool = true;
+      //             otherParams.showCancelButton = false;
+      //             otherParams.showCloseButton = true;
+      //             otherParams.confirmButtonColor =
+      //               'linear-gradient( 305deg, #40C8FF 0%, #3192FF 100%)';
+      //             otherParams.confirmButtonText = '我知道了';
+      //             otherParams.otherType = 'limit';
+      //             otherParams.messageAlign = 'center';
+      //             return true;
       try {
         storage.remove(ACCESS_TOKEN);
         removeAuth();
@@ -824,6 +841,7 @@ export default defineComponent({
       <div class={[styles['student-register']]}>
         <img src={bannerBg} class={styles.bannerBg} />
         <div class={styles.studentRegisterContainer}>
+          <img src={title1} class={styles.title1} />
           <div class={[styles.studentSection]}>
             <Form labelAlign="left" class={styles.registerForm}>
               <Field
@@ -1044,7 +1062,7 @@ export default defineComponent({
                   clearable={false}
                   required
                   inputAlign="right"
-                  label="互通码"
+                  label="激活码"
                   readonly={route.query.code ? true : false}
                   modelValue={maskMiddleDigits(forms.activationCode)}
                 />
@@ -1053,8 +1071,8 @@ export default defineComponent({
                   clearable={false}
                   required
                   inputAlign="right"
-                  label="互通码"
-                  placeholder="请输入互通码"
+                  label="激活码"
+                  placeholder="请输入激活码"
                   autocomplete="off"
                   v-model={forms.activationCode}
                 />
@@ -1064,21 +1082,14 @@ export default defineComponent({
 
           <MSticky position="bottom">
             <div class={styles.paymentContainer}>
-              <Button
-                onClick={() => {
-                  // onSubmit();
+              <img class={[styles.submitBtn, forms.submitLoading && styles.loading]} onClick={() => {
+                  if(forms.submitLoading) return
                   if (checkForm() || checkSubmit()) {
                     forms.submitLoading = false;
                     return;
                   }
                   forms.showConfirmPopup = true;
-                }}
-                round
-                block
-                disabled={forms.submitLoading}
-                loading={forms.submitLoading}>
-                提交
-              </Button>
+                }} src={submitBtn} />
             </div>
           </MSticky>
         </div>
@@ -1427,8 +1438,10 @@ export default defineComponent({
             background: 'transparent',
             overflow: 'visible !important'
           }}>
-          <CodeDialog type="INFO" showButton={false}>
+          <div class={styles.studentSectionPopup}>
+            <img src={title2} class={styles.title2} />
             <div class={styles.studentInfo}>
+              <div class={styles.studentInner}>
               <Cell
                 border={false}
                 title="学生姓名"
@@ -1456,31 +1469,22 @@ export default defineComponent({
               {!route.query.code && (
                 <Cell
                   border={false}
-                  title="互通码"
+                  title="激活码"
                   value={forms.activationCode}></Cell>
               )}
-            </div>
+
             <div class={styles.studentBtnGroup}>
-              <Button
-                round
-                block
-                onClick={() => (forms.showConfirmPopup = false)}>
-                取消
-              </Button>
-              <Button
-                round
-                block
-                disabled={forms.submitLoading}
-                loading={forms.submitLoading}
-                color="linear-gradient( 305deg, #3192FF 0%, #40C8FF 100%)"
-                onClick={() => {
+              <img src={btn5} class={[styles.btn, styles.cancelBtn]} onClick={() => (forms.showConfirmPopup = false)} />
+              <img src={btn4} class={[styles.btn, styles.primaryBtn]} onClick={() => {
+                  if(forms.submitLoading) return
                   forms.showConfirmPopup = false;
                   onSubmit();
-                }}>
-                确认
-              </Button>
+                }} />
             </div>
-          </CodeDialog>
+              </div>
+            </div>
+           
+          </div>
         </Popup>
 
         <Popup
@@ -1491,12 +1495,13 @@ export default defineComponent({
           }}>
           <CodeDialog
             type={forms.reslutPopupType}
-            btnText={
-              forms.reslutPopupType === 'ACTIVATING' ||
-              forms.reslutPopupType === 'ACTIVATING-TWO'
-                ? '立即下载激活'
-                : '我知道了'
-            }
+            // btnText={
+            //   forms.reslutPopupType === 'ACTIVATING' ||
+            //   forms.reslutPopupType === 'ACTIVATING-TWO'
+            //     ? '立即下载激活'
+            //     : '我知道了'
+            // }
+            btnImg={forms.reslutPopupType === 'ACTIVATING' || forms.reslutPopupType === 'ACTIVATING-TWO' ? btn6 : btn3}
             onConfirm={() => {
               //
               if (
@@ -1517,7 +1522,7 @@ export default defineComponent({
             )}
             {forms.reslutPopupType === 'ACTIVATING-TWO' && (
               <p>
-                您已使用该互通码,请勿重复提交,请下载
+                您已使用该激活码,请勿重复提交,请下载
                 <span style={{ color: '#2B85FF' }}>【音乐数字课堂】</span>
                 实现互通互联
               </p>

+ 80 - 0
src/views/activation-code/m-message-tip/index.module.less

@@ -0,0 +1,80 @@
+.wxPopupDialog {
+  // position: relative;
+  overflow: initial;
+  margin: 0 40px;
+  width: calc(100% - 75px) !important;
+  // margin-top: -160px;
+  border-radius: 20px !important;
+
+  &::before {
+    position: absolute;
+    content: ' ';
+    top: -38px;
+    left: 50%;
+    margin-left: -34px;
+    display: inline-block;
+    background: url('../activation-register/images/message-top.png') no-repeat top center;
+    background-size: contain;
+    width: 78px;
+    height: 76px;
+  }
+}
+
+.popupContainer {
+  background: url('../activation-register/images/message-bg2.png') no-repeat top center;
+
+  background-size: contain;
+  border-radius: 20px;
+  overflow: hidden;
+  padding-bottom: 20px;
+  text-align: center;
+
+  .title1 {
+    padding-top: 53px;
+    text-align: center;
+    font-size: 18px;
+    font-weight: 500;
+    color: #000000;
+  }
+
+  .popupTips {
+    font-size: 15px;
+    color: #666666;
+    line-height: 21px;
+    padding: 16px 20px 20px;
+    word-break: break-all;
+  }
+
+  .btnGroup {
+    display: flex;
+    align-items: center;
+    margin: 0 13px
+  }
+
+  .button {
+    // padding: 0 44px;
+    height: 40px;
+    font-size: 16px;
+    color: #333333;
+    border-color: #AAAAAA;
+    margin: 0 7px;
+    flex: 1;
+  }
+
+  .confirmBtn {
+    background: linear-gradient(305deg, #40C8FF 0%, #3192FF 100%);
+    color: #FFFFFF;
+    border: none;
+  }
+
+  .iconClose {
+    position: absolute;
+    top: 16px;
+    right: 16px;
+    display: inline-block;
+    background: url('../../common/images/message-close.png') no-repeat top center;
+    background-size: cover;
+    width: 18px;
+    height: 18px;
+  }
+}

+ 127 - 0
src/views/activation-code/m-message-tip/index.tsx

@@ -0,0 +1,127 @@
+import { Button, Popup } from 'vant';
+import { PropType, defineComponent, onMounted, ref, watch } from 'vue';
+import styles from './index.module.less';
+import { browser } from '@/helpers/utils';
+
+export default defineComponent({
+  name: 'm-wx-tip',
+  props: {
+    // 是否显示微信弹窗
+    show: {
+      type: Boolean,
+      default: true
+    },
+    title: {
+      type: String,
+      default: '温馨提示'
+    },
+    message: {
+      type: String,
+      default: '请使用微信打开'
+    },
+    messageAlign: {
+      type: String as PropType<'center' | 'left' | 'right'>,
+      default: 'center'
+    },
+    /** 是否展示取消按钮 */
+    showCancelButton: {
+      type: Boolean,
+      default: false
+    },
+    /** 取消按钮文案 */
+    cancelButtonText: {
+      type: String,
+      default: '取消'
+    },
+    /** 取消按钮颜色 */
+    cancelButtonColor: {
+      type: String,
+      default: ''
+    },
+    /** 是否展示确认按钮 */
+    showConfirmButton: {
+      type: Boolean,
+      default: true
+    },
+    /** 确认按钮文案 */
+    confirmButtonText: {
+      type: String,
+      default: '确认'
+    },
+    /** 确认按钮颜色 */
+    confirmButtonColor: {
+      type: String,
+      default: ''
+    },
+    /** 是否有关闭按钮 */
+    showCloseButton: {
+      type: Boolean,
+      default: true
+    }
+  },
+  emits: ['confirm', 'cancel', 'close'],
+  setup(props, { emit }) {
+    const showPopup = ref(false);
+    onMounted(() => {
+      if (props.show) {
+        showPopup.value = true;
+      }
+    });
+
+    watch(
+      () => [props.show, props.message],
+      () => {
+        if (props.show) {
+          showPopup.value = true;
+        } else {
+          showPopup.value = false;
+        }
+      }
+    );
+    return () => (
+      <>
+        <Popup
+          v-model:show={showPopup.value}
+          round
+          style={{ width: '100%', maxWidth: '520px' }}
+          closeOnClickOverlay={false}
+          class={styles.wxPopupDialog} closeable={false}>
+          <div class={styles.popupContainer}>
+            {props.showCloseButton && (
+              <i class={styles.iconClose} onClick={() => emit('close')}></i>
+            )}
+
+            <p class={styles.title1} v-html={props.title}></p>
+            <p
+              class={styles.popupTips}
+              style={{ 'text-align': props.messageAlign }}
+              v-html={props.message}></p>
+
+            {(props.showConfirmButton || props.showConfirmButton) && (
+              <div class={styles.btnGroup}>
+                {props.showCancelButton && (
+                  <Button
+                    round
+                    class={[styles.button, styles.cancelBtn]}
+                    color={props.cancelButtonColor}
+                    onClick={() => emit('cancel')}>
+                    {props.cancelButtonText}
+                  </Button>
+                )}
+                {props.showConfirmButton && (
+                  <Button
+                    round
+                    class={[styles.button, styles.confirmBtn]}
+                    color={props.confirmButtonColor}
+                    onClick={() => emit('confirm')}>
+                    {props.confirmButtonText}
+                  </Button>
+                )}
+              </div>
+            )}
+          </div>
+        </Popup>
+      </>
+    );
+  }
+});

二进制
src/views/activation-code/modal/code-dialog/images/title1.png


二进制
src/views/activation-code/modal/code-dialog/images/title5.png


二进制
src/views/activation-code/modal/code-dialog/images/title6.png


二进制
src/views/activation-code/modal/code-dialog/images/title7.png


+ 6 - 1
src/views/activation-code/modal/code-dialog/index.module.less

@@ -1,6 +1,6 @@
 .codeDialog {
   width: 305px;
-  background: linear-gradient(89deg, #D0EFF7 0%, #D9F9DC 100%);
+  background: linear-gradient( 89deg, #D0EFF7 0%, #D9F9DC 100%);
   position: relative;
   border-radius: 12px;
 }
@@ -72,6 +72,11 @@
   .btnGroup {
     padding: 20px 55px 0;
 
+    .imgBtn {
+      width: 148px;
+      height: 48px;
+    }
+
     :global {
       .van-button {
         padding: 0;

+ 10 - 2
src/views/activation-code/modal/code-dialog/index.tsx

@@ -15,6 +15,10 @@ export default defineComponent({
       type: Boolean,
       default: true
     },
+    btnImg : {
+      type: String as PropType<any>,
+      default: ''
+    },
     btnText: {
       type: String,
       default: '我知道了'
@@ -104,7 +108,10 @@ export default defineComponent({
               </div>
               {props.showButton && (
                 <div class={styles.btnGroup}>
-                  <Button
+                  
+                  {props.btnImg ? <img src={props.btnImg} class={styles.imgBtn} onClick={() => {
+                      emit('confirm');
+                    }} /> : <Button
                     block
                     round
                     color="linear-gradient( 305deg, #40C8FF 0%, #3192FF 100%)"
@@ -112,7 +119,8 @@ export default defineComponent({
                       emit('confirm');
                     }}>
                     {props.btnText}
-                  </Button>
+                  </Button>}
+
                 </div>
               )}
             </div>

+ 55 - 0
src/views/adapay/pay-result-wechat/index.module.less

@@ -0,0 +1,55 @@
+.paywxresult {
+  overflow: hidden;
+  // background: #fff;
+  min-height: 100vh;
+
+  :gloabl {
+    .van-cell {
+      padding: 12px 16px;
+    }
+    .van-cell__title,
+    .van-cell__value {
+      flex: auto;
+      font-size: 16px;
+      color: #4f4f4f;
+    }
+    .van-button {
+      font-size: 16px;
+      width: 86%;
+      margin: 20px auto;
+    }
+    .van-loading__spinner {
+      width: 50px;
+      height: 50px;
+    }
+  }
+}
+.container {
+  background: #fff;
+  padding: 15px 0;
+}
+
+.order-loading {
+  padding: 15px 0;
+  margin-top: 15px;
+  background-color: #ffffff;
+  text-align: center;
+  font-size: 15px;
+  & > p {
+    margin-bottom: 15px;
+  }
+}
+.error-text {
+  font-size: 15px;
+  width: 100%;
+  text-align: center;
+  color: #3f3f3f;
+  margin-top: 100px;
+}
+
+.error-icon {
+  display: block;
+  color: #ffb07b;
+  font-size: 22px;
+  margin-bottom: 20px;
+}

+ 286 - 0
src/views/adapay/pay-result-wechat/index.tsx

@@ -0,0 +1,286 @@
+import request from '@/helpers/request';
+import { browser, getUrlCode, moneyFormat } from '@/helpers/utils';
+import { goAliAuth, goWechatAuth } from '@/state';
+import {
+  Cell,
+  CellGroup,
+  Icon,
+  Loading,
+  showConfirmDialog,
+  showToast
+} from 'vant';
+import { defineComponent, onMounted, reactive } from 'vue';
+import { useRouter, useRoute } from 'vue-router';
+import styles from './index.module.less';
+
+export default defineComponent({
+  name: 'pay-result',
+  setup() {
+    const router = useRouter();
+    const route = useRoute();
+    const state = reactive({
+      errorText: '',
+      browserStatus: false,
+      code: null as any,
+      pay_channel: route.query.pay_channel as any,
+      wxAppId: route.query.wxAppId as any,
+      paymentType: route.query.paymentType as any,
+      alipayAppId: route.query.alipayAppId as any,
+      body: route.query.body as any,
+      price: route.query.price as any,
+      orderNo: route.query.orderNo as any,
+      userId: route.query.userId as any,
+      payInfo: {} as any,
+      isYeePay: false // 是否为易宝支付
+    });
+
+    const init = () => {
+      const query = route.query;
+      const isYeePay = state.paymentType.indexOf('yeepay') !== -1;
+      // 判断是否有支付对象
+      if (!query.orderNo || !query.pay_channel) {
+        showConfirmDialog({
+          message: '支付订单信息错误请重新支付',
+          showCancelButton: false
+        }).then(() => {
+          router.back();
+        });
+      } else {
+        // 判断当前浏览器
+        if (browser().weixin) {
+          state.browserStatus = true;
+          getWxPay();
+        } else if (browser().alipay) {
+          if (isYeePay) {
+            let code = getUrlCode('auth_code');
+            if (code) {
+              state.code = code; // 赋值code码
+              state.browserStatus = true;
+              getPayment();
+            } else {
+              goAliAuth(state.alipayAppId);
+            }
+          } else {
+            state.browserStatus = true;
+            getPayment();
+          }
+        } else {
+          state.errorText = '请在微信或支付宝客户端打开';
+          document.title = 'ERROR';
+        }
+      }
+    };
+
+    const getPayment = async () => {
+      try {
+        if (parseFloat(state.price) <= 0) {
+          showToast('支付金额异常');
+          return;
+        }
+        const payMap: any = {
+          merOrderNo: state.orderNo,
+          paymentChannel: state.pay_channel, // 支付渠道
+          userId: state.userId,
+          code: state.code
+        };
+        //     // 判断是否是微信公众号支付
+        // if (state.pay_channel == 'wx_pub') {
+        // payMap.code = state.code;
+        // }
+
+        const { data } = await request.post(
+          '/edu-app/open/userOrder/executePayment',
+          {
+            data: {
+              ...payMap
+            }
+          }
+        );
+        state.isYeePay = data.paymentVender?.indexOf('yeepay') !== -1;
+        console.log(data, 'data');
+        scanCodePay(data.reqParams);
+      } catch (e) {
+        //
+        console.log(e);
+        // 接口报错也跳转到支付回调页
+        // window.location.replace(
+        //   location.origin +
+        //     '/classroom-app/#/payment-result?orderNo=' +
+        //     state.orderNo
+        // );
+      }
+    };
+
+    // 由于js的载入是异步的,所以可以通过该方法,当AlipayJSBridgeReady事件发生后,再执行callback方法
+    const ready = (callback: any) => {
+      if ((window as any).AlipayJSBridge) {
+        callback && callback();
+      } else {
+        document.addEventListener('AlipayJSBridgeReady', callback, false);
+      }
+    };
+    const tradePay = (tradeNO: any) => {
+      ready(function () {
+        // 通过传入交易号唤起快捷调用方式(注意tradeNO大小写严格)
+        (window as any).AlipayJSBridge.call(
+          'tradePay',
+          {
+            tradeNO: tradeNO
+          },
+          function (data: any) {
+            // if ('9000' == data.resultCode) {
+            //   window.location.replace(
+            //     location.origin +
+            //       '/classroom-app/#/payment-result?orderNo=' +
+            //       state.orderNo
+            //   );
+            // } else {
+            //   window.location.replace(
+            //     location.origin +
+            //       '/classroom-app/#/payment-result?orderNo=' +
+            //       state.orderNo
+            //   );
+            // }
+            //使用的支付宝内置api实现关闭H5
+            (window as any).AlipayJSBridge.call('closeWebview');
+          }
+        );
+      });
+    };
+    const scanCodePay = (data: any) => {
+      // 判断支付方式 如果是 test 模式 支付用测试url 否则用生产url
+      if (state.pay_channel == 'alipay_qr') {
+        if (state.isYeePay) {
+          tradePay(data.tradeNO);
+        } else {
+          const url =
+            data.prod_mode === 'false'
+              ? data?.expend?.qrcode_url +
+                '?payment_id=' +
+                data.id +
+                '&pay_channel=' +
+                data.pay_channel
+              : data?.expend?.qrcode_url;
+          window.location.href = url;
+        }
+      } else if (state.pay_channel == 'alipay_wap') {
+        window.location.href = data?.expend?.pay_info;
+      } else if (state.pay_channel == 'wx_pub') {
+        const tempPayInfo = state.isYeePay
+          ? JSON.parse(data.prePayTn)
+          : data?.expend
+          ? JSON.parse(data?.expend?.pay_info)
+          : data;
+        state.payInfo = tempPayInfo;
+        if (typeof (window as any).WeixinJSBridge == 'undefined') {
+          if (document.addEventListener) {
+            document.addEventListener(
+              'WeixinJSBridgeReady',
+              onBridgeReady,
+              false
+            );
+          } else if ((document as any).attachEvent) {
+            (document as any)
+              .attachEvent(
+                'WeixinJSBridgeReady',
+                onBridgeReady
+              )(document as any)
+              .attachEvent('onWeixinJSBridgeReady', onBridgeReady);
+          }
+        } else {
+          onBridgeReady();
+        }
+      }
+    };
+
+    const onBridgeReady = () => {
+      const payInfo = state.payInfo;
+      // let orderNo = state.orderNo
+      (window as any).WeixinJSBridge.invoke(
+        'getBrandWCPayRequest',
+        {
+          appId: payInfo.appId, //公众号名称,由商户传入
+          timeStamp: payInfo.timeStamp, //时间戳,自1970年以来的秒数
+          nonceStr: payInfo.nonceStr, //随机串
+          package: payInfo.package || payInfo.packageValue,
+          signType: payInfo.signType, //微信签名方式:
+          paySign: payInfo.paySign //微信签名
+        },
+        (res: any) => {
+          // if(res.err_msg == "get_brand_wcpay_request:ok" ){
+          // 使用以上方式判断前端返回,微信团队郑重提示:
+          //res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
+          // } else
+
+          console.log(res, 'res')
+          if (
+            res.err_msg == 'get_brand_wcpay_request:cancel' ||
+            res.err_msg == 'get_brand_wcpay_request:fail'
+          ) {
+            // window.location.replace(
+            //   location.origin +
+            //     '/classroom-app/#/payment-result?orderNo=' +
+            //     state.orderNo
+            // );
+          } else {
+            // 使用以上方式判断前端返回,微信团队郑重提示:
+            //res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
+            // alert('支付成功')
+            // window.location.replace(
+            //   location.origin +
+            //     '/classroom-app/#/payment-result?orderNo=' +
+            //     state.orderNo
+            // );
+          }
+        }
+      );
+    };
+
+    const getWxPay = () => {
+      // 微信公众号支付
+      //授权
+      const code = getUrlCode();
+      if (!code) {
+        goWechatAuth(state.wxAppId);
+      } else {
+        state.code = code;
+        getPayment();
+      }
+    };
+
+    onMounted(() => {
+      init();
+    });
+
+    return () => (
+      <div class={styles.paywxresult}>
+        {state.browserStatus && (
+          <>
+            <div class={styles.container}>
+              <CellGroup border={false}>
+                <Cell
+                  title={'订单金额'}
+                  value={'¥ ' + moneyFormat(state.price)}></Cell>
+                <Cell title={'订单信息'} value={state.body}></Cell>
+              </CellGroup>
+            </div>
+
+            <div class={styles['order-loading']}>
+              <p>{state.pay_channel == 'wx_pub' ? '微信支付' : '支付宝支付'}</p>
+              <Loading type="spinner" color="#01C1B5" />
+            </div>
+          </>
+        )}
+
+        {!state.browserStatus && (
+          <div class={styles['error-text']}>
+            {state.errorText && (
+              <Icon class={styles['error-icon']} name="warning-o" />
+            )}
+            {state.errorText}
+          </div>
+        )}
+      </div>
+    );
+  }
+});

+ 24 - 21
src/views/student-register/modal/select-student/index.module.less

@@ -88,28 +88,31 @@
 .addStudentBtn {
   margin: 0 20px 22px;
 
-  .iconAdd {
-    display: inline-block;
-    width: 20px;
-    height: 20px;
-    background: url('../../images/new/icon-n-3.png') no-repeat center;
-    background-size: contain;
-    margin-right: 6px;
-    flex-shrink: 0;
-  }
+  // .iconAdd {
+  //   display: inline-block;
+  //   width: 20px;
+  //   height: 20px;
+  //   background: url('../../images/new/icon-n-3.png') no-repeat center;
+  //   background-size: contain;
+  //   margin-right: 6px;
+  //   flex-shrink: 0;
+  // }
 
-  :global {
-    .van-button {
-      border-radius: 8px;
-      font-weight: 600;
-      font-size: 16px;
-      color: #1189FF;
-    }
+  // :global {
+  //   .van-button {
+  //     border-radius: 8px;
+  //     font-weight: 600;
+  //     font-size: 16px;
+  //     color: #1189FF;
+  //   }
 
-    .van-button__text {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
+  //   .van-button__text {
+  //     display: flex;
+  //     align-items: center;
+  //     justify-content: center;
+  //   }
+  // }
+  .addBtn {
+    width: 100%;
   }
 }

+ 9 - 2
src/views/student-register/modal/select-student/index.tsx

@@ -3,6 +3,7 @@ import styles from './index.module.less';
 import { Button, Cell, Icon, Image, Radio, RadioGroup } from 'vant';
 import checkBoxActive from '../../images/new/icon-n-1.png';
 import checkBoxDefault from '../../images/new/icon-n-2.png';
+import btn2 from '../../../activation-code/activation-register/images/btn2.png'
 
 export default defineComponent({
   name: 'select-student',
@@ -87,7 +88,7 @@ export default defineComponent({
         </RadioGroup>
         {props.showAdd && (
           <div class={styles.addStudentBtn}>
-            <Button
+            {/* <Button
               block
               color="linear-gradient( 135deg, #31C7FF 0%, #007AFE 100%)"
               onClick={() => {
@@ -98,7 +99,13 @@ export default defineComponent({
               }}>
               <i class={styles.iconAdd}></i>
               <span>新增学生</span>
-            </Button>
+            </Button> */}
+            <img src={btn2} onClick={() => {
+                //
+                // radioChecked.value = null;
+                emit('confirm', {});
+                // emit('close');
+              }} class={styles.addBtn} />
           </div>
         )}
       </div>