添加活动

src/student/leaderboard/index.tsx

@@ -39,6 +39,7 @@ export default defineComponent({
       musicList: [] as IMusicItem[],
       isSignup: false, // 是否报名
       isChallenge: false, // 是否挑战过
+      rankingMethod: '',
       score: 0
     })
     const getMusicList = async () => {
@@ -46,13 +47,17 @@ export default defineComponent({
         const { data } = await request.post(
           `/api-student/open/activity/info/${route.query.id}`
         )
-        if (Array.isArray(data.activityMusicVoList)) {
-          state.musicList = data.activityMusicVoList.map(n => {
+        state.rankingMethod = data.rankingMethod
+        const activityList =
+          data.rankingMethod === 'TOTAL_SCORE'
+            ? data.subjectInfos
+            : data.activityMusicVoList
+        if (Array.isArray(activityList)) {
+          state.musicList = activityList.map(n => {
             n.rankingList = []
             return n
           })
-          state.isChallenge = data.activityMusicVoList.filter(n => n.join)
-            .length
+          state.isChallenge = activityList.filter(n => n.join).length
             ? true
             : false
         }
@@ -151,7 +156,13 @@ export default defineComponent({
             >
               {state.musicList.map((item: IMusicItem) => {
                 return (
-                  <Tab title={item.musicSheetName}>
+                  <Tab
+                    title={
+                      state.rankingMethod === 'TOTAL_SCORE'
+                        ? item.subjectName
+                        : item.musicSheetName
+                    }
+                  >
                     <div
                       class={[
                         styles.tabContent,

src/student/main.ts

@@ -14,8 +14,8 @@ import { browser } from '@/helpers/utils'
 
 const app = createApp(App)
 
-import Vconsole from 'vconsole'
-const vconsole = new Vconsole()
+// import Vconsole from 'vconsole'
+// const vconsole = new Vconsole()
 postMessage(
   {
     api: 'getVersion'

src/student/share-active/track-review-activity/index.module.less

@@ -243,11 +243,9 @@
       overflow: hidden;
       line-height: 1;
     }
-    .name {
-      padding-bottom: 3px;
-    }
 
     .subjectName {
+      margin-top: 3px;
       display: inline-block;
       font-size: 12px;
       color: #ff8c00;
@@ -441,6 +439,10 @@
       padding: 14px 20px;
     }
     .van-cell__title {
+      flex-shrink: 0;
+    }
+    .van-cell__title,
+    .van-cell__value {
       flex: 1 auto;
     }
   }
@@ -451,6 +453,7 @@
     border-radius: 8px;
     overflow: hidden;
     margin-right: 10px;
+    flex-shrink: 0;
   }
 
   .musicName {
@@ -458,6 +461,7 @@
     font-weight: 600;
     color: #1a1a1a;
     line-height: 22px;
+    max-width: 200px;
   }
 
   .labelClass {

src/student/share-active/track-review-activity/index.tsx

@@ -84,7 +84,7 @@ export default defineComponent({
           })
         }
       }
-      console.log(list)
+      // console.log(list)
       return list || []
     }
   },

src/student/share-active/track-review-activity/track-song.tsx

@@ -30,7 +30,8 @@ export default defineComponent({
       backIconColor: 'white',
       title: subjectName + '曲目评测',
       behaviorId: getRandomKey(),
-      musicList: [] as any
+      musicList: [] as any,
+      rankingScore: 0
     }
   },
   async mounted() {
@@ -60,6 +61,7 @@ export default defineComponent({
           (activity: any) => activity.subjectId == this.subjectId
         )
         this.musicList = musicList
+        this.rankingScore = data.rankingScore || 0
       } catch {
         //
       }
@@ -100,9 +102,15 @@ export default defineComponent({
   computed: {
     allScore() {
       const musicList = this.musicList || []
-      // let score = musicList.reduce((total, currentIndex3))
-
-      return 0
+      let score = 0
+      musicList.forEach((item: any) => {
+        score += item.score
+      })
+      return score
+    },
+    calcScore() {
+      const allScore = this.allScore as number
+      return Number(this.rankingScore - allScore)
     }
   },
   render() {
@@ -125,9 +133,11 @@ export default defineComponent({
           >
             <div class={styles.trackScore}>
               <div class={styles.trackCountScore}>
-                我的总分 <span>196</span>
+                我的总分 <span>{this.allScore}</span>
+              </div>
+              <div class={styles.trackIf}>
+                距离要求分数还有{this.calcScore}分，继续加油！
               </div>
-              <div class={styles.trackIf}>距离要求分数还有94分，继续加油！</div>
 
               <Image
                 class={styles.trackImg}

src/teacher/share-page/track-review-activity/index.tsx

@@ -26,23 +26,34 @@ export default defineComponent({
     }
   },
   computed: {
+    rankingMethod() {
+      const activeInfo: any = this.activeInfo
+      return activeInfo.rankingMethod || ''
+    },
     activityMusic() {
       const activeInfo: any = this.activeInfo
-      return activeInfo.activityMusicVoList || []
+      const list =
+        activeInfo.rankingMethod === 'TOTAL_SCORE'
+          ? activeInfo.subjectInfos
+          : activeInfo.activityMusicVoList
+      return list || []
     },
     rewardList() {
       const activeInfo: any = this.activeInfo
-      // activityRewardList = activityRewardList?.activityRewardList
-      // console.log(activityRewardList)
       let list = activeInfo.activityRewardList || []
       if (list && list.length > 0) {
-        const last = list.sort((a: any, b: any) => {
-          return Number(a.group) < Number(b.group) ? -1 : 1
-        })
-        list = this.groupBy(last, (item: any) => {
-          return [item.group]
-        })
+        if (activeInfo.rankingMethod === 'TOTAL_SCORE') {
+          list = [list]
+        } else {
+          const last = list.sort((a: any, b: any) => {
+            return Number(a.group) < Number(b.group) ? -1 : 1
+          })
+          list = this.groupBy(last, (item: any) => {
+            return [item.group]
+          })
+        }
       }
+      // console.log(list)
       return list || []
     }
   },
@@ -182,25 +193,34 @@ export default defineComponent({
             {this.rewardList.map((item: any, index: number) => (
               <>
                 <div class={styles.prizeTitle}>
-                  {index === 0 && (
-                    <Image
-                      class={styles.prizeLevel}
-                      src={getAssetsHomeFile('icon_level.png')}
-                    />
-                  )}
-                  {index === 1 && (
-                    <Image
-                      class={styles.prizeLevel}
-                      src={getAssetsHomeFile('icon_level2.png')}
-                    />
-                  )}
-                  {index === 2 && (
-                    <Image
-                      class={styles.prizeLevel}
-                      src={getAssetsHomeFile('icon_level3.png')}
-                    />
+                  {this.rankingMethod === 'TOTAL_SCORE' ? (
+                    <div class={styles.prizeTitle_score}>
+                      总评测分数达到 {this.activeInfo.rankingScore || 0}
+                      分即可获奖
+                    </div>
+                  ) : (
+                    <>
+                      {index === 0 && (
+                        <Image
+                          class={styles.prizeLevel}
+                          src={getAssetsHomeFile('icon_level.png')}
+                        />
+                      )}
+                      {index === 1 && (
+                        <Image
+                          class={styles.prizeLevel}
+                          src={getAssetsHomeFile('icon_level2.png')}
+                        />
+                      )}
+                      {index === 2 && (
+                        <Image
+                          class={styles.prizeLevel}
+                          src={getAssetsHomeFile('icon_level3.png')}
+                        />
+                      )}
+                      第{++index}名奖品
+                    </>
                   )}
-                  第{++index}名奖品
                 </div>
                 <div class={styles.prizeSection}>
                   {item.map((child: any) => (
@@ -236,22 +256,25 @@ export default defineComponent({
                 活动曲目
               </span>
 
-              <span
-                class={styles.titleTips}
-                // onClick={() =>
-                //   this.$router.push({
-                //     path: '/leaderboard',
-                //     query: { id: this.id }
-                //   })
-                // }
-              >
-                {/* 查看挑战排行榜
-                <img
-                  style={{ width: '16px', marginLeft: '4px' }}
-                  src={getAssetsHomeFile('icon-lv.png')}
-                /> */}
-                共{this.activityMusic.length || 0}首曲目
-              </span>
+              {this.rankingMethod === 'TOTAL_SCORE' ? (
+                <span
+                  class={styles.titleTips}
+                  onClick={() => {
+                    this.$router.push({
+                      path: '/track-subject-song',
+                      query: {
+                        id: this.id
+                      }
+                    })
+                  }}
+                >
+                  查看曲目
+                </span>
+              ) : (
+                <span class={styles.titleTips}>
+                  共{this.activityMusic.length || 0}首曲目
+                </span>
+              )}
             </h2>
 
             {this.activityMusic.map((item: any) => (
@@ -262,16 +285,38 @@ export default defineComponent({
                   v-slots={{
                     icon: () => (
                       <Image
-                        src={getAssetsHomeFile('icon_music.png')}
+                        src={getAssetsHomeFile(
+                          this.rankingMethod === 'TOTAL_SCORE'
+                            ? 'icon_music.png'
+                            : 'icon_subject.png'
+                        )}
                         class={styles.iconMusic}
                       />
                     ),
                     title: () => (
                       <span class={styles.musicName}>
-                        {item.musicSheetName}
+                        {this.rankingMethod === 'TOTAL_SCORE'
+                          ? item.subjectName
+                          : item.musicSheetName}
                       </span>
                     ),
-                    value: () => <span>{item.musicSubject}</span>
+                    value: () => (
+                      <span
+                        onClick={() => {
+                          this.$router.push({
+                            path: '/track-subject-song',
+                            query: {
+                              id: this.id,
+                              subjectId: item.subjectId
+                            }
+                          })
+                        }}
+                      >
+                        {this.rankingMethod === 'TOTAL_SCORE'
+                          ? `共${item.musicNums}首活动曲目`
+                          : item.musicSubject}
+                      </span>
+                    )
                   }}
                 />
                 <Cell
@@ -319,11 +364,13 @@ export default defineComponent({
                             {item.userId ? (
                               <>
                                 <p class={styles.name}>{item.username}</p>
-                                <p>
-                                  <span class={styles.subjectName}>
-                                    {item.userSubject}
-                                  </span>
-                                </p>{' '}
+                                {this.rankingMethod !== 'TOTAL_SCORE' && (
+                                  <p>
+                                    <span class={styles.subjectName}>
+                                      {item.userSubject}
+                                    </span>
+                                  </p>
+                                )}
                               </>
                             ) : (
                               <span class={styles.noText}>虚位以待</span>
@@ -338,11 +385,7 @@ export default defineComponent({
                               height: '32px'
                             }}
                             color="linear-gradient(180deg, #FFA200 0%, #FF6900 100%)"
-                            disabled={
-                              // this.activeInfo.join === 0 ||
-                              // (this.userSelectMusic && item.join !== 1)
-                              true
-                            }
+                            disabled={true}
                           >
                             立刻挑战
                           </Button>

src/views/share-page/track-review-activity/index.module.less

@@ -1,5 +1,10 @@
 .subjectSong {
   overflow: hidden;
+  :global {
+    .van-sticky {
+      background-color: #f6f8f9;
+    }
+  }
 }
 
 .subjectSearch {
@@ -10,13 +15,17 @@
 
 .cellGroup {
   border-radius: 12px;
-  padding: 2px 0;
   overflow: hidden;
   margin: 0 14px;
 
   :global {
     .van-cell {
       padding: 14px;
+
+      &:first-child,
+      &:last-child {
+        margin-top: 2px;
+      }
     }
   }
 
@@ -26,6 +35,7 @@
     border-radius: 8px;
     overflow: hidden;
     margin-right: 10px;
+    flex-shrink: 0;
   }
 
   .musicName {

src/views/share-page/track-review-activity/subject-song.tsx

@@ -1,13 +1,63 @@
 import { defineComponent } from 'vue'
 import styles from './index.module.less'
 import { Cell, CellGroup, Picker, Popup, Sticky, Image } from 'vant'
+import request from '@/helpers/request'
 
 export default defineComponent({
   name: 'subject-song',
   data() {
+    const query = this.$route.query
     return {
+      id: query.id,
+      subjectId: query.subjectId,
+      // subjectName: '',
       showSubject: false,
-      columns: ['长笛', '长号']
+      columns: [] as any,
+      activeInfo: {} as any
+    }
+  },
+  async mounted() {
+    await this.getMusicInfo()
+  },
+  methods: {
+    async getMusicInfo() {
+      try {
+        const res = await request.post(
+          '/api-student/open/activity/info/' + this.id
+        )
+        this.activeInfo = res.data
+
+        const subjectInfos = res.data.subjectInfos || []
+        const tmp = [] as any
+        subjectInfos.forEach((subject: any) => {
+          tmp.push({
+            text: subject.subjectName,
+            value: subject.subjectId
+          })
+        })
+        this.columns = tmp
+        // 初始化显示的声部
+        this.subjectId = this.subjectId || subjectInfos[0].value
+      } catch {
+        //
+      }
+    }
+  },
+  computed: {
+    subjectName() {
+      if (!this.subjectId) {
+        return ''
+      }
+      const columns = this.columns
+      const list = columns.find((c: any) => c.value === this.subjectId)
+      return list ? list.text : ''
+    },
+    selectSubjectList() {
+      const musicList = this.activeInfo.activityMusicVoList || []
+      const tmpList = musicList.filter(
+        (music: any) => music.subjectId === this.subjectId
+      )
+      return tmpList
     }
   },
   render() {
@@ -16,7 +66,7 @@ export default defineComponent({
         <Sticky position="top">
           <Cell
             class={styles.subjectSearch}
-            title="长笛声部"
+            title={`${this.subjectName} 声部`}
             isLink
             arrowDirection="down"
             onClick={() => {
@@ -26,13 +76,19 @@ export default defineComponent({
         </Sticky>
 
         <CellGroup inset class={styles.cellGroup}>
-          {[1, 2, 3, 4].map(() => (
+          {this.selectSubjectList.map((item: any) => (
             <Cell
               center
               v-slots={{
-                icon: () => <Image src="" class={styles.musicPic} />,
-                title: () => <div class={styles.musicName}>斯卡布罗集市斯</div>,
-                label: () => <div class={styles.labelClass}>作者：Alex Liu</div>
+                icon: () => (
+                  <Image src={item.musicImage} class={styles.musicPic} />
+                ),
+                title: () => (
+                  <div class={styles.musicName}>{item.musicSheetName}</div>
+                ),
+                label: () => (
+                  <div class={styles.labelClass}>作者：{item.composer}</div>
+                )
               }}
             />
           ))}
@@ -46,7 +102,7 @@ export default defineComponent({
               this.showSubject = false
             }}
             onConfirm={(val: any) => {
-              console.log(val)
+              this.subjectId = val.value
               this.showSubject = false
             }}
           />