Browse Source

开启微信授权及样式调整

lex 1 year ago
parent
commit
9a78484988

+ 6 - 1
src/components/o-sticky/index.module.less

@@ -6,8 +6,13 @@
 
 .white {
   background-color: #fff;
-  > div {
+
+  >div {
     padding-top: 15px;
     box-shadow: 0px 0px 10px 0px rgba(216, 216, 216, 0.5);
   }
 }
+
+.white-only {
+  background-color: #fff;
+}

+ 1 - 1
src/student/music-group/layout/login.tsx

@@ -40,7 +40,7 @@ export default defineComponent({
       orchestraInfo: {} as any,
       hasBuyInstruments: false, // 是否购买商品
       // 是否开启微信登录(测试使用)默认为false
-      testIsWeixin: true,
+      testIsWeixin: false,
       noPaymentList: [
         '1656572729093021697',
         '1656488025144713217',

+ 46 - 22
src/student/music-group/pre-apply/order-detail.module.less

@@ -1,6 +1,7 @@
 .cartConfirm {
   padding: 10px 14px;
-  padding-bottom: 100px;
+
+  // padding-bottom: 100px;
   :global {
     .van-cell-group {
       border-radius: 6px;
@@ -9,25 +10,27 @@
   }
 }
 
-.cartConfirmBox {
-  padding: 0;
-  margin-bottom: 12px;
-  border-radius: 10px;
-  overflow: hidden;
-  // border-bottom: 3px solid;
-  // border-image-source: url('./images/icon-address-border.png');
-  .cartItem {
-    margin: 0;
-    border-radius: 0;
-    padding: 0;
-  }
-  :global {
-    .van-cell__value {
-      color: #666;
-      font-weight: 500;
-    }
-  }
-}
+// .cartConfirmBox {
+//   padding: 0;
+//   margin-bottom: 12px;
+//   border-radius: 10px;
+//   overflow: hidden;
+
+//   // border-bottom: 3px solid;
+//   // border-image-source: url('./images/icon-address-border.png');
+//   .cartItem {
+//     margin: 0;
+//     border-radius: 0;
+//     padding: 0;
+//   }
+
+//   :global {
+//     .van-cell__value {
+//       color: #666;
+//       font-weight: 500;
+//     }
+//   }
+// }
 
 .mlr13 {
   margin-right: 13px;
@@ -38,6 +41,7 @@
   box-shadow: none !important;
   padding: 8px 0 !important;
   background: #ffebdd;
+
   :global {
     .van-checkbox__label {
       color: #777;
@@ -52,20 +56,23 @@
   font-size: 14px;
   padding-left: 12px;
   padding-right: 12px;
-  padding-bottom: calc(20px + env(safe-area-inset-bottom));
+  padding-bottom: calc(12px + env(safe-area-inset-bottom));
   box-shadow: none !important;
   background: #fff;
   padding-top: 12px;
+
   .needPrice {
     display: flex;
     align-items: center;
     color: #333333;
+
     span {
       font-size: 22px;
       font-weight: bold;
       color: #ff4e19;
     }
   }
+
   .allPrice {
     color: #aaa;
   }
@@ -83,6 +90,7 @@
   padding: 15px 12px;
   border-radius: 10px;
   overflow: hidden;
+
   .img {
     width: 70px;
     height: 70px;
@@ -101,6 +109,7 @@
 
   .numFont {
     font-family: 'DINA';
+
     .numPrefix {
       font-size: 14px !important;
       margin-right: 2px;
@@ -108,6 +117,7 @@
   }
 
   .goodsContent {
+
     // h2 {
     //   font-size: 16px;
     //   font-weight: 500;
@@ -120,20 +130,24 @@
       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;
     }
+
     h2 {
       font-size: 16px;
       font-weight: 500;
@@ -171,6 +185,7 @@
 
 .codeContainer {
   position: relative;
+
   .codeClose {
     display: inline-block;
     position: absolute;
@@ -206,6 +221,7 @@
       color: #ffffff;
       text-align: center;
     }
+
     .codeQr {
       margin: 23px auto 0;
       width: 221px;
@@ -214,6 +230,7 @@
       background: linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
       border-radius: 11px;
       overflow: hidden;
+
       img {
         width: 100%;
         height: 100%;
@@ -256,11 +273,13 @@
       }
     }
   }
+
   .close {
     position: absolute;
     top: 12px;
     right: 15px;
   }
+
   .codeBottom {
     position: relative;
     margin-top: 32px;
@@ -268,12 +287,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 +304,12 @@
       border-radius: 2px;
     }
   }
+
   .shareImg {
     width: 47px;
     height: 47px;
   }
+
   .shareText {
     padding-top: 6px;
     font-size: 14px;
@@ -303,9 +326,10 @@
   padding: 15px 12px;
   font-size: 16px;
   color: #333;
+
   :global {
     .van-cell__value {
       color: #ff4e19;
     }
   }
-}
+}

+ 7 - 7
src/student/music-group/pre-apply/order-detail.tsx

@@ -1,12 +1,12 @@
 import OHeader from '@/components/o-header'
-import { computed, defineComponent, onMounted, reactive, ref } from 'vue'
+import { computed, defineComponent, onMounted, reactive } from 'vue'
 import styles from './order-detail.module.less'
-import Addres from './component/addres'
+// import Addres from './component/addres'
 import OSticky from '@/components/o-sticky'
-import { Button, Cell, CellGroup, Image, Popup, showConfirmDialog, showToast, Tag } from 'vant'
+import { Button, Cell, CellGroup, Image, Popup, showToast, Tag } from 'vant'
 import Payment from '@/views/adapay/payment'
 import { useRoute, useRouter } from 'vue-router'
-import OQrcode from '@/components/o-qrcode'
+// import OQrcode from '@/components/o-qrcode'
 import request from '@/helpers/request'
 import { state as baseState } from '@/state'
 import { browser, moneyFormat } from '@/helpers/utils'
@@ -61,7 +61,7 @@ export default defineComponent({
       return state.orderInfo.orderType
     })
 
-    const addressDetails = ref<any>({})
+    // const addressDetails = ref<any>({})
 
     const getOrderDetails = async () => {
       try {
@@ -352,7 +352,7 @@ export default defineComponent({
             </div>
           )} */}
 
-          <CellGroup style={{ margin: 0 }}>
+          <CellGroup style={{ margin: 0 }} border={false}>
             {state.goodsInfos &&
               state.goodsInfos.map((goods: any) => (
                 <Cell
@@ -430,7 +430,7 @@ export default defineComponent({
           )}
         </div>
 
-        <OSticky position="bottom">
+        <OSticky position="bottom" background="white-only">
           <div class={styles.protocol}>
             <OProtocol
               v-model:modelValue={state.agreeStatus}

BIN
src/student/music-group/pre-goods-apply/images/header-bg-1.png


BIN
src/student/music-group/pre-goods-apply/images/header-bg.png


BIN
src/student/music-group/pre-goods-apply/images/icon-checkbox-active.png


BIN
src/student/music-group/pre-goods-apply/images/icon-checkbox-ring.png


+ 9 - 3
src/student/music-group/pre-goods-apply/index.module.less

@@ -1,5 +1,5 @@
 .goodsApply {
-  background: linear-gradient(270deg, #FFAC9B 0%, #F7E3AA 100%);
+  background: linear-gradient(to right, #F7E3AA 0%, #FFAC9B 100%);
   min-height: 100vh;
   position: relative;
 }
@@ -8,7 +8,7 @@
   position: absolute;
   top: 0;
   width: 100%;
-  opacity: .3;
+  // opacity: .2;
 }
 
 .goodsHeader {
@@ -43,11 +43,12 @@
 }
 
 .form {
+  position: relative;
   background: rgba(255, 255, 255, 0.5);
   border-radius: 20px 20px 0 0;
   border: 2px solid #FFFFFF;
   border-bottom: 0;
-  padding-bottom: calc(12px + env(safe-area-inset-bottom));
+  padding-bottom: 12px; // calc(12px + env(safe-area-inset-bottom));
 }
 
 .applyCellGroup {
@@ -392,6 +393,11 @@
         vertical-align: bottom;
       }
     }
+
+    .checkboxImg {
+      width: 14px;
+      height: 14px;
+    }
   }
 }
 

+ 41 - 16
src/student/music-group/pre-goods-apply/index.tsx

@@ -7,6 +7,8 @@ import iconHead from './images/icon-head.png'
 import iconBao from './images/icon-bao.png'
 import iconFree from './images/icon-free.png'
 import icon12 from './images/icon-12.png'
+import iconCheckbox from './images/icon-checkbox-ring.png'
+import iconCheckboxActive from './images/icon-checkbox-active.png'
 import {
   Button,
   CellGroup,
@@ -74,7 +76,7 @@ export default defineComponent({
       vipYearInfo: {} as any, // 学练工具
       inspectStatus: true,
       // 是否开启微信登录(测试使用)默认为false
-      testIsWeixin: true,
+      testIsWeixin: false,
       details: [] as any, //
       pattern: /^1(3|4|5|6|7|8|9)\d{9}$/,
       nameReg: /^[\u4E00-\u9FA5]+$/,
@@ -118,7 +120,6 @@ export default defineComponent({
         const subjects: any = state.subjectList.find(
           (item: any) => item.value == detail.registerSubjectId
         )
-        state.instrumentsInspectionDescribe = subjects.instrumentsInspectionDescribe
         forms.username = detail.username
         forms.sex = detail.sex ? 1 : 0
         forms.currentGrade = detail.currentGrade
@@ -136,7 +137,7 @@ export default defineComponent({
           // 更新商品信息
           await registerGoods()
         }
-        forms.groupBuyType = detail.groupBuyType || 'GROUP_BUY'
+        forms.groupBuyType = detail.groupBuyType
       } catch (e) {
         //
         console.log(e)
@@ -683,11 +684,11 @@ export default defineComponent({
                           <div class={styles.priceGroup}>
                             团购价:
                             <p>
-                              <span>¥</span> {state.vipYearInfo.currentPrice}
+                              <span>¥</span> {moneyFormat(state.vipYearInfo.currentPrice)}
                             </p>
                           </div>
                           <div class={styles.priceOrigin}>
-                            原价: ¥{state.vipYearInfo.originalPrice}
+                            原价: ¥{moneyFormat(state.vipYearInfo.originalPrice)}
                           </div>
                         </div>
                       </div>
@@ -705,21 +706,36 @@ export default defineComponent({
                     value: () => (
                       <div class={styles.goodsInfo}>
                         <div class={styles.goodsTitle}>
-                          {state.goodsInfo.goodsName} <img src={iconFree} />
+                          {state.goodsInfo.goodsName}
+                          {state.goodsInfo.currentPrice <= 0 ? <img src={iconFree} /> : ''}
                         </div>
                         <p class={[styles.goodsMemo, 'van-multi-ellipsis--l2']}>
                           {state.goodsInfo.description}
                         </p>
                         <div class={styles.goodsPrice}>
-                          <div class={styles.priceGroup}>
-                            团购价:
-                            <p>
-                              <span>¥</span> {state.goodsInfo.currentPrice}
-                            </p>
-                          </div>
-                          <div class={styles.priceOrigin}>
-                            原价: ¥{state.goodsInfo.originalPrice}
-                          </div>
+                          {state.goodsInfo.currentPrice > 0 ? (
+                            <>
+                              <div class={styles.priceGroup}>
+                                团购价:
+                                <p>
+                                  <span>¥</span> {moneyFormat(state.goodsInfo.currentPrice)}
+                                </p>
+                              </div>
+                              <div class={styles.priceOrigin}>
+                                原价: ¥{moneyFormat(state.goodsInfo.originalPrice)}
+                              </div>
+                            </>
+                          ) : (
+                            <>
+                              <div class={styles.priceGroup}>
+                                原价:
+                                <p>
+                                  <span>¥</span>{' '}
+                                  <del>{moneyFormat(state.goodsInfo.originalPrice)}</del>
+                                </p>
+                              </div>
+                            </>
+                          )}
                         </div>
                       </div>
                     )
@@ -755,7 +771,16 @@ export default defineComponent({
                             onClick={() => {
                               calcPrice()
                             }}
-                          ></Checkbox>
+                          >
+                            {{
+                              icon: (props: any) => (
+                                <img
+                                  class={styles.checkboxImg}
+                                  src={props.checked ? iconCheckboxActive : iconCheckbox}
+                                />
+                              )
+                            }}
+                          </Checkbox>
                         </div>
                       </div>
                     )