Hooke / mlaj

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
72087055 1 parent 39c750ac

feat(study): 添加文件列表展示功能 

在StudyDetailPage.vue中，为课程类型为'file'的课程添加了文件列表展示区域，包括文件图标、标题和打开文件的链接。同时，在main.js中添加了faFileAlt图标以支持文件列表的展示
Inline Side-by-side
Showing 2 changed files with 18 additions and 4 deletions
1 /* 1 /*
2 * @Date: 2025-03-20 20:36:36 2 * @Date: 2025-03-20 20:36:36
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-04-07 14:24:50 4 + * @LastEditTime: 2025-05-08 10:56:28
5 * @FilePath: /mlaj/src/main.js 5 * @FilePath: /mlaj/src/main.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
...@@ -18,10 +18,10 @@ import { library } from '@fortawesome/fontawesome-svg-core' ...@@ -18,10 +18,10 @@ import { library } from '@fortawesome/fontawesome-svg-core'
18 /* import font awesome icon component */ 18 /* import font awesome icon component */
19 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' 19 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
20 /* import specific icons */ 20 /* import specific icons */
21 -import { faCirclePause, faCirclePlay, faPlay, faPause, faBackwardStep, faForwardStep, faVolumeUp, faRedo, faRepeat, faList, faChevronDown, faVolumeOff, faXmark } from '@fortawesome/free-solid-svg-icons' 21 +import { faCirclePause, faCirclePlay, faPlay, faPause, faBackwardStep, faForwardStep, faVolumeUp, faRedo, faRepeat, faList, faChevronDown, faVolumeOff, faXmark, faFileAlt } from '@fortawesome/free-solid-svg-icons'
22 22
23 /* add icons to the library */ 23 /* add icons to the library */
24 -library.add(faCirclePause, faCirclePlay, faPlay, faPause, faBackwardStep, faForwardStep, faVolumeUp, faRedo, faRepeat, faList, faChevronDown, faVolumeOff, faXmark) 24 +library.add(faCirclePause, faCirclePlay, faPlay, faPause, faBackwardStep, faForwardStep, faVolumeUp, faRedo, faRepeat, faList, faChevronDown, faVolumeOff, faXmark, faFileAlt)
25 25
26 const app = createApp(App) 26 const app = createApp(App)
27 // 屏蔽警告信息 27 // 屏蔽警告信息
......
...@@ -47,7 +47,21 @@ ...@@ -47,7 +47,21 @@
47 </van-swipe> 47 </van-swipe>
48 </div> 48 </div>
49 <!-- 文件列表展示区域 --> 49 <!-- 文件列表展示区域 -->
50 - <div v-if="course.course_type === 'file'" class="w-full relative">file</div> 50 + <div v-if="course.course_type === 'file'" class="w-full relative bg-white rounded-lg shadow-sm">
51 + <div class="p-4 space-y-3">
52 + <div v-for="(item, index) in courseFile?.list" :key="index" class="group hover:bg-gray-50 transition-colors rounded-lg p-3">
53 + <div class="flex items-center space-x-3">
54 + <div class="flex-shrink-0">
55 + <font-awesome-icon icon="file-alt" class="text-gray-400 text-xl" />
56 + </div>
57 + <div class="flex-1 min-w-0">
58 + <h3 class="text-sm font-medium text-gray-900 truncate">{{ item.title }}</h3>
59 + <a :href="item.url" target="_blank" class="text-sm text-blue-600 hover:text-blue-800 hover:underline truncate block mt-1">打开文件</a>
60 + </div>
61 + </div>
62 + </div>
63 + </div>
64 + </div>
51 <!-- 标签页区域 --> 65 <!-- 标签页区域 -->
52 <div class="px-4 py-3 bg-white"> 66 <div class="px-4 py-3 bg-white">
53 <van-tabs v-model:active="activeTab" sticky animated swipeable shrink @change="handleTabChange"> 67 <van-tabs v-model:active="activeTab" sticky animated swipeable shrink @change="handleTabChange">
......