更新样式

src/student/home/components/TheSong/index.tsx

@@ -3,7 +3,7 @@ import { defineComponent, PropType } from 'vue'
 import styles from './index.module.less'
 import IconPlay from '@/common/images/icon-play.png'
 import IconFine from '@/views/music/component/images/icon_exquisite.png'
-import IconAlbum from '@/views/images/component/icon_album_active.png'
+import IconAlbum from '@/views/music/component/images/icon_album_active.png'
 import { useRouter } from 'vue-router'
 export default defineComponent({
   name: 'TheSong',

src/student/home/components/info-list/index.tsx

@@ -0,0 +1,9 @@
+import { defineComponent } from 'vue'
+import styles from './index.module.less'
+
+export default defineComponent({
+  name: 'info-list',
+  setup() {
+    return () => <>资讯列表</>
+  }
+})

src/student/home/components/video-class/index.module.less

@@ -16,7 +16,7 @@
   border-radius: 8px;
   background-color: #fff;
   overflow: hidden;
-  width: 168px;
+  width: 148px;
   margin-right: 12px;
 
   .viCover {

src/student/home/index.module.less

@@ -26,3 +26,26 @@
     }
   }
 }
+
+.homeTabs {
+  margin-top: 18px;
+  :global {
+    .van-tab {
+      font-size: 18px;
+      color: #999;
+      font-weight: 600;
+      position: relative;
+      z-index: 2;
+    }
+    .van-tab--active {
+      color: #333333;
+    }
+    .van-tabs__line {
+      width: 56px;
+      height: 10px;
+      background: rgba(45, 199, 170, 0.5);
+      border-radius: 6px;
+      bottom: 25px;
+    }
+  }
+}

src/student/home/index.tsx

@@ -1,7 +1,8 @@
 import request from '@/helpers/request'
-import { PullRefresh, Swipe, SwipeItem, Image } from 'vant'
+import { PullRefresh, Swipe, SwipeItem, Image, Tabs, Tab } from 'vant'
 import { defineComponent } from 'vue'
 import HotAlbum from './components/hot-album'
+import InfoList from './components/info-list'
 import MenuList from './components/menu-list'
 import Music from './components/music'
 import RecommendSage from './components/recommend-sage'
@@ -143,15 +144,22 @@ export default defineComponent({
 
           <HotAlbum album={this.albumList} />
 
-          <Music title="推荐曲目" music={this.musicList?.topMusicSheet || []} />
+          {/* <Music title="推荐曲目" music={this.musicList?.topMusicSheet || []} />
           <Music title="最新曲目" music={this.musicList?.newMusicSheet || []} />
-          <Music title="最热曲目" music={this.musicList?.hotMusicSheet || []} />
+          <Music title="最热曲目" music={this.musicList?.hotMusicSheet || []} /> */}
 
           {/* 推荐达人 */}
-          <RecommendSage sage={this.sageList} />
+          {/* <RecommendSage sage={this.sageList} /> */}
 
           {/* 精品视频课 */}
-          <VideoClass video={this.videoList} />
+          {/* <VideoClass video={this.videoList} /> */}
+
+          <Tabs shrink background="transparent" class={styles.homeTabs}>
+            <Tab title="达人风采" name="sage">
+              <InfoList />
+            </Tab>
+            <Tab title="热门资讯" name="info"></Tab>
+          </Tabs>
         </PullRefresh>
       </div>
     )