hookehuyr

fix: 修复学习记录页显示问题并调整热门课程数量

修改学习记录页的显示字段,使用后端返回的格式化数据替代前端计算
调整热门课程获取数量从4增加到8
修复分页初始值错误问题
1 <!-- 1 <!--
2 * @Date: 2025-03-20 19:55:21 2 * @Date: 2025-03-20 19:55:21
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-06-11 13:20:30 4 + * @LastEditTime: 2025-06-11 17:10:09
5 * @FilePath: /mlaj/src/views/HomePage.vue 5 * @FilePath: /mlaj/src/views/HomePage.vue
6 * @Description: 美乐爱觉教育首页组件 6 * @Description: 美乐爱觉教育首页组件
7 * 7 *
...@@ -577,7 +577,6 @@ const checkInTypes = ref([]); ...@@ -577,7 +577,6 @@ const checkInTypes = ref([]);
577 // 自动轮播 577 // 自动轮播
578 let carouselInterval 578 let carouselInterval
579 onMounted(async () => { 579 onMounted(async () => {
580 -
581 // 获取课程列表 580 // 获取课程列表
582 const res = await getCourseListAPI({ sn: 'RMKC' }) 581 const res = await getCourseListAPI({ sn: 'RMKC' })
583 if (res.code) { 582 if (res.code) {
...@@ -588,7 +587,7 @@ onMounted(async () => { ...@@ -588,7 +587,7 @@ onMounted(async () => {
588 // 获取热门课程 587 // 获取热门课程
589 const res2 = await getCourseListAPI({ 588 const res2 = await getCourseListAPI({
590 sn: 'RMKC', 589 sn: 'RMKC',
591 - limit: 4 590 + limit: 8
592 }) 591 })
593 if (res2.code) { 592 if (res2.code) {
594 hotCourses.value = res2.data 593 hotCourses.value = res2.data
......
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
47 d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" 47 d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
48 /> 48 />
49 </svg> 49 </svg>
50 - <span>学习时长:{{ formatDuration(record.study_duration) }}</span> 50 + <span>学习时长:{{ record.study_duration_desc }}</span>
51 </div> 51 </div>
52 <div class="flex items-center text-sm text-gray-500 mb-3"> 52 <div class="flex items-center text-sm text-gray-500 mb-3">
53 <svg 53 <svg
...@@ -64,12 +64,12 @@ ...@@ -64,12 +64,12 @@
64 d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" 64 d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"
65 /> 65 />
66 </svg> 66 </svg>
67 - <span>最近学习:{{ formatDate(record.recent_study_time) }}</span> 67 + <span>最近学习:{{ record.recent_study_time }}</span>
68 </div> 68 </div>
69 <div class="flex items-center"> 69 <div class="flex items-center">
70 <div class="flex-1"> 70 <div class="flex-1">
71 <van-progress 71 <van-progress
72 - :percentage="record.study_progress" 72 + :percentage="record.record_progress"
73 :stroke-width="4" 73 :stroke-width="4"
74 color="#10B981" 74 color="#10B981"
75 /> 75 />
...@@ -110,7 +110,7 @@ import { ref } from 'vue'; ...@@ -110,7 +110,7 @@ import { ref } from 'vue';
110 import { useRoute } from 'vue-router'; 110 import { useRoute } from 'vue-router';
111 import { useTitle } from '@vueuse/core'; 111 import { useTitle } from '@vueuse/core';
112 import FrostedGlass from '@/components/ui/FrostedGlass.vue'; 112 import FrostedGlass from '@/components/ui/FrostedGlass.vue';
113 -import { formatDate, formatDuration } from '@/utils/tools'; 113 +import { formatDate } from '@/utils/tools';
114 114
115 // 导入接口 115 // 导入接口
116 import { getStudyRecordListAPI } from "@/api/record"; 116 import { getStudyRecordListAPI } from "@/api/record";
...@@ -121,7 +121,7 @@ useTitle($route.meta.title); ...@@ -121,7 +121,7 @@ useTitle($route.meta.title);
121 const records = ref([]); 121 const records = ref([]);
122 const loading = ref(false); 122 const loading = ref(false);
123 const finished = ref(false); 123 const finished = ref(false);
124 -const page = ref(1); 124 +const page = ref(0);
125 const limit = ref(10); 125 const limit = ref(10);
126 const finishText = ref('没有更多了'); 126 const finishText = ref('没有更多了');
127 127
...@@ -135,6 +135,9 @@ const onLoad = async () => { ...@@ -135,6 +135,9 @@ const onLoad = async () => {
135 page: nextPage, 135 page: nextPage,
136 }); 136 });
137 if (code) { 137 if (code) {
138 + data.forEach((item) => {
139 + item.record_progress = Math.floor((item?.study_count/item?.count)*100);
140 + });
138 records.value.push(...data); 141 records.value.push(...data);
139 finished.value = data.length < limit.value; 142 finished.value = data.length < limit.value;
140 page.value = nextPage + 1; 143 page.value = nextPage + 1;
......