hookehuyr

feat(教师端): 新增学员作业记录页面及跳转功能

- 添加学员作业记录页面路由及视图组件
- 在作业主页学生卡片添加点击跳转功能
- 实现作业记录列表展示、媒体播放及点评功能
- 更新README文档说明新增功能
...@@ -12,3 +12,7 @@ https://oa-dev.onwall.cn/f/mlaj ...@@ -12,3 +12,7 @@ https://oa-dev.onwall.cn/f/mlaj
12 - 统计:出勤率与任务完成率(参考 `myClassPage.vue` 统计样式,数据Mock)。 12 - 统计:出勤率与任务完成率(参考 `myClassPage.vue` 统计样式,数据Mock)。
13 - 日历:使用 `van-calendar` 单选模式,选择日期后展示当日学生完成情况。 13 - 日历:使用 `van-calendar` 单选模式,选择日期后展示当日学生完成情况。
14 - 学生完成情况:参考图片2样式,勾选代表已完成,未勾选代表未完成(数据Mock)。 14 - 学生完成情况:参考图片2样式,勾选代表已完成,未勾选代表未完成(数据Mock)。
15 + - 教师端新增学员作业记录页面:路径 `/teacher/student-record`,标题“学员作业记录”。
16 + - 在作业主页的学生列表点击卡片可跳转至该页面(当前版本为固定示例页面)。
17 + - 列表展示:作业帖子、图片/视频/音频、点赞与点评弹窗(与 `studentPage.vue` 的作业记录样式一致)。
18 + - 接口参数固定:`user_id=817017``group_id=816653`(后续可替换为动态参数)。
......
...@@ -60,4 +60,13 @@ export default [ ...@@ -60,4 +60,13 @@ export default [
60 requiresAuth: true 60 requiresAuth: true
61 }, 61 },
62 }, 62 },
63 + {
64 + path: '/teacher/student-record',
65 + name: 'StudentRecord',
66 + component: () => import('../views/teacher/studentRecordPage.vue'),
67 + meta: {
68 + title: '学员作业记录',
69 + requiresAuth: true
70 + },
71 + },
63 ] 72 ]
......
This diff is collapsed. Click to expand it.
1 <!-- 1 <!--
2 * @Date: 2025-11-19 21:00:00 2 * @Date: 2025-11-19 21:00:00
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-11-19 21:43:15 4 + * @LastEditTime: 2025-11-19 22:10:07
5 * @FilePath: /mlaj/src/views/teacher/taskHomePage.vue 5 * @FilePath: /mlaj/src/views/teacher/taskHomePage.vue
6 * @Description: 教师端作业主页(头部介绍、统计、日历与学生完成情况;数据Mock) 6 * @Description: 教师端作业主页(头部介绍、统计、日历与学生完成情况;数据Mock)
7 --> 7 -->
...@@ -66,7 +66,8 @@ ...@@ -66,7 +66,8 @@
66 <div class="grid grid-cols-5 gap-3 StudentsGrid"> 66 <div class="grid grid-cols-5 gap-3 StudentsGrid">
67 <div v-for="(stu, idx) in students_status" :key="stu.id" 67 <div v-for="(stu, idx) in students_status" :key="stu.id"
68 class="studentItem relative rounded-md h-16 flex flex-col items-center justify-center text-center border overflow-hidden" 68 class="studentItem relative rounded-md h-16 flex flex-col items-center justify-center text-center border overflow-hidden"
69 - :class="stu.completed ? 'bg-white border-green-500 text-green-600' : 'bg-gray-100 border-gray-300 text-gray-500'"> 69 + :class="stu.completed ? 'bg-white border-green-500 text-green-600' : 'bg-gray-100 border-gray-300 text-gray-500'"
70 + @click="go_student_record(stu)">
70 <div class="text-sm font-semibold">{{ idx + 1 }}</div> 71 <div class="text-sm font-semibold">{{ idx + 1 }}</div>
71 <div class="text-sm mt-1">{{ stu.name }}</div> 72 <div class="text-sm mt-1">{{ stu.name }}</div>
72 <img v-if="stu.completed" :src="checkCorner" alt="checked" class="cornerIcon" /> 73 <img v-if="stu.completed" :src="checkCorner" alt="checked" class="cornerIcon" />
...@@ -78,12 +79,13 @@ ...@@ -78,12 +79,13 @@
78 79
79 <script setup> 80 <script setup>
80 import { ref, computed } from 'vue' 81 import { ref, computed } from 'vue'
81 -import { useRoute } from 'vue-router' 82 +import { useRoute, useRouter } from 'vue-router'
82 import { useTitle } from '@vueuse/core' 83 import { useTitle } from '@vueuse/core'
83 import TaskCalendar from '@/components/ui/TaskCalendar.vue' 84 import TaskCalendar from '@/components/ui/TaskCalendar.vue'
84 import checkCorner from '@/assets/check_corner.svg' 85 import checkCorner from '@/assets/check_corner.svg'
85 86
86 const $route = useRoute() 87 const $route = useRoute()
88 +const $router = useRouter()
87 useTitle('作业主页') 89 useTitle('作业主页')
88 90
89 // 91 //
...@@ -193,6 +195,16 @@ const completed_count = computed(() => students_status.value.filter(s => s.compl ...@@ -193,6 +195,16 @@ const completed_count = computed(() => students_status.value.filter(s => s.compl
193 * @returns {string} 文本 195 * @returns {string} 文本
194 */ 196 */
195 const current_date_text = computed(() => selected_date.value) 197 const current_date_text = computed(() => selected_date.value)
198 +
199 +/**
200 + * 跳转至学员作业记录页面(固定ID的示例页面)
201 + * @param {{id:string,name:string,completed:boolean}} stu - 学员对象
202 + * @returns {void}
203 + */
204 +function go_student_record(stu) {
205 + // 跳转到固定ID的作业记录页面,当前版本不使用传入ID
206 + $router.push({ name: 'StudentRecord' })
207 +}
196 </script> 208 </script>
197 209
198 <style lang="less" scoped> 210 <style lang="less" scoped>
......