Merge branch 'iteration-20241126' into iteration-20250107-url

src/business-components/course-plan-step/index.module.less

@@ -73,19 +73,21 @@
       font-size: 13px;
       color: #7a7a7a;
       line-height: 20px;
+    }
 
-      .state0, .state1, .state2 {
-        font-weight: 500;
-        font-size: 14px;
-        color: #ff802c;
-        line-height: 22px;
-      }
-      .state2 {
-        color: #2DC7AA;
-      }
-      .state2 {
-        color: #999999;
-      }
+    .state0,
+    .state1,
+    .state2 {
+      font-weight: 500;
+      font-size: 14px;
+      color: #ff802c;
+      line-height: 22px;
+    }
+    .state2 {
+      color: #2dc7aa;
+    }
+    .state2 {
+      color: #999999;
     }
   }
 

src/business-components/user-detail/index.tsx

@@ -109,7 +109,7 @@ export default defineComponent({
                       <div class={[styles.buyNum, styles.buyNumOther]}>
                         {this.userInfo.type === 'live' ? (
                           <span>
-                            {this.userInfo.buyNum}人已
+                            {this.userInfo.buyNum}人
                             {this.userInfo.lessonPrice <= 0 &&
                             this.userInfo.auditVersion === 0
                               ? '领取'

src/student/live-class/live-detail.module.less

@@ -23,6 +23,7 @@
 
     h3 {
       display: flex;
+      align-items: center;
       font-size: 14px;
       font-weight: 500;
       color: #333333;
@@ -47,7 +48,7 @@
   .btnMore {
     display: flex;
     justify-content: space-around;
-    padding: 20px 28px 30px;
+    padding: 10px 28px 30px;
     background: linear-gradient( 180deg, rgba(255,255,255,0) 0%, #FFFFFF 100%), #FFFDFD;
     box-shadow: 0px 0px 2px 0px rgba(216,216,216,0.5);
 

src/student/teacher-dependent/components/vip.module.less

@@ -1,4 +1,4 @@
-.tipSection {
+.tipSection2 {
   padding: 4px 14px 0;
 }
 :global {
@@ -131,49 +131,6 @@
   background: #fff;
   padding-top: 10px;
   padding-bottom: 30px;
-}
-
-
-.tipSection {
-  position: relative;
-  background: #FFFFFF;
-  border-radius: 6px;
-  margin-bottom: 12px;
-  .iconCross {
-    position: absolute;
-    top: 15px;
-    right: 13px;
-    font-size: 16px;
-    color: #CCCCCC;
-    cursor: pointer;
-  }
-  .tipTitle {
-    padding: 12px 12px 10px;
-    font-weight: 500;
-    font-size: 15px;
-    color: #333333;
-    line-height: 18px;
-
-    img {
-      width: 18px;
-      height: 18px;
-      margin-right: 6px;
-      vertical-align: text-bottom;
-    }
-  }
-  .tipContent {
-    padding: 0 12px 10px;
-    font-size: 13px;
-    color: #777777;
-    line-height: 22px;
-  }
-  .tipFooter {
-    margin: 0 12px;
-    padding: 10px 0;
-    text-align: center;
-    border-top: 1px solid #F2F2F2;
-    font-size: 13px;
-    color: #2DC7AA;
-    line-height: 18px;
-  }
+  background: linear-gradient( 180deg, rgba(255,255,255,0) 0%, #FFFFFF 100%), #FFFDFD;
+  box-shadow: 0px 0px 2px 0px rgba(216,216,216,0.5);
 }

src/student/teacher-dependent/components/vip.tsx

@@ -395,7 +395,8 @@ export default defineComponent({
   render() {
     return (
       <>
-        <div class={styles.tipSection}><Tips type="LIVE_COURSE" title='什么是VIP定制课？' content='VIP定制课程采用一对一专属授课模式，每节课时长为45分钟。课程内容根据学生的具体需求量身打造，旨在全面提升学生的个人技能与表现。不论是希望在乐器演奏技巧上取得突破，如提高指法精准度、气息控制能力或节奏掌握等；还是为即将到来的重要活动、比赛或考级做充分准备，我们都能提供高度匹配的教学方案。此外，教学进度将根据每位学员的学习吸收情况灵活调整，确保每个人都能在最适合自己的节奏中稳步前进，扎实提升个人能力。' /></div>
+      <div class={styles.tipSection2}>
+        <Tips type="LIVE_COURSE" title='什么是VIP定制课？' content='VIP定制课程采用一对一专属授课模式，每节课时长为45分钟。课程内容根据学生的具体需求量身打造，旨在全面提升学生的个人技能与表现。不论是希望在乐器演奏技巧上取得突破，如提高指法精准度、气息控制能力或节奏掌握等；还是为即将到来的重要活动、比赛或考级做充分准备，我们都能提供高度匹配的教学方案。此外，教学进度将根据每位学员的学习吸收情况灵活调整，确保每个人都能在最适合自己的节奏中稳步前进，扎实提升个人能力。' /></div>
         {!this.loadDataStatus &&
           (this.settingStatus ? (
             <>

src/student/video-class/video-class-detail.module.less

@@ -1,5 +1,6 @@
 .video-class-detail {
   min-height: 100vh;
+  --message-field: 30px;
 
   .videoDesc {
     background-color: #fff;
@@ -94,4 +95,9 @@
   bottom: 0;
   left: 0;
   right: 0;
+  :global {
+    .van-field {
+      padding-bottom: var(--message-field);
+    }
+  }
 }

src/student/video-class/video-class-detail.tsx

@@ -419,9 +419,9 @@ export default defineComponent({
               style={{
                 // height: `calc(100vh - 380px - ${this.navHeight}px)`,
                 overflowY: 'auto',
-                height: `calc(100vh - var(--van-tabs-line-height) - var(--header-height) - (var(--van-cell-vertical-padding) * 2 + var( --van-cell-line-height)))`,
+                height: `calc(100vh - var(--van-tabs-line-height) - var(--message-field) - var(--header-height) - (var(--van-cell-vertical-padding) * 2 + var( --van-cell-line-height)))`,
                 marginBottom:
-                  'calc(var(--van-cell-vertical-padding) * 2 + var( --van-cell-line-height))'
+                  'calc(var(--van-cell-vertical-padding) * 2 + var( --van-cell-line-height) + var(--message-field))'
               }}
             >
               {this.dataShow ? (

src/student/video-class/video-detail.module.less

@@ -17,7 +17,7 @@
   .btnMore {
     display: flex;
     justify-content: space-around;
-    padding: 20px 28px 30px;
+    padding: 10px 28px 30px;
     background: linear-gradient( 180deg, rgba(255,255,255,0) 0%, #FFFFFF 100%), #FFFDFD;
     box-shadow: 0px 0px 2px 0px rgba(216,216,216,0.5);
 

src/styles/index.less

@@ -124,6 +124,10 @@ body {
   margin-bottom: 16px !important;
 }
 
+.mb24 {
+  margin-bottom: 24px !important;
+}
+
 .mt8 {
   margin-top: 8px !important;
 }

src/teacher/live-class/live-detail.module.less

@@ -24,7 +24,7 @@
 .btnMore {
   display: flex;
   justify-content: space-around;
-  padding: 20px 28px 30px;
+  padding: 10px 28px 30px;
   background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%),
     #fffdfd;
   box-shadow: 0px 0px 2px 0px rgba(216, 216, 216, 0.5);

src/teacher/live-class/live-detail.tsx

@@ -211,6 +211,7 @@ export default defineComponent({
         {this.myself ? (
           <SectionDetail title="课程列表" icon="courseList" border={true}>
             <CoursePlanStep
+              showState
               courseInfo={this.courseInfo}
               courseId={Number(this.courseId) || 0}
             />
@@ -225,17 +226,18 @@ export default defineComponent({
             <Tabs color="var(--van-primary)" lineWidth={20} sticky>
               <Tab title="课程列表" titleClass="van-hairline--bottom">
                 <CoursePlanStep
-                  showState={
-                    this.joinRoom == '1' && this.liveStatus.liveStatus !== 2
-                  }
+                  showState
+                  // ={
+                  //   this.joinRoom == '1' && this.liveStatus.liveStatus !== 2
+                  // }
                   courseInfo={this.courseInfo}
                   courseId={Number(this.courseId) || 0}
                 />
               </Tab>
-              <Tab title="上课学员" titleClass="van-hairline--bottom">
+              <Tab title="上课学生" titleClass="van-hairline--bottom">
                 {this.studentList.map((item: any) => (
                   <UserList
-                    class="mb16"
+                    class="mb24"
                     users={{
                       avatar: item.avatar,
                       studentId: item.studentId,
@@ -259,10 +261,7 @@ export default defineComponent({
           <>
             {this.courseOffStatus && (
               <TheSticky position="bottom">
-                <div
-                  class={['btnGroup']}
-                  style={{ paddingTop: '10px', background: '#fff' }}
-                >
+                <div class={['btnGroup']}>
                   <Button
                     block
                     round
@@ -277,10 +276,7 @@ export default defineComponent({
 
             {this.joinRoom == '1' && this.liveStatus.liveStatus !== 2 && (
               <TheSticky position="bottom">
-                <div
-                  class={['btnGroup', styles.btnMore]}
-                  style={{ paddingTop: '10px', background: '#fff' }}
-                >
+                <div class={['btnGroup', styles.btnMore]}>
                   <Button block round type="primary" onClick={this.onJoinRoom}>
                     进入直播间
                   </Button>
@@ -290,10 +286,7 @@ export default defineComponent({
 
             {this.share == '1' && this.courseInfo.length > 0 && (
               <TheSticky position="bottom">
-                <div
-                  class={['btnGroup', styles.btnMore]}
-                  style={{ paddingTop: '10px', background: '#fff' }}
-                >
+                <div class={['btnGroup', styles.btnMore]}>
                   <Button
                     block
                     round

src/teacher/my-sheetMusic/index.tsx

@@ -42,6 +42,7 @@ export default defineComponent({
             v-model:active={activeTab.value}
             onChange={val => (activeTab.value = val)}
             sticky
+            swipeThreshold={4}
             offsetTop={height.value}
           >
             <Tab title="购买单曲" name="personal">
@@ -59,7 +60,7 @@ export default defineComponent({
                 <AlbumMy />
               </div>
             </Tab>
-            <Tab title="收藏单曲" name="collection">
+            <Tab title="收藏平台单曲" name="collection">
               <div class={styles.container}>
                 <Collection
                   ref={collection}

src/teacher/statistics/home-statistics-detail/buy-item/index.module.less

@@ -61,7 +61,7 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    padding: 3px 0;
+    padding: 1px 0;
     .iTitle {
       font-weight: 600;
       font-size: 14px;

src/teacher/statistics/home-statistics-detail/echats/index.module.less

@@ -137,7 +137,7 @@
   // }
 
   .popupSection {
-    padding: 0 16px 30px;
+    padding: 0 16px 40px;
     .title {
       display: flex;
       justify-content: space-between;
@@ -226,11 +226,11 @@
         color: #999999;
         cursor: pointer;
 
-        &.active {
-          border: 1px solid #2dc7aa;
-          color: #2dc7aa;
-          background: #e9fff8;
-        }
+        // &.active {
+        //   border: 1px solid #2dc7aa;
+        //   color: #2dc7aa;
+        //   background: #e9fff8;
+        // }
       }
       .hasValue {
         color: #333;

src/teacher/statistics/home-statistics-detail/echats/index.tsx

@@ -10,7 +10,7 @@ import {
 } from 'vue'
 import styles from './index.module.less'
 import icon1 from '../../images/icon1.png'
-import iconArrow from '../../images/icon-arrow.png'
+// import iconArrow from '../../images/icon-arrow.png'
 import iconArrow1 from '../../images/icon-arrow1.png'
 import iconArrow11 from '../../images/icon-arrow1-1.png'
 import * as echarts from 'echarts/core'
@@ -59,7 +59,7 @@ echarts.use([
   LineChart
 ])
 
-const lineChartOption = (xAxisData: any, seriesData: any) => {
+const lineChartOption = (xAxisData: any, seriesData: any, countMaxCount = 5) => {
   return {
     title: {
       text: '单位：次',
@@ -81,7 +81,8 @@ const lineChartOption = (xAxisData: any, seriesData: any) => {
         margin: 16
       },
       axisTick: {
-        show: false
+        show: true,
+        alignWithLabel: true
       },
       axisPointer: {
         handle: {
@@ -203,7 +204,8 @@ const lineChartOption = (xAxisData: any, seriesData: any) => {
       splitLine: {
         axisLine: { lineStyle: { color: '#8C8C8C' } },
         lineStyle: { color: ['#f2f2f2'], type: 'dashed' }
-      }
+      },
+      splitNumber: countMaxCount
     },
     dataZoom: [{ type: 'inside', throttle: 100 }],
     toolbox: { feature: { saveAsImage: { show: false } } }
@@ -229,6 +231,7 @@ export default defineComponent({
       buyCount: 0,
       time: ''
     })
+    const countMaxCount = ref(5)
     const currentType = ref<TIME_TYPE>(props.currentType)
     const timeRange = getTimeRange(currentType.value)
     const searchStatus = ref(false)
@@ -261,10 +264,11 @@ export default defineComponent({
         statisticCounts.value.browseCount = props.obj.browseCount || 0
         statisticCounts.value.buyCount = props.obj.buyCount || 0
         statisticCounts.value.time = props.obj.time
+        countMaxCount.value = props.obj.countMaxCount
         myChart.clear()
         lineChartOption &&
           myChart.setOption(
-            lineChartOption(props.obj.xAxisData, props.obj.yAxisData)
+            lineChartOption(props.obj.xAxisData, props.obj.yAxisData, countMaxCount.value)
           )
         myChart.on('highlight', function (params: any) {
           const batch = params.batch || []

src/teacher/statistics/home-statistics-detail/list/index.module.less

@@ -32,6 +32,7 @@
     left: 0;
     background: #ffffff;
     border-radius: 10px 10px 0 0;
+    z-index: 1;
 
     .title {
       display: flex;
@@ -59,7 +60,7 @@
   }
   .tipSection {
     background: #fff;
-    padding-bottom: 18px;
+    padding-bottom: 6px;
   }
   .incomeTip {
     font-size: 13px;
@@ -105,4 +106,12 @@
     //   right: -26px;
     // }
   }
+
+  .cellGroup {
+    :global {
+      .van-cell:first-child {
+        padding-top: 6px !important;
+      }
+    }
+  }
 }

src/teacher/statistics/home-statistics-detail/list/index.tsx

@@ -35,6 +35,7 @@ export default defineComponent({
     const obj = ref({
       xAxisData: [] as any,
       yAxisData: [] as any,
+      countMaxCount: 5,
       browseCount: 0,
       buyCount: 0,
       time: ''
@@ -66,10 +67,14 @@ export default defineComponent({
         const exposure = data.exposure || []
         const xAxisData: string[] = []
         const exposureList: number[] = []
+        let maxCount = 0 // 最大人数 - 用记设置练习人数分割线
         exposure.forEach((item: any, index: number) => {
           xAxisData.push(item.date)
           exposureList.push(item.exposureNum)
 
+          if (maxCount < (item.exposureNum || 0)) {
+            maxCount = item.exposureNum
+          }
           if (exposure.length - 1 === index) {
             obj.value.browseCount = item.exposureNum
             obj.value.time = item.date
@@ -84,9 +89,11 @@ export default defineComponent({
           }
         })
         const yAxisData = [exposureList, buyList]
+        const countMaxCount = maxCount >= 5 ? 5 : Math.max(maxCount, 1)
 
         obj.value.xAxisData = xAxisData
         obj.value.yAxisData = yAxisData
+        obj.value.countMaxCount = countMaxCount
       } catch {
         //
       }
@@ -175,7 +182,7 @@ export default defineComponent({
               immediateCheck={false}
               onLoad={getList}
             >
-              <CellGroup border={false}>
+              <CellGroup class={styles.cellGroup} border={false}>
                 {['VIP_COURSE', 'PRACTICE'].includes(props.type) && (
                   <TeacherItem list={tableList.value} />
                 )}

src/teacher/statistics/home-statistics/index.tsx

@@ -76,10 +76,11 @@ const lineChartOption = (
       lineStyle: { color: '#F2F2F2' },
       boundaryGap: true,
       axisTick: {
-        show: false
+        show: true,
+        alignWithLabel: true
       },
       axisLabel: {
-        margin: 16,
+        margin: 16
         // formatter: function (value, index) {
         //   // 第一个和最后一个标签分别居左和居右显示
         //   if (index === 0) {
@@ -243,6 +244,7 @@ export default defineComponent({
     const popoverStatus = ref(false)
     const currentType = ref<TIME_TYPE>('MONTH')
     const timeRange = ref(getTimeRange(currentType.value))
+    // const isNotifyHeight = ref(false)
     const statisticCounts = ref({
       browseCount: 0,
       buyCount: 0,
@@ -253,8 +255,11 @@ export default defineComponent({
       myChart = echarts.init(
         document.getElementById('eChart') as HTMLDivElement
       )
+      getHeight()
       getDetail()
+    })
 
+    const getHeight = () => {
       const round = homeStatisticsRef.value?.getBoundingClientRect()
       postMessage({
         api: 'homeStatisticsHeight',
@@ -262,7 +267,8 @@ export default defineComponent({
           height: round.height || 300
         }
       })
-    })
+      // isNotifyHeight.value = true
+    }
 
     const searchText = computed(() => {
       const template = {
@@ -279,6 +285,7 @@ export default defineComponent({
         const { data } = await request.post(
           '/api-teacher/home/courseExposure',
           {
+            hideLoading: true,
             data: timeRange.value
           }
         )
@@ -378,6 +385,9 @@ export default defineComponent({
 
     // 监听页面返回
     listenerMessage('webViewOnResume', () => {
+      // if (!isNotifyHeight.value) {
+      //   getHeight()
+      // }
       getDetail()
     })
     return () => (
@@ -397,9 +407,9 @@ export default defineComponent({
         <div class={styles.eChartSection}>
           <div class={styles.eChartTitle}>
             <div class={styles.left}>
-              {statisticCounts.value.time && (
+              {/* {statisticCounts.value.time && ( */}
                 <div class={styles.time}>{statisticCounts.value.time}</div>
-              )}
+              {/* )} */}
 
               <div class={styles.twoItem}>
                 <div class={styles.item} style="--color: #2DC7AA">

src/teacher/statistics/practice-statistics-detail/echats/index.tsx

@@ -1,10 +1,8 @@
 import {
   defineComponent,
   nextTick,
-  onMounted,
   PropType,
   ref,
-  shallowRef,
   watch
 } from 'vue'
 import styles from './index.module.less'
@@ -33,7 +31,6 @@ import {
 import { LabelLayout } from 'echarts/features'
 import { CanvasRenderer } from 'echarts/renderers'
 import { formatSecToHMS } from '..'
-import { boxShadow } from 'html2canvas/dist/types/css/property-descriptors/box-shadow'
 
 // 注册必须的组件
 echarts.use([
@@ -86,7 +83,8 @@ const lineChartOption = (params: {
         // inside: false
       },
       axisTick: {
-        show: false
+        show: true,
+        alignWithLabel: true
       },
       axisPointer: {
         handle: {
@@ -159,7 +157,7 @@ const lineChartOption = (params: {
         // 固定在顶部
         return [point[0], '10%']
       },
-      backgroundColor: '#FF6079',
+      backgroundColor: params.colors.lineColor || '#FF6079',
       boxShadow: 'none',
       borderWidth: 0,
       borderRadius: 24,
@@ -171,7 +169,7 @@ const lineChartOption = (params: {
       extraCssText: 'z-index: 2;box-shadow: none;',
       axisPointer: {
         lineStyle: {
-          color: '#FF6079'
+          color: params.colors.lineColor || '#FF6079'
         }
       }
     },
@@ -218,7 +216,7 @@ export default defineComponent({
         statisticCounts.value.count =
           props.type === 'NUM'
             ? props.obj.count
-            : formatSecToHMS(props.obj.count).all
+            : formatSecToHMS(props.obj.count || 0).all
 
         myChart.clear()
         lineChartOption &&
@@ -251,7 +249,7 @@ export default defineComponent({
             const count =
               props.type === 'NUM'
                 ? props.obj.yAxisData[batchIndex]
-                : formatSecToHMS(props.obj.yAxisData[batchIndex] || 0).all
+                : formatSecToHMS(props.obj.yAxisData[batchIndex]?.[2] || 0).all
             const time = props.obj.xAxisData[batchIndex]
             statisticCounts.value = {
               count,

src/teacher/statistics/practice-statistics-detail/index.module.less

@@ -9,6 +9,9 @@
   height: calc(100vh - var(--header-height, 0));
   overflow-x: hidden;
   overflow-y: auto;
+  &::-webkit-scrollbar {
+    display: none;
+  }
 }
 
 .section {
@@ -171,10 +174,43 @@
   border-collapse: separate;
   border-spacing: 0;
 
+  &.scrollTable {
+    .tdFixedLeft::after {
+      box-shadow: inset 12px 0 8px -12px rgba(0, 0, 0, 0.18);
+    }
+  }
+
   .tdFixedLeft {
     position: sticky;
     z-index: 1;
     left: 0;
+    &::after {
+      pointer-events: none;
+      content: '';
+      width: 12px;
+      display: inline-block;
+      position: absolute;
+      top: 0;
+      bottom: -1px;
+      transition: box-shadow 0.2s var(--n-bezier);
+      right: -12px;
+    }
+  }
+  tbody {
+    td {
+      border-bottom: 1px solid #f2f2f2;
+    }
+    tr:last-child {
+      td {
+        border-bottom: none;
+      }
+    }
+  }
+  thead th {
+    border-left: 1px solid #fff;
+    &:first-child {
+      border-right: none;
+    }
   }
 
   th {
@@ -262,16 +298,22 @@
     flex-direction: column;
     justify-content: center;
     margin-left: 4px;
+    width: 12px;
+    position: relative;
     :global {
       .iconfont {
         line-height: 1;
       }
     }
+    .upArrow,
+    .downArrow {
+      width: 6px;
+    }
     .upArrow {
-      transform: rotate(180deg) translateY(-1px);
+      margin-bottom: 2px;
     }
     .downArrow {
-      transform: translateY(-3px);
+      transform: rotate(180deg);
     }
   }
 }
@@ -368,7 +410,6 @@
         &:first-child {
           margin-left: 5px;
         }
-
       }
     }
 
@@ -425,4 +466,4 @@
       top: 19px;
     }
   }
-}
+}

src/teacher/statistics/practice-statistics-detail/index.tsx

@@ -4,8 +4,10 @@ import iconArrow1 from '../images/icon-arrow1.png'
 import iconArrow11 from '../images/icon-arrow1-1.png'
 import icon1 from '../images/icon-1.png'
 import icon2 from '../images/icon-2.png'
+import ArrowUp from '../images/arrow-up.png'
+import ArrowUpActive from '../images/arrow-up-active.png'
 import iconDownload from '../images/icon-download.png'
-import { Button, DatetimePicker, Icon, Popup, Toast } from 'vant'
+import { Button, DatetimePicker, Popup, Toast } from 'vant'
 import Echats from './echats'
 import ColHeader from '@/components/col-header'
 import TheSticky from '@/components/the-sticky'
@@ -16,6 +18,7 @@ import { getTimeRange, TIME_TYPE } from '../home-statistics'
 import ColResult from '@/components/col-result'
 import { promisefiyPostMessage } from '@/helpers/native-message'
 import { useRouter } from 'vue-router'
+import { state } from '@/state'
 
 /** 秒转分 */
 export const formatSecToMin = (second: number) => {
@@ -45,22 +48,40 @@ export const formatSecToHMS = second => {
   }
 }
 
+const catchKey = 'practice-statistics-detail-search'
 export default defineComponent({
   name: 'PracticeDetail',
   setup() {
     const router = useRouter()
+
+    let catchSearch: any = sessionStorage.getItem(catchKey)
+    catchSearch = catchSearch ? JSON.parse(catchSearch) : {}
+    sessionStorage.removeItem(catchKey)
+
     const searchStatus = ref(false)
-    const currentType = ref<TIME_TYPE>('MONTH')
+    const currentType = ref<TIME_TYPE>(
+      catchSearch.currentType !== undefined ? catchSearch.currentType : 'MONTH'
+    )
 
     const searchObj = reactive({
-      tempSubjectId: '' as any,
-      type: 'MONTH' as TIME_TYPE
+      tempSubjectId: catchSearch.subjectId || ('' as any),
+      type:
+        catchSearch.currentType !== undefined
+          ? catchSearch.currentType
+          : ('MONTH' as TIME_TYPE)
     })
-    const timeRange = getTimeRange(currentType.value)
+    const timeRange =
+      catchSearch.startTime && catchSearch.endTime
+        ? {
+            startTime: catchSearch.startTime,
+            endTime: catchSearch.endTime
+          }
+        : getTimeRange(currentType.value)
     const forms = reactive({
       loading: false,
       dataShow: true,
-      subjectId: '' as any, // 选择的声部
+      isScrollLeft: false,
+      subjectId: catchSearch.subjectId || ('' as any), // 选择的声部
       subjectList: [] as any,
       startTimeStatus: false,
       startTimeClosedStatus: false,
@@ -131,15 +152,13 @@ export default defineComponent({
 
         const pathname = data || ''
         if (pathname) {
-          const filenameWithExtension = pathname.split('/').pop()
-          const filename = filenameWithExtension.split('.')[0]
-          console.log(filename) // 输出: page
+          const fileName = `练习详情${forms.startTimeStr}~${forms.endTimeStr}_${state.user.data?.userId}`
           // 发送消息通知移动端下载文件
           promisefiyPostMessage({
             api: 'downloadFile',
             content: {
               downloadUrl: pathname,
-              fileName: filename
+              fileName
             }
           })
         }
@@ -171,10 +190,14 @@ export default defineComponent({
         // 练习时长
         const practiceTimes = data.practiceTimes || []
         const xAxisDataTimes: string[] = []
-        const practiceTimeList: string[] = []
+        const practiceTimeList: any[] = []
         practiceTimes.forEach((item: any, index: number) => {
           xAxisDataTimes.push(item.date)
-          practiceTimeList.push(formatSecToMin(item.practiceTime))
+          practiceTimeList.push([
+            index,
+            formatSecToMin(item.practiceTime),
+            item.practiceTime
+          ])
 
           if (practiceTimes.length - 1 === index) {
             obj.value.timeCount = item.practiceTime
@@ -292,6 +315,7 @@ export default defineComponent({
       // timeRange.value = getTimeRange(currentType.value)
       searchStatus.value = false
       forms.subjectId = searchObj.tempSubjectId
+      currentType.value = searchObj.type
       getDetail()
       getStudentDetail()
     }
@@ -320,6 +344,15 @@ export default defineComponent({
 
     /** 跳转详情 */
     const toDetail = (item: any) => {
+      sessionStorage.setItem(
+        catchKey,
+        JSON.stringify({
+          startTime: forms.startTimeStr,
+          endTime: forms.endTimeStr,
+          currentType: currentType.value,
+          subjectId: forms.subjectId
+        })
+      )
       router.push({
         path: '/exercise-detail',
         query: {
@@ -439,7 +472,7 @@ export default defineComponent({
 
             <div class={styles.scroll}>
               {forms.dataShow ? (
-                <table class={styles.dataTable} style={{ width: '486px' }}>
+                <table class={[styles.dataTable]} style={{ width: '486px' }}>
                   <colgroup>
                     <col style="width: 88px;" />
                     <col style="width: 105px;" />
@@ -449,38 +482,32 @@ export default defineComponent({
                   </colgroup>
                   <thead>
                     <tr>
-                      <th class={styles.tdFixedLeft}>学员</th>
+                      <th class={[styles.tdFixedLeft]}>学员</th>
                       <th>乐器</th>
                       <th>
                         <div
                           class={styles.filterSection}
                           onClick={() => onSort('totalPracticeTime')}
                         >
-                          练习时长
+                          练习总时长
                           <div class={styles.filters}>
-                            <Icon
-                              classPrefix="iconfont"
-                              name="down"
-                              class={styles.upArrow}
-                              size={12}
-                              color={
+                            <img
+                              src={
                                 forms.sortField === 'totalPracticeTime' &&
                                 forms.sortType === 'ASC'
-                                  ? 'rgba(223, 128, 16, 1)'
-                                  : 'rgba(0, 0, 0, 0.20)'
+                                  ? ArrowUpActive
+                                  : ArrowUp
                               }
+                              class={styles.upArrow}
                             />
-                            <Icon
-                              classPrefix="iconfont"
-                              name="down"
-                              class={styles.downArrow}
-                              size={12}
-                              color={
+                            <img
+                              src={
                                 forms.sortField === 'totalPracticeTime' &&
                                 forms.sortType === 'DESC'
-                                  ? 'rgba(223, 128, 16, 1)'
-                                  : 'rgba(0, 0, 0, 0.20)'
+                                  ? ArrowUpActive
+                                  : ArrowUp
                               }
+                              class={styles.downArrow}
                             />
                           </div>
                         </div>
@@ -493,30 +520,25 @@ export default defineComponent({
                         >
                           平均练习时长
                           <div class={styles.filters}>
-                            <Icon
-                              classPrefix="iconfont"
-                              name="down"
-                              class={styles.upArrow}
-                              size={12}
-                              color={
+                            <img
+                              src={
                                 forms.sortField === 'averagePracticeTime' &&
                                 forms.sortType === 'ASC'
-                                  ? 'rgba(223, 128, 16, 1)'
-                                  : 'rgba(0, 0, 0, 0.20)'
+                                  ? ArrowUpActive
+                                  : ArrowUp
                               }
+                              class={styles.upArrow}
                             />
-                            <Icon
-                              classPrefix="iconfont"
-                              name="down"
-                              class={styles.downArrow}
-                              size={12}
-                              color={
+                            <img
+                              src={
                                 forms.sortField === 'averagePracticeTime' &&
                                 forms.sortType === 'DESC'
-                                  ? 'rgba(223, 128, 16, 1)'
-                                  : 'rgba(0, 0, 0, 0.20)'
+                                  ? ArrowUpActive
+                                  : ArrowUp
                               }
+                              class={styles.downArrow}
                             />
+                            <img />
                           </div>
                         </div>
                       </th>
@@ -525,19 +547,19 @@ export default defineComponent({
                   <tbody>
                     {obj.value.students.map((item: any) => (
                       <tr onClick={() => toDetail(item)}>
-                        <td class={styles.tdFixedLeft}>
+                        <td class={[styles.tdFixedLeft]}>
                           <img class={styles.userImg} src={item.avatar} />
                           <span>{item.studentName}</span>
                         </td>
                         <td>{item.subjectName}</td>
                         <td>
-                          {item.totalPracticeTime.hours}小时
+                          {item.totalPracticeTime.hours}时
                           {item.totalPracticeTime.minutes}分
                           {item.totalPracticeTime.seconds}秒
                         </td>
                         <td>{item.practiceDays}</td>
                         <td>
-                          {item.averagePracticeTime.hours}小时
+                          {item.averagePracticeTime.hours}时
                           {item.averagePracticeTime.minutes}分
                           {item.averagePracticeTime.seconds}秒
                         </td>
@@ -549,7 +571,7 @@ export default defineComponent({
                 <ColResult
                   classImgSize="SMALL"
                   btnStatus={false}
-                  tips="暂无数据~"
+                  tips="暂无数据"
                 />
               )}
             </div>

src/teacher/video-class/video-detail.module.less

@@ -24,4 +24,19 @@
     width: 164px !important;
     height: 92px !important;
   }
+
+  .btnMore {
+    display: flex;
+    justify-content: space-around;
+    padding: 10px 28px 30px;
+    background: linear-gradient( 180deg, rgba(255,255,255,0) 0%, #FFFFFF 100%), #FFFDFD;
+    box-shadow: 0px 0px 2px 0px rgba(216,216,216,0.5);
+
+    :global {
+      .van-button {
+        width: 100%;
+        font-size: 16px;
+      }
+    }
+  }
 }

src/teacher/video-class/video-detail.tsx

@@ -259,7 +259,7 @@ export default defineComponent({
                   >
                     {this.buyUserList.map((item: any) => (
                       <UserList
-                        class="mb16"
+                        class="mb24"
                         users={{
                           avatar: item.avatar,
                           studentId: item.userId,
@@ -285,7 +285,7 @@ export default defineComponent({
           <>
             {this.share == '1' && this.detailList.length > 0 && (
               <TheSticky position="bottom">
-                <div class={['btnGroup']} style={{ background: '#fff', paddingTop: '10px' }}>
+                <div class={['btnGroup', styles.btnMore]}>
                   <Button
                     block
                     round
@@ -301,7 +301,7 @@ export default defineComponent({
             )}
             {this.share != '1' && this.detailList.length > 0 && (
               <TheSticky position="bottom">
-                <div class={['btnGroup']} style={{ background: '#fff', paddingTop: '10px' }}>
+                <div class={['btnGroup', styles.btnMore]}>
                   <Button
                     block
                     round

src/tenant/music/courseList/index.tsx

@@ -410,7 +410,7 @@ export default defineComponent({
           <div class={styles.periodSection}>
           <TransitionGroup name="van-fade">
             {!data.loading && (
-              <>
+              <div key="list">
                 <div class={styles.periodHeader}>
                   <div key="periodTitle" class={styles.periodTitle}>
                       <img class={styles.pIcon} src={iconList} />
@@ -432,7 +432,7 @@ export default defineComponent({
                     </div>
                 </div>
 
-                <div key="list" class={styles.periodList}>
+                <div class={styles.periodList}>
                   <CellGroup inset>
                     {data.list.map((item: any) => {
                       // const isLock =
@@ -506,7 +506,7 @@ export default defineComponent({
                     })}
                   </CellGroup>
                 </div>
-              </>
+              </div>
             )}
           </TransitionGroup>
           {data.loading && (

src/tenant/music/coursewarePlay/component/points-search.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, watch } from 'vue';
+import { defineComponent, PropType, reactive, watch } from 'vue';
 import styles from './point.module.less';
 import { iconArrow } from '../image/icons.json';
 import {
@@ -22,8 +22,8 @@ export default defineComponent({
       default: () => []
     },
     tabActive: {
-      type: String,
-      default: ''
+      type: Array as PropType<any>,
+      default: () => []
     },
     itemActive: {
       type: String,
@@ -59,7 +59,7 @@ export default defineComponent({
         pointData.liftChildActive = props.tabActive[2] || '';
       }
     );
-    
+
     watch(() => props.open, () => {
       pointData.search = props.search
     })

src/tenant/music/coursewarePlay/component/points.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, watch } from 'vue'
+import { defineComponent, PropType, reactive, watch } from 'vue'
 import styles from './point.module.less'
 import { iconMulv, iconArrow } from '../image/icons.json'
 // import iconZhibo from '../image/icon-load.gif';
@@ -20,8 +20,8 @@ export default defineComponent({
       default: () => []
     },
     tabActive: {
-      type: String,
-      default: ''
+      type: Array as PropType<any>,
+      default: () => []
     },
     itemActive: {
       type: String,

src/tenant/music/coursewarePlay/index.tsx

@@ -59,6 +59,7 @@ import PointsSearch from './component/points-search'
 export default defineComponent({
   name: 'CoursewarePlay',
   setup() {
+    const browserInfo = browser()
     const apiSuffix = ref(
       baseState.platformType === 'STUDENT' ? '/api-student' : '/api-teacher'
     )
@@ -77,17 +78,6 @@ export default defineComponent({
     const parentContainer = reactive({
       width: '100vw'
     })
-    // const setContainer = () => {
-    //   const min = Math.min(screen.width, screen.height)
-    //   const max = Math.max(screen.width, screen.height)
-    //   const width = min * (16 / 9)
-    //   if (width > max) {
-    //     parentContainer.width = '100vw'
-    //     return
-    //   } else {
-    //     parentContainer.width = width + 'px'
-    //   }
-    // }
     const handleInit = (type = 0) => {
       //设置容器16:9
       // setContainer()
@@ -103,13 +93,6 @@ export default defineComponent({
           // console.log(234);
         }
       )
-      // 头,包括返回箭头
-      // postMessage({
-      //   api: 'setTitleBarVisibility',
-      //   content: {
-      //     status: type
-      //   }
-      // })
       // 安卓的状态栏
       postMessage({
         api: 'setStatusBarVisibility',
@@ -180,45 +163,24 @@ export default defineComponent({
       // console.log('缓存路径返回', res)
       return res
     }
-    // 获取当前课程是否签退
-    // const getCourseSchedule = async () => {
-    //   if (!route.query.courseId) return;
-    //   try {
-    //     const res = await request.get(
-    //       `${state.platformApi}/courseSchedule/detail/${route.query.courseId}`,
-    //       {
-    //         hideLoading: true
-    //       }
-    //     );
-    //     if (res?.data) {
-    //       data.isCourse =
-    //         res.data.status === 'ING' && state.platformType == 'TEACHER'
-    //           ? true
-    //           : false;
-    //       // data.isRecordPlay = Date.now() > dayjs(res.data.startTime).valueOf()
-    //     }
-    //   } catch (e) {
-    //     console.log(e);
-    //   }
-    // };
     const getTempList = async (materialList: any, name: any) => {
       const list: any = []
-      const browserInfo = browser()
+      // const browserInfo = browser()
       for (let j = 0; j < materialList.length; j++) {
         const material = materialList[j]
         //请求本地缓存
-        if (browserInfo.isApp && ['VIDEO', 'IMG'].includes(material.typeCode)) {
-          const localData: any = await getCacheFilePath(material)
-
-          if (localData?.content?.localPath) {
-            material.url = material.content
-            material.content = localData.content.localPath
-          } else {
-            material.url = material.content + '?t=' + +new Date()
-            material.content = material.content + '?t=' + +new Date()
-          }
-        }
+        // if (browserInfo.isApp && ['VIDEO', 'IMG'].includes(material.typeCode)) {
+        //   const localData: any = await getCacheFilePath(material)
 
+        //   if (localData?.content?.localPath) {
+        //     material.url = material.content
+        //     material.content = localData.content.localPath
+        //   } else {
+        //     material.url = material.content + '?t=' + +new Date()
+        //     material.content = material.content + '?t=' + +new Date()
+        //   }
+        // }
+        material.isReadCatch = false // 是否读取缓存
         material.iframeRef = null
         material.videoEle = null
         material.tabName = name
@@ -272,8 +234,6 @@ export default defineComponent({
       )
       _firstIndex = _firstIndex > -1 ? _firstIndex : 0
       const item = list[_firstIndex]
-
-      // console.log(_firstIndex, '_firstIndex', route.query.kId, 'route.query.kId', item)
       // 是否自动播放
       if (activeData.isAutoPlay) {
         item.autoPlay = true
@@ -286,6 +246,7 @@ export default defineComponent({
       popupData.itemName = item.name
       nextTick(() => {
         data.itemList = list
+        getCurrentItemCatch(popupData.activeIndex) // 获取当前元素的缓存
         checkedAnimation(popupData.activeIndex)
         postMessage({
           api: 'courseLoading',
@@ -304,6 +265,24 @@ export default defineComponent({
         }, 500)
       })
     }
+
+    /** 获取当前元素的缓存 */
+    const getCurrentItemCatch = async (index: number) => {
+      const item = data.itemList[index]
+      if (browserInfo.isApp && ['VIDEO', 'IMG'].includes(item.typeCode) && !item.isReadCatch) {
+        const localData: any = await getCacheFilePath(item)
+        item.isReadCatch = true
+        if (localData?.content?.localPath) {
+          item.url = item.content
+          item.content = localData.content.localPath
+        } else {
+          item.url = item.content + '?t=' + +new Date()
+          item.content = item.content + '?t=' + +new Date()
+        }
+        console.log('加载了缓存')
+      }
+    }
+
     const getDetail = async (id?: any) => {
       try {
         const res: any = await request.get(
@@ -382,7 +361,6 @@ export default defineComponent({
               return n
             }
           )
-          console.log(data.knowledgePointList, 'data.knowledgePointList')
           getItemList()
         }
         return true
@@ -532,9 +510,10 @@ export default defineComponent({
 
           data.detail = detailList.value?.find((child: any) => child.coursewareDetailId === item.coursewareDetailId)
         }
-        
+
         nextTick(() => {
           data.itemList = allList;
+          getCurrentItemCatch(popupData.activeIndex) // 获取当前元素的缓存
           checkedAnimation(popupData.activeIndex);
           postMessage({
             api: 'courseLoading',
@@ -553,7 +532,6 @@ export default defineComponent({
           }, 500);
         });
 
-        
         return true
       } catch (error) {
         console.log(error);
@@ -675,7 +653,6 @@ export default defineComponent({
 
     onMounted(async () => {
       await sysParamConfig()
-      
 
       if(data.source === 'search') {
         await getSearchDetail({search: data.search})
@@ -736,7 +713,7 @@ export default defineComponent({
       activeIndex: 0,
       playIndex: 0,
       tempTabActive: '', // 临时选中
-      tempItemActive: "", // 临时编号 
+      tempItemActive: "", // 临时编号
       tabActive: '',
       tabName: '',
       itemActive: '',
@@ -794,22 +771,6 @@ export default defineComponent({
       Toast.clear()
       activeData.model = false
     }
-    const toggleModel = (type = true) => {
-      activeData.model = type
-    }
-
-    // 去点名,签退
-    const gotoRollCall = (pageTag: string) => {
-      postMessage({
-        api: 'open_app_page',
-        content: {
-          action: 'app',
-          pageTag: pageTag,
-          url: '',
-          params: JSON.stringify({ courseId: route.query.courseId })
-        }
-      })
-    }
 
     // 双击
     const handleDbClick = () => {
@@ -908,7 +869,7 @@ export default defineComponent({
       checkedAnimation(popupData.activeIndex, index)
       nextTick(() => {
         popupData.activeIndex = index
-
+        getCurrentItemCatch(index) // 获取当前元素的缓存
         acitveTimer.value = setTimeout(
           () => {
             popupData.playIndex = index
@@ -1012,8 +973,8 @@ export default defineComponent({
       }
     }
 
-     // 白板的批注打开时暂停播放
-     watch(
+    // 白板的批注打开时暂停播放
+    watch(
       () => [whitePenShow.value, penShow.value],
       () => {
         if (whitePenShow.value || penShow.value) {
@@ -1034,12 +995,6 @@ export default defineComponent({
       }
     )
 
-    /** 关闭教学工具 */
-    const closeStudyTool = () => {
-      studyData.type = 'init'
-      toggleModel()
-    }
-
     const activeVideoItem = computed(() => {
       const item = data.itemList[popupData.activeIndex]
       if (
@@ -1124,7 +1079,6 @@ export default defineComponent({
               const isRender = Math.abs(popupData.playIndex - mIndex) < 2
               // 判断是否是当前选中的元素
               const activeEle = popupData.playIndex === mIndex ? true : false
-
               return isRenderItem ? (
                 <div
                   key={'index' + mIndex}
@@ -1146,14 +1100,14 @@ export default defineComponent({
                   <Transition name="van-fade">
                     {m.typeCode === 'VIDEO' &&
                       data.animationState !== 'end' &&
-                      data.videoState != 'play' && (
+                      data.videoState != 'play' ? (
                         <div class={styles.loadWrap}>
                           <Vue3Lottie animationData={playLoadData}></Vue3Lottie>
                         </div>
-                      )}
+                      ) : ''}
                   </Transition>
                   {isRender && m.typeCode === 'IMG' && (
-                    <>
+                    <div>
                       <img src={m.content} />
                       {m.materialMusicId && (
                         <div
@@ -1172,7 +1126,7 @@ export default defineComponent({
                           }}
                         ></div>
                       )}
-                    </>
+                    </div>
                   )}
                   {isRender && m.typeCode === 'SONG' && (
                     <MusicScore
@@ -1190,48 +1144,6 @@ export default defineComponent({
               )
             })}
           </div>
-          {/* <Transition name="right">
-            {activeData.model && (
-              <div
-                class={styles.rightFixedBtns}
-                onClick={(e: Event) => {
-                  e.stopPropagation()
-                  clearTimeout(activeData.timer)
-                }}
-              >
-                <div class={styles.btnsWrap}>
-                  <div
-                    class={[styles.fullBtn, styles.point]}
-                    onClick={() => (popupData.open = true)}
-                  >
-                    <img src={iconMenu} />
-                    <span>知识点</span>
-                  </div>
-                </div>
-
-                <div class={[styles.btnsWrap, styles.btnsBottom]}>
-                  {data.isCourse && (
-                    <>
-                      <div
-                        class={styles.fullBtn}
-                        onClick={() => gotoRollCall('student_roll_call')}
-                      >
-                        <img src={iconDian} />
-                        <span>点名</span>
-                      </div>
-                      <div
-                        class={styles.fullBtn}
-                        onClick={() => gotoRollCall('sign_out')}
-                      >
-                        <img src={iconPoint} />
-                        <span>签退</span>
-                      </div>
-                    </>
-                  )}
-                </div>
-              </div>
-            )}
-          </Transition> */}
 
           <Transition name="left">
             {activeData.model && (
@@ -1260,7 +1172,7 @@ export default defineComponent({
                       }}>
                         <img src={iconCourseType} />
                       </div>}
-                      
+
                       <div class={styles.fullBtn} onClick={() => {
                         handleStop()
                         popupData.open = true
@@ -1269,7 +1181,6 @@ export default defineComponent({
                         {/* <span>知识点</span> */}
                       </div>
                   </>}
-                  
                   <div
                     class={[styles.fullBtn, !(popupData.activeIndex != 0) && styles.disabled]}
                     onClick={() => {
@@ -1331,29 +1242,6 @@ export default defineComponent({
               </div>
             )}
           </div>
-        {/* <div
-          style={{ transform: activeData.model ? '' : 'translateY(-100%)' }}
-          id="coursePlayHeader"
-          class={styles.headerContainer}
-          ref={headeRef}
-        >
-          <div class={styles.backBtn} onClick={() => goback()}>
-            <Icon name={iconBack} />
-          </div>
-          <div
-            class={styles.menu}
-            onClick={() => {
-              const _effectIndex = effectIndex.value + 1
-              effectIndex.value =
-                _effectIndex >= effects.length - 1 ? 0 : _effectIndex
-              setModelOpen()
-            }}
-          >
-            {popupData.tabName}
-          </div>
-
-          
-        </div> */}
 
         {/* 更多弹窗 */}
         <Popup
@@ -1375,7 +1263,7 @@ export default defineComponent({
           v-model:show={popupData.open}
           onClose={handleClosePopup}
         >
-          {data.source === 'search' ? 
+          {data.source === 'search' ?
               <PointsSearch
                 data={detailTempSearchList.value}
                 search={data.searchTemp || data.search}
@@ -1418,7 +1306,6 @@ export default defineComponent({
                   toggleMaterial(res.itemActive)
                 }}
               />}
-          
         </Popup>
 
         <Popup
@@ -1440,6 +1327,7 @@ export default defineComponent({
               if(n && s) {
                 popupData.coursewareOpen = false;
                 popupData.activeIndex = 0;
+                getCurrentItemCatch(popupData.activeIndex) // 获取当前元素的缓存
                 nextTick(() => {
                   popupData.open = true
                 })

src/views/music/list/index.module.less

@@ -11,7 +11,7 @@
     input {
       caret-color: #2dc7aa;
     }
-    .van-icon-clear {
+    .van-search .van-icon-clear {
       color: #fff !important;
     }
   }
@@ -24,6 +24,9 @@
     height: calc(100vh - var(--header-height));
     overflow: hidden;
     overflow-y: auto;
+    &::-webkit-scrollbar {
+      display: none;
+    }
   }
 }
 

src/views/music/personal/album-my.tsx

@@ -88,7 +88,7 @@ export default defineComponent({
           </div>
         ) : (
           !loading.value && (
-            <ColResult tips="暂无专辑" classImgSize="SMALL" btnStatus={false} />
+            <ColResult tips="暂无内容" classImgSize="SMALL" btnStatus={false} />
           )
         )}
       </List>

src/views/music/personal/album.tsx

@@ -71,7 +71,7 @@ export default defineComponent({
         ) : (
           !loading.value && (
             <ColResult
-              tips="暂无收藏专辑"
+              tips={'暂无内容'}
               classImgSize="SMALL"
               btnStatus={false}
             />

src/views/music/personal/collection.tsx

@@ -103,7 +103,7 @@ export default defineComponent({
         ) : (
           !loading.value && (
             <ColResult
-              tips={props.type === 'TENANT' ? '暂无内容' : '暂无收藏平台单曲'}
+              tips={'暂无内容'}
               classImgSize="SMALL"
               btnStatus={false}
             />

src/views/music/personal/personal.tsx

@@ -110,7 +110,7 @@ export default defineComponent({
           </div>
         ) : (
           !loading.value && (
-            <ColResult tips="暂无单曲" classImgSize="SMALL" btnStatus={false} />
+            <ColResult tips="暂无内容" classImgSize="SMALL" btnStatus={false} />
           )
         )}
       </List>