修改样式

src/components/m-full-refresh/index.tsx

@@ -39,36 +39,36 @@ export default defineComponent({
         loadingText=" "
         class={styles.pullRefresh}>
         {{
-          loading: () => (
-            <div>
-              {
-                <Image src={loadingJSon.loading} class={styles.loading} />
-                // <Vue3Lottie
-                //   class={styles.animateWrap}
-                //   animationData={AstronautJSON}></Vue3Lottie>
-              }
-            </div>
-          ),
-          pulling: () => (
-            <div>
-              {
-                <Image src={loading} class={styles.loading} />
-                // <Vue3Lottie
-                //   class={styles.animateWrap}
-                //   animationData={AstronautJSON}></Vue3Lottie>
-              }
-            </div>
-          ),
-          loosing: () => (
-            <div>
-              {
-                <Image src={loading} class={styles.loading} />
-                // <Vue3Lottie
-                //   class={styles.animateWrap}
-                //   animationData={AstronautJSON}></Vue3Lottie>
-              }
-            </div>
-          ),
+          // loading: () => (
+          //   <div>
+          //     {
+          //       // <Image src={loadingJSon.loading} class={styles.loading} />
+          //       <Vue3Lottie
+          //         class={styles.animateWrap}
+          //         animationData={AstronautJSON}></Vue3Lottie>
+          //     }
+          //   </div>
+          // ),
+          // pulling: () => (
+          //   <div>
+          //     {
+          //       // <Image src={loading} class={styles.loading} />
+          //       <Vue3Lottie
+          //         class={styles.animateWrap}
+          //         animationData={AstronautJSON}></Vue3Lottie>
+          //     }
+          //   </div>
+          // ),
+          // loosing: () => (
+          //   <div>
+          //     {
+          //       // <Image src={loading} class={styles.loading} />
+          //       <Vue3Lottie
+          //         class={styles.animateWrap}
+          //         animationData={AstronautJSON}></Vue3Lottie>
+          //     }
+          //   </div>
+          // ),
           default: () => <> {slots.default && slots.default()}</>
         }}
       </PullRefresh>

src/components/m-protocol/index.module.less

@@ -2,7 +2,7 @@
 
   font-size: 12px;
   padding: 15px 14px;
-  color: var(--k-gray-4);
+  color: var(--k-gray-1);
 
   &.center {
     display: flex;
@@ -43,7 +43,7 @@
 
     .van-checkbox__label {
       line-height: 15px;
-      color: var(--k-gray-4);
+      color: var(--k-gray-1);
     }
   }
 

src/styles/index.less

@@ -266,4 +266,8 @@ body {
 
 .van-toast {
   z-index: 9999 !important;
+}
+
+.fontBlod {
+  font-weight: bold;
 }

src/views/collection-record/component/list.module.less

@@ -1,22 +1,31 @@
 .downBtn {
-    margin-left: 13px;
-    margin-bottom: 12px;
-    padding: 3px 12px;
-    font-size: 14px;
-    line-height: 20px;
-    color: #333;
-    font-weight: 400;
-    min-width: 103px;
-    :global {
-        .van-button__text {
-            display: flex;
-            align-items: center;
-        }
+  margin-left: 13px;
+  margin-bottom: 12px;
+  padding: 3px 12px;
+  font-size: 14px;
+  line-height: 20px;
+  color: #333;
+  font-weight: 400;
+  min-width: 103px;
+  border: none;
+
+  :global {
+    .van-button__text {
+      display: flex;
+      align-items: center;
     }
+  }
+
+  .downIcon {
+    width: 9px;
+    height: 5px;
+    margin-left: 4px;
+    transition: transform 0.2s ease-in;
 
-    .downIcon {
-        width: 9px;
-        height: 5px;
-        margin-left: 4px;
+    &.upIcon {
+      transition: transform 0.2s ease-in;
+      transform: rotate(180deg);
+      color: #1CACF1;
     }
+  }
 }

src/views/collection-record/component/list.tsx

@@ -59,7 +59,7 @@ export default defineComponent({
       PAYING: '待领取',
       PAID: '领取成功',
       CLOSED: '已关闭',
-      REFUNDED: '退回成功',
+      REFUNDED: '退回成功'
     };
     const statusColors: { [_: string]: string } = {
       WAIT_PAY: 'rgba(64, 196, 203, 1)',
@@ -165,7 +165,42 @@ export default defineComponent({
             round
             onClick={() => (data.dataOpen = true)}>
             <div>{timeName.value}</div>
-            <img class={styles.downIcon} src={icon_arrow} />
+            {/* <img
+              class={[styles.downIcon, data.dataOpen ? styles.upIcon : '']}
+              src={icon_arrow}
+            /> */}
+
+            <svg
+              class={[styles.downIcon, data.dataOpen ? styles.upIcon : '']}
+              width="9px"
+              height="5px"
+              viewBox="0 0 9 5"
+              version="1.1"
+              xmlns="http://www.w3.org/2000/svg">
+              <title>三角形</title>
+              <g
+                id="页面-1"
+                stroke="currentColor"
+                stroke-width="1"
+                fill="currentColor"
+                fill-rule="evenodd">
+                <g
+                  id="领取记录-待领取"
+                  transform="translate(-99.000000, -155.000000)"
+                  fill="currentColor">
+                  <g id="编组-2" transform="translate(13.000000, 144.000000)">
+                    <g
+                      id="筛选目录备份"
+                      transform="translate(12.000000, 3.000000)">
+                      <path
+                        d="M78.8716471,8.41294119 L82.2489659,12.1655176 C82.4336954,12.3707726 82.4170562,12.6869176 82.2118012,12.8716471 C82.1199888,12.9542782 82.0008397,13 81.8773188,13 L75.1226812,13 C74.8465388,13 74.6226812,12.7761424 74.6226812,12.5 C74.6226812,12.3764791 74.668403,12.25733 74.7510341,12.1655176 L78.1283529,8.41294119 C78.3130824,8.20768618 78.6292274,8.19104698 78.8344824,8.37577649 C78.8475136,8.38750459 78.859919,8.39990996 78.8716471,8.41294119 Z"
+                        id="三角形"
+                        transform="translate(78.500000, 10.500000) rotate(-180.000000) translate(-78.500000, -10.500000) "></path>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </svg>
           </Button>
           {data.skelete && new Array(5).fill(1).map(i => <ItemSkelete />)}
 
@@ -190,10 +225,13 @@ export default defineComponent({
             <MEmpty description="暂无记录" />
           )}
         </MFullRefresh>
-        <Popup teleport="body" v-model:show={data.dataOpen} position="bottom">
+        <Popup
+          teleport="body"
+          v-model:show={data.dataOpen}
+          position="bottom"
+          round>
           <DatePicker
             v-model={data.dateTime}
-            title="选择年月"
             columnsType={['year', 'month']}
             minDate={data.minDate}
             maxDate={data.maxDate}
@@ -202,6 +240,7 @@ export default defineComponent({
               console.log(data.dateTime);
               handlStart();
             }}
+            onCancel={() => (data.dataOpen = false)}
           />
         </Popup>
       </>

src/views/collection-record/index.module.less

@@ -1,56 +1,62 @@
 .container {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    display: flex;
-    flex-direction: column;
-    height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
 }
 
 .content {
-    flex: 1;
-    overflow: hidden;
-
-    :global {
-        .van-tabs {
-            height: 100%;
-        }
-
-        .van-tabs__wrap {
-            height: 44px;
-            --van-tab-text-color: #777;
-            .van-tab {
-                z-index: 2;
-            }
-
-            .van-tabs__line {
-                height: 6px;
-                background: linear-gradient(270deg, rgba(119, 255, 239, 0.59) 0%, #42CDFF 100%);
-                bottom: 0.73rem;
-                z-index: 1;
-            }
-        }
-
-        .van-tabs__content {
-            height: calc(100% - 44px);
-            overflow: hidden;
-        }
-        .van-tab__panel{
-            height: 100%;
-            overflow-x: hidden;
-            overflow-y: auto;
-        }
+  flex: 1;
+  overflow: hidden;
+
+  :global {
+    .van-tabs {
+      height: 100%;
+    }
+
+    .van-tabs__wrap {
+      height: 44px;
+      --van-tab-text-color: #777;
+
+      .van-tab {
+        z-index: 2;
+      }
+
+      .van-tabs__line {
+        height: 6px;
+        background: linear-gradient(270deg, rgba(119, 255, 239, 0.59) 0%, #42CDFF 100%);
+        bottom: 0.73rem;
+        z-index: 1;
+        border-radius: 0;
+      }
+    }
+
+    .van-tabs__content {
+      height: calc(100% - 44px);
+      overflow: hidden;
     }
+
+    .van-tab__panel {
+      height: 100%;
+      overflow-x: hidden;
+      overflow-y: auto;
+    }
+  }
 }
-.wrap{
-    padding: 12px 0;
-    :global{
-        .van-list{
-            min-height: 82vh;
-        }
-        .van-empty{
-            height: 70vh;
-        }
+
+.wrap {
+  padding: 12px 0;
+
+  :global {
+    .van-list {
+      min-height: 82vh;
+    }
+
+    .van-empty {
+      height: 70vh;
     }
+  }
 }

src/views/courseware-list/index.module.less

@@ -1,222 +1,276 @@
 .container {
-    position: relative;
-    width: 100vw;
-    height: 100vh;
-    overflow: hidden;
-    background: url('../../common/images/icon_bg.png') no-repeat center center / cover;
-    display: flex;
-    flex-direction: column;
+  position: relative;
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+  background: url('../../common/images/icon_bg.png') no-repeat center center / cover;
+  display: flex;
+  flex-direction: column;
 }
 
 .head {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 19px 23px 8px 41px;
-    transition: opacity .3s ease-in-out;
-
-    .back {
-        img {
-            display: block;
-        }
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 19px 23px 8px 41px;
+  transition: opacity .3s ease-in-out;
+
+  .back {
+    img {
+      display: block;
     }
+  }
 
-    .tabs {
-        :global {
-            .van-tab {
-                color: rgba(255, 255, 255, .9);
-                font-size: 15px;
-                padding: 0 16px;
-
-                &.van-tab--active {
-                    color: #fff;
-                }
-            }
-
-            .van-tabs__nav.van-tabs__nav--line {
-                background: transparent;
-            }
-
-            .van-tabs__line {
-                background: #fff;
-                width: 18px;
-                height: 4px;
-            }
+  .tabs {
+    :global {
+      .van-tab {
+        color: rgba(255, 255, 255, .9);
+        font-size: 15px;
+        padding: 0 16px;
+
+        &.van-tab--active {
+          color: #fff;
         }
+      }
+
+      .van-tabs__nav.van-tabs__nav--line {
+        background: transparent;
+      }
+
+      .van-tabs__line {
+        background: #fff;
+        width: 18px;
+        height: 4px;
+      }
     }
+  }
 }
 
 .downBtn {
-    width: 84px;
-    height: 32px;
-    background: #F8F9FC;
-    border-radius: 16px;
-    border: none;
-    padding: 0;
-    display: flex;
-    justify-content: center;
-    align-items: center;
+  width: 84px;
+  height: 32px;
+  background: #F8F9FC;
+  border-radius: 16px;
+  border: none;
+  padding: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 
-    :global {
-        .van-button__content {
-            width: 100%;
-        }
-
-        .van-button__text {
-            width: 100%;
-            height: 100%;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 13px;
-            color: #333;
-            font-weight: 400;
-        }
+  :global {
+    .van-button__content {
+      width: 100%;
     }
 
-    .icon {
-        width: 8px;
-        height: 5px;
-        margin-left: 4px;
+    .van-button__text {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 13px;
+      color: #333;
+      font-weight: 400;
     }
+  }
+
+  .icon {
+    width: 8px;
+    height: 5px;
+    margin-left: 4px;
+    transition: transform .2s ease;
+  }
+
+  .iconUp {
+    color: var(--van-primary-color);
+    transform: rotate(180deg);
+    transition: transform .2s ease;
+  }
 }
 
 .popover {
-    width: 83px;
-    border: none;
+  width: 83px;
+  border: none;
 
-    :global {
-        .van-popover__action {
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            padding: 0;
-            width: 100%;
-            height: 36px;
-            color: #999;
-            font-size: 13px;
-        }
+  :global {
+    .van-popover__action {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      padding: 0;
+      width: 100%;
+      height: 36px;
+      color: #999;
+      font-size: 13px;
+    }
 
-        .van-popover__content {
-            max-height: 70vh;
-            overflow-x: hidden;
-            overflow-y: auto;
-        }
+    .van-popover__content {
+      max-height: 70vh;
+      overflow-x: hidden;
+      overflow-y: auto;
     }
+  }
 }
 
 
 .content {
-    flex: 1;
-    overflow-y: hidden;
-    overflow-x: auto;
-    display: flex;
-    
-    .wrap {
-        position: relative;
-        display: flex;
-        height: 100%;
-        padding: 20px 63px 0;
-    }
-}
+  flex: 1;
+  overflow-y: hidden;
+  overflow-x: auto;
+  display: flex;
 
-.wrapItem {
+  .wrap {
     position: relative;
-    width: 154px;
     display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding: 0 16px;
-    flex-shrink: 0;
-    z-index: 1;
+    height: 100%;
+    padding: 20px 63px 0;
 
+    &.emtpyWrap {
+      width: 100%;
+    }
+  }
 
-    .name {
-        font-size: 11px;
-        font-weight: 400;
-        color: #FFFFFF;
-        line-height: 16px;
-        text-align: center;
+  :global {
+    .van-empty__description {
+      font-size: 14px;
+      color: #fff;
     }
 
-    .favoriteBtn {
-        position: absolute;
-        top: 135px;
-        right: 20px;
-        z-index: 3;
+    .van-empty__image {
+      width: 200px;
+      height: 200px;
     }
+  }
+}
+
+.wrapItem {
+  position: relative;
+  width: 154px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 0 16px;
+  flex-shrink: 0;
+  z-index: 1;
+
+
+  .name {
+    font-size: 11px;
+    font-weight: 400;
+    color: #FFFFFF;
+    line-height: 16px;
+    text-align: center;
+  }
+
+  .favoriteBtn {
+    position: absolute;
+    top: 135px;
+    right: 20px;
+    z-index: 3;
+  }
+}
+
+.containerImg {
+  position: relative;
+  display: block;
+  width: 100%;
+  height: 170px;
+
+  &::before {
+    content: '';
+    position: absolute;
+    top: 4Px;
+    right: -4Px;
+    width: 4Px;
+    height: calc(100% - 8Px);
+    background-color: #C5C5C5;
+    z-index: 1;
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: 2Px;
+    right: -2Px;
+    width: 4Px;
+    height: calc(100% - 4Px);
+    background-color: #E7E7E7;
+    z-index: 2;
+  }
 }
 
 .cover {
-    position: relative;
-    display: block;
+  position: relative;
+  z-index: 3;
+  display: block;
+  width: 100%;
+  height: 170px;
+  margin-bottom: 15px;
+  background-color: #edeff2;
+  background-image: url('./image/icon_default.svg');
+  background-repeat: no-repeat;
+  background-position: center center;
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
     width: 100%;
-    height: 170px;
-    margin-bottom: 15px;
-    background-color: #edeff2;
-    background-image: url('./image/icon_default.svg');
+    height: 100%;
+    z-index: 2;
     background-repeat: no-repeat;
-    background-position: center center;
-    
-    &::after {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        z-index: 2;
-        background-repeat: no-repeat;
-        background-image: linear-gradient(to right, rgba(0, 0, 0, .2) 0, rgba(255, 255, 255, .08) 0%, transparent .5%), linear-gradient(to right, rgba(0, 0, 0, .1) .3%, rgba(255, 255, 255, .09) 1.1%, transparent 1.3%);
-        background-size: 50% 100%, 50% 100%;
-        background-position: 0% top, 9% top;
-    }
+    background-image: linear-gradient(to right, rgba(0, 0, 0, .2) 0, rgba(255, 255, 255, .08) 0%, transparent .5%), linear-gradient(to right, rgba(0, 0, 0, .1) .3%, rgba(255, 255, 255, .09) 1.1%, transparent 1.3%);
+    background-size: 50% 100%, 50% 100%;
+    background-position: 0% top, 9% top;
+  }
 
-    :global {
-        img {
-            width: 100%;
-            height: 100%;
-            opacity: 0;
-            transition: opacity .3s ease-in-out;
-        }
+  :global {
+    img {
+      width: 100%;
+      height: 100%;
+      opacity: 0;
+      transition: opacity .3s ease-in-out;
     }
+  }
 
-    &.loaded {
-        img {
-            opacity: 1;
-        }
 
+  &.loaded {
+    img {
+      opacity: 1;
     }
+
+  }
 }
 
 .book {
-    position: fixed;
-    top: 50%;
-    left: 50%;
-    width: 50vw;
-    transform: translate(-50%, -50%) scale(0);
-    z-index: 20;
-    background-color: #fff;
-    transition: all .3s ease-in-out;
-    visibility: hidden;
-    pointer-events: none;
-    border-radius: 8px;
-    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
-
-    .bookWrap {
-        height: 60vh;
-        overflow-y: auto;
-
-        ul {
-            list-style: circle;
-            padding: 10px 40px;
-        }
-    }
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  width: 50vw;
+  transform: translate(-50%, -50%) scale(0);
+  z-index: 20;
+  background-color: #fff;
+  transition: all .3s ease-in-out;
+  visibility: hidden;
+  pointer-events: none;
+  border-radius: 8px;
+  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
+
+  .bookWrap {
+    height: 60vh;
+    overflow-y: auto;
 
-    &.show {
-        visibility: visible;
-        pointer-events: auto;
-        transform: translate(-50%, -50%) scale(1);
+    ul {
+      list-style: circle;
+      padding: 10px 40px;
     }
+  }
+
+  &.show {
+    visibility: visible;
+    pointer-events: auto;
+    transform: translate(-50%, -50%) scale(1);
+  }
 }

src/views/courseware-list/index.tsx

@@ -3,7 +3,8 @@ import {
   defineComponent,
   onBeforeMount,
   onMounted,
-  reactive
+  reactive,
+  ref
 } from 'vue';
 import styles from './index.module.less';
 import icon_back from './image/icon_back.svg';
@@ -25,6 +26,7 @@ import { postMessage } from '@/helpers/native-message';
 
 import './jquery.min.1.7.js';
 import './turn.js';
+import MEmpty from '@/components/m-empty';
 
 export const BOOK_DATA = {
   grades: [
@@ -49,6 +51,7 @@ export default defineComponent({
   name: 'courseware-list',
   setup() {
     const router = useRouter();
+    const popoverShow = ref(false);
     // 返回
     const goback = () => {
       postMessage({ api: 'goBack' });
@@ -64,7 +67,8 @@ export default defineComponent({
         return {
           ...item,
           color:
-            forms.currentGradeNum === index ? 'var(--van-primary-color)' : ''
+            forms.currentGradeNum === index ? 'var(--van-primary-color)' : '',
+          className: forms.currentGradeNum === index ? 'fontBlod' : ''
         };
       });
     });
@@ -75,6 +79,7 @@ export default defineComponent({
 
     const data = reactive({
       list: [] as any[],
+      loading: false,
       favoriteList: [] as any[],
       tab: 'all',
       details: [] as any[],
@@ -84,6 +89,7 @@ export default defineComponent({
     });
 
     const getList = async () => {
+      data.loading = true;
       const res = await api_lessonCoursewarePage({
         ...forms,
         currentGradeNum: forms.currentGradeNum ? forms.currentGradeNum : ''
@@ -97,8 +103,10 @@ export default defineComponent({
           return item;
         });
       }
+      data.loading = false;
     };
     const getFavoriteList = async () => {
+      data.loading = true;
       const res = await api_lessonCoursewareFavoriteage({
         clientType: 'STUDENT',
         userId: state.user?.data?.id,
@@ -115,9 +123,10 @@ export default defineComponent({
           return item;
         });
       }
+      data.loading = false;
     };
     const getData = () => {
-      data.list = []
+      data.list = [];
       if (data.tab === 'all') {
         getList();
       }
@@ -200,6 +209,7 @@ export default defineComponent({
             <Tab title="我的收藏" name="favorite"></Tab>
           </Tabs>
           <Popover
+            v-model:show={popoverShow.value}
             class={styles.popover}
             actions={_actions.value}
             onSelect={onSelect}>
@@ -207,7 +217,43 @@ export default defineComponent({
               reference: () => (
                 <Button class={styles.downBtn} round size="small">
                   {BOOK_DATA.grades[forms.currentGradeNum].text}{' '}
-                  <img class={styles.icon} src={icon_arrow} />
+                  {/* <img class={styles.icon} src={icon_arrow} /> */}
+                  <svg
+                    class={[
+                      styles.icon,
+                      popoverShow.value ? styles.iconUp : ''
+                    ]}
+                    width="9px"
+                    height="5px"
+                    viewBox="0 0 9 5"
+                    version="1.1"
+                    xmlns="http://www.w3.org/2000/svg">
+                    <title>三角形</title>
+                    <g
+                      id="演示用"
+                      stroke="none"
+                      stroke-width="1"
+                      fill="currentColor"
+                      fill-rule="evenodd">
+                      <g
+                        id="全部教材-筛选"
+                        transform="translate(-769.000000, -35.000000)"
+                        fill="currentColor">
+                        <g
+                          id="编组-3"
+                          transform="translate(696.000000, 20.000000)">
+                          <g
+                            id="筛选目录备份-2"
+                            transform="translate(13.000000, 7.000000)">
+                            <path
+                              d="M64.8716471,8.41294119 L68.2489659,12.1655176 C68.4336954,12.3707726 68.4170562,12.6869176 68.2118012,12.8716471 C68.1199888,12.9542782 68.0008397,13 67.8773188,13 L61.1226812,13 C60.8465388,13 60.6226812,12.7761424 60.6226812,12.5 C60.6226812,12.3764791 60.668403,12.25733 60.7510341,12.1655176 L64.1283529,8.41294119 C64.3130824,8.20768618 64.6292274,8.19104698 64.8344824,8.37577649 C64.8475136,8.38750459 64.859919,8.39990996 64.8716471,8.41294119 Z"
+                              id="三角形"
+                              transform="translate(64.500000, 10.500000) rotate(-180.000000) translate(-64.500000, -10.500000) "></path>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </svg>
                 </Button>
               )
             }}
@@ -215,7 +261,11 @@ export default defineComponent({
         </div>
 
         <div class={styles.content}>
-          <div class={styles.wrap}>
+          <div
+            class={[
+              styles.wrap,
+              data.list.length <= 0 && !data.loading ? styles.emtpyWrap : ''
+            ]}>
             {data.list.map((item, index) => {
               return (
                 <div
@@ -227,18 +277,20 @@ export default defineComponent({
                   ]}
                   key={item.key}
                   onClick={() => handleOpen(item)}>
-                  <NImage
-                    data-id={item.id}
-                    class={[styles.cover, item.load ? styles.loaded : '']}
-                    objectFit="cover"
-                    src={item.coverImg}
-                    onLoad={() => {
-                      item.load = true;
-                    }}
-                    onError={() => {
-                      item.load = true;
-                    }}
-                  />
+                  <div class={styles.containerImg}>
+                    <NImage
+                      data-id={item.id}
+                      class={[styles.cover, item.load ? styles.loaded : '']}
+                      objectFit="cover"
+                      src={item.coverImg}
+                      onLoad={() => {
+                        item.load = true;
+                      }}
+                      onError={() => {
+                        item.load = true;
+                      }}
+                    />
+                  </div>
                   <div class={styles.name}>{item.name}</div>
                   <div
                     class={styles.favoriteBtn}
@@ -248,11 +300,17 @@ export default defineComponent({
                       item.favoriteFlag = !item.favoriteFlag;
                       dubounce(() => handleFavorite(item));
                     }}>
-                    <TheFavorite isFavorite={data.tab !== 'all' ? true : item.favoriteFlag} />
+                    <TheFavorite
+                      isFavorite={data.tab !== 'all' ? true : item.favoriteFlag}
+                    />
                   </div>
                 </div>
               );
             })}
+
+            {data.list.length <= 0 && !data.loading && (
+              <MEmpty description="暂无数据" />
+            )}
           </div>
         </div>
 

src/views/exercise-record/exercis-detail.module.less

@@ -29,10 +29,15 @@
         margin-right: 15px;
       }
 
+      .headerImg {
+        width: 60px;
+        height: 60px;
+      }
+
       .infoMsg {
         p {
           display: inline-block;
-          width: 110px;
+          width: 90px;
           text-overflow: ellipsis;
           white-space: nowrap;
           overflow: hidden;
@@ -59,14 +64,14 @@
     }
 
     .topInfoRight {
-      width: 50%;
+      // width: 50%;
       display: flex;
       flex-direction: row;
       align-items: center;
       justify-content: flex-end;
 
       .infoDay {
-        margin-right: 30px;
+        margin-right: 20px;
       }
 
       .infoDayMain {
@@ -74,7 +79,7 @@
         color: #333333;
         line-height: 28px;
         margin-bottom: 7px;
-        font-family: 'DINA';
+        font-family: DINAlternate-Bold, DINAlternate;
         font-weight: 600;
         text-align: center;
 

src/views/exercise-record/exercis-detail.tsx

@@ -147,17 +147,16 @@ export default defineComponent({
                         : iconStudent
                     }
                     fit="cover"
-                    width="68px"
-                    height="68px"
+                    class={styles.headerImg}
                   />
                 </div>
                 <div class={styles.infoMsg}>
                   <p>{infoDetail.value.nickname}</p>
                   <div class={styles.tag}>
                     {infoDetail.value.subjectNames
-                      ? infoDetail.value.subjectNames +
-                        infoDetail.value.classGroupName
-                      : '暂无声部'}
+                      ? infoDetail.value.subjectNames
+                      : //  +  infoDetail.value.classGroupName
+                        '暂无声部'}
                   </div>
                 </div>
               </div>
@@ -167,18 +166,19 @@ export default defineComponent({
                     {infoDetail.value.practiceDays
                       ? infoDetail.value.practiceDays
                       : 0}
-                    <span>天</span>
+                    {/* <span>天</span> */}
                   </p>
-                  <p class={styles.infoDaysub}>练习天数</p>
+                  <p class={styles.infoDaysub}>练习天数(天)</p>
                 </div>
                 <div class={styles.infoTime}>
                   <p class={styles.infoDayMain}>
                     {infoDetail.value.practiceTimes
                       ? Math.ceil(infoDetail.value.practiceTimes / 60)
                       : 0}
-                    <span>分钟</span>
+
+                    {/* <span>分钟</span> */}
                   </p>
-                  <p class={styles.infoDaysub}>练习时长</p>
+                  <p class={styles.infoDaysub}>练习时长(分钟)</p>
                 </div>
               </div>
             </div>

src/views/exercise-record/modals/detail-item.module.less

@@ -71,7 +71,7 @@
         color: #333333;
         line-height: 30px;
         margin-bottom: 4px;
-        font-family: 'DINA';
+        font-family: DINAlternate-Bold, DINAlternate;
         font-weight: bold;
 
         span {

src/views/exercise-record/modals/detail-item.tsx

@@ -91,7 +91,7 @@ export default defineComponent({
         </div>
         <div class={styles.itemBottom}>
           <div class={styles.itemBottomDot}>
-            <p class={styles.dotMain} style={{ color: '#F67146' }}>
+            <p class={styles.dotMain} style={{ color: '#ff5a56' }}>
               {props.item.score || 0}
               <span>分</span>{' '}
             </p>

src/views/information/information-detail.module.less

@@ -21,9 +21,10 @@
     font-size: 14px;
     color: #aaaaaa;
     line-height: 20px;
+
     span {
       font-weight: 500;
-      color: #f67146;
+      color: #1CACF1;
       padding-right: 10px;
     }
   }
@@ -40,4 +41,4 @@
       overflow: hidden;
     }
   }
-}
+}

src/views/knowledge-library/error-question-mode/index.module.less

@@ -8,7 +8,7 @@
 }
 
 .unitSwipe {
-  margin-top: 75px;
+  margin-top: 90px;
 
   .questionTitle {
     display: flex;
@@ -118,4 +118,8 @@
 
 .error {
   color: #FF5A56;
+}
+
+.primary {
+  color: #1cacf1;
 }

src/views/knowledge-library/error-question-mode/index.tsx

@@ -359,7 +359,7 @@ export default defineComponent({
         styles.right
       }'>${answerResult.passCount}</span>，答错<span class='${styles.error}'>${
         answerResult.count - answerResult.passCount
-      }</span>，正确率${rate}%~</div>`;
+      }</span>，正确率<span class='${styles.primary}'>${rate}%</span>~</div>`;
     };
 
     // 拦截
@@ -369,8 +369,8 @@ export default defineComponent({
       state.visiableInfo.title = '确认退出吗？';
       state.visiableInfo.showCancelButton = true;
       state.visiableInfo.operationType = 'BACK';
-      state.visiableInfo.cancelButtonText = '取消';
-      state.visiableInfo.confirmButtonText = '确定';
+      state.visiableInfo.cancelButtonText = '退出';
+      state.visiableInfo.confirmButtonText = '继续';
       state.visiableInfo.content = `您已经完成${
         answerResult.passCount + answerResult.noPassCount
       }道题了，继续做题可以巩固所学知识哦～`;

src/views/knowledge-library/examination-mode/index.module.less

@@ -8,7 +8,7 @@
 }
 
 .unitSwipe {
-  margin-top: 75px;
+  margin-top: 90px;
 
   .questionTitle {
     display: flex;
@@ -87,4 +87,8 @@
 
 .error {
   color: #FF5A56;
+}
+
+.minutes {
+  color: #1cacf1;
 }

src/views/knowledge-library/examination-mode/index.tsx

@@ -321,7 +321,7 @@ export default defineComponent({
       state.visiableInfo.operationType = 'BACK';
       state.visiableInfo.type = 'DEFAULT';
       state.visiableInfo.cancelButtonText = '弃考';
-      state.visiableInfo.confirmButtonText = '确定';
+      state.visiableInfo.confirmButtonText = '提交';
       state.visiableInfo.content = `还有题目未完成哦，是否要提前交卷？`;
       eventUnit.emit('unitAudioStop');
     };

src/views/knowledge-library/model/anser-title/index.module.less

@@ -3,25 +3,38 @@
   font-weight: 500;
   color: #333333;
   line-height: 26px;
+
   .unitScore {
     color: #777777;
   }
+
   :global {
     .van-tag {
       vertical-align: middle;
       margin-top: -3px;
+      font-size: 13px;
+      background: #EBF7FF;
+      border-radius: 4px;
+      font-weight: 500;
+      color: #1CACF1;
+      line-height: 20px !important;
+      padding-top: 0;
+
     }
   }
 }
+
 .unitDetail {
   padding-top: 20px;
   padding-bottom: 10px;
   font-size: 14px;
+
   img,
   video {
     width: 100%;
   }
 }
+
 .unitTitleImg {
   width: 100%;
 }
@@ -36,11 +49,13 @@
   font-weight: 500;
   color: #333333;
   line-height: 26px;
+
   .icon {
     font-size: 16px;
     margin-right: 6px;
   }
+
   .rate {
     color: #4991eb;
   }
-}
+}

src/views/knowledge-library/model/anser-title/index.tsx

@@ -59,6 +59,7 @@ export default defineComponent({
           {/* <span class={styles.unitScore}>（{props.score || 0}分）</span> */}
           <Tag
             type="primary"
+            plain
             style={{
               marginLeft: '8px',
               lineHeight: '20px'

src/views/knowledge-library/practice-mode/index.module.less

@@ -8,7 +8,7 @@
 }
 
 .unitSwipe {
-  margin-top: 75px;
+  margin-top: 90px;
 
   .questionTitle {
     display: flex;
@@ -100,4 +100,8 @@
 
 .error {
   color: #FF5A56;
+}
+
+.primary {
+  color: #1cacf1;
 }

src/views/knowledge-library/practice-mode/index.tsx

@@ -278,7 +278,7 @@ export default defineComponent({
       // 60 及格
       // 85 及以上优秀
       state.visiableInfo.show = true;
-      state.visiableInfo.title = '已完成';
+      state.visiableInfo.title = '已完成~';
       state.visiableInfo.showCancelButton = false;
       state.visiableInfo.operationType = 'RESULT';
       state.visiableInfo.confirmButtonText = '确认';
@@ -286,7 +286,7 @@ export default defineComponent({
         styles.right
       }'>${answerResult.passCount}</span>，答错<span class='${styles.error}'>${
         answerResult.count - answerResult.passCount
-      }</span>，正确率${rate}%~</div>`;
+      }</span>，正确率<span class='${styles.primary}'>${rate}%</span>~</div>`;
     };
 
     // 拦截
@@ -297,7 +297,7 @@ export default defineComponent({
       state.visiableInfo.showCancelButton = true;
       state.visiableInfo.operationType = 'BACK';
       state.visiableInfo.cancelButtonText = '取消';
-      state.visiableInfo.confirmButtonText = '确定';
+      state.visiableInfo.confirmButtonText = '继续';
       state.visiableInfo.content = `您已经完成${
         answerResult.passCount + answerResult.noPassCount
       }道题了，继续做题可以巩固所学知识哦～`;

src/views/knowledge-library/wroing-book/ai-exam/index.module.less

@@ -37,6 +37,7 @@
       width: 48px;
       height: 6px;
       background: linear-gradient(270deg, rgba(119, 255, 239, 0.59) 0%, #42CDFF 100%);
+      opacity: 0.5;
       z-index: -1;
     }
   }

src/views/knowledge-library/wroing-book/ai-exam/index.tsx

@@ -129,7 +129,7 @@ export default defineComponent({
             </CheckboxGroup>
             {forms.list.length <= 0 && !forms.loading && (
               <div class={styles.emptyContainer}>
-                <MEmpty />
+                <MEmpty description="暂无知识点" />
               </div>
             )}
           </CellGroup>

src/views/knowledge-library/wroing-book/index.module.less

@@ -34,7 +34,7 @@
       width: 48px;
       height: 6px;
       background: linear-gradient(270deg, rgba(119, 255, 239, 0.59) 0%, #42CDFF 100%);
-      // opacity: 0.5;
+      opacity: 0.5;
       z-index: -1;
     }
   }

src/views/knowledge-library/wroing-book/woring-stat/index.module.less

@@ -35,7 +35,7 @@
       width: 48px;
       height: 6px;
       background: linear-gradient(270deg, rgba(119, 255, 239, 0.59) 0%, #42CDFF 100%);
-      // opacity: 0.5;
+      opacity: 0.5;
       z-index: -1;
     }
   }
@@ -193,6 +193,7 @@
       font-size: 12px;
       color: #777777;
       line-height: 17px;
+
     }
 
     .iconMemo {
@@ -229,6 +230,8 @@
     span {
       margin-left: 10px;
       font-size: 16px;
+      font-family: DINAlternate-Bold, DINAlternate;
+
     }
   }
 

src/views/member-center/index.module.less

@@ -223,13 +223,14 @@
       padding: 0 17px;
       font-size: 16px;
       color: #772A27;
+      border: none;
     }
 
     .priceSection {
       display: flex;
       align-items: center;
       font-size: 16px;
-      color: #1a1a1a;
+      color: #772a27;
 
       .price {
         font-size: 18px;

src/views/school-register/index.module.less

@@ -1,200 +1,212 @@
 .container {
+  background: linear-gradient(179deg, #005CBA 0%, #B7EBFF 100%);
+
+  .containerBg {
+
     min-height: 100vh;
-    background-color: #005CBA;
+    //
     background-image: url('./images/icon_bg.png');
     background-repeat: no-repeat;
     background-size: 100%;
-    padding-top: 50Px;
-    .titleIcon{
-        display: block;
-        max-width: 100%;
-        height: 26Px;
-        margin: 8px auto;
-    }
+    padding-top: 23Px;
+  }
+
+  .titleIcon {
+    display: block;
+    max-width: 100%;
+    height: 26Px;
+    margin: 8px auto 0;
+  }
 }
 
 .title {
-    font-size: 30px;
-    font-family: AlimamaShuHeiTi-Bold, AlimamaShuHeiTi;
-    font-weight: bold;
-    color: #021F67;
-    line-height: 36px;
-    padding: 12px 16px;
-    text-align: center;
+  font-size: 30px;
+  font-family: AlimamaShuHeiTi-Bold, AlimamaShuHeiTi;
+  font-weight: bold;
+  color: #021F67;
+  line-height: 36px;
+  padding: 12px 16px 16px;
+  text-align: center;
 }
 
 .tagWrap {
+  display: flex;
+  justify-content: center;
+
+  .tag {
+    font-size: 16px;
+    font-family: Alibaba-PuHuiTi-M, Alibaba-PuHuiTi;
+    font-weight: normal;
+    color: #FFFFFF;
+    line-height: 22px;
+    background: linear-gradient(90deg, #02BAFF 0%, #007AFE 100%);
+    border-radius: 8px;
+    margin: 0 auto;
     display: flex;
-    justify-content: center;
-
-    .tag {
-        font-size: 16px;
-        font-family: Alibaba-PuHuiTi-M, Alibaba-PuHuiTi;
-        font-weight: normal;
-        color: #FFFFFF;
-        line-height: 22px;
-        background: linear-gradient(90deg, #02BAFF 0%, #007AFE 100%);
-        border-radius: 8px;
-        margin: 0 auto;
-        display: flex;
-        align-items: center;
-        padding: 4px 6px;
-
-        span {
-            font-size: 28Px;
-            color: #C5EEFD;
-        }
+    align-items: center;
+    padding: 4px 6px;
+
+    span {
+      font-size: 28Px;
+      color: #C5EEFD;
     }
+  }
 }
 
 .contentWrap {
-    padding-top: 208px;
-    .content {
-        background: rgba(255, 255, 255, 0.5);
-        border-radius: 20Px 20Px 0 0;
-        border: 2px solid #FFFFFF;
-        border-bottom: none;
-        padding: 12px;
-        padding-bottom: 50Px;
-    }
-
-    .icon {
-        display: block;
-        max-width: 100%;
-        height: 26Px;
-        margin: 8px auto;
-    }
-
-    .group {
-        border-radius: 18Px;
-        overflow: hidden;
-        margin-bottom: 12Px;
-
-        :global {
-            .van-field__control {
-                justify-content: flex-end;
-            }
-
-            .van-field__label {
-                font-size: 16Px;
-                color: #666666;
-            }
-
-            .van-field__error-message {
-                text-align: right;
-            }
-        }
+  padding-top: 208px;
+
+  .content {
+    background: rgba(255, 255, 255, 0.5);
+    border-radius: 20Px 20Px 0 0;
+    border: 2px solid #FFFFFF;
+    border-bottom: none;
+    padding: 12px;
+    padding-bottom: 50Px;
+  }
+
+  .icon {
+    display: block;
+    max-width: 100%;
+    height: 26Px;
+    margin: 16px auto 8px;
+  }
+
+  .group {
+    border-radius: 18Px;
+    overflow: hidden;
+    margin-bottom: 12Px;
+
+    :global {
+      .van-cell {
+        padding: 18px 16px;
+      }
+
+      .van-field__control {
+        justify-content: flex-end;
+      }
+
+      .van-field__label {
+        font-size: 16Px;
+        color: #666666;
+      }
+
+      .van-field__error-message {
+        text-align: right;
+      }
     }
+  }
 
-    .radio {
-        padding: 4px 10px;
-        background: #F5F6FA;
-        border: none;
-        font-size: 14Px;
-        line-height: 22px;
-        color: #626264;
-        font-weight: 400;
-        border-radius: 6px;
-        margin: 0 6px;
-    }
+  .radio {
+    padding: 4px 10px;
+    background: #F5F6FA;
+    border: none;
+    font-size: 14Px;
+    line-height: 22px;
+    color: #626264;
+    font-weight: 400;
+    border-radius: 6px;
+    margin: 0 6px;
+  }
 }
 
 .tips {
-    font-size: 13px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #F64650;
-    line-height: 18px;
-    background: #FFEBEB;
-    border-radius: 8Px;
-    padding: 8Px;
+  font-size: 13px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #F64650;
+  line-height: 18px;
+  background: #FFEBEB;
+  border-radius: 8Px;
+  padding: 8Px;
 }
 
 .submit {
-    margin-top: 18Px;
-    background-color: transparent;
-    height: 50Px;
-    padding: 0;
-    border: none;
-
-    &::before {
-        display: none;
-    }
+  margin-top: 18Px;
+  background-color: transparent;
+  height: 50Px;
+  padding: 0;
+  border: none;
+
+  &::before {
+    display: none;
+  }
 }
 
 .submitIcon {
-    display: block;
-    max-width: 100%;
-    max-height: 50Px;
+  display: block;
+  max-width: 100%;
+  max-height: 50Px;
 }
 
 .successWrap {
+  position: relative;
+  max-width: 76vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  .p1 {
+    position: absolute;
+    max-width: 94vw;
+    transform: translate(12Px, -84Px);
+  }
+
+  .p2 {
+    max-width: 100%;
     position: relative;
-    max-width: 76vw;
+    z-index: 1;
+  }
+
+  .btnWrap {
+    position: relative;
+    top: -2Px;
     display: flex;
     flex-direction: column;
     align-items: center;
-
-    .p1 {
-        position: absolute;
-        max-width: 94vw;
-        transform: translate(12Px, -84Px);
+    background-color: #fff;
+    width: 100%;
+    border-radius: 0 0 16Px 16Px;
+    padding: 0 0 20Px 0;
+
+    .btnTitle {
+      font-size: 17Px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #021F67;
+      line-height: 24Px;
+      padding: 15Px 0;
+      text-align: center;
     }
 
-    .p2 {
-        max-width: 100%;
-        position: relative;
-        z-index: 1;
+    .btnDes {
+      font-size: 15Px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #777777;
+      line-height: 21Px;
+      text-align: center;
+      padding-bottom: 20Px;
     }
 
-    .btnWrap {
-        position: relative;
-        top: -2Px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        background-color: #fff;
-        width: 100%;
-        border-radius: 0 0 16Px 16Px;
-        padding: 0 0 20Px 0;
-
-        .btnTitle {
-            font-size: 17Px;
-            font-family: PingFangSC-Semibold, PingFang SC;
-            font-weight: 600;
-            color: #021F67;
-            line-height: 24Px;
-            padding: 15Px 0;
-            text-align: center;
-        }
-
-        .btnDes {
-            font-size: 15Px;
-            font-family: PingFangSC-Regular, PingFang SC;
-            font-weight: 400;
-            color: #777777;
-            line-height: 21Px;
-            text-align: center;
-            padding-bottom: 20Px;
-        }
-
-        .btn {
-            width: 172Px;
-            height: 40Px;
-            font-size: 16Px;
-            font-family: PingFangSC-Semibold, PingFang SC;
-            font-weight: 600;
-            color: #EEF8FE;
-            line-height: 22Px;
-            background: linear-gradient(135deg, #00B9FF 0%, #007AFF 100%);
-            margin: 0 auto;
-        }
+    .btn {
+      width: 172Px;
+      height: 40Px;
+      font-size: 16Px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #EEF8FE;
+      line-height: 22Px;
+      background: linear-gradient(135deg, #00B9FF 0%, #007AFF 100%);
+      margin: 0 auto;
     }
+  }
 }
-.codeWrap{
-    :global{
-        .van-field__error-message{
-            text-align: left !important;
-        }
+
+.codeWrap {
+  :global {
+    .van-field__error-message {
+      text-align: left !important;
     }
+  }
 }

src/views/school-register/index.tsx

@@ -46,7 +46,11 @@ export default defineComponent({
       cityCode: '', // 所属城市
       provinceCode: '', // 所属省份
       schoolNature: 'PUBLIC' as 'PUBLIC' | 'PRIVATE' | string, // 学校性质
-      schoolType: 'PRIMARY_JUNIOR' as 'PRIMARY' | 'JUNIOR' | 'PRIMARY_JUNIOR' | string, // 学校类型
+      schoolType: 'PRIMARY_JUNIOR' as
+        | 'PRIMARY'
+        | 'JUNIOR'
+        | 'PRIMARY_JUNIOR'
+        | string, // 学校类型
       gradeYear: 'SIX_YEAR_SYSTEM' as
         | 'FIVE_YEAR_SYSTEM'
         | 'SIX_YEAR_SYSTEM'
@@ -138,255 +142,262 @@ export default defineComponent({
     };
     return () => (
       <div class={styles.container}>
-        <img class={styles.titleIcon} src={icon_logo} />
-        <div class={styles.title}>{route.query.name}</div>
-        <div class={styles.tagWrap}>
-          <div class={styles.tag}>
-            <span>·</span> 课堂乐器学校登记 <span>·</span>
+        <div class={styles.containerBg}>
+          <img class={styles.titleIcon} src={icon_logo} />
+          <div class={styles.title}>{route.query.name}</div>
+          <div class={styles.tagWrap}>
+            <div class={styles.tag}>
+              <span>·</span> 课堂乐器学校登记 <span>·</span>
+            </div>
           </div>
-        </div>
 
-        <div class={styles.contentWrap}>
-          <div class={styles.content}>
-            <Form onSubmit={() => handleSubmit()}>
-              <CellGroup class={styles.group}>
-                <img src={icon_school} class={styles.icon} />
-                <Field
-                  border
-                  name="name"
-                  label="学校全称"
-                  rows="1"
-                  autosize
-                  type="textarea"
-                  placeholder="请输入学校全称"
-                  inputAlign="right"
-                  v-model={forms.name}
-                  maxlength={20}
-                  rules={[{ required: true, message: '请输入学校全称' }]}
-                />
-                <Field
-                  isLink
-                  border
-                  label="所属城市"
-                  placeholder="请选择"
-                  readonly
-                  inputAlign="right"
-                  v-model={data.cityName}
-                  onClick={() => (data.showArea = true)}
-                  rules={[{ required: true, message: '请选择' }]}></Field>
-                <Field center border name="schoolNature" label="办学性质">
-                  {{
-                    input: () => (
-                      <>
-                        {formOptions.nature.map(item => {
-                          return (
-                            <Button
-                              class={styles.radio}
-                              size="small"
-                              color={
-                                item.value === forms.schoolNature
-                                  ? '#198CFE'
-                                  : ''
-                              }
-                              onClick={() => (forms.schoolNature = item.value)}>
-                              {item.label}
-                            </Button>
-                          );
-                        })}
-                      </>
-                    )
-                  }}
-                </Field>
+          <div class={styles.contentWrap}>
+            <div class={styles.content}>
+              <Form onSubmit={() => handleSubmit()}>
+                <CellGroup class={styles.group}>
+                  <img src={icon_school} class={styles.icon} />
+                  <Field
+                    border
+                    name="name"
+                    label="学校全称"
+                    rows="1"
+                    autosize
+                    // type="textarea"
+                    placeholder="请输入学校全称"
+                    inputAlign="right"
+                    v-model={forms.name}
+                    autocomplete="off"
+                    maxlength={20}
+                    rules={[{ required: true, message: '请输入学校全称' }]}
+                  />
+                  <Field
+                    isLink
+                    border
+                    label="所属城市"
+                    placeholder="请选择"
+                    readonly
+                    inputAlign="right"
+                    v-model={data.cityName}
+                    onClick={() => (data.showArea = true)}
+                    rules={[{ required: true, message: '请选择' }]}></Field>
+                  <Field center border name="schoolNature" label="办学性质">
+                    {{
+                      input: () => (
+                        <>
+                          {formOptions.nature.map(item => {
+                            return (
+                              <Button
+                                class={styles.radio}
+                                size="small"
+                                color={
+                                  item.value === forms.schoolNature
+                                    ? '#198CFE'
+                                    : ''
+                                }
+                                onClick={() =>
+                                  (forms.schoolNature = item.value)
+                                }>
+                                {item.label}
+                              </Button>
+                            );
+                          })}
+                        </>
+                      )
+                    }}
+                  </Field>
 
-                <Field center border label="学年制">
-                  {{
-                    input: () => (
-                      <>
-                        {formOptions.grades.map(item => {
-                          return (
-                            <Button
-                              class={styles.radio}
-                              size="small"
-                              color={
-                                item.value === forms.gradeYear ? '#198CFE' : ''
-                              }
-                              onClick={() => (forms.gradeYear = item.value)}>
-                              {item.label}
-                            </Button>
-                          );
-                        })}
-                      </>
-                    )
-                  }}
-                </Field>
-              </CellGroup>
+                  <Field center border label="学年制">
+                    {{
+                      input: () => (
+                        <>
+                          {formOptions.grades.map(item => {
+                            return (
+                              <Button
+                                class={styles.radio}
+                                size="small"
+                                color={
+                                  item.value === forms.gradeYear
+                                    ? '#198CFE'
+                                    : ''
+                                }
+                                onClick={() => (forms.gradeYear = item.value)}>
+                                {item.label}
+                              </Button>
+                            );
+                          })}
+                        </>
+                      )
+                    }}
+                  </Field>
+                </CellGroup>
 
-              <CellGroup class={styles.group}>
-                <img src={icon_person} class={styles.icon} />
-                <Field
-                  border
-                  name="emergencyContact"
-                  label="校长姓名"
-                  placeholder="请输入校长姓名"
-                  inputAlign="right"
-                  maxlength={6}
-                  v-model={forms.emergencyContact}
-                  rules={[{ required: true, message: '请输入校长姓名' }]}
-                />
-                <Field
-                  border
-                  name="emergencyContactPhone"
-                  label="校长联系方式"
-                  maxlength={11}
-                  placeholder="请输入校长手机号码"
-                  inputAlign="right"
-                  v-model={forms.emergencyContactPhone}
-                  rules={[
-                    { required: true, message: '请输入校长手机号码' },
-                    {
-                      pattern: /^1[3456789]\d{9}$/,
-                      message: '请输入正确的手机号码'
-                    }
-                  ]}
-                />
-                <Field
-                  border
-                  name="educationalAdministrationUsername"
-                  label="负责人姓名"
-                  placeholder="请输入负责人姓名"
-                  inputAlign="right"
-                  maxlength={6}
-                  v-model={forms.educationalAdministrationUsername}
-                  rules={[{ required: true, message: '请输入负责人姓名' }]}
-                />
-                <Field
-                  border
-                  name="educationalAdministrationPhone"
-                  label="负责人联系方式"
-                  labelWidth="40%"
-                  inputAlign="right"
-                  placeholder="请输入负责人手机号码"
-                  maxlength={11}
-                  v-model={forms.educationalAdministrationPhone}
-                  rules={[
-                    { required: true, message: '请输入负责人手机号码' },
-                    {
-                      pattern: /^1[3456789]\d{9}$/,
-                      message: '请输入正确的手机号码'
-                    }
-                  ]}
-                />
-                <Field center border label="性别">
-                  {{
-                    input: () => (
-                      <>
-                        {formOptions.genaral.map(item => {
-                          return (
-                            <Button
-                              class={styles.radio}
-                              size="small"
-                              color={
-                                item.value === forms.genaral ? '#198CFE' : ''
-                              }
-                              onClick={() => (forms.genaral = item.value)}>
-                              {item.label}
-                            </Button>
-                          );
-                        })}
-                      </>
-                    )
-                  }}
-                </Field>
-                <Field
-                  class={styles.codeWrap}
-                  border
-                  name="code"
-                  label="验证码"
-                  placeholder="请输入验证码"
-                  v-model={forms.code}
-                  maxlength={6}
-                  rules={[{ required: true, message: '请输入验证码' }]}>
-                  {{
-                    button: () => (
-                      <Button
-                        size="small"
-                        type="primary"
-                        color="#198CFE"
-                        onClick={() => {
-                          if (!forms.educationalAdministrationPhone) {
-                            showToast('请输入负责人手机号码');
-                            return;
-                          }
-                          if (
-                            !/^1[3456789]\d{9}$/.test(
-                              forms.educationalAdministrationPhone
-                            )
-                          ) {
-                            showToast('手机号码格式不正确');
-                            return;
-                          }
-                          data.imgCodeStatus = true;
-                        }}>
-                        {data.sendMsg}
-                      </Button>
-                    )
-                  }}
-                </Field>
-                <div style={{ padding: '10px 16px' }}>
-                  <div class={styles.tips}>
-                    负责人即为该学校酷乐秀课堂乐器老师端管理员，手机号即为酷乐秀课堂乐器老师端账号，默认密码为：ktyq+手机号后四位
+                <CellGroup class={styles.group}>
+                  <img src={icon_person} class={styles.icon} />
+                  <Field
+                    border
+                    name="emergencyContact"
+                    label="校长姓名"
+                    placeholder="请输入校长姓名"
+                    inputAlign="right"
+                    maxlength={6}
+                    v-model={forms.emergencyContact}
+                    rules={[{ required: true, message: '请输入校长姓名' }]}
+                  />
+                  <Field
+                    border
+                    name="emergencyContactPhone"
+                    label="校长联系方式"
+                    maxlength={11}
+                    placeholder="请输入校长手机号码"
+                    inputAlign="right"
+                    v-model={forms.emergencyContactPhone}
+                    rules={[
+                      { required: true, message: '请输入校长手机号码' },
+                      {
+                        pattern: /^1[3456789]\d{9}$/,
+                        message: '请输入正确的手机号码'
+                      }
+                    ]}
+                  />
+                  <Field
+                    border
+                    name="educationalAdministrationUsername"
+                    label="负责人姓名"
+                    placeholder="请输入负责人姓名"
+                    inputAlign="right"
+                    maxlength={6}
+                    v-model={forms.educationalAdministrationUsername}
+                    rules={[{ required: true, message: '请输入负责人姓名' }]}
+                  />
+                  <Field
+                    border
+                    name="educationalAdministrationPhone"
+                    label="负责人联系方式"
+                    labelWidth="40%"
+                    inputAlign="right"
+                    placeholder="请输入负责人手机号码"
+                    maxlength={11}
+                    v-model={forms.educationalAdministrationPhone}
+                    rules={[
+                      { required: true, message: '请输入负责人手机号码' },
+                      {
+                        pattern: /^1[3456789]\d{9}$/,
+                        message: '请输入正确的手机号码'
+                      }
+                    ]}
+                  />
+                  <Field center border label="性别">
+                    {{
+                      input: () => (
+                        <>
+                          {formOptions.genaral.map(item => {
+                            return (
+                              <Button
+                                class={styles.radio}
+                                size="small"
+                                color={
+                                  item.value === forms.genaral ? '#198CFE' : ''
+                                }
+                                onClick={() => (forms.genaral = item.value)}>
+                                {item.label}
+                              </Button>
+                            );
+                          })}
+                        </>
+                      )
+                    }}
+                  </Field>
+                  <Field
+                    class={styles.codeWrap}
+                    border
+                    name="code"
+                    label="验证码"
+                    placeholder="请输入验证码"
+                    v-model={forms.code}
+                    maxlength={6}
+                    rules={[{ required: true, message: '请输入验证码' }]}>
+                    {{
+                      button: () => (
+                        <Button
+                          size="small"
+                          type="primary"
+                          color="#198CFE"
+                          onClick={() => {
+                            if (!forms.educationalAdministrationPhone) {
+                              showToast('请输入负责人手机号码');
+                              return;
+                            }
+                            if (
+                              !/^1[3456789]\d{9}$/.test(
+                                forms.educationalAdministrationPhone
+                              )
+                            ) {
+                              showToast('手机号码格式不正确');
+                              return;
+                            }
+                            data.imgCodeStatus = true;
+                          }}>
+                          {data.sendMsg}
+                        </Button>
+                      )
+                    }}
+                  </Field>
+                  <div style={{ padding: '10px 16px' }}>
+                    <div class={styles.tips}>
+                      负责人即为该学校酷乐秀课堂乐器老师端管理员，手机号即为酷乐秀课堂乐器老师端账号，默认密码为：ktyq+手机号后四位
+                    </div>
                   </div>
-                </div>
-              </CellGroup>
+                </CellGroup>
 
-              <Button class={styles.submit} round block native-type="submit">
-                <img class={styles.submitIcon} src={icon_submit} />
-              </Button>
-            </Form>
-            <Popup v-model:show={data.showArea} position="bottom">
-              <Area
-                areaList={data.areaList}
-                onCancel={() => (data.showArea = false)}
-                onConfirm={({ selectedOptions }) => {
-                  forms.provinceCode = selectedOptions[0].value;
-                  forms.cityCode = selectedOptions[1].value;
-                  forms.regionCode = selectedOptions[2].value;
-                  data.cityName = selectedOptions
-                    .map((item: any) => item.text)
-                    .join('-');
-                  data.showArea = false;
-                }}
-              />
-            </Popup>
+                <Button class={styles.submit} round block native-type="submit">
+                  <img class={styles.submitIcon} src={icon_submit} />
+                </Button>
+              </Form>
+              <Popup v-model:show={data.showArea} position="bottom">
+                <Area
+                  areaList={data.areaList}
+                  onCancel={() => (data.showArea = false)}
+                  onConfirm={({ selectedOptions }) => {
+                    forms.provinceCode = selectedOptions[0].value;
+                    forms.cityCode = selectedOptions[1].value;
+                    forms.regionCode = selectedOptions[2].value;
+                    data.cityName = selectedOptions
+                      .map((item: any) => item.text)
+                      .join('-');
+                    data.showArea = false;
+                  }}
+                />
+              </Popup>
 
-            <Popup
-              class="popup-custom van-scale"
-              transition="van-scale"
-              closeOnClickOverlay={false}
-              v-model:show={data.success}>
-              <div class={styles.successWrap}>
-                <img class={styles.p1} src={icon_p1} />
-                <img class={styles.p2} src={icon_p2} />
-                <div class={styles.btnWrap}>
-                  <div class={styles.btnTitle}>您已成功登记</div>
-                  <div class={styles.btnDes}>欢迎您使用酷乐秀课堂乐器～</div>
-                  <Button class={styles.btn} type="primary" round>
-                    我知道了
-                  </Button>
+              <Popup
+                class="popup-custom van-scale"
+                transition="van-scale"
+                closeOnClickOverlay={false}
+                v-model:show={data.success}>
+                <div class={styles.successWrap}>
+                  <img class={styles.p1} src={icon_p1} />
+                  <img class={styles.p2} src={icon_p2} />
+                  <div class={styles.btnWrap}>
+                    <div class={styles.btnTitle}>您已成功登记</div>
+                    <div class={styles.btnDes}>欢迎您使用酷乐秀课堂乐器～</div>
+                    <Button class={styles.btn} type="primary" round>
+                      我知道了
+                    </Button>
+                  </div>
                 </div>
-              </div>
-            </Popup>
+              </Popup>
 
-            {data.imgCodeStatus ? (
-              <MImgCode
-                v-model:value={data.imgCodeStatus}
-                phone={forms.educationalAdministrationPhone}
-                onClose={() => {
-                  data.imgCodeStatus = false;
-                }}
-                onSendCode={onSendSms}
-              />
-            ) : null}
+              {data.imgCodeStatus ? (
+                <MImgCode
+                  v-model:value={data.imgCodeStatus}
+                  phone={forms.educationalAdministrationPhone}
+                  onClose={() => {
+                    data.imgCodeStatus = false;
+                  }}
+                  onSendCode={onSendSms}
+                />
+              ) : null}
+            </div>
           </div>
         </div>
       </div>

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

@@ -105,6 +105,7 @@
   .brandName {
     margin-left: 4px;
     font-size: 12px;
+    font-weight: 400;
     color: #BE7332;
     line-height: 17px;
     height: 18px;
@@ -229,6 +230,7 @@
       font-weight: bold;
       color: #8C6142;
       line-height: 16px;
+      opacity: 0.5;
     }
   }
 }
@@ -264,7 +266,7 @@
   padding: 0 7px;
   height: 106px;
   background: #FFFFFF;
-  box-shadow: 0px 1px 6px 0px #F0D8C8;
+  // box-shadow: 0px 1px 6px 0px #F0D8C8;
   border-radius: 18px;
   display: flex;
   align-items: center;
@@ -279,6 +281,7 @@
       font-size: 16px;
       color: #333333;
       line-height: 22px;
+      font-weight: 400;
 
       span {
         color: #FF5A56;
@@ -373,6 +376,7 @@
     font-weight: bold;
     color: #8C6142;
     line-height: 16px;
+    opacity: 0.5;
   }
 
   :global {
@@ -382,9 +386,9 @@
       width: 148px;
       background: #FF8057 linear-gradient(121deg, #FFD892 0%, #FFCB75 100%);
       border-radius: 12px;
-      font-size: 18px;
-      font-weight: 600;
+      font-size: 16px;
       color: #5B2C03;
+      font-weight: 400;
       border: 0;
     }
   }

src/views/student-register/index.tsx

@@ -267,7 +267,7 @@ export default defineComponent({
 
                         <p class={[styles.model]}>{item.description}</p>
 
-                        <div class={styles.sbtnGroup}>
+                        {/* <div class={styles.sbtnGroup}>
                           <span
                             class={styles.btnDetail}
                             onClick={(e: MouseEvent) => {
@@ -284,7 +284,7 @@ export default defineComponent({
                             }}>
                             介绍视频
                           </span>
-                        </div>
+                        </div> */}
                       </div>
 
                       <i
@@ -357,63 +357,61 @@ export default defineComponent({
                   </div>
                 </div>
               ) : (
-                studentRegisterStore.getGoods.map(
-                  (goods: any, index: number) => (
-                    <CellGroup class={styles.goodsSection}>
-                      <Cell border={false} class={styles.goodsCell}>
-                        {{
-                          icon: () => (
-                            <Image class={styles.img} src={goods.pic} />
-                          ),
-                          title: () => (
-                            <div class={styles.section}>
-                              <div class={styles.sectionContent}>
-                                <h2>
-                                  {goods.name}
-                                  <Tag class={styles.brandName}>
-                                    {goods.brandName}
-                                  </Tag>
-                                </h2>
-                                <p class={[styles.model]}>
-                                  规格：{goods.spDataJson}
-                                </p>
-                                <p class={[styles.model]}>{goods.productSn}</p>
+                studentRegisterStore.getGoods.map((goods: any) => (
+                  <CellGroup class={styles.goodsSection}>
+                    <Cell border={false} class={styles.goodsCell}>
+                      {{
+                        icon: () => (
+                          <Image class={styles.img} src={goods.pic} />
+                        ),
+                        title: () => (
+                          <div class={styles.section}>
+                            <div class={styles.sectionContent}>
+                              <h2>
+                                {goods.name}
+                                <Tag class={styles.brandName}>
+                                  {goods.brandName}
+                                </Tag>
+                              </h2>
+                              <p class={[styles.model]}>
+                                规格：{goods.spDataJson}
+                              </p>
+                              <p class={[styles.model]}>{goods.productSn}</p>
 
-                                <Stepper
-                                  min={1}
-                                  max={99}
-                                  v-model={goods.quantity}
-                                />
-                              </div>
-
-                              <i
-                                class={styles.delete}
-                                onClick={() => onGoodsRemove(goods)}></i>
+                              <Stepper
+                                min={1}
+                                max={99}
+                                v-model={goods.quantity}
+                              />
                             </div>
-                          )
-                        }}
-                      </Cell>
-                      <Cell border={false} class={styles.priceCell}>
-                        {{
-                          title: () => (
-                            <div class={styles.sPriceGroup}>
-                              <div class={styles.tg}>
-                                团购价：
-                                <span>
-                                  <i>¥ </i>
-                                  {moneyFormat(goods.price)}
-                                </span>
-                              </div>
-                              {goods.price < goods.originalPrice && (
-                                <del>¥{moneyFormat(goods.originalPrice)}</del>
-                              )}
+
+                            <i
+                              class={styles.delete}
+                              onClick={() => onGoodsRemove(goods)}></i>
+                          </div>
+                        )
+                      }}
+                    </Cell>
+                    <Cell border={false} class={styles.priceCell}>
+                      {{
+                        title: () => (
+                          <div class={styles.sPriceGroup}>
+                            <div class={styles.tg}>
+                              团购价：
+                              <span>
+                                <i>¥ </i>
+                                {moneyFormat(goods.price)}
+                              </span>
                             </div>
-                          )
-                        }}
-                      </Cell>
-                    </CellGroup>
-                  )
-                )
+                            {goods.price < goods.originalPrice && (
+                              <del>¥{moneyFormat(goods.originalPrice)}</del>
+                            )}
+                          </div>
+                        )
+                      }}
+                    </Cell>
+                  </CellGroup>
+                ))
               )}
             </div>
             {studentRegisterStore.getGoods &&

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

@@ -40,7 +40,7 @@
 .protocol {
   box-shadow: none !important;
   padding: 8px 0 !important;
-  background: #ffebdd;
+  background: #fff4e9;
 
   :global {
     .van-checkbox__label {
@@ -70,7 +70,7 @@
     span {
       font-size: 22px;
       font-weight: bold;
-      color: #ff4e19;
+      color: #fc1a19;
 
       i {
         font-style: normal;

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

@@ -421,13 +421,13 @@ export default defineComponent({
         </div>
 
         <OSticky position="bottom">
-          <div class={styles.protocol}>
+          {/* <div class={styles.protocol}>
             <OProtocol
               v-model:modelValue={state.agreeStatus}
               showHeader={state.showHeader}
               style={{ paddingTop: 0, paddingBottom: 0 }}
             />
-          </div>
+          </div> */}
           <div class={styles.paymentContainer}>
             <div class={styles.payemntPrice}>
               <p class={styles.needPrice}>

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

@@ -47,7 +47,7 @@
   }
 
   .codeText {
-    color: #DE801E;
+    color: #333;
     font-size: 14px;
     font-weight: 600;
 
@@ -58,7 +58,7 @@
 }
 
 .submitBtn {
-  margin: 0px 12px 22px;
+  margin: 16px 12px 22px;
   width: calc(100% - 24px);
   height: 46px;
   border-radius: 12px;

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

@@ -300,11 +300,11 @@ export default defineComponent({
             onClick={() => (forms.classStatus = true)}
           />
         </Form>
-        <MProtocol
+        {/* <MProtocol
           center
           v-model:modelValue={forms.modelValue}
           prototcolType="REGISTER"
-        />
+        /> */}
 
         <Button
           type="primary"

src/views/student-register/shop-mall/modal/add-goods-cart/index.module.less

@@ -5,17 +5,40 @@
   --van-stepper-button-round-theme-color: var(--van-primary);
 
   :global {
+    // .van-stepper__input {
+    //   background: #f7f8f9 !important;
+    //   border-radius: 6px;
+    //   margin: 0 8px;
+    // }
+
+    // .van-stepper__minus--disabled {
+    //   opacity: 0.6 !important;
+    //   color: #333 !important;
+    //   background: #f7f8f9 !important;
+    //   border-color: #f7f8f9 !important;
+    // }
+
+    .van-stepper__minus,
+    .van-stepper__plus,
     .van-stepper__input {
-      background: #f7f8f9 !important;
-      border-radius: 6px;
-      margin: 0 8px;
+      background-color: #FFF4E7;
+    }
+
+    .van-stepper__minus,
+    .van-stepper__plus {
+      color: #BF7434;
+    }
+
+    .van-stepper__input {
+      color: #8C6142;
+    }
+
+    .van-stepper__minus {
+      border-radius: 100px 0px 0px 100px;
     }
 
-    .van-stepper__minus--disabled {
-      opacity: 0.6 !important;
-      color: #333 !important;
-      background: #f7f8f9 !important;
-      border-color: #f7f8f9 !important;
+    .van-stepper__plus {
+      border-radius: 0px 100px 100px 0px;
     }
   }
 

src/views/student-register/shop-mall/modal/add-goods-cart/index.tsx

@@ -233,9 +233,9 @@ export default defineComponent({
           center>
           <Stepper
             v-model={this.total}
-            inputWidth="50px"
-            theme="round"
-            buttonSize="24px"
+            // inputWidth="50px"
+            // theme="round"
+            // buttonSize="24px"
             max={this.selectItem.stock > 200 ? 200 : this.selectItem.stock}
             min={1}
             disabled={this.selectItem.stock <= 0}

src/views/teaher-register/index.module.less

@@ -1,234 +1,244 @@
 .container {
-    max-width: 750Px;
-    min-height: 100vh;
-    background-color: rgba(96,166,241,1);
-    background-image: url('./images/icon_bg.png');
-    background-repeat: no-repeat;
-    background-size: 100%;
-    padding-top: 50Px;
-    margin: 0 auto;
-
-    .titleIcon {
-        display: block;
-        max-width: 100%;
-        height: 26Px;
-        margin: 8px auto;
-    }
+  max-width: 750Px;
+  min-height: 100vh;
+  background-color: rgba(96, 166, 241, 1);
+  background-image: url('./images/icon_bg.png');
+  background-repeat: no-repeat;
+  background-size: 100%;
+  padding-top: 30Px;
+  margin: 0 auto;
+
+  .titleIcon {
+    display: block;
+    max-width: 100%;
+    height: 26Px;
+    margin: 8px auto;
+  }
 }
 
 .schoolName {
-    font-size: 15px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #FFFFFF;
-    line-height: 21px;
-    text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 15px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #FFFFFF;
+  line-height: 21px;
+  text-align: center;
 }
 
 
 .teacherIcon {
-    position: relative;
-    width: 265Px;
-    height: 277Px;
-    margin: 0 auto;
-
-    &>img {
-        display: block;
-        width: 100%;
-        height: 100%;
-    }
+  position: relative;
+  width: 265Px;
+  height: 277Px;
+  margin: 0 auto;
+
+  &>img {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
 }
 
 .toggleBtn {
-    position: absolute;
-    left: 50%;
-    bottom: 0;
-    width: 96Px;
-    height: 34Px;
-    background: url('./images/icon_rect.png') no-repeat center center / 100% 100%;
-    transform: translate(-50%, 0);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 16Px;
-    font-weight: 600;
-    color: #131415;
-
-    &>img {
-        width: 16Px;
-        height: 16Px;
-        margin-left: 8Px;
-    }
+  position: absolute;
+  left: 50%;
+  bottom: 0;
+  width: 96Px;
+  height: 34Px;
+  background: url('./images/icon_rect.png') no-repeat center center / 100% 100%;
+  transform: translate(-50%, 0);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 16Px;
+  font-weight: 600;
+  color: #131415;
+
+  &>img {
+    width: 16Px;
+    height: 16Px;
+    margin-left: 8Px;
+  }
 }
 
 .contentWrap {
-    padding: 16Px;
-
-    .content {
-        background: rgba(255, 255, 255, 0.5);
-        border-radius: 20Px;
-        border: 2px solid #FFFFFF;
-        border-bottom: none;
-        padding: 6Px;
-    }
+  padding: 16Px 16Px 32Px;
 
-    .group {
-        border-radius: 14Px;
-        overflow: hidden;
-        padding: 14Px 0 20Px;
+  .content {
+    background: rgba(255, 255, 255, 0.5);
+    border-radius: 20Px;
+    border: 2px solid #FFFFFF;
+    border-bottom: none;
+    padding: 6Px;
+  }
 
-        :global {
-            .van-field__body {
-                background: #F1F7FC;
-                border-radius: 20Px;
-                height: 40Px;
-                padding: 0 15Px;
+  .group {
+    border-radius: 14Px;
+    overflow: hidden;
+    padding: 14Px 0 20Px;
 
-            }
+    :global {
+      .van-field__body {
+        background: #F1F7FC;
+        border-radius: 20Px;
+        height: 40Px;
+        padding: 0 15Px;
 
-            .van-field__control {
-                font-size: 14Px;
-            }
+      }
 
-            input::-webkit-input-placeholder {
-                color: #94ACC8;
-            }
+      .van-field__control {
+        font-size: 14px;
+      }
 
-            .van-cell {
-                padding: 8Px 15Px;
-            }
-        }
-    }
+      input::-webkit-input-placeholder {
+        color: #94ACC8;
+      }
 
-    .inputCode {
-        :global {
-            .van-field__control {
-                border-right: 1.5Px solid #1677FF;
-                height: 16Px;
-            }
-
-            .van-field__button {
-                height: 100%;
-            }
-            .van-button--disabled{
-                color: #94ACC8;
-            }
-        }
+      .van-cell {
+        padding: 8Px 15Px;
+      }
     }
+  }
 
-    .sendBtn {
-        border: none;
-        background-color: transparent;
-        width: 100Px;
-        color: #1677FF;
-        font-size: 14Px;
-        padding: 0;
+  .inputCode {
+    :global {
+      .van-field__control {
+        border-right: 1.5px solid #1677FF;
+        line-height: 16px;
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+
+      .van-field__button {
         height: 100%;
-        &::before{
-            display: none;
-        }
+      }
+
+      .van-button--disabled {
+        color: #94ACC8;
+      }
     }
+  }
+
+  .sendBtn {
+    border: none;
+    background-color: transparent;
+    width: 100Px;
+    color: #1677FF;
+    font-size: 14Px;
+    padding: 0;
+    height: 100%;
+
+    &::before {
+      display: none;
+    }
+  }
 
 }
 
 .tips {
-    font-size: 12Px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #FD5160;
-    line-height: 17Px;
-    padding: 6Px 0;
-    text-align: center;
+  font-size: 12Px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #FD5160;
+  line-height: 17Px;
+  padding: 6Px 0;
+  text-align: center;
 }
-.xieyiWrap{
-    display: flex;
-    justify-content: center;
-    padding: 6Px 0;
-    :global{
-        .van-checkbox__icon{
-            transform: scale(0.7);
-        }
+
+.xieyiWrap {
+  display: flex;
+  justify-content: center;
+  padding: 6Px 0;
+
+  :global {
+    .van-checkbox__icon {
+      transform: scale(0.7);
     }
+  }
 }
-.xieyi{
-    color: #94ACC8;
-    font-size: 12Px;
+
+.xieyi {
+  color: #94ACC8;
+  font-size: 12Px;
 }
 
 .submit {
-    padding: 20Px 15Px 0;
-
-    :global {
-        .van-button {
-            background: linear-gradient(135deg, #00B9FF 0%, #007AFF 100%);
-            height: 44Px;
-            color: #fff;
-            padding: 0;
-            border: none;
-        }
+  padding: 20Px 15Px 0;
+
+  :global {
+    .van-button {
+      background: linear-gradient(135deg, #00B9FF 0%, #007AFF 100%);
+      height: 44Px;
+      color: #fff;
+      padding: 0;
+      border: none;
     }
+  }
 }
 
 .successWrap {
+  position: relative;
+  max-width: 76vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  .p1 {
+    position: absolute;
+    max-width: 94vw;
+    transform: translate(12Px, -84Px);
+  }
+
+  .p2 {
+    max-width: 100%;
     position: relative;
-    max-width: 76vw;
+    z-index: 1;
+  }
+
+  .btnWrap {
+    position: relative;
+    top: -2Px;
     display: flex;
     flex-direction: column;
     align-items: center;
-
-    .p1 {
-        position: absolute;
-        max-width: 94vw;
-        transform: translate(12Px, -84Px);
+    background-color: #fff;
+    width: 100%;
+    border-radius: 0 0 16Px 16Px;
+    padding: 0 0 20Px 0;
+
+    .btnTitle {
+      font-size: 17Px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #021F67;
+      line-height: 24Px;
+      padding: 15Px 0;
+      text-align: center;
     }
 
-    .p2 {
-        max-width: 100%;
-        position: relative;
-        z-index: 1;
+    .btnDes {
+      font-size: 15Px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #777777;
+      line-height: 21Px;
+      text-align: center;
+      padding-bottom: 20Px;
     }
 
-    .btnWrap {
-        position: relative;
-        top: -2Px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        background-color: #fff;
-        width: 100%;
-        border-radius: 0 0 16Px 16Px;
-        padding: 0 0 20Px 0;
-
-        .btnTitle {
-            font-size: 17Px;
-            font-family: PingFangSC-Semibold, PingFang SC;
-            font-weight: 600;
-            color: #021F67;
-            line-height: 24Px;
-            padding: 15Px 0;
-            text-align: center;
-        }
-
-        .btnDes {
-            font-size: 15Px;
-            font-family: PingFangSC-Regular, PingFang SC;
-            font-weight: 400;
-            color: #777777;
-            line-height: 21Px;
-            text-align: center;
-            padding-bottom: 20Px;
-        }
-
-        .btn {
-            width: 172Px;
-            height: 40Px;
-            font-size: 16Px;
-            font-family: PingFangSC-Semibold, PingFang SC;
-            font-weight: 600;
-            color: #EEF8FE;
-            line-height: 22Px;
-            background: linear-gradient(135deg, #00B9FF 0%, #007AFF 100%);
-            margin: 0 auto;
-        }
+    .btn {
+      width: 172Px;
+      height: 40Px;
+      font-size: 16Px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #EEF8FE;
+      line-height: 22Px;
+      background: linear-gradient(135deg, #00B9FF 0%, #007AFF 100%);
+      margin: 0 auto;
     }
+  }
 }