style: 样式优化

src/components/select-courseware-pop/index.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, ref, reactive } from 'vue';
+import { defineComponent, ref, reactive, onMounted } from 'vue';
 import styles from './index.module.less';
 import popBox from './select_courseware_box.png';
 import popClose from './selce_courseware_close.png';
@@ -32,6 +32,17 @@ export default defineComponent({
         }, 300);
       }
     }
+    const initScroll = () => {
+      const listDom = document.getElementById('list')
+      let idx = props.list.findIndex((item: any) => item.id === props?.kjId) || 0
+      listDom?.scrollTo({
+        top: idx * 40,
+        behavior: "smooth",
+      }); 
+    }
+    onMounted(() => {
+      initScroll()
+    });
     return () => (
       <div class={styles.popBox} 
       onClick={(e: Event) => e.stopPropagation()}
@@ -42,7 +53,7 @@ export default defineComponent({
           <img class={styles.popClose} src={popClose} onClick={(e: Event) => {
             emit('close');
         }} />
-          <ul class={styles.list}>
+          <ul class={styles.list} id="list">
             {props.list.map((item: any, index: number) => {
               return (
                 <li class={(data.actIdx === index || props.kjId === item.id) ? styles.active : ''} onClick={() => selectItem(item, index)}>{item.name}</li>

src/views/courseware-list/component/book/index.tsx

@@ -353,19 +353,19 @@ export default defineComponent({
             c_orientation: 0 // 0 横屏 1 竖屏
           }
         });
-        router.push({
-          path: '/courseware-play',
-          query: {
-            id: item.id,
-            subjectId: props.subjectId,
-            lessonCoursewareId: item.lessonCoursewareId,
-            courseId: props.bookData.id,
-            lessonCoursewareDetailId: item.lessonCoursewareDetailId,
-            name: item.zjName,
-            tab: props.tab,
-            coursewareDetailKnowledgeId: item.coursewareDetailKnowledgeId
-          }
-        });
+        // router.push({
+        //   path: '/courseware-play',
+        //   query: {
+        //     id: item.id,
+        //     subjectId: props.subjectId,
+        //     lessonCoursewareId: item.lessonCoursewareId,
+        //     courseId: props.bookData.id,
+        //     lessonCoursewareDetailId: item.lessonCoursewareDetailId,
+        //     name: item.zjName,
+        //     tab: props.tab,
+        //     coursewareDetailKnowledgeId: item.coursewareDetailKnowledgeId
+        //   }
+        // });
         debounceSkip.value = false;
       }
     };

src/views/courseware-play/component/chapter.tsx

@@ -21,7 +21,11 @@ export default defineComponent({
     active: {
       type: String,
       default: ''
-    }
+    },
+    popShow: {
+      type: Boolean,
+      default: false
+    },
   },
   emits: ['handleSelect'],
   setup(props, { emit }) {
@@ -41,6 +45,14 @@ export default defineComponent({
         pointData.active = active.value;
       }
     );
+    watch(
+      () => props.popShow,
+      () => {
+        if (props.popShow) {
+          pointData.active = props.active
+        }
+      }
+    );
     return () => (
       <div class={styles.container}>
         <div class={styles.pointHead}>

src/views/courseware-play/component/point.module.less

@@ -35,9 +35,9 @@
     width: 0;
     display: none;
   }
-  .collapseKnow:nth-of-type(n+2) {
-    padding-top: 2px !important;
-  }
+  // .collapseKnow:nth-of-type(n+2) {
+  //   padding-top: 2px !important;
+  // }
 }
 
 .matItem {
@@ -110,7 +110,7 @@
 }
 
 .kjColumn {
-  margin: 0 12px;
+  margin: 0 12px 0 6px;
   padding: 10px 12px;
   border-top: 1px solid #F2F2F2;
   display: flex;
@@ -132,7 +132,7 @@
       font-size: 14px;
       color: #333333;
       font-weight: 500;
-      margin: 4px;
+      margin: 4px 4px 4px 6px;
     }
   }
   .kjRight {
@@ -148,7 +148,7 @@
   }
 
   .collapseKnow {
-    padding: 12px 12px 0 12px;
+    padding: 8px 12px 6px 12px;
     position: relative;
     :global {
       .van-cell {

src/views/courseware-play/index.tsx

@@ -836,6 +836,7 @@ export default defineComponent({
 
     // 是否允许下一页
     const isDownArrow = computed(() => {
+      console.log(22222222222)
       if (popupData.activeIndex < data.itemList.length - 1) {
         return true;
       }
@@ -944,7 +945,7 @@ export default defineComponent({
         (chapter: any) => chapter.id === activeData.coursewareDetailKnowledgeId
       );
       zjItem && (popupData.itemPointName = zjItem.name);
-      console.log('章节名称', popupData.itemPointName);
+      // console.log('章节名称', popupData.itemPointName);
       loadingClass.value = false;
       debounceSkip.value = false;
     };
@@ -954,7 +955,10 @@ export default defineComponent({
       if (item.coursewareNum || checkType) {
         try {
           if (checkType) {
+            // @ts-ignore
             temporaryData.zjId = activeData.coursewareDetailKnowledgeId
+            // @ts-ignore
+            temporaryData.dyId = activeData.lessonCoursewareDetailId
           }
           const res =
             route.query.tab == 'all'
@@ -1312,6 +1316,7 @@ export default defineComponent({
             detail={data.courseDetails}
             itemActive={activeData.coursewareDetailKnowledgeId as any}
             active={activeData.lessonCoursewareDetailId as any}
+            popShow={popupData.chapterOpen}
             onHandleSelect={async (item: any) => {
               temporaryData.dyId = item.tabActive;
               temporaryData.zjId = item.itemActive;