style: UI走查修改

src/components/select-courseware-pop/index.module.less

@@ -32,13 +32,32 @@
     }
     .list {
         height: 110px;
-        width: 249px;
+        width: 258px;
         margin-top: 117px;
         margin-left: 17px;
         display: flex;
         flex-direction: column;
         position: relative;
         overflow-y: scroll;
+        overflow-x: hidden;
+        &::-webkit-scrollbar
+        {
+            width:4px;
+            height:4px;
+            background-color: transparent;
+        }
+        &::-webkit-scrollbar-track
+        {
+            //-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
+            border-radius:10px;
+            background-color: transparent;
+        }
+        &::-webkit-scrollbar-thumb
+        {
+            border-radius:10px;
+            //-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);
+            background-color:#CBCBCB;
+        }      
         >li {
             width: 249px;
             box-sizing: border-box;

src/views/courseware-play/component/instrument-info/index.module.less

@@ -117,7 +117,7 @@
                 .liBg {
                     width: 28px;
                     height: 28px;
-                    border-radius: 20px;
+                    border-radius: 8px;
                 }
                 .liName {
                     flex: 1;
@@ -125,12 +125,29 @@
                     overflow-x: hidden;
                     text-overflow: ellipsis;
                     white-space: nowrap;
+                    font-size: 14px;
+                    color: #131415;
                 }
                 .liPlay {
                     width: 20px;
                     height: 20px;
                 }
             }
+            .emptyBox {
+                flex: 1;
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                > img {
+                    width: 110px;
+                    height: 110px;
+                }
+                > span {
+                    font-size: 14px;
+                    color: #999999;
+                    margin-top: 4px;
+                }
+            }
         }
     }
     .right {
@@ -146,6 +163,7 @@
             font-size: 16px;
             color: #000000;
             font-weight: 500;
+            margin-bottom: 15px;
             >img {
                 width: 24px;
                 height: 24px;
@@ -162,6 +180,17 @@
             video {
               width: 100% !important;
             }
+            &::-webkit-scrollbar
+            {
+                width:4px;
+                height:4px;
+                background-color: transparent;
+            }
+            &::-webkit-scrollbar-thumb
+            {
+                border-radius:10px;
+                background-color:#CBCBCB;
+            }             
         }
     }
 }

src/views/courseware-play/component/instrument-info/index.tsx

@@ -6,6 +6,7 @@ import styles from './index.module.less';
 import musicBg from '../../image/music_bg.png';
 import titleIcon1 from '../../image/title_icon1.png';
 import playIcon from '../../image/music_play_icon.png';
+import emptyIcon from '../../image/ins-empty-icon.png';
 
 export default defineComponent({
   name: 'InstrumentInfo',
@@ -94,15 +95,24 @@ export default defineComponent({
             </div>
           }          
           <div class={styles.insList}>
-          {forms.musicList.map((item: any, index: number) => {
-              return (
-                <div class={styles.li}>
-                  <img class={styles.liBg} src={musicBg} />
-                  <div class={styles.liName}>{item.name || '--'}</div>
-                  <img class={styles.liPlay} src={playIcon} />
-                </div>
-              );
-            })}
+            {
+              forms.musicList.length ? 
+                <>
+                  {forms.musicList.map((item: any, index: number) => {
+                    return (
+                      <div class={styles.li}>
+                        <img class={styles.liBg} src={musicBg} />
+                        <div class={styles.liName}>{item.name || '--'}</div>
+                        <img class={styles.liPlay} src={playIcon} />
+                      </div>
+                    );
+                  })}
+              </> : 
+              <div class={styles.emptyBox}>
+                <img src={emptyIcon} />
+                <span>暂无曲目～</span>
+              </div>
+            }
           </div>
         </div>       
         <div class={styles.right}>

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

@@ -103,7 +103,22 @@
   }
 
   .collapseKnow {
-    padding-bottom: 0;
+    padding: 14px 14px 0;
+    position: relative;
+    :global {
+      .van-cell {
+        margin-bottom: 8px;
+      }
+    }
+    &::before {
+      content: "";
+      position: absolute;
+      left: 5px;
+      top: 8px;
+      width: calc(100% - 10px);
+      height: 1px;
+      background: #D5E2EA;
+    }
   }
   :global {
     .van-cell {

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

@@ -10,6 +10,7 @@ import iconSong from '../image/icon-song.svg';
 import iconSongActive from '../image/icon-song-active.svg';
 import chapterDown from '../image/chapter-down-arrow.svg';
 import chapterDefault from '../image/chapter-default-arrow.svg';
+import chapterDefault2 from '../image/chapter-default-arrow2.svg';
 
 import { Icon, Collapse, CollapseItem } from 'vant';
 import { useRoute } from 'vue-router';
@@ -186,7 +187,7 @@ export default defineComponent({
                                     src={
                                       pointData.zsdId === know.id
                                         ? chapterDown
-                                        : chapterDefault
+                                        : chapterDefault2
                                     }
                                   />
                                 )

src/views/courseware-play/image/chapter-default-arrow2.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="7px" height="10px" viewBox="0 0 7 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>展开更多备份 3</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="课件-课件列表收起备份" transform="translate(-583.000000, -130.000000)" fill="#333333">
+            <g id="编组-9" transform="translate(550.000000, 50.000000)">
+                <g id="展开更多备份-3" transform="translate(36.500000, 85.000000) rotate(-90.000000) translate(-36.500000, -85.000000) translate(31.500000, 82.000000)">
+                    <path d="M5.38411064,0.460932768 L9.31658983,5.1799078 C9.49337187,5.39204625 9.46470984,5.7073286 9.25257139,5.88411064 C9.16271389,5.95899189 9.04944745,6 8.93247919,6 L1.06752081,6 C0.791378431,6 0.567520806,5.77614237 0.567520806,5.5 C0.567520806,5.38303175 0.608528916,5.2697653 0.683410167,5.1799078 L4.61588936,0.460932768 C4.7926714,0.248794319 5.10795375,0.220132287 5.3200922,0.396914328 C5.34332373,0.416273938 5.36475103,0.437701235 5.38411064,0.460932768 Z" id="展开更多" transform="translate(5.000000, 3.000000) rotate(-180.000000) translate(-5.000000, -3.000000) "></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>