Showing
1 changed file
with
21 additions
and
16 deletions
| ... | @@ -57,20 +57,14 @@ | ... | @@ -57,20 +57,14 @@ |
| 57 | <!-- Tab Content --> | 57 | <!-- Tab Content --> |
| 58 | <div class="p-4"> | 58 | <div class="p-4"> |
| 59 | <div v-if="activeTab === '课程特色'"> | 59 | <div v-if="activeTab === '课程特色'"> |
| 60 | - <!-- <ul class="list-disc pl-5 space-y-2 text-gray-700"> | 60 | + <div v-html="course?.feature"></div> |
| 61 | - <li>小班授课,更多关注</li> | ||
| 62 | - <li>名师授课,经验丰富</li> | ||
| 63 | - <li>随堂练习,巩固知识</li> | ||
| 64 | - <li>及时反馈,调整教学</li> | ||
| 65 | - </ul> --> | ||
| 66 | - <div v-html="course?.feature || 'N/A'"></div> | ||
| 67 | </div> | 61 | </div> |
| 68 | 62 | ||
| 69 | <div v-if="activeTab === '课程大纲'"> | 63 | <div v-if="activeTab === '课程大纲'"> |
| 70 | <div class="space-y-4"> | 64 | <div class="space-y-4"> |
| 71 | <div v-for="(item, index) in displayedSchedule" :key="index" class="border-l-2 border-green-500 pl-3"> | 65 | <div v-for="(item, index) in displayedSchedule" :key="index" class="border-l-2 border-green-500 pl-3"> |
| 72 | <h4 class="font-medium text-gray-800">{{ item.title }}</h4> | 66 | <h4 class="font-medium text-gray-800">{{ item.title }}</h4> |
| 73 | - <p class="text-sm text-gray-600 mt-1">{{ item.duration }}分钟 · {{ item.schedule_time || 'N/A' }}个小节</p> | 67 | + <p class="text-sm text-gray-600 mt-1">{{ item.duration }}分钟 · {{ item.schedule_time }}个小节</p> |
| 74 | </div> | 68 | </div> |
| 75 | <div v-if="course?.schedule?.length > 4" class="flex justify-center mt-4"> | 69 | <div v-if="course?.schedule?.length > 4" class="flex justify-center mt-4"> |
| 76 | <button @click="toggleSchedule" | 70 | <button @click="toggleSchedule" |
| ... | @@ -84,13 +78,13 @@ | ... | @@ -84,13 +78,13 @@ |
| 84 | 78 | ||
| 85 | <div v-if="activeTab === '课程亮点'"> | 79 | <div v-if="activeTab === '课程亮点'"> |
| 86 | <div class="space-y-3 text-gray-700"> | 80 | <div class="space-y-3 text-gray-700"> |
| 87 | - <div v-html="course?.highlights || 'N/A'"></div> | 81 | + <div v-html="course?.highlights"></div> |
| 88 | </div> | 82 | </div> |
| 89 | </div> | 83 | </div> |
| 90 | 84 | ||
| 91 | <div v-if="activeTab === '学习目标'"> | 85 | <div v-if="activeTab === '学习目标'"> |
| 92 | <div class="space-y-3 text-gray-700"> | 86 | <div class="space-y-3 text-gray-700"> |
| 93 | - <div v-html="course?.learning_goal || 'N/A'"></div> | 87 | + <div v-html="course?.learning_goal"></div> |
| 94 | </div> | 88 | </div> |
| 95 | </div> | 89 | </div> |
| 96 | </div> | 90 | </div> |
| ... | @@ -273,12 +267,16 @@ const toggleFavorite = async () => { | ... | @@ -273,12 +267,16 @@ const toggleFavorite = async () => { |
| 273 | } | 267 | } |
| 274 | 268 | ||
| 275 | // Curriculum items | 269 | // Curriculum items |
| 276 | -const curriculumItems = [ | 270 | +const curriculumItems = computed(() => { |
| 277 | - { title: '课程特色', active: true }, | 271 | + if (!course.value) return []; |
| 278 | - { title: '课程大纲', active: false }, | 272 | + |
| 279 | - { title: '课程亮点', active: false }, | 273 | + return [ |
| 280 | - { title: '学习目标', active: false }, | 274 | + { title: '课程特色', active: activeTab.value === '课程特色', show: !!course.value.feature }, |
| 281 | -] | 275 | + { title: '课程大纲', active: activeTab.value === '课程大纲', show: !!(course.value.schedule && course.value.schedule.length > 0) }, |
| 276 | + { title: '课程亮点', active: activeTab.value === '课程亮点', show: !!course.value.highlights }, | ||
| 277 | + { title: '学习目标', active: activeTab.value === '学习目标', show: !!course.value.learning_goal }, | ||
| 278 | + ].filter(item => item.show); | ||
| 279 | +}); | ||
| 282 | 280 | ||
| 283 | // Handle image error | 281 | // Handle image error |
| 284 | const handleImageError = (e) => { | 282 | const handleImageError = (e) => { |
| ... | @@ -370,6 +368,13 @@ onMounted(async () => { | ... | @@ -370,6 +368,13 @@ onMounted(async () => { |
| 370 | isFavorite.value = foundCourse.is_favorite; | 368 | isFavorite.value = foundCourse.is_favorite; |
| 371 | isPurchased.value = foundCourse.is_buy; | 369 | isPurchased.value = foundCourse.is_buy; |
| 372 | isReviewed.value = foundCourse.is_comment; | 370 | isReviewed.value = foundCourse.is_comment; |
| 371 | + | ||
| 372 | + // 设置默认选中的 tab,确保选中的 tab 有内容 | ||
| 373 | + const availableTabs = curriculumItems.value; | ||
| 374 | + if (availableTabs.length > 0 && !availableTabs.some(item => item.title === activeTab.value)) { | ||
| 375 | + activeTab.value = availableTabs[0].title; | ||
| 376 | + } | ||
| 377 | + | ||
| 373 | // 获取评论列表 | 378 | // 获取评论列表 |
| 374 | await fetchCommentList() | 379 | await fetchCommentList() |
| 375 | } else { | 380 | } else { | ... | ... |
-
Please register or login to post a comment