Merge branch 'hqyDev' of http://git.dayaedu.com/lex/h5-colexiu

src/components/col-search/index.module.less

@@ -117,8 +117,8 @@
     line-height: 1;
 
     &.searchTenantBtn {
-      background: linear-gradient(270deg, #FF3C81 0%, #FF76A6 100%);
+      background: linear-gradient( 270deg, #FF436A 0%, #FF6D8B 100%);
       border: none;
     }
   }
-}
+}

src/tenant/music/courseList/index.module.less

@@ -1,6 +1,6 @@
 .courseList {
   min-height: 100vh;
-  background-image: url('./image/bg.png');
+  background-image: url('../../images/bg.png');
   background-size: 100% 214px;
   background-repeat: no-repeat;
   box-sizing: border-box;
@@ -181,7 +181,7 @@
 }
 
 .courseDialog {
-  width: 315px;
+  width: 305px;
 
   :global {
     .van-dialog__header {
@@ -244,7 +244,7 @@
 }
 
 .courseDialog {
-  padding: 20px;
+  padding: 20px 15px;
 
   // :global {
   //   .van-popup__close-icon {
@@ -253,11 +253,11 @@
   //   }
   // }
   .iconClose {
-    width: 18px;
+    width: 19px;
     height: 19px;
     position: absolute;
-    top: 24px;
-    right: 23px;
+    top: 23px;
+    right: 20px;
     z-index: 9;
     background: url('./image/icon-close.png') no-repeat center;
     background-size: contain;
@@ -273,7 +273,8 @@
   }
 
   .content {
-    padding: 20px 0 25px;
+    padding: 20px 5px 25px;
+    font-weight: 400;
     font-size: 16px;
     color: #666666;
     line-height: 24px;
@@ -294,7 +295,13 @@
     }
   }
 }
-
+.btnLeft {
+  color: #333;
+  border-color: #dbdbdb;
+}
+.btnRight {
+  background: linear-gradient(270deg, #ff204b 0%, #fe5b71 100%);
+}
 .finch {
   width: 150px;
   margin: 80px auto 0;

src/tenant/music/courseList/index.tsx

@@ -247,10 +247,10 @@ export default defineComponent({
     }
     // 下载缓存进度
     const getProgress = (res: any) => {
-      // console.log('🚀 ~ res', res)
-      if (!data.isDownloading) {
-        return
-      }
+      //console.log('🚀 ~ res', res)
+      // if (!data.isDownloading) {
+      //   return
+      // }
       if (res?.content?.lessonCoursewareDetailId) {
         const { lessonCoursewareDetailId, downloadStatus, progress } =
           res.content
@@ -444,11 +444,11 @@ export default defineComponent({
                                 ) : (
                                   ''
                                 )}
-                                {item.downloadStatus == 1 && (
+                                {/* {item.downloadStatus == 1 && (
                                   <div class={styles.downloading}>{`${
                                     item.progress || 0
                                   }%`}</div>
-                                )}
+                                )} */}
                               </div>
                             </div>
                           ),
@@ -531,14 +531,19 @@ export default defineComponent({
           <div class={styles.title}>下载提醒</div>
 
           <div class={styles.content}>
-            您尚未下载课件内容，为了更加流畅的学习体验，推荐您下载后观看课件。
+            您尚未下载课件，为了更加流畅的学习体验，推荐您下载后观看课件。
           </div>
 
           <div class={styles.popupBtnGroup}>
-            <Button round onClick={() => gotoPlay(data.catchItem)}>
+            <Button
+              class={styles.btnLeft}
+              round
+              onClick={() => gotoPlay(data.catchItem)}
+            >
               直接观看
             </Button>
             <Button
+              class={styles.btnRight}
               round
               type="primary"
               onClick={() => downCatch(data.catchItem)}

src/tenant/music/coursewarePlay/index.tsx

@@ -8,7 +8,8 @@ import {
   ref,
   watch,
   Transition,
-  computed
+  computed,
+  onBeforeUnmount
 } from 'vue'
 import iconBack from './image/back.svg'
 import styles from './index.module.less'
@@ -16,7 +17,11 @@ import 'plyr/dist/plyr.css'
 import request from '@/helpers/request'
 import { state } from '@/state'
 import { useRoute } from 'vue-router'
-import { postMessage, promisefiyPostMessage } from '@/helpers/native-message'
+import {
+  postMessage,
+  promisefiyPostMessage,
+  listenerMessage
+} from '@/helpers/native-message'
 import MusicScore from './component/musicScore'
 import iconDian from './image/icon-dian.svg'
 import iconPoint from './image/icon-point.svg'
@@ -258,6 +263,8 @@ export default defineComponent({
             type: 'fullscreen'
           }
         })
+        //检测是否录屏
+        handleLimitScreenRecord()
         setTimeout(() => {
           data.animationState = 'end'
         }, 500)
@@ -338,7 +345,68 @@ export default defineComponent({
           ev.data.show || (ev.data.playState == 'play' ? false : true)
       }
     }
+    //录屏时间触发
+    const handleLimitScreenRecord = async () => {
+      const result = await promisefiyPostMessage({
+        api: 'getDeviceStatus',
+        content: { type: 'video' }
+      })
+      const { status } = result?.content || {}
+      if (status == '1') {
+        data.itemList.forEach((item: any) => (item.autoPlay = false))
+        handleStop()
+        // 处理事件 - 事件事件后加载的
+        checkVideoPlay()
+        Dialog.alert({
+          title: '温馨提示',
+          message: '课件内容请勿录屏',
+          beforeClose: () => {
+            return new Promise(resolve => {
+              promisefiyPostMessage({
+                api: 'getDeviceStatus',
+                content: { type: 'video' }
+              }).then((res: any) => {
+                const content = res.content
+                if (content?.status == '1') {
+                  const activeItem = data.itemList[popupData.activeIndex]
+                  togglePlay(activeItem, false)
+                  resolve(false)
+                } else {
+                  const activeItem = data.itemList[popupData.activeIndex]
+                  togglePlay(activeItem, true)
+                  resolve(true)
+                }
+              })
+            })
+          }
+        })
+      }
+    }
+    // 切换播放
+    const togglePlay = (m: any, isPlay: boolean) => {
+      if (isPlay) {
+        m.videoEle?.play()
+      } else {
+        m.videoEle?.pause()
+      }
+    }
+    let timers: any = null
+    const checkVideoPlay = () => {
+      const activeVideoRef = data.videoItemRef?.getPlyrRef()
+      if (activeVideoRef) {
+        timers = setInterval(() => {
+          if (!activeVideoRef.paused()) {
+            activeVideoRef.pause()
+            clearInterval(timers)
+          }
+          activeVideoRef.pause()
+        }, 100)
+      }
 
+      setTimeout(() => {
+        clearInterval(timers)
+      }, 3000)
+    }
     onMounted(async () => {
       await getDetail()
       // const hasFree = String(data.detail?.accessScope) === '0'
@@ -361,8 +429,29 @@ export default defineComponent({
       // }
       // getCourseSchedule();
       window.addEventListener('message', iframeHandle)
+      // 禁止录屏 ios
+      listenerMessage('setVideoPlayer', result => {
+        if (result?.content?.status == 'pause') {
+          handleLimitScreenRecord()
+        }
+      })
+      // 禁止录屏 安卓
+      postMessage({
+        api: 'limitScreenRecord',
+        content: {
+          type: 1
+        }
+      })
+    })
+    onBeforeUnmount(() => {
+      // 取消 禁止录屏
+      postMessage({
+        api: 'limitScreenRecord',
+        content: {
+          type: 0
+        }
+      })
     })
-
     const playRef = ref()
     // 返回
     const goback = () => {

src/tenant/music/lessonCourseware/index.module.less

@@ -5,8 +5,8 @@
 
   :global {
     .van-sticky {
-      background: url('../../images/bg-image.png') no-repeat top center;
-      background-size: 100% 214px;
+      // background: url('../../images/bg.png') no-repeat top center;
+      // background-size: 100% 214px;
     }
 
     .van-search__content {
@@ -33,6 +33,17 @@
 
     .van-dropdown-menu__title {
       padding-left: 0;
+      color: #131415;
+      &:after {
+        border-color: transparent transparent rgba(0, 0, 0, 0.4)
+          rgba(0, 0, 0, 0.4);
+      }
+      &.van-dropdown-menu__title--active {
+        color: #fe2451;
+        &:after {
+          border-color: transparent transparent #fe2451 #fe2451;
+        }
+      }
     }
 
     .van-dropdown-menu__title:after {
@@ -66,6 +77,9 @@
           background-color: rgba(254, 36, 81, 0.08);
           border-radius: 10px;
           color: #fe2451;
+          .van-cell__title {
+            font-weight: 600;
+          }
         }
         .van-cell__title {
           font-weight: 400;
@@ -79,12 +93,18 @@
     }
   }
   .titleActive {
-    color: #fe2451;
     :global(.van-ellipsis) {
       max-width: 62px;
     }
   }
 }
+.search {
+  :global {
+    .van-search {
+      height: calc(var(--van-dropdown-menu-height) + 20px);
+    }
+  }
+}
 .bgImg {
   position: fixed;
   top: 0;

src/tenant/music/lessonCourseware/index.tsx

@@ -13,7 +13,7 @@ import styles from './index.module.less'
 import { useRouter, useRoute } from 'vue-router'
 import ColHeader from '@/components/col-header'
 import TheSticky from '@/components/the-sticky'
-import bgImg from '../../images/bg-image.png'
+import bgImg from '../../images/bg.png'
 import Search from '@/components/col-search'
 import CourseItem from './component/CourseItem'
 import ColResult from '@/components/col-result'
@@ -67,7 +67,7 @@ export default defineComponent({
         if (res.code === 200) {
           subjectOpt.value = [
             {
-              text: '全部课件',
+              text: '全部教材',
               value: ''
             },
             ...(res.data?.courseTypeList || []).map(item => {
@@ -140,6 +140,7 @@ export default defineComponent({
                 color="#131415"
               ></ColHeader>
               <Search
+                class={styles.search}
                 onSearch={onSearch}
                 type="tenant"
                 placeholder={'请输入教材关键词'}
@@ -190,8 +191,7 @@ export default defineComponent({
                       path: '/courseList',
                       query: {
                         id: row.id,
-                        albumId: params.albumId,
-                        taId: route.query.taId
+                        albumId: params.albumId
                       }
                     })
                   }}

src/tenant/music/music-detail/new-index.module.less

@@ -8,7 +8,7 @@
   --van-overlay-background-color: rgba(0, 0, 0, .6);
   height: 100vh;
 
-  --plyr-color-main: #FF3C81;
+  --plyr-color-main: #FF436A;
   --plyr-control-icon-size: 10px;
   --plyr-range-track-height: 4px;
   // --plyr-range-thumb-height: 4px;
@@ -19,7 +19,7 @@
     }
 
     .plyr__controls .plyr__controls__item:first-child {
-      background: linear-gradient(270deg, #FF3C81 0%, #FF76A6 100%);
+      background: linear-gradient(90deg, #FF6D8B 0%, #FF436A 100%);
       color: #fff;
       border-radius: 50%;
     }
@@ -327,7 +327,7 @@
     right: 0;
     top: 0;
     height: 26px;
-    background: linear-gradient(270deg, #FF3C81 0%, #FF76A6 100%);
+    background: linear-gradient( 270deg, #FF436A 0%, #FF6D8B 100%);
     border-radius: 0px 0px 0px 16px;
     display: flex;
     align-items: center;
@@ -656,4 +656,4 @@
 
 .staffIframe {
   // margin-top: -60px;
-}
+}

src/tenant/music/music-detail/new-index.tsx

@@ -1095,7 +1095,7 @@ export default defineComponent({
                     round
                     block
                     type="primary"
-                    color="linear-gradient(270deg, #FF3C81 0%, #FF76A6 100%)"
+                    color="linear-gradient( 270deg, #FF204B 0%, #FE5B71 100%)"
                     onClick={() => {
                       if (!browser().isApp) {
                         onDownloadApp()
@@ -1128,7 +1128,7 @@ export default defineComponent({
                     round
                     block
                     type="primary"
-                    color="linear-gradient(270deg, #FF3C81 0%, #FF76A6 100%)"
+                    color="linear-gradient( 270deg, #FF204B 0%, #FE5B71 100%)"
                     onClick={() => {
                       if (!browser().isApp) {
                         onDownloadApp()

src/tenant/music/train-list/index.module.less

@@ -5,8 +5,8 @@
 
   :global {
     .van-sticky {
-      background: url('../../images/bg-image.png') no-repeat top center;
-      background-size: 100% 214px;
+      // background: url('../../images/bg.png') no-repeat top center;
+      // background-size: 100% 214px;
     }
 
     .van-search__content {
@@ -33,13 +33,18 @@
 
     .van-dropdown-menu__title {
       padding-left: 0;
+      color: #131415;
+      &:after {
+        border-color: transparent transparent rgba(0, 0, 0, 0.4)
+          rgba(0, 0, 0, 0.4);
+      }
+      &.van-dropdown-menu__title--active {
+        color: #fe2451;
+        &:after {
+          border-color: transparent transparent #fe2451 #fe2451;
+        }
+      }
     }
-
-    .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;
     }
@@ -53,7 +58,13 @@
     color: #fe2451;
   }
 }
-
+.search {
+  :global {
+    .van-search {
+      height: calc(var(--van-dropdown-menu-height) + 20px);
+    }
+  }
+}
 .albumSearchSection {
   :global {
     .van-dropdown-menu__bar {

src/tenant/music/train-list/index.tsx

@@ -27,7 +27,7 @@ import { openDefaultWebView, state as baseState, state } from '@/state'
 import { SubjectEnum, useSubjectId } from '@/helpers/hooks'
 import Song from '../component/song'
 import ColHeader from '@/components/col-header'
-import bgImg from '../../images/bg-image.png'
+import bgImg from '../../images/bg.png'
 import TheSticky from '@/components/the-sticky'
 import dayjs from 'dayjs'
 
@@ -289,6 +289,7 @@ export default defineComponent({
                 }} */}
               </ColHeader>
               <Search
+                class={styles.search}
                 onSearch={onSearch}
                 type="tenant"
                 background="transparent"
@@ -480,8 +481,7 @@ export default defineComponent({
                       query: {
                         subjectType,
                         id: item.id,
-                        tenantAlbumId: item.tenantAlbumId,
-                        taId: route.query.taId
+                        tenantAlbumId: item.tenantAlbumId
                       }
                     })
                   }}

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

@@ -306,7 +306,7 @@
     .van-tabs__line {
       width: 24px;
       height: 4px;
-      background: linear-gradient(90deg, #FF3C81 0%, rgba(255, 118, 166, 0.5) 100%) !important;
+      background: linear-gradient(90deg, #FF3C5E 0%, rgba(255, 118, 155,0.5) 100%) !important;
       border-radius: 36px 36px 0px 0px;
     }
 
@@ -343,4 +343,4 @@
       font-weight: 500;
     }
   }
-}
+}

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

@@ -89,8 +89,8 @@ export default defineComponent({
       state.loadingAlbum = true
       try {
         // tenantGroupAlbum/buyAlbumInfo
-        // 当小组专辑id和专辑id同时传入的时候以小组专辑id为准
-        if (state.albumId && !route.query.taId) {
+        // 当我的曲目过来的时候才走单个查询
+        if (state.albumId && state.buy === '1') {
           let url = apiSuffix.value + '/userTenantAlbumRecord/detail'
           if (state.albumId) {
             url = url + '?albumId=' + state.albumId
@@ -101,8 +101,9 @@ export default defineComponent({
         } else {
           const url =
             apiSuffix.value +
-            '/tenantGroupAlbum/buyAlbumInfo?tenantGroupAlbumId=' +
-            (route.query.taId || '')
+            `/tenantGroupAlbum/buyAlbumInfo?tenantGroupAlbumId=${
+              route.query.taId || ''
+            }&tenantAlbumId=${state.albumId || ''}`
           // if (state.albumId) {
           //   url = url + '?albumId=' + state.albumId
           // }
@@ -184,7 +185,6 @@ export default defineComponent({
         } else if (subjectType == 'COURSEWARE' && state.coursewareCounts) {
           state.activeTab = 'COURSEWARE'
         }
-
         if (state.details.buyTimesFlag) {
           if (state.details.buyedTimes >= state.details.buyTimes) {
             state.hasBuyStatus = false
@@ -428,14 +428,14 @@ export default defineComponent({
                             state.details?.musicCounts <= 0 ? false : true
                           state.coursewareCounts =
                             state.details?.coursewareCounts <= 0 ? false : true
-                          if (state.coursewareCounts) {
-                            state.activeTab = 'COURSEWARE'
-                          } else if (state.subjectCounts) {
+                          if (state.subjectCounts) {
                             state.activeTab = 'SUBJECT'
                           } else if (state.musicCounts) {
                             state.activeTab = 'MUSIC'
                           } else if (state.ensembleCounts) {
                             state.activeTab = 'ENSEMBLE'
+                          } else if (state.coursewareCounts) {
+                            state.activeTab = 'COURSEWARE'
                           }
                           params.page = 1
                           state.list = []
@@ -522,9 +522,6 @@ export default defineComponent({
                       FetchList()
                     }}
                   >
-                    {state.coursewareCounts && (
-                      <Tab title="云教程" name="COURSEWARE"></Tab>
-                    )}
                     {state.subjectCounts && (
                       <Tab title="声部练习" name="SUBJECT"></Tab>
                     )}
@@ -534,6 +531,9 @@ export default defineComponent({
                     {state.ensembleCounts && (
                       <Tab title="合奏练习" name="ENSEMBLE"></Tab>
                     )}
+                    {state.coursewareCounts && (
+                      <Tab title="云教程" name="COURSEWARE"></Tab>
+                    )}
                   </Tabs>
                 </Sticky>
 
@@ -566,7 +566,7 @@ export default defineComponent({
                               query: {
                                 id: row.id,
                                 albumId: state.details.id,
-                                taId: state.details.tenantGroupAlbumId // 当通过专辑查看时候 这个值为空
+                                taId: state.details.tenantGroupAlbumId // 当通过我的曲目进来的时候 这个值为空
                               }
                             })
                           }}
@@ -585,7 +585,7 @@ export default defineComponent({
                               query: {
                                 id: item.id,
                                 tenantAlbumId: item.tenantAlbumId,
-                                taId: state.details.tenantGroupAlbumId // 当通过专辑查看时候 这个值为空
+                                taId: state.details.tenantGroupAlbumId // 当通过我的曲目进来的时候 这个值为空
                               }
                             })
                           }}