Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
mlaj
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
hookehuyr
2025-06-11 21:30:27 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
661d315be76edc04e2c64bff0fec3f498ef6ec98
661d315b
1 parent
ebceeb8c
refactor(课程详情页): 优化课程详情页的标签显示逻辑
根据课程内容动态显示标签页,移除默认值'N/A'
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
21 additions
and
16 deletions
src/views/courses/CourseDetailPage.vue
src/views/courses/CourseDetailPage.vue
View file @
661d315
...
...
@@ -57,20 +57,14 @@
<!-- Tab Content -->
<div class="p-4">
<div v-if="activeTab === '课程特色'">
<!-- <ul class="list-disc pl-5 space-y-2 text-gray-700">
<li>小班授课,更多关注</li>
<li>名师授课,经验丰富</li>
<li>随堂练习,巩固知识</li>
<li>及时反馈,调整教学</li>
</ul> -->
<div v-html="course?.feature || 'N/A'"></div>
<div v-html="course?.feature"></div>
</div>
<div v-if="activeTab === '课程大纲'">
<div class="space-y-4">
<div v-for="(item, index) in displayedSchedule" :key="index" class="border-l-2 border-green-500 pl-3">
<h4 class="font-medium text-gray-800">{{ item.title }}</h4>
<p class="text-sm text-gray-600 mt-1">{{ item.duration }}分钟 · {{ item.schedule_time
|| 'N/A'
}}个小节</p>
<p class="text-sm text-gray-600 mt-1">{{ item.duration }}分钟 · {{ item.schedule_time }}个小节</p>
</div>
<div v-if="course?.schedule?.length > 4" class="flex justify-center mt-4">
<button @click="toggleSchedule"
...
...
@@ -84,13 +78,13 @@
<div v-if="activeTab === '课程亮点'">
<div class="space-y-3 text-gray-700">
<div v-html="course?.highlights
|| 'N/A'
"></div>
<div v-html="course?.highlights"></div>
</div>
</div>
<div v-if="activeTab === '学习目标'">
<div class="space-y-3 text-gray-700">
<div v-html="course?.learning_goal
|| 'N/A'
"></div>
<div v-html="course?.learning_goal"></div>
</div>
</div>
</div>
...
...
@@ -273,12 +267,16 @@ const toggleFavorite = async () => {
}
// Curriculum items
const curriculumItems = [
{ title: '课程特色', active: true },
{ title: '课程大纲', active: false },
{ title: '课程亮点', active: false },
{ title: '学习目标', active: false },
]
const curriculumItems = computed(() => {
if (!course.value) return [];
return [
{ title: '课程特色', active: activeTab.value === '课程特色', show: !!course.value.feature },
{ title: '课程大纲', active: activeTab.value === '课程大纲', show: !!(course.value.schedule && course.value.schedule.length > 0) },
{ title: '课程亮点', active: activeTab.value === '课程亮点', show: !!course.value.highlights },
{ title: '学习目标', active: activeTab.value === '学习目标', show: !!course.value.learning_goal },
].filter(item => item.show);
});
// Handle image error
const handleImageError = (e) => {
...
...
@@ -370,6 +368,13 @@ onMounted(async () => {
isFavorite.value = foundCourse.is_favorite;
isPurchased.value = foundCourse.is_buy;
isReviewed.value = foundCourse.is_comment;
// 设置默认选中的 tab,确保选中的 tab 有内容
const availableTabs = curriculumItems.value;
if (availableTabs.length > 0 && !availableTabs.some(item => item.title === activeTab.value)) {
activeTab.value = availableTabs[0].title;
}
// 获取评论列表
await fetchCommentList()
} else {
...
...
Please
register
or
login
to post a comment