feat(StudyDetailPage): 高亮显示当前课程标题
添加计算属性 courseId 并根据当前课程 ID 高亮显示标题文本
Showing
1 changed file
with
9 additions
and
4 deletions
| ... | @@ -221,7 +221,7 @@ | ... | @@ -221,7 +221,7 @@ |
| 221 | <div v-if="lesson.progress > 0 && lesson.progress < 100" | 221 | <div v-if="lesson.progress > 0 && lesson.progress < 100" |
| 222 | class="absolute top-2 right-2 px-2 py-1 bg-green-100 text-green-600 text-xs rounded"> | 222 | class="absolute top-2 right-2 px-2 py-1 bg-green-100 text-green-600 text-xs rounded"> |
| 223 | 上次看到</div> | 223 | 上次看到</div> |
| 224 | - <div class="text-black text-base font-medium mb-2">{{ lesson.title }}</div> | 224 | + <div class="text-black text-base font-medium mb-2" :class="{ 'text-green-600' : courseId == lesson.id }">{{ lesson.title }}</div> |
| 225 | <div class="flex items-center text-sm text-gray-500"> | 225 | <div class="flex items-center text-sm text-gray-500"> |
| 226 | <span>{{ course_type_maps[lesson.course_type] }}</span> | 226 | <span>{{ course_type_maps[lesson.course_type] }}</span> |
| 227 | <span v-if="course_type_maps[lesson.course_type]" class="mx-2">|</span> | 227 | <span v-if="course_type_maps[lesson.course_type]" class="mx-2">|</span> |
| ... | @@ -402,6 +402,10 @@ const showPdf = ({ title, url }) => { | ... | @@ -402,6 +402,10 @@ const showPdf = ({ title, url }) => { |
| 402 | pdfShow.value = true; | 402 | pdfShow.value = true; |
| 403 | }; | 403 | }; |
| 404 | 404 | ||
| 405 | +const courseId = computed(() => { | ||
| 406 | + return route.params.id || ''; | ||
| 407 | +}); | ||
| 408 | + | ||
| 405 | onMounted(async () => { | 409 | onMounted(async () => { |
| 406 | // 延迟设置topWrapper和bottomWrapper的高度 | 410 | // 延迟设置topWrapper和bottomWrapper的高度 |
| 407 | setTimeout(() => { | 411 | setTimeout(() => { |
| ... | @@ -420,9 +424,10 @@ onMounted(async () => { | ... | @@ -420,9 +424,10 @@ onMounted(async () => { |
| 420 | }) | 424 | }) |
| 421 | }, 500); | 425 | }, 500); |
| 422 | 426 | ||
| 423 | - const courseId = route.params.id; | 427 | + |
| 424 | - if (courseId) { | 428 | + |
| 425 | - const { code, data } = await getScheduleCourseAPI({ i: courseId }); | 429 | + if (courseId.value) { |
| 430 | + const { code, data } = await getScheduleCourseAPI({ i: courseId.value }); | ||
| 426 | if (code) { | 431 | if (code) { |
| 427 | course.value = data; | 432 | course.value = data; |
| 428 | courseFile.value = data.file; | 433 | courseFile.value = data.file; | ... | ... |
-
Please register or login to post a comment