feat: 添加 dayjs 库以处理日期格式化

为了在课程详情页面中正确显示创建日期,我们添加了 dayjs 库来格式化日期字符串。这样,我们可以将日期显示为 "YYYY-MM-DD HH:mm:ss" 的格式。

- 添加了 dayjs 库的依赖
- 在课程详情页面中使用 dayjs 格式化创建日期
This commit is contained in:
2024-09-20 17:28:52 +08:00
parent 37f952911c
commit bc4cb97dea
5 changed files with 35 additions and 5 deletions

View File

@ -1,5 +1,6 @@
<script lang="ts" setup>
import BussApi from '@/api/BussApi';
import { useDayjs } from '@/composables/useDayjs';
import type { Lesson } from '@/types/api/lesson';
import { calcLessonProgress, extractLessonStage, getLessonSteps } from '@/utils/lesson';
import { useRoute } from 'uni-mini-router';
@ -8,6 +9,7 @@ import { useToast } from 'wot-design-uni';
const route = useRoute()
const toast = useToast()
const dayjs = useDayjs()
const lesson = ref<Lesson | null>(null)
const lessonSteps = computed(() => lesson.value ? getLessonSteps(lesson.value) : [])
@ -40,7 +42,7 @@ onMounted(() => {
<h2 class="text-sm text-white font-black op-50">{{ lesson?.m_lesson_name }}</h2>
<h1 class="text-lg text-white font-bold">{{ lesson?.course_name }}</h1>
</div>
<p class="text-xs text-white font-bold op-50" style="line-height: 1;">创建于 {{ lesson?.created_at }}</p>
<p class="text-xs text-white font-bold op-50" style="line-height: 1;">创建于 {{ dayjs(lesson?.created_at).format('YYYY-MM-DD HH:mm:ss') }}</p>
<wd-icon :name="lessonProgress === 100 ? 'check-circle' : 'hourglass'" custom-class="absolute text-white top-2 right-2 op-35" size="64px" />
</div>
<div class="p-4">