更新样式与登录

src/helpers/request.ts

@@ -4,9 +4,8 @@ import { browser } from '@/helpers/utils';
 import { setLogout, setLoginError, state } from '@/state';
 import { postMessage } from './native-message';
 import { showLoadingToast, showToast, closeToast } from 'vant';
-import { createStorage } from '@/helpers/storage';
+import { storage } from '@/helpers/storage';
 import { ACCESS_TOKEN } from '@/store/mutation-types';
-const storage = createStorage({ prefixKey: '', storage: sessionStorage });
 
 export interface SearchInitParams {
   rows?: string | number;
@@ -38,20 +37,19 @@ request.interceptors.request.use(
     initRequest = options.initRequest || false;
     const Authorization = storage.get(ACCESS_TOKEN) || '';
     const authHeaders: any = {};
+    console.log(url);
     if (
       Authorization &&
       ![
         '/edu-oauth/userlogin',
         '/edu-oauth/smsLogin',
-        '/edu-oauth/open/sendSms'
+        '/edu-oauth/open/sendSms',
+        '/edu-app/open/userOrder/registerGoods'
       ].includes(url)
     ) {
       authHeaders.Authorization = Authorization;
     }
 
-    if (state?.user?.data?.schoolId) {
-      authHeaders.coopId = state?.user?.data.schoolId;
-    }
     return {
       url,
       options: {

src/helpers/storage.ts

@@ -4,11 +4,11 @@ const DEFAULT_CACHE_TIME = 60 * 60 * 24 * 7;
 /**
  * 创建本地缓存对象
  * @param {string=} prefixKey -
- * @param {Object} [storage=localStorage] - sessionStorage | localStorage
+ * @param {Object} [storage=sessionStorage] - sessionStorage | localStorage
  */
 export const createStorage = ({
   prefixKey = '',
-  storage = localStorage
+  storage = sessionStorage
 } = {}) => {
   /**
    * 本地缓存类

src/store/modules/student-register-store.ts

@@ -2,18 +2,20 @@ import { defineStore } from 'pinia';
 import { createStorage } from '@/helpers/storage';
 import { ACCESS_TOKEN } from '../mutation-types';
 const storage = createStorage({ prefixKey: '', storage: sessionStorage });
-
+import router from '../../router/index';
 export interface IUserState {
   token: string;
   selectGoods: any[];
   selectVip: any[];
+  schoolId: string;
 }
 
 export const useStudentRegisterStore = defineStore('student-register-store', {
   state: (): IUserState => ({
     token: storage.get(ACCESS_TOKEN, ''),
     selectGoods: [] as any,
-    selectVip: [] as any
+    selectVip: [] as any,
+    schoolId: ''
   }),
   getters: {
     getToken(): string {
@@ -24,6 +26,9 @@ export const useStudentRegisterStore = defineStore('student-register-store', {
     },
     getVip(): any {
       return this.selectVip;
+    },
+    getSchoolId(): string {
+      return this.schoolId;
     }
   },
   actions: {
@@ -36,6 +41,13 @@ export const useStudentRegisterStore = defineStore('student-register-store', {
       storage.set(ACCESS_TOKEN, token);
     },
     /**
+     * 删除token
+     */
+    deleteToken() {
+      this.token = '';
+      storage.remove(ACCESS_TOKEN);
+    },
+    /**
      * 设置选择的商品
      * @param goods 商品
      */
@@ -79,6 +91,25 @@ export const useStudentRegisterStore = defineStore('student-register-store', {
         (goods: any) => goods.goodsId === goodsId
       );
       return index >= 0 ? true : false;
+    },
+    /**
+     * 初始化学校编号
+     * @param token
+     */
+    setShoolId(schoolId: string) {
+      this.schoolId = schoolId;
+    },
+    /**
+     * 退出登录
+     */
+    studentLoutOut(): void {
+      this.deleteToken();
+      router.replace({
+        path: '/student-register',
+        query: {
+          sId: this.schoolId
+        }
+      });
     }
   }
 });

src/views/payment-result/index.tsx

@@ -187,13 +187,7 @@ export default defineComponent({
                     <Tag class={styles.brandName}>{goods.brandName}</Tag>
                   </div>
                 ),
-                value: () => (
-                  <span>
-                    {goods.goodsType === 'VIP' || goods.goodsType === 'DEPOSIT'
-                      ? '6个月'
-                      : 'x 1'}
-                  </span>
-                )
+                value: () => <span>x {goods.goodsNum}</span>
               }}
             </Cell>
           ))}

src/views/student-register/component/addres.tsx

@@ -60,6 +60,7 @@ export default defineComponent({
                   {props.item.defaultStatus && (
                     <Tag
                       type="primary"
+                      color="linear-gradient(90deg, #FF8633 0%, #FFB047 100%)"
                       round
                       style={{
                         'vertical-align': 'text-top',

src/views/student-register/layout/auth.tsx

@@ -0,0 +1,106 @@
+import { defineComponent } from 'vue';
+import styles from './index.module.less';
+import { state, setLogin, setLogout, setLoginError } from '@/state';
+import { browser } from '@/helpers/utils';
+import { RouterView } from 'vue-router';
+import { storage } from '@/helpers/storage';
+import { ACCESS_TOKEN } from '@/store/mutation-types';
+import OEmpty from '@/components/m-empty';
+import request from '@/helpers/request';
+
+const browserInfo = browser();
+export default defineComponent({
+  name: 'Auth-loayout',
+  data() {
+    return {
+      loading: false as boolean
+    };
+  },
+  computed: {
+    isExternal() {
+      // 该路由在外部连接打开是否需要登录
+      // 只判断是否在学员端打开
+      return this.$route.meta.isExternal || false;
+    },
+    isNeedView() {
+      return (
+        state.user.status === 'login' ||
+        this.$route.path === '/student-register' ||
+        (this as any).isExternal
+      );
+    }
+  },
+  mounted() {
+    !this.isExternal && this.setAuth();
+  },
+  methods: {
+    async setAuth() {
+      const { query } = this.$route;
+      const token = query.userInfo || query.Authorization;
+      if (token) {
+        storage.set(ACCESS_TOKEN, token);
+      }
+      if (this.loading) {
+        return;
+      }
+      if (state.user.status === 'init' || state.user.status === 'error') {
+        this.loading = true;
+        try {
+          const res = await request.get('/edu-app/user/getUserInfo', {
+            initRequest: true, // 初始化接口
+            requestType: 'form'
+          });
+          setLogin(res.data);
+        } catch (e: any) {
+          // console.log(e, 'e')
+          const message = e.message;
+          if (
+            message.indexOf('5000') === -1 &&
+            message.indexOf('authentication') === -1
+          ) {
+            setLoginError();
+          } else {
+            setLogout();
+          }
+        }
+        this.loading = false;
+      }
+      if (state.user.status === 'logout') {
+        try {
+          const route = this.$route;
+          const query = {
+            returnUrl: this.$route.path,
+            ...this.$route.query
+          } as any;
+          if (route.meta.isRegister) {
+            query.isRegister = route.meta.isRegister;
+          }
+          this.$router.replace({
+            path: '/student-register',
+            query: query
+          });
+        } catch (error) {
+          //
+        }
+      }
+    }
+  },
+  render() {
+    return (
+      <>
+        {state.user.status === 'error' ? (
+          <div class={styles.error}>
+            <OEmpty
+              description="加载失败，请稍后重试"
+              buttonText="重新加载"
+              showButton
+              onClick={this.setAuth}
+            />
+          </div>
+        ) : this.isNeedView ? (
+          <RouterView></RouterView>
+        ) : null}
+      </>
+    );
+  }
+});

src/views/student-register/layout/index.module.less

@@ -0,0 +1,117 @@
+.error {
+  background-color: #fff;
+  display: flex;
+  // padding-top: 20px;
+  flex-direction: column;
+  min-height: calc(100vh);
+  align-items: center;
+  justify-content: center;
+  .info {
+    display: flex;
+    align-items: center;
+    margin-bottom: 30px;
+
+    span {
+      display: inline-block;
+      margin-left: 10px;
+      color: #58727e;
+      font-size: 18px;
+    }
+  }
+
+  :global {
+    .o-result-container,
+    .van-empty {
+      padding-top: 0;
+    }
+
+    .van-button {
+      width: 50%;
+    }
+  }
+}
+
+.login {
+  min-height: 100vh;
+  background: url('../../../views/layout/images/top_bg.png') no-repeat top center,
+    url('../../../views/layout/images/bottom_student_bg.png') no-repeat bottom center;
+  background-color: #fff;
+  background-size: 100%;
+
+  .loginTitle {
+    padding-top: 100px;
+    font-size: 26px;
+    padding-left: 35px;
+    padding-bottom: 70px;
+    line-height: 37px;
+    font-weight: 500;
+  }
+
+  .codeText {
+    color: var(--van-primary-text);
+  }
+
+  .margin34 {
+    margin: 0 34px;
+  }
+
+  .formTitle {
+    font-size: 18px;
+    color: #000;
+    font-weight: 500;
+  }
+
+  :global {
+    .van-cell-group {
+      margin-bottom: 35px;
+    }
+    .van-field {
+      padding-left: 0;
+      padding-right: 0;
+    }
+    .van-button + .van-button {
+      margin-top: 20px;
+      color: #000 !important;
+    }
+  }
+
+  .wxPopupDialog {
+    position: relative;
+    overflow: inherit;
+    margin-top: -160px;
+    &::before {
+      position: absolute;
+      content: ' ';
+      top: -73px;
+      left: 50%;
+      margin-left: -86px;
+      display: inline-block;
+      background: url('../pre-apply/images/wx-no-top.png') no-repeat top center;
+      background-size: contain;
+      width: 172px;
+      height: 154px;
+    }
+  }
+  .popupContainer {
+    background: url('../pre-apply/images/wx-no-bg.png') no-repeat top center;
+    background-size: cover;
+    border-radius: 20px;
+    overflow: hidden;
+    padding: 0 20px;
+    .title {
+      padding-top: 57px;
+      text-align: center;
+      font-size: 18px;
+      font-weight: 500;
+      color: #3b2300;
+    }
+    .popupTips {
+      padding-top: 12px;
+      padding-bottom: 47px;
+      text-align: center;
+      font-size: 15px;
+      color: #777777;
+      line-height: 21px;
+    }
+  }
+}

src/views/student-register/layout/utils.tsx

@@ -0,0 +1,22 @@
+/**
+ * 删除token
+ */
+export const removeAuth = () => {
+  sessionStorage.removeItem('Authorization')
+}
+
+/**
+ * 设置token
+ * @param token
+ * @returns {void}
+ */
+export const setAuth = (token: any) => {
+  sessionStorage.setItem('Authorization', token)
+}
+
+/**
+ * 获取token
+ */
+export const getAuth = () => {
+  sessionStorage.getItem('Authorization')
+}

src/views/student-register/order-detail.module.less

@@ -1,6 +1,7 @@
 .cartConfirm {
   padding: 10px 14px;
   padding-bottom: 100px;
+
   :global {
     .van-cell-group {
       border-radius: 6px;
@@ -14,6 +15,7 @@
   margin-bottom: 12px;
   border-radius: 10px;
   overflow: hidden;
+
   // border-bottom: 3px solid;
   // border-image-source: url('./images/icon-address-border.png');
   .cartItem {
@@ -21,6 +23,7 @@
     border-radius: 0;
     padding: 0;
   }
+
   :global {
     .van-cell__value {
       color: #666;
@@ -38,6 +41,7 @@
   box-shadow: none !important;
   padding: 8px 0 !important;
   background: #ffebdd;
+
   :global {
     .van-checkbox__label {
       color: #777;
@@ -56,16 +60,26 @@
   box-shadow: none !important;
   background: #fff;
   padding-top: 12px;
+
   .needPrice {
     display: flex;
     align-items: center;
     color: #333333;
+    font-family: DINAlternate-Bold, DINAlternate;
+
     span {
       font-size: 22px;
       font-weight: bold;
       color: #ff4e19;
+
+      i {
+        font-style: normal;
+        font-size: 18px;
+        margin-right: 3px;
+      }
     }
   }
+
   .allPrice {
     color: #aaa;
   }
@@ -83,6 +97,7 @@
   padding: 15px 12px;
   border-radius: 10px;
   overflow: hidden;
+
   .img {
     width: 70px;
     height: 70px;
@@ -101,6 +116,7 @@
 
   .numFont {
     font-family: 'DINA';
+
     .numPrefix {
       font-size: 14px !important;
       margin-right: 2px;
@@ -108,6 +124,7 @@
   }
 
   .goodsContent {
+
     // h2 {
     //   font-size: 16px;
     //   font-weight: 500;
@@ -120,20 +137,25 @@
       line-height: 20px;
       flex-shrink: 0;
     }
+
     .goodsPrice {
       padding-top: 4px;
       display: flex;
       align-items: center;
       justify-content: space-between;
+
       .free {
         font-size: 14px;
       }
     }
+
     .goodsNums {
       font-size: 18px;
       font-weight: bold;
       color: #fc1a19;
+      font-family: DINAlternate-Bold, DINAlternate;
     }
+
     h2 {
       font-size: 16px;
       font-weight: 500;
@@ -149,6 +171,9 @@
       font-size: 12px;
       padding: 0 6px;
       border-radius: 4px;
+      background: linear-gradient(180deg, #FFF7E8 0%, #FFE9D9 100%);
+      color: #BE7332;
+      border: 1px solid #FFE9D9;
     }
 
     .model {
@@ -171,6 +196,7 @@
 
 .codeContainer {
   position: relative;
+
   .codeClose {
     display: inline-block;
     position: absolute;
@@ -206,6 +232,7 @@
       color: #ffffff;
       text-align: center;
     }
+
     .codeQr {
       margin: 23px auto 0;
       width: 221px;
@@ -214,6 +241,7 @@
       background: linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
       border-radius: 11px;
       overflow: hidden;
+
       img {
         width: 100%;
         height: 100%;
@@ -256,11 +284,13 @@
       }
     }
   }
+
   .close {
     position: absolute;
     top: 12px;
     right: 15px;
   }
+
   .codeBottom {
     position: relative;
     margin-top: 32px;
@@ -268,12 +298,14 @@
     border-radius: 20px 20px 0px 0px;
     padding-bottom: 10px;
   }
+
   .title {
     font-size: 16px;
     font-weight: 600;
     color: #333333;
     line-height: 22px;
     padding: 15px 15px 0;
+
     i {
       display: inline-block;
       margin-right: 6px;
@@ -283,10 +315,12 @@
       border-radius: 2px;
     }
   }
+
   .shareImg {
     width: 47px;
     height: 47px;
   }
+
   .shareText {
     padding-top: 6px;
     font-size: 14px;
@@ -303,9 +337,22 @@
   padding: 15px 12px;
   font-size: 16px;
   color: #333;
+
   :global {
     .van-cell__value {
       color: #ff4e19;
     }
   }
 }
+
+
+.submitBtn {
+  height: 40px;
+  background: linear-gradient(121deg, #FFD892 0%, #FFCB75 100%);
+  border-radius: 12px;
+  border: 0;
+  padding: 0 40px;
+  font-size: 16px;
+  font-weight: 600;
+  color: #5B2C03;
+}

src/views/student-register/order-detail.tsx

@@ -66,15 +66,12 @@ export default defineComponent({
         const goodsInfos = data.goodsInfos || [];
         state.orderInfo = data;
         let hasInstrument = false; // 是否有乐器
-        let hasTextbook = false; // 是否购买教材
         goodsInfos.forEach((item: any) => {
           const img = item.goodsUrl ? item.goodsUrl.split(',')[0] : '';
           item.goodsUrl = img;
 
           if (item.goodsType === 'INSTRUMENTS') {
             hasInstrument = true;
-          } else if (item.goodsType === 'TEXTBOOK') {
-            hasTextbook = true;
           }
         });
         state.goodsInfos = goodsInfos;
@@ -85,8 +82,7 @@ export default defineComponent({
 
         // 判断运费状态
         // 如果没有购买商品，有购买教材则『到付』 其它则免运费
-        console.log(hasInstrument, hasTextbook);
-        if (!hasInstrument && hasTextbook) {
+        if (hasInstrument) {
           state.freight = '到付';
         } else {
           state.freight = '免运费';
@@ -161,9 +157,6 @@ export default defineComponent({
             // 默认关闭支付二维码弹窗
             state.showQrcode = false;
             clearInterval(state.orderTimer);
-            // window.location.replace(
-            //   window.location.origin + '/#/payment-result?orderNo=' + state.orderNo
-            // )
             setTimeout(() => {
               checkOrderTypeJump();
             }, 100);
@@ -367,18 +360,14 @@ export default defineComponent({
                         <h2>
                           <span>{goods.goodsName}</span>
                           <span class={styles.goodsNum}>
-                            {goods.goodsType === 'VIP' ||
-                            goods.goodsType === 'DEPOSIT'
-                              ? '6个月'
-                              : 'x 1'}
+                            x {goods.goodsNum}
                           </span>
                         </h2>
                         <div class={styles.goodsPrice}>
-                          <Tag
-                            color="linear-gradient(135deg, #FF8C4A 0%, #FF531C 100%)"
-                            textColor="#fff"
-                            class={styles.brandName}>
-                            {goods.brandName}
+                          <Tag class={styles.brandName}>
+                            {goods.goodsType === 'VIP'
+                              ? '12个月'
+                              : goods.brandName}
                           </Tag>
                           <span
                             class={[
@@ -425,17 +414,20 @@ export default defineComponent({
             <div class={styles.payemntPrice}>
               <p class={styles.needPrice}>
                 支付金额：
-                <span>¥ {moneyFormat(state.orderInfo.currentPrice)}</span>
+                <span>
+                  <i>¥</i>
+                  {moneyFormat(state.orderInfo.currentPrice)}
+                </span>
               </p>
             </div>
             <div class={styles.paymentBtn}>
               <Button
-                color="linear-gradient(135deg, #FF8C4A 0%, #FF531C 100%)"
                 round
+                class={styles.submitBtn}
                 onClick={onSubmit}
                 loading={state.submitStatus}
                 disabled={state.submitStatus}>
-                立即购买
+                提交
               </Button>
             </div>
           </div>

src/views/student-register/register-modal/index.module.less

@@ -19,9 +19,18 @@
   margin: 0 12px;
   overflow: hidden;
 
+  .tips {
+    padding-top: 4px;
+    font-size: 12px;
+    font-weight: 400;
+    color: #FF5A56;
+    line-height: 17px;
+  }
+
   :global {
     .van-cell {
-      padding: 13px 16px;
+      padding: 16px 16px;
+
     }
 
     .van-field__label {
@@ -31,6 +40,10 @@
       line-height: 22px;
       margin-bottom: 10px;
     }
+
+    .van-field__control {
+      font-size: 16px;
+    }
   }
 
   .codeText {

src/views/student-register/register-modal/index.tsx

@@ -186,8 +186,18 @@ export default defineComponent({
             type="tel"
             autocomplete="off"
             v-model={studentInfo.username}
-            maxlength={11}
-          />
+            maxlength={11}>
+            {{
+              label: () => (
+                <div>
+                  联系方式（直接监护人）
+                  <p class={styles.tips}>
+                    手机号是数字化器乐课堂的唯一登录账户
+                  </p>
+                </div>
+              )
+            }}
+          </Field>
           <Field
             center
             clearable

src/views/student-register/shop-address/address-operation.tsx

@@ -180,6 +180,7 @@ export default defineComponent({
               type="primary"
               block
               round
+              class={styles.createBtn}
               onClick={onSubmit}
               disabled={state.isClick}>
               确认

src/views/student-register/shop-address/index.module.less

@@ -1,4 +1,5 @@
 .shopAddress {
+  --k-font-primary: #FF8021;
   overflow: hidden;
 }
 
@@ -11,6 +12,7 @@
     font-size: 16px;
     color: #777777;
     line-height: 22px;
+
     .name {
       font-size: 16px;
       font-weight: 600;
@@ -18,6 +20,7 @@
       line-height: 22px;
       padding-right: 12px;
     }
+
     :global {
       .van-tag {
         padding: 0 8px;
@@ -26,6 +29,7 @@
       }
     }
   }
+
   .content {
     font-size: 14px;
     color: #777777;
@@ -41,6 +45,7 @@
       border-radius: 10px;
       overflow: hidden;
     }
+
     .van-button {
       height: 100%;
       border-radius: 10px;
@@ -51,6 +56,9 @@
 
 .operation {
   padding-top: 12px;
+  --k-font-primary: #FF8021;
+  --van-switch-on-background: #FFCD7A !important;
+
   .form {
     :global {
       .van-cell__title {
@@ -58,6 +66,7 @@
       }
     }
   }
+
   :global {
     .van-cell {
       font-size: 16px;
@@ -75,3 +84,13 @@
     }
   }
 }
+
+
+.createBtn {
+  background: linear-gradient(121deg, #FFD892 0%, #FFCB75 100%);
+  border-radius: 12px;
+  border: 0;
+  font-size: 16px;
+  font-weight: 600;
+  color: #5B2C03;
+}

src/views/student-register/shop-address/index.tsx

@@ -38,7 +38,8 @@ export default defineComponent({
     const onBeforeClose = ({ position }: any, item: any) => {
       if (position === 'right') {
         showConfirmDialog({
-          title: '确定删除吗？'
+          title: '确定删除吗？',
+          confirmButtonColor: '#FF8021'
         }).then(async () => {
           await request.post('/edu-app/userReceiveAddress/remove', {
             requestType: 'form',
@@ -113,11 +114,7 @@ export default defineComponent({
       getList();
     });
     return () => (
-      <div
-        class={[
-          styles.shopAddress,
-          !form.listState.dataShow && 'emptyRootContainer'
-        ]}>
+      <div class={[styles.shopAddress]}>
         {form.listState.dataShow ? (
           <List
             // v-model:loading={form.listState.loading}
@@ -139,7 +136,7 @@ export default defineComponent({
                             <span class={styles.name}>{item.name}</span>
                             <span class={styles.phone}>{item.phoneNumber}</span>
                             {item.defaultStatus && (
-                              <Tag round color="#FF8057">
+                              <Tag plain color="#FF8057">
                                 默认
                               </Tag>
                             )}
@@ -172,7 +169,14 @@ export default defineComponent({
             ))}
           </List>
         ) : (
-          <OEmpty description="暂无收货地址" />
+          <div
+            style={{
+              'min-height': 'calc(100vh - var(--header-height))',
+              display: 'flex',
+              'align-items': 'center'
+            }}>
+            <OEmpty description="暂无收货地址" />
+          </div>
         )}
         <OSticky position="bottom">
           <div class={'btnGroup'}>
@@ -180,6 +184,7 @@ export default defineComponent({
               type="primary"
               round
               block
+              class={styles.createBtn}
               onClick={() => {
                 router.push('addressOperation');
               }}>