Browse Source

修改样式

lex 1 year ago
parent
commit
0e805d52a3
58 changed files with 1130 additions and 860 deletions
  1. BIN
      src/common/images/icon-alipay.png
  2. BIN
      src/common/images/icon-wechat.png
  3. BIN
      src/common/images/icon_checkbox-tenant.png
  4. 41 36
      src/components/col-field/index.module.less
  5. 2 1
      src/components/col-search/index.module.less
  6. 1 11
      src/components/col-share/share-item.tsx
  7. 1 2
      src/teacher/share-page/track-review-activity/share-model.tsx
  8. 1 1
      src/tenant/activation-code/index.module.less
  9. 19 8
      src/tenant/exercise-record/exercis-detail.module.less
  10. 2 2
      src/tenant/exercise-record/exercis-detail.tsx
  11. BIN
      src/tenant/images/bg-image-1.png
  12. BIN
      src/tenant/member-center/images/tips-ligit.png
  13. 20 5
      src/tenant/member-center/index.module.less
  14. 11 4
      src/tenant/member-center/index.tsx
  15. BIN
      src/tenant/music/album-detail/icon-album-bg.png
  16. 28 12
      src/tenant/music/album-detail/index.module.less
  17. 3 12
      src/tenant/music/album-detail/index.tsx
  18. 4 0
      src/tenant/music/album/index.module.less
  19. 1 7
      src/tenant/music/album/index.tsx
  20. BIN
      src/tenant/music/component/images/collection.png
  21. BIN
      src/tenant/music/component/images/collection_active.png
  22. 4 4
      src/tenant/music/component/song/index.module.less
  23. 25 2
      src/tenant/music/list/index.module.less
  24. 32 38
      src/tenant/music/list/index.tsx
  25. 2 8
      src/tenant/music/list/item.tsx
  26. 5 4
      src/tenant/music/music-detail/download.module.less
  27. 1 4
      src/tenant/music/music-detail/index.tsx
  28. 41 26
      src/tenant/music/music-detail/new-index.module.less
  29. 3 46
      src/tenant/music/music-detail/new-index.tsx
  30. 4 2
      src/tenant/music/personal/index.module.less
  31. 1 1
      src/tenant/music/personal/index.tsx
  32. 41 16
      src/tenant/music/search/header.tsx
  33. 24 0
      src/tenant/music/search/index.module.less
  34. 1 0
      src/tenant/music/search/select-subject.module.less
  35. 2 8
      src/tenant/music/train-list/item.tsx
  36. 1 1
      src/tenant/music/train-tool/index.module.less
  37. 2 2
      src/tenant/music/train-tool/index.tsx
  38. 7 3
      src/tenant/trade/index.module.less
  39. 2 2
      src/tenant/trade/index.tsx
  40. 138 93
      src/views/adapay/payment/index.module.less
  41. 49 7
      src/views/adapay/payment/index.tsx
  42. 2 5
      src/views/live-class/live-item.tsx
  43. 1 4
      src/views/music/album-detail/index.tsx
  44. 2 8
      src/views/music/list/item.tsx
  45. 1 4
      src/views/music/music-detail/index.tsx
  46. 7 4
      src/views/order-detail/index.module.less
  47. 89 81
      src/views/order-detail/order-album/index.module.less
  48. 21 1
      src/views/order-detail/order-album/index.tsx
  49. 113 81
      src/views/order-detail/order-music/index.module.less
  50. 74 75
      src/views/order-detail/order-music/index.tsx
  51. 60 48
      src/views/order-detail/order-vip/index.module.less
  52. 71 65
      src/views/order-detail/order-vip/index.tsx
  53. 50 11
      src/views/order-detail/payment/index.module.less
  54. 50 58
      src/views/order-detail/payment/index.tsx
  55. 58 45
      src/views/order-detail/userAuth/index.module.less
  56. 7 1
      src/views/order-detail/userAuth/index.tsx
  57. 4 0
      src/views/trade/trade-detail.module.less
  58. 1 1
      vite.config.ts

BIN
src/common/images/icon-alipay.png


BIN
src/common/images/icon-wechat.png


BIN
src/common/images/icon_checkbox-tenant.png


+ 41 - 36
src/components/col-field/index.module.less

@@ -1,36 +1,41 @@
-.formTitle {
-  font-size: 16px;
-  color: #000;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  .pdL {
-    // padding-left: 8px;
-  }
-  .col-left {
-    display: flex;
-    align-items: center;
-    :global {
-      .van-icon {
-        margin-right: 5px;
-        & > img {
-          vertical-align: middle;
-        }
-      }
-    }
-    .required {
-      font-style: normal;
-      color: #ff4e19;
-      font-size: 17px;
-    }
-  }
-
-  .col-icon {
-    display: flex;
-    align-items: center;
-  }
-}
-
-.col-field {
-  margin-bottom: 16px;
-}
+.formTitle {
+  font-size: 16px;
+  color: #000;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  .pdL {
+    // padding-left: 8px;
+  }
+
+  .col-left {
+    display: flex;
+    align-items: center;
+
+    :global {
+      .van-icon {
+        margin-right: 5px;
+
+        &>img {
+          vertical-align: middle;
+        }
+      }
+    }
+
+    .required {
+      font-style: normal;
+      color: #ff2451;
+      font-size: 17px;
+    }
+  }
+
+  .col-icon {
+    display: flex;
+    align-items: center;
+  }
+}
+
+.col-field {
+  margin-bottom: 16px;
+}

+ 2 - 1
src/components/col-search/index.module.less

@@ -50,7 +50,8 @@
   &.col-tenant-search {
     --van-cell-line-height: 34px;
 
-    &.default {
+    &.default,
+    &.transparent {
       :global {
         .van-search__content {
           background: #f5f6f8;

+ 1 - 11
src/components/col-share/share-item.tsx

@@ -62,17 +62,7 @@ export default defineComponent({
     }
   },
   mounted() {
-    // alert(state.user.data.headUrl)
-    // this.heardUrl =
-    //   state.user.data.headUrl +
-    //   '@base@tag=imgscale&m=0&w=100&et=1&eth=100&etw=100&etc=ccc'
-    // this.heardUrl = state.user.data.heardUrl + '@base@tag=imgScale&p=25'
-    this.heardUrl =
-      state.user.data.heardUrl + '@base@tag=imgScale&h=80&w=80&m=1'
-    // '@base@tag=imgscale&m=0&w=80&et=1&eth=100&etw=100&etc=cccccc'
-    // ?time= +
-    // new Date().valueOf()
-    // console.log(this.heardUrl, 'heardUrl')
+    this.heardUrl = state.user.data.heardUrl + '?t=' + +new Date()
   },
   render() {
     return (

+ 1 - 2
src/teacher/share-page/track-review-activity/share-model.tsx

@@ -36,8 +36,7 @@ export default defineComponent({
   async mounted() {
     try {
       // this.subjectUrl = this.activeInfo.subjectUrl + `?t=${dayjs().unix()}`
-      this.subjectUrl =
-        this.activeInfo.shareUrl + '@base@tag=imgScale&w=570?t=' + +new Date()
+      this.subjectUrl = this.activeInfo.shareUrl + '?t=' + +new Date()
       console.log(this.shareUrl)
       const shortRes = await request.post('/api-teacher/sysConfig/shortURL', {
         requestType: 'form',

+ 1 - 1
src/tenant/activation-code/index.module.less

@@ -133,7 +133,7 @@
     .liveBtn {
       background: #FE2451;
       border-radius: 6px;
-      padding: 0 20px;
+      padding: 0 12px;
       height: 25px;
     }
   }

+ 19 - 8
src/tenant/exercise-record/exercis-detail.module.less

@@ -33,6 +33,14 @@
   // border-radius: 10px;
   padding: 18px;
 
+  :global {
+    .van-cell__title {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+    }
+  }
+
 
   .level {
     width: 44px;
@@ -59,8 +67,8 @@
   }
 
   .userImg {
-    width: 46px;
-    height: 46px;
+    width: 68px;
+    height: 68px;
     border-radius: 50%;
     vertical-align: middle;
     overflow: hidden;
@@ -78,9 +86,11 @@
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
-      font-size: 18px;
-      font-weight: 600;
-      color: #742626;
+
+      font-size: 20px;
+      font-weight: 500;
+      color: #000000;
+      line-height: 28px;
     }
   }
 
@@ -125,7 +135,7 @@
     width: 25%;
 
     .dotMain {
-      font-size: 24px;
+      font-size: 22px;
       color: #333333;
       line-height: 30px;
       margin-bottom: 4px;
@@ -153,7 +163,7 @@
 .topWrap {
   :global {
     .van-sticky {
-      background: url('../images/bg-image.png') no-repeat top center;
+      background: url('../images/bg-image-1.png') no-repeat top center;
       background-size: 100% 214px;
       z-index: 99999999;
     }
@@ -294,7 +304,8 @@
       display: flex;
       align-items: center;
       font-size: 14px;
-      color: #131415;
+      color: rgba(19, 20, 21, 0.6);
+
 
 
       .iconArrow {

+ 2 - 2
src/tenant/exercise-record/exercis-detail.tsx

@@ -20,7 +20,7 @@ import { state as baseState } from '@/state'
 import TheSticky from '@/components/the-sticky'
 import ColHeader from '@/components/col-header'
 import ColResult from '@/components/col-result'
-import bgImg from '../images/bg-image.png'
+import bgImg from '../images/bg-image-1.png'
 import iconStudent from '@common/images/icon_student.png'
 import iconLogo from '../member-center/images/icon-logo-default.png'
 import iconLogoActive from '../member-center/images/icon-logo.png'
@@ -370,7 +370,7 @@ export default defineComponent({
           >
             <ColResult
               tips="暂无学练统计"
-              classImgSize="SMALL"
+              // classImgSize="SMALL"
               btnStatus={false}
             />
           </div>

BIN
src/tenant/images/bg-image-1.png


BIN
src/tenant/member-center/images/tips-ligit.png


+ 20 - 5
src/tenant/member-center/index.module.less

@@ -170,7 +170,8 @@
   .intro {
     background: #FFFFFF;
     border-radius: 16px;
-    font-size: 14px;
+
+    line-height: 24px;
     color: #bb6e3a;
     overflow: hidden;
 
@@ -186,19 +187,27 @@
     }
 
 
-    p {
+    &>p {
+      position: relative;
       background: linear-gradient(44deg, #FCE3E1 0%, #FEF3EC 29%, #FDDDD5 59%, #FEDBE3 100%);
       border-radius: 12px;
       // opacity: 0.27;
       margin: 13px 12px 20px;
-      padding: 15px;
+
       text-align: justify;
-      line-height: 22px;
+      font-size: 14px;
       font-size: 14px;
       color: #2D1A18;
 
+      &>p {
+        padding: 15px;
+        background: url('./images/tips-ligit.png') no-repeat center;
+        background-size: cover;
+      }
+
       span {
         color: #EF2F56;
+        font-weight: 600;
       }
     }
   }
@@ -377,7 +386,7 @@
     background-size: contain;
     box-shadow: inset 0px 1px 0px 0px #FFFFFF;
     border-radius: 16px 16px 0px 0px;
-    border: 2px solid #FFFFFF;
+    // border: 2px solid #FFFFFF;
   }
 
   .memberMeal {
@@ -397,6 +406,12 @@
         height: 14px;
         background: url('./images/icon-arrow-line.png') no-repeat center;
         background-size: contain;
+        transition: all .2s;
+
+        &.iconArrowLineHide {
+          transform: rotate(180deg);
+          transition: all .2s;
+        }
       }
     }
   }

+ 11 - 4
src/tenant/member-center/index.tsx

@@ -21,6 +21,7 @@ import { moneyFormat } from '@/helpers/utils'
 import ColShare from '@/components/col-share'
 import TheSticky from '@/components/the-sticky'
 import bgImg from './images/member-bg.png'
+import { postMessage } from '@/helpers/native-message'
 
 export const getAssetsHomeFile = (fileName: string) => {
   const path = `./images/${fileName}`
@@ -73,6 +74,10 @@ export default defineComponent({
   },
   async mounted() {
     try {
+      postMessage({
+        api: 'backIconChange',
+        content: { iconStyle: 'white' }
+      })
       const userInfo = await request.get(
         state.platformType === 'TEACHER'
           ? '/api-teacher/teacher/queryUserInfo'
@@ -284,10 +289,12 @@ export default defineComponent({
         <div class={styles.memberContainer}>
           <div class={[styles.intro]}>
             <p>
-              酷乐秀会员可使用包括平台提供的所有训练乐谱,并
-              <span>专享“小酷AI”八大核心功能</span>
-              ,让孩子<span>在家就能轻松完成乐器自主规范练习</span>,让家长
-              <span>即时掌握练习情况</span>。
+              <p>
+                酷乐秀会员可使用包括平台提供的所有训练乐谱,并
+                <span>专享“小酷AI”八大核心功能</span>
+                ,让孩子<span>在家就能轻松完成乐器自主规范练习</span>,让家长
+                <span>即时掌握练习情况</span>。
+              </p>
             </p>
           </div>
 

BIN
src/tenant/music/album-detail/icon-album-bg.png


+ 28 - 12
src/tenant/music/album-detail/index.module.less

@@ -36,12 +36,11 @@
     width: 94px;
     height: 94px;
     border-radius: 50%;
-    // background-color: var(--music-list-item-background-color);
-    // box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.08);
-    background: linear-gradient(180deg, #434343 0%, #666666 50%, #434343 100%);
     position: absolute;
     right: -9px;
     top: 0px;
+    background: url('./icon-album-bg.png') no-repeat center;
+    background-size: contain;
   }
 
   .albumType {
@@ -174,7 +173,7 @@
 .bg {
   position: relative;
   height: 100%;
-  padding: 16px 16px 12px;
+  padding: 5px 16px 12px;
   z-index: 11;
 }
 
@@ -203,6 +202,7 @@
 
     .des {
       color: #999;
+      line-height: 16px;
     }
   }
 }
@@ -212,9 +212,9 @@
 
   .tag {
     margin: 0 2px;
-    padding: 2px 6px;
+    padding: 1px 9px;
     color: #000;
-    // background-color: rgba(113, 138, 147, 1);
+    background: rgba(255, 254, 254, 0.2);
     border-radius: 20px;
     color: #FFFFFF;
     border: 1px solid #FFFFFF;
@@ -255,20 +255,21 @@
   background-size: contain;
   // border-radius: 16px;
   // opacity: 0.32;
-  padding: 10px 10px;
+  padding: 11px 10px 10px;
   margin-top: 12px;
   font-size: 13px;
   font-weight: 500;
   color: #5E3314;
-  line-height: 18px;
+  line-height: 1;
   display: flex;
   justify-content: space-between;
   align-items: center;
 
   .albumPrice {
-    font-size: 14px;
-    font-weight: bold;
-    color: #FFC76C;
+    font-size: 13px;
+    font-weight: 400;
+    color: #FFE1AE;
+    line-height: 18px;
     background: #262626;
     border-radius: 13px;
     padding: 4px 7px;
@@ -283,7 +284,7 @@
 
   .alumnList {
     padding: 16px 20px 0 12px;
-    border-radius: 18px;
+    border-radius: 18px !important;
     background-color: #fff;
     margin-bottom: 16px;
   }
@@ -429,3 +430,18 @@
     }
   }
 }
+
+.btnStickyBottom {
+  :global {
+    .van-sticky {
+      background-color: #fff;
+      border-top: 1px solid #F2F2F2;
+    }
+
+    .van-button__text {
+      padding-top: 1px;
+      font-size: 16px;
+      color: #FFFFFF;
+    }
+  }
+}

+ 3 - 12
src/tenant/music/album-detail/index.tsx

@@ -278,13 +278,7 @@ export default defineComponent({
                 <div class={[styles.alumTitle, 'van-ellipsis']}>
                   {albumDetail.value?.albumName}
                 </div>
-                <div
-                  class={[styles.des, 'van-multi-ellipsis--l2']}
-                  style={{
-                    height: '32px',
-                    lineHeight: '16px'
-                  }}
-                >
+                <div class={[styles.des, 'van-multi-ellipsis--l2']}>
                   {albumDetail.value?.albumDesc}
                 </div>
                 <div class={styles.tags}>
@@ -404,7 +398,7 @@ export default defineComponent({
           {/* 判断是否是收费 是否是已经购买 */}
           {albumDetail.value?.paymentType === 'CHARGE' &&
             albumDetail.value?.orderStatus !== 'PAID' && (
-              <ColSticky position="bottom" background="white">
+              <ColSticky position="bottom" class={styles.btnStickyBottom}>
                 <div
                   class={[
                     'btnGroup',
@@ -468,10 +462,7 @@ export default defineComponent({
                 <img
                   class={styles.icon}
                   crossorigin="anonymous"
-                  src={
-                    albumDetail.value?.albumCoverUrl +
-                    `@base@tag=imgScale&h=144&w=144&m=1?t=${+new Date()}`
-                  }
+                  src={albumDetail.value?.albumCoverUrl + `?t=${+new Date()}`}
                 />
                 <div class={styles.info}>
                   <h4 class="van-multi-ellipsis--l2">

+ 4 - 0
src/tenant/music/album/index.module.less

@@ -53,6 +53,10 @@
 
     }
   }
+
+  .titleActive {
+    color: #FE2451;
+  }
 }
 
 

+ 1 - 7
src/tenant/music/album/index.tsx

@@ -271,13 +271,7 @@ export default defineComponent({
                                 // </div>
                                 <DropdownMenu>
                                   <DropdownItem
-                                    titleClass={
-                                      params.subjectId ||
-                                      params.type ||
-                                      params.level
-                                        ? styles.titleActive
-                                        : ''
-                                    }
+                                    titleClass={styles.titleActive}
                                     title="筛选"
                                     ref={searchRef}
                                   >

BIN
src/tenant/music/component/images/collection.png


BIN
src/tenant/music/component/images/collection_active.png


+ 4 - 4
src/tenant/music/component/song/index.module.less

@@ -30,7 +30,7 @@
     .cover {
       width: 50px;
       height: 50px;
-      border-radius: 6px;
+      border-radius: 8px;
       margin-right: 10px;
 
       img {
@@ -70,7 +70,7 @@
       align-items: center;
 
       .name {
-        font-size: 12px;
+        font-size: 13px;
         color: #999;
         line-height: 16px;
         margin-left: 6px;
@@ -153,8 +153,8 @@
 }
 
 .collection {
-  width: 16px;
-  height: 15px;
+  width: 15px;
+  height: 16px;
   margin-right: 4px;
 }
 

+ 25 - 2
src/tenant/music/list/index.module.less

@@ -6,7 +6,7 @@
   :global {
     .van-sticky {
       background: url('../../images/bg-image.png') no-repeat top center;
-      background-size: 100% 214px;
+      background-size: 100% 364px;
     }
 
     .van-search__content {
@@ -25,6 +25,29 @@
       }
     }
 
+    .van-dropdown-menu__bar {
+      background-color: transparent;
+      box-shadow: none;
+      padding-right: 15px;
+    }
+
+    .van-dropdown-menu__title {
+      padding-left: 0
+    }
+
+    .van-dropdown-menu__title:after {
+      border-color: transparent transparent rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.4);
+    }
+
+    .van-dropdown-item__content {
+      border-radius: 0px 0px 20px 20px;
+
+    }
+
+  }
+
+  .titleActive {
+    color: #FE2451;
   }
 }
 
@@ -83,7 +106,7 @@
   top: 0;
   left: 0;
   width: 100%;
-  height: 214px;
+  // height: 214px;
   // object-fit: cover;
   z-index: -1;
 }

+ 32 - 38
src/tenant/music/list/index.tsx

@@ -1,5 +1,15 @@
 import { defineComponent, nextTick, onMounted, reactive, ref } from 'vue'
-import { Sticky, List, Popup, Icon, Switch, Tabs, Tab } from 'vant'
+import {
+  Sticky,
+  List,
+  Popup,
+  Icon,
+  Switch,
+  Tabs,
+  Tab,
+  DropdownMenu,
+  DropdownItem
+} from 'vant'
 import Search from '@/components/col-search'
 import request from '@/helpers/request'
 // import Item from './item'
@@ -254,10 +264,12 @@ export default defineComponent({
       FetchList()
       tagVisibility.value = false
     }
+    const searchRef = ref()
     const onComfirmSubject = item => {
       params.page = 1
       params.subjectIds = item.id
       data.value = null
+      searchRef.value.toggle()
       if (baseState.platformType === 'TEACHER') {
         teacherDetaultSubject.value = {
           name: item.name,
@@ -357,7 +369,7 @@ export default defineComponent({
                             src={iconFree}
                             class={[
                               styles.iconFree,
-                              exquisiteFlag.value && styles.iconFreeDisable
+                              !exquisiteFlag.value && styles.iconFreeDisable
                             ]}
                           />
                         </span>
@@ -372,21 +384,24 @@ export default defineComponent({
                   // leftIcon={iconSearch}
                   v-slots={{
                     left: () => (
-                      <div
-                        class={styles.label}
-                        onClick={() => (subject.show = true)}
-                      >
-                        {baseState.platformType === 'TEACHER'
-                          ? teacherDetaultSubject.value.name
-                          : subject.name}
-
-                        <Icon
-                          classPrefix="iconfont"
-                          name="down"
-                          size={12}
-                          color="#131415"
-                        />
-                      </div>
+                      <DropdownMenu>
+                        <DropdownItem
+                          titleClass={styles.titleActive}
+                          title="筛选"
+                          ref={searchRef}
+                        >
+                          <SelectSubject
+                            type="MUSIC"
+                            isReset
+                            searchParams={
+                              baseState.platformType === 'TEACHER'
+                                ? teacherDetaultSubject.value
+                                : subject
+                            }
+                            onComfirm={onComfirmSubject}
+                          />
+                        </DropdownItem>
+                      </DropdownMenu>
                     )
                   }}
                 />
@@ -471,27 +486,6 @@ export default defineComponent({
               defaultValue={route.query.tagids as string}
             />
           </Popup>
-
-          {/* 声部弹框 */}
-          <Popup
-            show={subject.show}
-            position="bottom"
-            round
-            closeable
-            safe-area-inset-bottom
-            onClose={() => (subject.show = false)}
-            onClosed={() => (subject.show = false)}
-          >
-            <SelectSubject
-              type="MUSIC"
-              searchParams={
-                baseState.platformType === 'TEACHER'
-                  ? teacherDetaultSubject.value
-                  : subject
-              }
-              onComfirm={onComfirmSubject}
-            />
-          </Popup>
         </>
       )
     }

+ 2 - 8
src/tenant/music/list/item.tsx

@@ -34,9 +34,7 @@ export default defineComponent({
     // console.log(props, emit)
     const favorite = ref(data.favorite)
     const favoriteLoading = ref(false)
-    const titleImg =
-      data.titleImg + '@base@tag=imgScale&h=80&w=80&m=1?t=' + +new Date()
-    //daya.ks3-cn-beijing.ksyun.com/202204/T2yF851.jpeg@base@tag=imgScale&h=80&w=80&m=1
+    const titleImg = data.titleImg + '?t=' + +new Date()
 
     const toggleFavorite = async (evt: MouseEvent) => {
       evt.stopPropagation()
@@ -173,11 +171,7 @@ export default defineComponent({
               <img
                 class={styles.icon}
                 crossorigin="anonymous"
-                src={
-                  data.titleImg +
-                    `@base@tag=imgScale&h=80&w=80&m=1?t=${+new Date()}` ||
-                  MusicIcon
-                }
+                src={data.titleImg + `?t=${+new Date()}` || MusicIcon}
               />
               <div class={styles.info}>
                 <h4 class="van-multi-ellipsis--l2">{data.musicSheetName}</h4>

+ 5 - 4
src/tenant/music/music-detail/download.module.less

@@ -23,14 +23,15 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: 12px;
-  color: #999;
+  font-size: 14px;
+  color: #777777;
   padding: 0 0 12px;
+
   .page {
     font-size: 16px;
     font-weight: 600;
-    color: #1a1a1a;
     line-height: 22px;
+    color: #131415;
   }
 }
 
@@ -40,4 +41,4 @@
   font-weight: 600;
   color: #ffffff;
   line-height: 20px;
-}
+}

+ 1 - 4
src/tenant/music/music-detail/index.tsx

@@ -951,10 +951,7 @@ export default defineComponent({
                 <img
                   class={styles.icon}
                   crossorigin="anonymous"
-                  src={
-                    musicDetail.value?.titleImg +
-                    `@base@tag=imgScale&h=80&w=80&m=1?t=${+new Date()}`
-                  }
+                  src={musicDetail.value?.titleImg + `?t=${+new Date()}`}
                 />
                 <div class={styles.info}>
                   <h4 class="van-multi-ellipsis--l2">

+ 41 - 26
src/tenant/music/music-detail/new-index.module.less

@@ -5,10 +5,13 @@
   --van-nav-bar-icon-color: #fff;
   --van-nav-bar-text-color: #fff;
   --van-nav-bar-title-text-color: #fff;
+  --van-overlay-background-color: rgba(0, 0, 0, .6);
   height: 100vh;
 
   --plyr-color-main: #FF3C81;
   --plyr-control-icon-size: 10px;
+  --plyr-range-track-height: 4px;
+  // --plyr-range-thumb-height: 4px;
 
   :global {
     .plyr__controls {
@@ -38,9 +41,9 @@
 }
 
 .img {
-  width: 94px;
-  height: 94px;
-  margin-right: 18px;
+  width: 81px;
+  height: 81px;
+  margin-right: 16px !important;
   position: relative;
 
   >img,
@@ -50,18 +53,18 @@
     overflow: hidden;
   }
 
-  &::before {
-    content: '';
-    width: 94px;
-    height: 94px;
-    border-radius: 50%;
-    // background-color: var(--music-list-item-background-color);
-    // box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.08);
-    background: linear-gradient(180deg, #434343 0%, #666666 50%, #434343 100%);
-    position: absolute;
-    right: -9px;
-    top: 0px;
-  }
+  // &::before {
+  //   content: '';
+  //   width: 94px;
+  //   height: 94px;
+  //   border-radius: 50%;
+  //   // background-color: var(--music-list-item-background-color);
+  //   // box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.08);
+  //   background: linear-gradient(180deg, #434343 0%, #666666 50%, #434343 100%);
+  //   position: absolute;
+  //   right: -9px;
+  //   top: 0px;
+  // }
 
   .albumType {
     position: absolute;
@@ -136,7 +139,7 @@
 .bg {
   position: relative;
   // height: 100%;
-  padding: 16px 16px 12px;
+  padding: 5px 16px 12px;
   z-index: 11;
 }
 
@@ -145,8 +148,8 @@
   align-items: center;
 
   .img {
-    width: 98px;
-    height: 98px;
+    width: 81px;
+    height: 81px;
     flex-shrink: 0;
     border-radius: 6px;
     // overflow: hidden;
@@ -165,6 +168,7 @@
 
     .des {
       color: #999;
+      line-height: 16px;
     }
   }
 }
@@ -198,9 +202,9 @@
     justify-content: center;
     width: 32%;
     height: 36px;
-    font-size: 15px;
+    font-size: 14px;
     color: #fff;
-    background-color: rgba(255, 255, 255, 0.5);
+    background-color: rgba(255, 255, 255, 0.2);
     border-radius: 99px;
     font-weight: 600;
 
@@ -220,18 +224,17 @@
   font-size: 13px;
   font-weight: 500;
   color: #5E3314;
-  line-height: 18px;
+  line-height: 1;
   display: flex;
   justify-content: space-between;
   align-items: center;
 
   .albumPrice {
-    font-size: 14px;
-    font-weight: bold;
-    color: #FFC76C;
+    font-size: 13px;
+    color: #FFE1AE;
     background: #262626;
     border-radius: 13px;
-    padding: 4px 7px;
+    padding: 4px 7px 2px;
 
   }
 
@@ -245,7 +248,7 @@
   &>span {
     display: flex;
     align-items: center;
-
+    padding-top: 1px;
   }
 }
 
@@ -334,8 +337,11 @@
   }
 
   .musicTitle {
+    font-weight: 600;
     text-align: center;
     font-size: 16px;
+    color: #131415;
+    line-height: 22px;
   }
 
   .musicImg {
@@ -405,6 +411,15 @@
 
 .footers {
   padding: 0 25px 20px; // height: 45px;
+
+  :global {
+    .van-button {
+      font-size: 18px;
+      font-weight: 600;
+      color: #FFFFFF;
+      line-height: 25px;
+    }
+  }
 }
 
 .colSticky {

+ 3 - 46
src/tenant/music/music-detail/new-index.tsx

@@ -261,7 +261,7 @@ export default defineComponent({
     const freeRate = ref<any>(0)
     const initAudio = async () => {
       const controls = [
-        'play-large',
+        // 'play-large',
         'play',
         'progress',
         'captions',
@@ -596,13 +596,7 @@ export default defineComponent({
               <div class={[styles.alumTitle, 'van-ellipsis']}>
                 {musicDetail.value?.musicSheetName}
               </div>
-              <div
-                class={[styles.des, 'van-multi-ellipsis--l2']}
-                style={{
-                  height: '32px',
-                  lineHeight: '16px'
-                }}
-              >
+              <div class={[styles.des, 'van-multi-ellipsis--l2']}>
                 {musicDetail.value?.addName
                   ? `上传者:${musicDetail.value?.addName || ''}`
                   : `作曲:${musicDetail.value?.composer || ''}`}
@@ -622,40 +616,6 @@ export default defineComponent({
                           {name}
                         </span>
                       ))}
-
-                    {/* {buyState.value.play && (
-                      <span
-                        style={{
-                          borderColor: colors.FREE.color,
-                          color: colors.FREE.color
-                        }}
-                        class={styles.tag}
-                      >
-                        {colors.FREE.text}
-                      </span>
-                    )}
-                    {buyState.value?.charge && (
-                      <span
-                        style={{
-                          borderColor: colors.CHARGE.color,
-                          color: colors.CHARGE.color
-                        }}
-                        class={styles.tag}
-                      >
-                        {colors.CHARGE.text}
-                      </span>
-                    )}
-                    {buyState.value.vip && (
-                      <span
-                        style={{
-                          borderColor: colors.VIP.color,
-                          color: colors.VIP.color
-                        }}
-                        class={styles.tag}
-                      >
-                        {colors.VIP.text}
-                      </span>
-                    )} */}
                   </>
                 )}
               </div>
@@ -878,10 +838,7 @@ export default defineComponent({
               <img
                 class={styles.icon}
                 crossorigin="anonymous"
-                src={
-                  musicDetail.value?.titleImg +
-                  `@base@tag=imgScale&h=80&w=80&m=1?t=${+new Date()}`
-                }
+                src={musicDetail.value?.titleImg + `?t=${+new Date()}`}
               />
               <div class={styles.info}>
                 <h4 class="van-multi-ellipsis--l2">

+ 4 - 2
src/tenant/music/personal/index.module.less

@@ -14,7 +14,9 @@
 
     .van-tab--active {
       font-size: 16px !important;
-      color: var(--van-primary);
+      // color: var(--van-primary);
+      font-weight: 500;
+      color: #000000;
     }
 
     .van-tabs__line {
@@ -33,7 +35,7 @@
 
   :global {
     .van-sticky {
-      background: url('../../images/bg-image.png') no-repeat top center;
+      background: url('../../images/bg-image-1.png') no-repeat top center;
       background-size: 100% 214px;
     }
 

+ 1 - 1
src/tenant/music/personal/index.tsx

@@ -6,7 +6,7 @@ import Personal from './personal'
 import Collection from './collection'
 import Album from './album'
 import AlbumMy from './album-my'
-import bgImg from '../../images/bg-image.png'
+import bgImg from '../../images/bg-image-1.png'
 import styles from './index.module.less'
 import { getRandomKey } from '../music'
 import { useEventTracking } from '@/helpers/hooks'

+ 41 - 16
src/tenant/music/search/header.tsx

@@ -1,4 +1,16 @@
-import { Sticky, Cell, Tag, Icon, Popup, Tabs, Tab, Dialog, Button } from 'vant'
+import {
+  Sticky,
+  Cell,
+  Tag,
+  Icon,
+  Popup,
+  Tabs,
+  Tab,
+  Dialog,
+  Button,
+  DropdownMenu,
+  DropdownItem
+} from 'vant'
 import {
   RouterView,
   useRouter,
@@ -166,11 +178,12 @@ export default defineComponent({
         mitter.emit('search', val)
       }
     }
-
+    const searchRef = ref()
     const onComfirmSubject = (item: any) => {
       // console.log('onSort', item)
       subject.name = item.name
       subject.id = item.id
+      searchRef.value.toggle()
       useSubjectId(
         SubjectEnum.SEARCH,
         JSON.stringify({
@@ -273,18 +286,30 @@ export default defineComponent({
                 type="tenant"
                 v-slots={{
                   left: () => (
-                    <div
-                      class={styles.label}
-                      onClick={() => (subject.show = true)}
-                    >
-                      {subject.name}
-                      <Icon
-                        classPrefix="iconfont"
-                        name="down"
-                        size={12}
-                        color="#333"
-                      />
-                    </div>
+                    // <div
+                    //   class={styles.label}
+                    //   onClick={() => (subject.show = true)}
+                    // >
+                    //   {subject.name}
+                    //   <Icon
+                    //     classPrefix="iconfont"
+                    //     name="down"
+                    //     size={12}
+                    //     color="#333"
+                    //   />
+                    // </div>
+                    <DropdownMenu>
+                      <DropdownItem
+                        titleClass={styles.titleActive}
+                        title="筛选"
+                        ref={searchRef}
+                      >
+                        <SelectSubject
+                          searchParams={subject}
+                          onComfirm={onComfirmSubject}
+                        />
+                      </DropdownItem>
+                    </DropdownMenu>
                   ),
                   action: () => (
                     <span
@@ -382,7 +407,7 @@ export default defineComponent({
           <RouterView />
 
           {/* 声部弹框 */}
-          <Popup
+          {/* <Popup
             show={subject.show}
             position="bottom"
             round
@@ -395,7 +420,7 @@ export default defineComponent({
               searchParams={subject}
               onComfirm={onComfirmSubject}
             />
-          </Popup>
+          </Popup> */}
 
           <div
             class={[styles.searchResult]}

+ 24 - 0
src/tenant/music/search/index.module.less

@@ -31,6 +31,30 @@
       .van-search__action {
         padding-right: 0;
       }
+
+
+      .van-dropdown-menu__bar {
+        background-color: transparent;
+        box-shadow: none;
+        padding-right: 15px;
+      }
+
+      .van-dropdown-menu__title {
+        padding-left: 0
+      }
+
+      .van-dropdown-menu__title:after {
+        border-color: transparent transparent rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.4);
+      }
+
+      .van-dropdown-item__content {
+        border-radius: 0px 0px 20px 20px;
+
+      }
+    }
+
+    .titleActive {
+      color: #FE2451;
     }
   }
 

+ 1 - 0
src/tenant/music/search/select-subject.module.less

@@ -10,6 +10,7 @@
 .btnGroup {
   padding: 18px 13px;
   border: 1px solid #F2F2F2;
+  background-color: #fff;
 
   :global {
     .van-button {

+ 2 - 8
src/tenant/music/train-list/item.tsx

@@ -34,9 +34,7 @@ export default defineComponent({
     // console.log(props, emit)
     const favorite = ref(data.favorite)
     const favoriteLoading = ref(false)
-    const titleImg =
-      data.titleImg + '@base@tag=imgScale&h=80&w=80&m=1?t=' + +new Date()
-    //daya.ks3-cn-beijing.ksyun.com/202204/T2yF851.jpeg@base@tag=imgScale&h=80&w=80&m=1
+    const titleImg = data.titleImg + '?t=' + +new Date()
 
     const toggleFavorite = async (evt: MouseEvent) => {
       evt.stopPropagation()
@@ -173,11 +171,7 @@ export default defineComponent({
               <img
                 class={styles.icon}
                 crossorigin="anonymous"
-                src={
-                  data.titleImg +
-                    `@base@tag=imgScale&h=80&w=80&m=1?t=${+new Date()}` ||
-                  MusicIcon
-                }
+                src={data.titleImg + `?t=${+new Date()}` || MusicIcon}
               />
               <div class={styles.info}>
                 <h4 class="van-multi-ellipsis--l2">{data.musicSheetName}</h4>

+ 1 - 1
src/tenant/music/train-tool/index.module.less

@@ -304,7 +304,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: 600;
     color: #131415;
     line-height: 22px;

+ 2 - 2
src/tenant/music/train-tool/index.tsx

@@ -319,7 +319,7 @@ export default defineComponent({
                       width="100%"
                       height="100%"
                       fit="cover"
-                      src={state.details?.coverImg}
+                      src={state.details?.coverImg || iconAlbumCover}
                     />
                   </div>
                 </div>
@@ -406,7 +406,7 @@ export default defineComponent({
                     round
                     block
                     disabled={state.details?.musicNum <= 0}
-                    color="#FE2451"
+                    color="linear-gradient(270deg, #FF204B 0%, #FE5B71 100%)"
                     onClick={() => (state.popupStatus = true)}
                   >
                     购买教程

+ 7 - 3
src/tenant/trade/index.module.less

@@ -1,8 +1,8 @@
 .sticky {
   :global {
     .van-sticky {
-      background: url('../images/bg-image.png') no-repeat top center;
-      background-size: 100% 214px;
+      background: url('../images/bg-image-1.png') no-repeat top center;
+      background-size: 100% 375px;
     }
 
     .van-search__content {
@@ -49,7 +49,7 @@
   top: 0;
   left: 0;
   width: 100%;
-  height: 214px;
+  // height: 214px;
   // object-fit: cover;
   z-index: -1;
 }
@@ -68,6 +68,10 @@
       color: #999999;
     }
 
+    .van-tab--shrink {
+      padding: 0 12px;
+    }
+
     .van-tab--active {
       font-size: 16px !important;
       color: #131415;

+ 2 - 2
src/tenant/trade/index.tsx

@@ -21,7 +21,7 @@ import { useRouter } from 'vue-router'
 import ColResult from '@/components/col-result'
 import styles from './index.module.less'
 import ColHeader from '@/components/col-header'
-import bgImg from '../images/bg-image.png'
+import bgImg from '../images/bg-image-1.png'
 import { dateFormat, formatterDate, moneyFormat } from '@/helpers/utils'
 import TheSticky from '@/components/the-sticky'
 import { tradeOrder } from './tradeOrder'
@@ -185,7 +185,7 @@ export default defineComponent({
                       classPrefix="iconfont"
                       name="down"
                       size={12}
-                      color="#131415"
+                      color="#948D93"
                     />
                   </div>
                 )

+ 138 - 93
src/views/adapay/payment/index.module.less

@@ -1,93 +1,138 @@
-.payment {
-  :global {
-    .van-cell__title {
-      font-size: 16px;
-      padding-left: 10px;
-    }
-    .van-icon-cross {
-      position: absolute;
-      z-index: 1;
-      top: 13px;
-      left: 13px;
-      color: #ccc;
-      cursor: pointer;
-    }
-
-    // .van-checkbox__icon,
-    // .van-radio__icon {
-    //   height: 22px;
-    //   .van-icon {
-    //     border: 0;
-    //   }
-    // }
-    // .van-checkbox__icon--checked .van-icon,
-    // .van-radio__icon--checked .van-icon {
-    //   background: transparent;
-    //   border: transparent;
-    // }
-  }
-
-  // .van-popup__close-icon {
-  //   color: #cccccc;
-  //   font-size: 22px;
-  // }
-  // .van-popup--bottom.van-popup--round {
-  //   border-radius: 6px 6px 0 0;
-  // }
-  // .van-hairline--bottom::after {
-  //   border-bottom-color: #f0f0f0;
-  // }
-  .title {
-    background-color: #ffffff;
-    font-size: 16px;
-    font-weight: 400;
-    color: #1a1a1a;
-    padding: 14px 0 12px;
-    text-align: center;
-  }
-  .payAmount {
-    background-color: #ffffff;
-    padding: 20px 0;
-    text-align: center;
-    p {
-      font-size: 14px;
-      color: #666666;
-      padding-bottom: 10px;
-    }
-    .amount {
-      font-size: 28px;
-      color: #000000;
-      span {
-        font-size: 18px;
-        // padding-right: 3px;
-      }
-    }
-  }
-
-  .blank {
-    height: 65px;
-    // background-color: #f6f8f9;
-  }
-
-  .payTypeRe {
-    display: flex;
-    align-items: center;
-  }
-  .recommend {
-    margin-left: 5px;
-    background: linear-gradient(122deg, #ffa371 0%, #ff6b3b 100%);
-    border-radius: 10px;
-    font-size: 12px;
-    color: #ffffff;
-    line-height: 16px;
-    padding: 0 5px;
-  }
-
-  .payBtn {
-    width: 90% !important;
-    margin: 0 auto;
-    font-size: 16px;
-    font-weight: 600;
-    margin-bottom: 20px;
-  }
-}
+.payment {
+  :global {
+    .van-cell__title {
+      font-size: 16px;
+      padding-left: 10px;
+    }
+
+    .van-icon-cross {
+      position: absolute;
+      z-index: 1;
+      top: 30px;
+      left: 13px;
+      color: #ccc;
+      font-size: 18px;
+      cursor: pointer;
+    }
+
+    .van-cell {
+      padding: 20px;
+    }
+
+    // .van-checkbox__icon,
+    // .van-radio__icon {
+    //   height: 22px;
+    //   .van-icon {
+    //     border: 0;
+    //   }
+    // }
+    // .van-checkbox__icon--checked .van-icon,
+    // .van-radio__icon--checked .van-icon {
+    //   background: transparent;
+    //   border: transparent;
+    // }
+
+    .van-checkbox {
+      display: inline-block;
+      align-items: inherit;
+      overflow: inherit;
+    }
+
+    .van-checkbox__icon {
+      height: 18px;
+      line-height: 18px;
+      display: inline-block;
+      vertical-align: middle;
+    }
+
+    .van-checkbox__label {
+      line-height: 18px;
+    }
+  }
+
+  .boxStyle {
+    background: transparent !important;
+    width: 18px;
+    height: 18px;
+    border: transparent !important;
+  }
+
+  // .van-popup__close-icon {
+  //   color: #cccccc;
+  //   font-size: 22px;
+  // }
+  // .van-popup--bottom.van-popup--round {
+  //   border-radius: 6px 6px 0 0;
+  // }
+  // .van-hairline--bottom::after {
+  //   border-bottom-color: #f0f0f0;
+  // }
+  .title {
+    background-color: #ffffff;
+    font-size: 18px;
+    font-weight: 500;
+    color: #333333;
+    padding: 30px 0 12px;
+    text-align: center;
+  }
+
+  .payAmount {
+    background-color: #ffffff;
+    padding: 20px 0;
+    text-align: center;
+
+    p {
+      font-size: 14px;
+      color: #666666;
+      padding-bottom: 10px;
+    }
+
+    .amount {
+      font-size: 41px;
+      font-family: DINAlternate-Bold, DINAlternate;
+      font-weight: bold;
+      color: #333333;
+
+      span {
+        font-size: 31px;
+        // padding-right: 3px;
+      }
+    }
+  }
+
+  .blank {
+    height: 65px;
+    // background-color: #f6f8f9;
+  }
+
+  .payTypeRe {
+    display: flex;
+    align-items: center;
+    font-size: 16px;
+    font-weight: 600;
+    color: #333333;
+    line-height: 1.2;
+  }
+
+  .recommend {
+    margin-left: 5px;
+    background: #FE2451;
+    border-radius: 10px;
+    font-size: 11px;
+    color: #ffffff;
+    line-height: 16px;
+    padding: 0 5px;
+  }
+
+  .payBtn {
+    width: 90% !important;
+    margin: 0 auto;
+    font-size: 16px;
+    font-weight: 600;
+    margin-bottom: 20px;
+  }
+
+  .tenantPayBtn {
+    background: linear-gradient(270deg, #FF204B 0%, #FE5B71 100%);
+  }
+}

+ 49 - 7
src/views/adapay/payment/index.tsx

@@ -6,6 +6,11 @@ import { useEventTracking } from '@/helpers/hooks'
 import request from '@/helpers/request'
 import { useRouter } from 'vue-router'
 import { state as baseState } from '@/state'
+import activeButtonIcon from '@common/images/icon_checkbox.png'
+import inactiveButtonIcon from '@common/images/icon_checkbox_default.png'
+import activeButtonIconTenant from '@common/images/icon_checkbox-tenant.png'
+import iconWechat from '@common/images/icon-wechat.png'
+import iconAlipay from '@common/images/icon-alipay.png'
 
 const urlFix =
   baseState.platformType === 'TEACHER' ? '/api-teacher' : '/api-student'
@@ -122,7 +127,7 @@ export default defineComponent({
         <div class={styles.payAmount}>
           <p>应付金额</p>
           <div class={styles.amount}>
-            <span>¥ </span>
+            <span>¥</span>
             {moneyFormat(props.paymentConfig.actualPrice)}
           </div>
         </div>
@@ -135,10 +140,26 @@ export default defineComponent({
                 state.payType = 'wx'
               }}
               v-slots={{
-                icon: () => (
-                  <Icon name="wechat-pay" color="#15c434" size={22} />
+                icon: () => <Icon name={iconWechat} size={18} />,
+                'right-icon': () => (
+                  <Radio
+                    name="wx"
+                    v-slots={{
+                      icon: (props: any) => (
+                        <Icon
+                          class={styles.boxStyle}
+                          name={
+                            props.checked
+                              ? baseState.projectType === 'tenant'
+                                ? activeButtonIconTenant
+                                : activeButtonIcon
+                              : inactiveButtonIcon
+                          }
+                        />
+                      )
+                    }}
+                  />
                 ),
-                'right-icon': () => <Radio name="wx" />,
                 title: () => (
                   <div class={styles.payTypeRe}>
                     微信支付 <span class={styles.recommend}>推荐</span>
@@ -154,8 +175,26 @@ export default defineComponent({
                 state.payType = 'zfb'
               }}
               v-slots={{
-                icon: () => <Icon name="alipay" color="#009fe9" size={22} />,
-                'right-icon': () => <Radio name="zfb" />
+                icon: () => <Icon name={iconAlipay} size={18} />,
+                'right-icon': () => (
+                  <Radio
+                    name="zfb"
+                    v-slots={{
+                      icon: (props: any) => (
+                        <Icon
+                          class={styles.boxStyle}
+                          name={
+                            props.checked
+                              ? baseState.projectType === 'tenant'
+                                ? activeButtonIconTenant
+                                : activeButtonIcon
+                              : inactiveButtonIcon
+                          }
+                        />
+                      )
+                    }}
+                  />
+                )
               }}
             ></Cell>
           </CellGroup>
@@ -164,7 +203,10 @@ export default defineComponent({
         <div class={styles.blank}></div>
         <Button
           type="primary"
-          class={styles.payBtn}
+          class={[
+            styles.payBtn,
+            baseState.projectType === 'tenant' && styles.tenantPayBtn
+          ]}
           block
           round
           onClick={onSubmit}

+ 2 - 5
src/views/live-class/live-item.tsx

@@ -45,11 +45,8 @@ export default defineComponent({
     }
   },
   mounted() {
-    this.backgroundPic =
-      this.liveInfo.backgroundPic + '@base@tag=imgScale&h=192&w=340&m=1'
-    //  + '?time=' + new Date().valueOf()
-    this.avatar = this.liveInfo.avatar + '@base@tag=imgScale&h=80&w=80&m=1'
-    //  + '?time=' + new Date().valueOf() || ''
+    this.backgroundPic = this.liveInfo.backgroundPic + '?t' + +new Date()
+    this.avatar = this.liveInfo.avatar + '?t' + +new Date()
   },
   render() {
     // console.log(this.liveInfo, 121212)

+ 1 - 4
src/views/music/album-detail/index.tsx

@@ -476,10 +476,7 @@ export default defineComponent({
                 <img
                   class={styles.icon}
                   crossorigin="anonymous"
-                  src={
-                    albumDetail.value?.albumCoverUrl +
-                    `@base@tag=imgScale&h=144&w=144&m=1?t=${+new Date()}`
-                  }
+                  src={albumDetail.value?.albumCoverUrl + `?t=${+new Date()}`}
                 />
                 <div class={styles.info}>
                   <h4 class="van-multi-ellipsis--l2">

+ 2 - 8
src/views/music/list/item.tsx

@@ -34,9 +34,7 @@ export default defineComponent({
     // console.log(props, emit)
     const favorite = ref(data.favorite)
     const favoriteLoading = ref(false)
-    const titleImg =
-      data.titleImg + '@base@tag=imgScale&h=80&w=80&m=1?t=' + +new Date()
-    //daya.ks3-cn-beijing.ksyun.com/202204/T2yF851.jpeg@base@tag=imgScale&h=80&w=80&m=1
+    const titleImg = data.titleImg + '?t=' + +new Date()
 
     const toggleFavorite = async (evt: MouseEvent) => {
       evt.stopPropagation()
@@ -173,11 +171,7 @@ export default defineComponent({
               <img
                 class={styles.icon}
                 crossorigin="anonymous"
-                src={
-                  data.titleImg +
-                    `@base@tag=imgScale&h=80&w=80&m=1?t=${+new Date()}` ||
-                  MusicIcon
-                }
+                src={data.titleImg + `?t=${+new Date()}` || MusicIcon}
               />
               <div class={styles.info}>
                 <h4 class="van-multi-ellipsis--l2">{data.musicSheetName}</h4>

+ 1 - 4
src/views/music/music-detail/index.tsx

@@ -955,10 +955,7 @@ export default defineComponent({
                 <img
                   class={styles.icon}
                   crossorigin="anonymous"
-                  src={
-                    musicDetail.value?.titleImg +
-                    `@base@tag=imgScale&h=80&w=80&m=1?t=${+new Date()}`
-                  }
+                  src={musicDetail.value?.titleImg + `?t=${+new Date()}`}
                 />
                 <div class={styles.info}>
                   <h4 class="van-multi-ellipsis--l2">

+ 7 - 4
src/views/order-detail/index.module.less

@@ -78,13 +78,16 @@
     .priceSection {
       display: flex;
       align-items: center;
-      font-size: 16px;
-      color: #1a1a1a;
+      font-size: 14px;
+      font-weight: 500;
+      color: #999999;
+      line-height: 20px;
 
       .price {
-        font-size: 18px;
+        font-size: 28px;
         font-weight: bold;
         color: #ff3535;
+        font-family: DINAlternate-Bold, DINAlternate;
 
         .priceUnit {
           font-size: 14px;
@@ -94,7 +97,7 @@
   }
 
   .btnTenant {
-    background: #FE2451;
+    background: linear-gradient(270deg, #FF204B 0%, #FE5B71 100%);
     font-size: 16px;
     font-weight: 500;
     color: #FFFFFF;

+ 89 - 81
src/views/order-detail/order-album/index.module.less

@@ -1,81 +1,89 @@
-.item {
-  background-color: var(--music-list-item-background-color);
-  // margin: 10px 14px;
-  margin-bottom: 12px;
-  padding: 10px;
-  border-radius: 9px;
-  .header {
-    display: flex;
-    align-items: center;
-    border-bottom: 1px solid var(--music-list-item-border-color);
-    padding-bottom: 12px;
-    .mate {
-      display: flex;
-      flex: 1;
-      align-items: center;
-      .icon {
-        width: 40px;
-        height: 40px;
-      }
-      .info {
-        margin-left: 14px;
-        > h4 {
-          color: var(--music-list-item-title-color);
-          font-size: 14px;
-          font-weight: 600;
-        }
-        > p {
-          color: var(--music-list-item-mate-color);
-          line-height: 17px;
-        }
-      }
-    }
-    .btn {
-      width: 54px;
-      height: 22px;
-      font-size: 12px;
-      border-radius: 11px;
-      padding: 0;
-      border: none;
-      &.vip {
-        background-color: var(--music-list-item-vip-bg);
-        color: var(--music-list-item-vip-color);
-      }
-      &.free {
-        background-color: var(--music-list-item-free-bg);
-        color: var(--music-list-item-free-color);
-      }
-      &.charge {
-        background-color: var(--music-list-item-charge-bg);
-        color: var(--music-list-item-charge-color);
-      }
-    }
-  }
-  .footer {
-    display: flex;
-    padding-top: 8px;
-    align-items: center;
-    justify-content: space-between;
-    .user {
-      display: flex;
-      align-items: center;
-      padding: 0 10px;
-      .userIcon {
-        width: 20px;
-        height: 20px;
-        margin-right: 8px;
-      }
-    }
-    .favorite {
-      font-size: 16px;
-    }
-    .tags {
-      display: flex;
-      align-items: center;
-      --van-tag-default-color: #fff1de;
-      --van-tag-text-color: #ff8c00;
-    }
-  }
-
-  --van-button-disabled-opacity: 1;
-}
+.album {
+  margin: 12px 14px;
+  padding: 10px;
+  background-color: var(--music-list-item-background-color);
+  border-radius: 10px;
+  display: flex;
+  position: relative;
+
+  .albumType {
+    position: absolute;
+    left: 10px;
+    top: 10px;
+    background: linear-gradient(180deg, #ff8900 0%, #ff5100 100%);
+    box-shadow: 0px 1px 2px 0px rgba(150, 13, 0, 0.11);
+    border-radius: 10px 0px 10px 0px;
+    font-size: 12px;
+    padding: 0 6px;
+    line-height: 20px;
+    color: #ffffff;
+  }
+
+  .img {
+    width: 98px;
+    height: 98px;
+    margin-right: 15px;
+    position: relative;
+
+    >img,
+    >div {
+      position: absolute;
+      border-radius: 10px;
+      overflow: hidden;
+    }
+
+  }
+
+  .content {
+    flex: 1;
+
+    >h4 {
+      font-size: 14px;
+      font-weight: 500;
+      color: #131415;
+      line-height: 24px;
+    }
+
+    >p {
+      padding-top: 2px;
+      font-size: 12PX;
+      color: #777777;
+    }
+
+    .footer {
+      span {
+        font-size: 12px;
+        color: #FE2451;
+        line-height: 16px;
+        padding: 1px 6px;
+        border-radius: 4px;
+        border: 1px solid #FE2451;
+
+        margin-right: 5px;
+      }
+    }
+  }
+}
+
+.footer {
+  margin-top: 11px;
+  display: flex;
+
+  >div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 12px;
+    color: var(--music-list-item-mate-color);
+    margin-right: 18px;
+
+    .icon {
+      margin-right: 5px;
+    }
+
+    span {
+      display: block;
+      margin-top: 1px;
+    }
+  }
+}

+ 21 - 1
src/views/order-detail/order-album/index.tsx

@@ -24,6 +24,26 @@ export default defineComponent({
   },
   render() {
     const item = this.item
-    return <Item data={item} style={{ margin: '0 0 10px' }} />
+    return (
+      <div class={styles.album}>
+        <Image class={styles.img} src={item.albumCoverUrl} />
+        {item.paymentType === 'CHARGE' && (
+          <span class={styles.albumType}>付费</span>
+        )}
+
+        <div class={styles.content}>
+          <h4 class="van-ellipsis">{item.albumName}</h4>
+          <p class="van-multi-ellipsis--l2">{item.albumDesc}</p>
+          {/* <Footer
+            musicSheetCount={item.musicSheetCount}
+            albumFavoriteCount={item.albumFavoriteCount}
+          /> */}
+          <div class={styles.footer}>
+            <span>{item.musicSheetCount}首</span>
+            <span>{item.albumFavoriteCount}人收藏</span>
+          </div>
+        </div>
+      </div>
+    )
   }
 })

+ 113 - 81
src/views/order-detail/order-music/index.module.less

@@ -1,81 +1,113 @@
-.item {
-  background-color: var(--music-list-item-background-color);
-  // margin: 10px 14px;
-  margin-bottom: 12px;
-  padding: 10px;
-  border-radius: 9px;
-  .header {
-    display: flex;
-    align-items: center;
-    border-bottom: 1px solid var(--music-list-item-border-color);
-    padding-bottom: 12px;
-    .mate {
-      display: flex;
-      flex: 1;
-      align-items: center;
-      .icon {
-        width: 40px;
-        height: 40px;
-      }
-      .info {
-        margin-left: 14px;
-        > h4 {
-          color: var(--music-list-item-title-color);
-          font-size: 14px;
-          font-weight: 600;
-        }
-        > p {
-          color: var(--music-list-item-mate-color);
-          line-height: 17px;
-        }
-      }
-    }
-    .btn {
-      width: 54px;
-      height: 22px;
-      font-size: 12px;
-      border-radius: 11px;
-      padding: 0;
-      border: none;
-      &.vip {
-        background-color: var(--music-list-item-vip-bg);
-        color: var(--music-list-item-vip-color);
-      }
-      &.free {
-        background-color: var(--music-list-item-free-bg);
-        color: var(--music-list-item-free-color);
-      }
-      &.charge {
-        background-color: var(--music-list-item-charge-bg);
-        color: var(--music-list-item-charge-color);
-      }
-    }
-  }
-  .footer {
-    display: flex;
-    padding-top: 8px;
-    align-items: center;
-    justify-content: space-between;
-    .user {
-      display: flex;
-      align-items: center;
-      padding: 0 10px;
-      .userIcon {
-        width: 20px;
-        height: 20px;
-        margin-right: 8px;
-      }
-    }
-    .favorite {
-      font-size: 16px;
-    }
-    .tags {
-      display: flex;
-      align-items: center;
-      --van-tag-default-color: #fff1de;
-      --van-tag-text-color: #ff8c00;
-    }
-  }
-
-  --van-button-disabled-opacity: 1;
-}
+.item {
+  background-color: var(--music-list-item-background-color);
+  // margin: 10px 14px;
+  margin-bottom: 12px;
+  padding: 10px;
+  border-radius: 9px;
+
+  .header {
+    display: flex;
+    align-items: center;
+    // border-bottom: 1px solid var(--music-list-item-border-color);
+    // padding-bottom: 12px;
+
+    .mate {
+      display: flex;
+      flex: 1;
+
+      .icon {
+        width: 98px;
+        height: 98px;
+        border-radius: 10px;
+        overflow: hidden;
+      }
+
+      .info {
+        margin-left: 14px;
+        flex: 1;
+
+        >h4 {
+          font-size: 14px;
+          font-weight: 500;
+          color: #131415;
+          line-height: 24px;
+        }
+
+        >p {
+          font-size: 12px;
+          color: #777777;
+          line-height: 18px;
+        }
+      }
+    }
+
+    .btn {
+      width: 54px;
+      height: 22px;
+      font-size: 12px;
+      border-radius: 11px;
+      padding: 0;
+      border: none;
+
+      &.vip {
+        background-color: var(--music-list-item-vip-bg);
+        color: var(--music-list-item-vip-color);
+      }
+
+      &.free {
+        background-color: var(--music-list-item-free-bg);
+        color: var(--music-list-item-free-color);
+      }
+
+      &.charge {
+        background-color: var(--music-list-item-charge-bg);
+        color: var(--music-list-item-charge-color);
+      }
+    }
+  }
+
+  .tags {
+    padding-top: 7px;
+    display: flex;
+    align-items: center;
+    --van-tag-default-color: #FFEAF2;
+    --van-tag-text-color: #FE2451;
+
+    font-size: 12px;
+    color: #FE2451;
+    line-height: 16px;
+
+    :global {
+      .van-tag {
+        padding: 2px 6px 1px;
+      }
+    }
+  }
+
+  .footer {
+    display: flex;
+    padding-top: 8px;
+    align-items: center;
+    justify-content: space-between;
+
+    .user {
+      display: flex;
+      align-items: center;
+      padding: 0 10px;
+
+      .userIcon {
+        width: 20px;
+        height: 20px;
+        margin-right: 8px;
+      }
+    }
+
+    .favorite {
+      font-size: 16px;
+    }
+
+
+  }
+
+  --van-button-disabled-opacity: 1;
+}

+ 74 - 75
src/views/order-detail/order-music/index.tsx

@@ -1,75 +1,74 @@
-import { Button, Icon, Image, Tag } from 'vant'
-import classNames from 'classnames'
-import MusicIcon from '@/views/music/list/icons/music-icon.png'
-import InitUserIcon from '@/views/music/list/icons/init-user-icon.png'
-// import FavoriteIcon from '@/student/music/album/favorite.svg'
-// import FavoritedIcon from '@/student/music/album/favorited.svg'
-import { defineComponent } from 'vue'
-import styles from './index.module.less'
-
-const chargeTypes = {
-  CHARGE: '点播',
-  FREE: '免费',
-  VIP: 'VIP'
-}
-
-export default defineComponent({
-  name: 'OrderMusic',
-  props: {
-    item: {
-      type: Object,
-      default: {}
-    }
-  },
-  render() {
-    const item = this.item
-    return (
-      <div class={styles.item}>
-        <header class={styles.header}>
-          <div class={styles.mate}>
-            <Image src={item.titleImg || MusicIcon} round class={styles.icon} />
-            <div class={styles.info}>
-              <h4>{item.musicSheetName}</h4>
-              <p>{item.composer}</p>
-            </div>
-          </div>
-          <div class={styles.buttons}>
-            {/* <Button
-              class={classNames(
-                styles.btn,
-                styles[item.chargeType.toLocaleLowerCase()]
-              )}
-              disabled
-            >
-              {chargeTypes[item.chargeType]}
-              <Icon name="arrow" />
-            </Button> */}
-          </div>
-        </header>
-        <footer class={styles.footer}>
-          <div class={styles.user}>
-            <Image
-              round
-              src={item.addUserAvatar || InitUserIcon}
-              class={styles.userIcon}
-            />
-            <p>{item.addName}</p>
-            <div class={styles.tags}>
-              {(item.subjectNames || '').split(',').map(item => (
-                <Tag>{item}</Tag>
-              ))}
-            </div>
-          </div>
-          <div class={styles.icons}>
-            {/* <Button style={{ border: 'none' }} disabled>
-              <Icon
-                class={styles.favorite}
-                name={this.data.value ? FavoritedIcon : FavoriteIcon}
-              />
-            </Button> */}
-          </div>
-        </footer>
-      </div>
-    )
-  }
-})
+import { Button, Icon, Image, Tag } from 'vant'
+import classNames from 'classnames'
+import MusicIcon from '@/views/music/list/icons/music-icon.png'
+import InitUserIcon from '@/views/music/list/icons/init-user-icon.png'
+// import FavoriteIcon from '@/student/music/album/favorite.svg'
+// import FavoritedIcon from '@/student/music/album/favorited.svg'
+import { defineComponent } from 'vue'
+import styles from './index.module.less'
+
+const chargeTypes = {
+  CHARGE: '点播',
+  FREE: '免费',
+  VIP: 'VIP'
+}
+
+export default defineComponent({
+  name: 'OrderMusic',
+  props: {
+    item: {
+      type: Object,
+      default: {}
+    }
+  },
+  render() {
+    const item = this.item
+    return (
+      <div class={styles.item}>
+        <header class={styles.header}>
+          <div class={styles.mate}>
+            <Image src={item.titleImg || MusicIcon} class={styles.icon} />
+            <div class={styles.info}>
+              <h4>{item.musicSheetName}</h4>
+              <p>{item.composer}</p>
+              <div class={styles.tags}>
+                {(item.subjectNames || '').split(',').map(item => (
+                  <Tag>{item}</Tag>
+                ))}
+              </div>
+            </div>
+          </div>
+          <div class={styles.buttons}>
+            {/* <Button
+              class={classNames(
+                styles.btn,
+                styles[item.chargeType.toLocaleLowerCase()]
+              )}
+              disabled
+            >
+              {chargeTypes[item.chargeType]}
+              <Icon name="arrow" />
+            </Button> */}
+          </div>
+        </header>
+        {/* <footer class={styles.footer}>
+          <div class={styles.user}>
+            <Image
+              round
+              src={item.addUserAvatar || InitUserIcon}
+              class={styles.userIcon}
+            />
+            <p>{item.addName}</p>
+            <div class={styles.tags}>
+              {(item.subjectNames || '').split(',').map(item => (
+                <Tag>{item}</Tag>
+              ))}
+            </div>
+          </div>
+          <div class={styles.icons}>
+          </div>
+        </footer> */}
+      </div>
+    )
+  }
+})

+ 60 - 48
src/views/order-detail/order-vip/index.module.less

@@ -1,48 +1,60 @@
-.memberLogo {
-  width: 53px;
-  height: 50px;
-}
-
-.titleClass {
-  padding-left: 20px;
-}
-
-.title {
-  font-size: 16px;
-  font-weight: 500;
-  color: #333333;
-  line-height: 22px;
-}
-
-.price {
-  padding-top: 3px;
-  font-size: 16px;
-  font-weight: 500;
-  color: #ff4e19;
-  line-height: 20px;
-  i {
-    font-style: normal;
-    font-size: 14px;
-  }
-}
-
-.timerTitle {
-  display: flex;
-  align-items: center;
-  font-size: 14px;
-  font-weight: 500;
-  color: #333333;
-  line-height: 20px;
-  padding-right: 12px;
-}
-
-.timer {
-  font-size: 13px;
-  color: #999999;
-  line-height: 18px;
-}
-
-.timerCell {
-  display: flex;
-  align-items: center;
-}
+.memberLogo {
+  width: 98px;
+  height: 98px;
+}
+
+.titleClass {
+  padding-left: 15px;
+}
+
+.title {
+  padding-top: 2px;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 22px;
+
+  color: #131415;
+}
+
+.price {
+  padding-top: 8px;
+  font-size: 25px;
+  font-family: DINAlternate-Bold, DINAlternate;
+  font-weight: bold;
+  color: #EF2F56;
+
+  i {
+    line-height: 19px;
+    font-style: normal;
+    font-size: 16px;
+  }
+}
+
+.timerTitle {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  font-weight: 500;
+  color: #333333;
+  line-height: 20px;
+  padding-right: 12px;
+}
+
+.timer {
+  font-size: 14px;
+  font-weight: 500;
+  color: #FE2451;
+  line-height: 20px;
+}
+
+.timerCell {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  span {
+    font-size: 16px;
+    font-weight: 600;
+    color: #131415;
+  }
+}

+ 71 - 65
src/views/order-detail/order-vip/index.tsx

@@ -1,65 +1,71 @@
-import { Cell, CellGroup, Icon, Image } from 'vant'
-import { defineComponent } from 'vue'
-import styles from './index.module.less'
-import { orderStatus } from '../orderStatus'
-
-import iconMember from '@common/images/icon_member.png'
-import iconTimer from '@common/images/icon_timer.png'
-import request from '@/helpers/request'
-
-export default defineComponent({
-  name: 'OrderVideo',
-  props: {
-    item: {
-      type: Object,
-      default: {}
-    }
-  },
-  render() {
-    const item = this.item
-    return (
-      <div class={styles.videoOrder}>
-        <CellGroup
-          class={'mb12'}
-          border={false}
-          style={{ borderRadius: '8px', overflow: 'hidden' }}
-        >
-          <Cell
-            center
-            titleClass={styles.titleClass}
-            v-slots={{
-              icon: () => <Image class={styles.memberLogo} src={iconMember} />,
-              title: () => (
-                <div class={styles.container}>
-                  <div class={styles.title}>小酷Ai{item.title}</div>
-                  <div class={styles.price}>
-                    <i>¥</i>
-                    {(this as any).$filters.moneyFormat(item.price)}
-                  </div>
-                </div>
-              )
-            }}
-          />
-
-          <Cell
-            center
-            v-slots={{
-              title: () => (
-                <div class={styles.timerCell}>
-                  <div class={styles.timerTitle}>
-                    <Icon name={iconTimer} size={18} />
-                    <span style={{ paddingLeft: '5px' }}>生效时间</span>
-                  </div>
-                  <div class={styles.timer}>
-                    {item.startTime} 至 {item.endTime}
-                  </div>
-                </div>
-              )
-            }}
-          />
-        </CellGroup>
-      </div>
-      // 视频课
-    )
-  }
-})
+import { Cell, CellGroup, Icon, Image } from 'vant'
+import { defineComponent } from 'vue'
+import styles from './index.module.less'
+import { orderStatus } from '../orderStatus'
+
+import iconMember from '@common/images/icon_member.png'
+import iconTimer from '@common/images/icon_timer.png'
+import request from '@/helpers/request'
+
+export default defineComponent({
+  name: 'OrderVideo',
+  props: {
+    item: {
+      type: Object,
+      default: {}
+    }
+  },
+  render() {
+    const item = this.item
+    return (
+      <div class={styles.videoOrder}>
+        <CellGroup
+          class={'mb12'}
+          border={false}
+          style={{ borderRadius: '8px', overflow: 'hidden' }}
+        >
+          <Cell
+            // center
+            titleClass={styles.titleClass}
+            v-slots={{
+              icon: () => <Image class={styles.memberLogo} src={iconMember} />,
+              title: () => (
+                <div class={styles.container}>
+                  <div class={styles.title}>小酷Ai{item.title}</div>
+                  <div class={styles.price}>
+                    <i>¥</i>
+                    {(this as any).$filters.moneyFormat(item.price)}
+                  </div>
+                </div>
+              )
+            }}
+          />
+        </CellGroup>
+
+        <CellGroup
+          class={'mb12'}
+          border={false}
+          style={{ borderRadius: '8px', overflow: 'hidden' }}
+        >
+          <Cell
+            center
+            v-slots={{
+              title: () => (
+                <div class={styles.timerCell}>
+                  <div class={styles.timerTitle}>
+                    {/* <Icon name={iconTimer} size={18} /> */}
+                    <span style={{ paddingLeft: '5px' }}>生效时间</span>
+                  </div>
+                  <div class={styles.timer}>
+                    {item.startTime} 至 {item.endTime}
+                  </div>
+                </div>
+              )
+            }}
+          />
+        </CellGroup>
+      </div>
+      // 视频课
+    )
+  }
+})

+ 50 - 11
src/views/order-detail/payment/index.module.less

@@ -8,12 +8,17 @@
     .van-icon-cross {
       position: absolute;
       z-index: 1;
-      top: 13px;
+      top: 30px;
       left: 13px;
       color: #ccc;
+      font-size: 18px;
       cursor: pointer;
     }
 
+    .van-cell {
+      padding: 20px;
+    }
+
     // .van-checkbox__icon,
     // .van-radio__icon {
     //   height: 22px;
@@ -26,6 +31,30 @@
     //   background: transparent;
     //   border: transparent;
     // }
+
+    .van-checkbox {
+      display: inline-block;
+      align-items: inherit;
+      overflow: inherit;
+    }
+
+    .van-checkbox__icon {
+      height: 18px;
+      line-height: 18px;
+      display: inline-block;
+      vertical-align: middle;
+    }
+
+    .van-checkbox__label {
+      line-height: 18px;
+    }
+  }
+
+  .boxStyle {
+    background: transparent !important;
+    width: 18px;
+    height: 18px;
+    border: transparent !important;
   }
 
   // .van-popup__close-icon {
@@ -40,10 +69,10 @@
   // }
   .title {
     background-color: #ffffff;
-    font-size: 16px;
-    font-weight: 400;
-    color: #1a1a1a;
-    padding: 14px 0 12px;
+    font-size: 18px;
+    font-weight: 500;
+    color: #333333;
+    padding: 30px 0 12px;
     text-align: center;
   }
 
@@ -59,11 +88,13 @@
     }
 
     .amount {
-      font-size: 28px;
-      color: #000000;
+      font-size: 41px;
+      font-family: DINAlternate-Bold, DINAlternate;
+      font-weight: bold;
+      color: #333333;
 
       span {
-        font-size: 18px;
+        font-size: 31px;
         // padding-right: 3px;
       }
     }
@@ -77,13 +108,17 @@
   .payTypeRe {
     display: flex;
     align-items: center;
+    font-size: 16px;
+    font-weight: 600;
+    color: #333333;
+    line-height: 1.2;
   }
 
   .recommend {
     margin-left: 5px;
-    background: linear-gradient(122deg, #ffa371 0%, #ff6b3b 100%);
+    background: #FE2451;
     border-radius: 10px;
-    font-size: 12px;
+    font-size: 11px;
     color: #ffffff;
     line-height: 16px;
     padding: 0 5px;
@@ -96,4 +131,8 @@
     font-weight: 600;
     margin-bottom: 20px;
   }
-}
+
+  .tenantPayBtn {
+    background: linear-gradient(270deg, #FF204B 0%, #FE5B71 100%);
+  }
+}

+ 50 - 58
src/views/order-detail/payment/index.tsx

@@ -20,6 +20,11 @@ import styles from './index.module.less'
 import { state } from '@/state'
 import { orderStatus } from '../orderStatus'
 import { useEventTracking } from '@/helpers/hooks'
+import activeButtonIcon from '@common/images/icon_checkbox.png'
+import inactiveButtonIcon from '@common/images/icon_checkbox_default.png'
+import activeButtonIconTenant from '@common/images/icon_checkbox-tenant.png'
+import iconWechat from '@common/images/icon-wechat.png'
+import iconAlipay from '@common/images/icon-alipay.png'
 
 interface IOrderInfo {
   orderNo: string | number
@@ -193,63 +198,12 @@ export default defineComponent({
     return (
       <div class={styles.payment}>
         <Icon onClick={this.onClose} name="cross" size={20} />
-        {/* <div class={[styles.title, 'van-hairline--bottom']}>选择支付方式</div>
-
-        <div class={styles.payAmount}>
-          <p>应付金额</p>
-          <div class={styles.amount}>
-            {(this as any).$filters.moneyFormat(this.orderInfo.actualPrice)}
-            <span>元</span>
-          </div>
-        </div>
-        <RadioGroup v-model={this.payType}>
-          <CellGroup border={false}>
-            <Cell
-              title="支付宝支付"
-              border={false}
-              center
-              onClick={() => {
-                this.payType = 'ali_app'
-              }}
-              v-slots={{
-                icon: () => <Icon name="alipay" color="#009fe9" size={22} />,
-                'right-icon': () => <Radio name="ali_app" />
-              }}
-            ></Cell>
-            <Cell
-              title="微信支付"
-              border={false}
-              center
-              onClick={() => {
-                // wx_lite
-                this.payType = 'wx_app'
-              }}
-              v-slots={{
-                icon: () => (
-                  <Icon name="wechat-pay" color="#15c434" size={22} />
-                ),
-                'right-icon': () => <Radio name="wx_app" />
-              }}
-            ></Cell>
-          </CellGroup>
-        </RadioGroup>
-
-        <div class={styles.blank}></div>
-        <Button
-          type="primary"
-          class={styles.payBtn}
-          block
-          round
-          onClick={this.onSubmit}
-        >
-          确认支付
-        </Button> */}
         <div class={[styles.title]}>选择支付方式</div>
 
         <div class={styles.payAmount}>
           <p>应付金额</p>
           <div class={styles.amount}>
-            <span>¥ </span>
+            <span>¥</span>
             {(this as any).$filters.moneyFormat(this.orderInfo.actualPrice)}
           </div>
         </div>
@@ -263,10 +217,26 @@ export default defineComponent({
                 this.payType = 'wx_app'
               }}
               v-slots={{
-                icon: () => (
-                  <Icon name="wechat-pay" color="#15c434" size={22} />
+                icon: () => <Icon name={iconWechat} size={18} />,
+                'right-icon': () => (
+                  <Radio
+                    name="wx_app"
+                    v-slots={{
+                      icon: (props: any) => (
+                        <Icon
+                          class={styles.boxStyle}
+                          name={
+                            props.checked
+                              ? state.projectType === 'tenant'
+                                ? activeButtonIconTenant
+                                : activeButtonIcon
+                              : inactiveButtonIcon
+                          }
+                        />
+                      )
+                    }}
+                  />
                 ),
-                'right-icon': () => <Radio name="wx_app" />,
                 title: () => (
                   <div class={styles.payTypeRe}>
                     微信支付 <span class={styles.recommend}>推荐</span>
@@ -282,8 +252,27 @@ export default defineComponent({
                 this.payType = 'ali_app'
               }}
               v-slots={{
-                icon: () => <Icon name="alipay" color="#009fe9" size={22} />,
-                'right-icon': () => <Radio name="ali_app" />
+                icon: () => <Icon name={iconAlipay} size={18} />,
+                'right-icon': () => (
+                  <Radio
+                    name="ali_app"
+                    v-slots={{
+                      icon: (props: any) => (
+                        <Icon
+                          class={styles.boxStyle}
+                          name={
+                            props.checked
+                              ? state.projectType === 'tenant'
+                                ? activeButtonIconTenant
+                                : activeButtonIcon
+                              : inactiveButtonIcon
+                          }
+                        />
+                      )
+                    }}
+                  />
+                ),
+                title: () => <div class={styles.payTypeRe}>支付宝支付</div>
               }}
             ></Cell>
           </CellGroup>
@@ -292,7 +281,10 @@ export default defineComponent({
         <div class={styles.blank}></div>
         <Button
           type="primary"
-          class={styles.payBtn}
+          class={[
+            styles.payBtn,
+            state.projectType === 'tenant' && styles.tenantPayBtn
+          ]}
           block
           round
           onClick={this.onSubmit}

+ 58 - 45
src/views/order-detail/userAuth/index.module.less

@@ -1,45 +1,58 @@
-.userAuth {
-  min-height: 100vh;
-  background-color: #f6f8f9;
-  overflow: hidden;
-
-  .btnGroup {
-    padding: 0 14px;
-    padding-bottom: 15px;
-  }
-
-  .colProtocol {
-    // display: flex;
-    // align-items: center;
-    font-size: 12px;
-    padding: 15px 14px;
-    color: #999;
-    .protocolText {
-      color: var(--van-primary);
-      line-height: 15px;
-    }
-
-    .boxStyle {
-      background: transparent !important;
-      width: 15px;
-      height: 15px;
-      border: transparent !important;
-    }
-    :global {
-      .van-checkbox {
-        display: inline-block;
-        align-items: inherit;
-        overflow: inherit;
-      }
-      .van-checkbox__icon {
-        height: 15px;
-        line-height: 15px;
-        display: inline-block;
-        vertical-align: middle;
-      }
-      .van-checkbox__label {
-        line-height: 15px;
-      }
-    }
-  }
-}
+.userAuth {
+  min-height: 100vh;
+  background-color: #f6f8f9;
+  overflow: hidden;
+
+  .btnGroup {
+    padding: 0 14px;
+    padding-bottom: 15px;
+  }
+
+  .btnTenant {
+    background: linear-gradient(270deg, #FF204B 0%, #FE5B71 100%);
+    font-size: 16px;
+    font-weight: 500;
+    color: #FFFFFF;
+    border: none;
+    padding: 0 42px !important;
+  }
+
+  .colProtocol {
+    // display: flex;
+    // align-items: center;
+    font-size: 12px;
+    padding: 15px 14px;
+    color: #999;
+
+    .protocolText {
+      color: var(--van-primary);
+      line-height: 15px;
+    }
+
+    .boxStyle {
+      background: transparent !important;
+      width: 15px;
+      height: 15px;
+      border: transparent !important;
+    }
+
+    :global {
+      .van-checkbox {
+        display: inline-block;
+        align-items: inherit;
+        overflow: inherit;
+      }
+
+      .van-checkbox__icon {
+        height: 15px;
+        line-height: 15px;
+        display: inline-block;
+        vertical-align: middle;
+      }
+
+      .van-checkbox__label {
+        line-height: 15px;
+      }
+    }
+  }
+}

+ 7 - 1
src/views/order-detail/userAuth/index.tsx

@@ -145,7 +145,13 @@ export default defineComponent({
           </span>
         </div>
         <div class={['btnGroup']}>
-          <Button block round type="primary" native-type="submit">
+          <Button
+            block
+            round
+            type="primary"
+            native-type="submit"
+            class={state.projectType === 'tenant' && styles.btnTenant}
+          >
             确定
           </Button>
         </div>

+ 4 - 0
src/views/trade/trade-detail.module.less

@@ -105,6 +105,10 @@
     font-size: 14px;
   }
 
+  .price {
+    font-weight: bold;
+  }
+
   .desc,
   .num {
     padding-top: 3px;

+ 1 - 1
vite.config.ts

@@ -12,7 +12,7 @@ function resolve(dir: string) {
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
 // const proxyUrl = 'https://online.colexiu.com/';
-const proxyUrl = 'https://test.colexiu.com/'
+const proxyUrl = 'https://dev.colexiu.com/'
 // const proxyUrl = 'http://192.168.3.143:8000/'
 export default defineConfig({
   base: './',