修改视频播放

src/router/index.ts

@@ -32,9 +32,9 @@ const router: Router = createRouter({
           }
         },
         {
-          path: '/choise-homework',
-          name: 'choise-homework',
-          component: () => import('@/views/choise-homework'),
+          path: '/chooise-homework',
+          name: 'chooise-homework',
+          component: () => import('@/views/chooise-homework'),
           meta: {
             title: '选择练习内容'
           }
@@ -42,21 +42,21 @@ const router: Router = createRouter({
         {
           path: '/classify',
           name: 'classify',
-          component: () => import('@/views/choise-homework/classify'),
+          component: () => import('@/views/chooise-homework/classify'),
           meta: {
             title: '声部云练'
           }
         },
         {
           path: '/music-list/:id',
-          component: () => import('@/views/choise-homework/music-list'),
+          component: () => import('@/views/chooise-homework/music-list'),
           meta: {
             title: '声部云练'
           }
         },
         {
           path: '/classroom-detail',
-          component: () => import('@/views/choise-homework/classroom-detail'),
+          component: () => import('@/views/chooise-homework/classroom-detail'),
           meta: {
             title: '教材详情'
           }

src/views/choise-homework/music-list/modals/choosePartName/index.tsx → src/views/chooise-homework/music-list/modals/choosePartName/index.tsx

@@ -2,7 +2,7 @@ import { defineComponent } from 'vue';
 import { Picker, Button } from 'vant';
 import styles from './index.module.less';
 import stylesRem from './index-rem.module.less';
-import { getVoiceChinesName } from '@/views/choise-homework/pageState';
+import { getVoiceChinesName } from '@/views/chooise-homework/pageState';
 
 export default defineComponent({
   name: 'choosePartName',

src/views/exercise-after-class/index.module.less

@@ -321,6 +321,11 @@
   flex-direction: column;
   justify-content: center;
 
+  :global {
+    color: #AAAAAA;
+    font-size: 18px;
+  }
+
   .title {
     font-weight: 600;
     font-size: 18px;
@@ -329,6 +334,7 @@
   }
 
   .content {
+    padding: 20px 0 25px;
     font-size: 16px;
     color: #666666;
     line-height: 24px;
@@ -336,5 +342,20 @@
 
   .btnGroup {
     display: flex;
+    padding: 0 15px;
+    width: 100%;
+
+    :global {
+      .van-button:first-child {
+        font-weight: 400;
+      }
+
+      .van-button+.van-button {
+        margin-left: 15px;
+        font-weight: 500;
+        font-size: 16px;
+        color: #FFFFFF;
+      }
+    }
   }
 }

src/views/exercise-after-class/index.tsx

@@ -74,6 +74,9 @@ export default defineComponent({
     const headeRef = ref();
     const data = reactive({
       visiableStatus: true,
+      visiableConfirmText: '下一题',
+      isLastIndex: false,
+      itemIndex: 0,
       isMember: false, // 是否为会员
       videoData: null as any,
       trainings: [] as any[],
@@ -240,7 +243,7 @@ export default defineComponent({
       ) {
         let isLastIndex = false;
         let itemIndex = 0;
-        console.log(data.isPlayBaseStatus, data.isPlayAll, data.trainings);
+        // console.log(data.isPlayBaseStatus, data.isPlayAll, data.trainings);
         if (data.isPlayBaseStatus) {
           itemIndex = data.trainings.findIndex(
             (n: any) => n.id == data.videoData?.id
@@ -262,37 +265,32 @@ export default defineComponent({
           isLastIndex = status;
         }
 
-        showConfirmDialog({
-          title: '课后作业',
-          message: '你已完成该练习~',
-          confirmButtonColor: 'var(--van-primary)',
-          confirmButtonText: isLastIndex ? '完成' : '下一题',
-          cancelButtonText: '继续'
-        })
-          .then(() => {
-            if (!isLastIndex) {
-              const nextItem = data.trainings[itemIndex + 1];
-              if (nextItem.musicScoreName) {
-                popupData.tabName = nextItem.musicScoreName;
-              }
-              data.itemList = [nextItem];
-              data.videoData = nextItem;
-              handleExerciseCompleted();
-            } else {
-              postMessage({ api: 'goBack' });
-            }
-          })
-          .catch(() => {
-            console.log(
-              data.trainings,
-              itemIndex,
-              data.trainings[itemIndex],
-              'data.trainings[itemIndex]'
-            );
-            data.trainings[itemIndex].currentTime = 0;
-            data.trainings[itemIndex].videoEle.currentTime(0);
-          });
+        data.visiableConfirmText = isLastIndex ? '完成' : '下一题';
+        data.visiableStatus = true;
+        data.itemIndex = itemIndex;
+        data.isLastIndex = isLastIndex;
+      }
+    };
+
+    const dialogConfirm = () => {
+      if (!data.isLastIndex) {
+        const nextItem = data.trainings[data.itemIndex + 1];
+        if (nextItem.musicScoreName) {
+          popupData.tabName = nextItem.musicScoreName;
+        }
+        data.itemList = [nextItem];
+        data.videoData = nextItem;
+        handleExerciseCompleted();
+      } else {
+        postMessage({ api: 'goBack' });
       }
+
+      data.visiableStatus = false;
+    };
+    const dialogCancel = () => {
+      data.trainings[data.itemIndex].currentTime = 0;
+      data.trainings[data.itemIndex].videoEle.currentTime(0);
+      data.visiableStatus = false;
     };
 
     watch(pageVisibility, (value: any) => {
@@ -368,21 +366,22 @@ export default defineComponent({
           </Transition>
         </div>
 
-        {/* <Popup
+        <Popup
           v-model:show={data.visiableStatus}
-          closeable
-          class={styles.visiablePopup}>
+          // closeable
+          class={styles.visiablePopup}
+          closeOnClickOverlay={false}>
           <div class={styles.title}>温馨提示</div>
           <p class={styles.content}>您已完成该练习～</p>
           <div class={styles.btnGroup}>
-            <Button color="#ccc" round>
-              取消
+            <Button round block onClick={dialogCancel}>
+              继续
             </Button>
-            <Button color="#FF8057" round>
-              下一步
+            <Button color="#01C1B5" round block onClick={dialogConfirm}>
+              {data.visiableConfirmText}
             </Button>
           </div>
-        </Popup> */}
+        </Popup>
       </div>
     );
   }