Hooke / mlaj

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
94520fd1 1 parent ecc35066

feat(teacher): 添加学生点评删除功能并更新班级页面 

- 在学生详情页添加删除点评功能，包括确认对话框
- 更新班级页面学生信息展示，使用真实数据字段
- 移除多余的排序选项并调整头像尺寸
Inline Side-by-side
Showing 2 changed files with 106 additions and 47 deletions
......@@ -2,7 +2,7 @@
* @Author: hookehuyr hookehuyr@gmail.com
* @Date: 2025-01-20 10:00:00
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-06-25 16:12:36
* @LastEditTime: 2025-06-25 17:22:37
* @FilePath: /mlaj/src/views/teacher/myClassPage.vue
* @Description: 我的班级页面
-->
......@@ -13,10 +13,10 @@
<div>
<div class="bg-white p-4">
<div class="flex items-center mb-4">
<van-image round width="3rem" height="3rem"
:src="userInfo.avatar || 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'" fit="cover" class="mr-3" />
<van-image round width="4rem" height="4rem"
:src="currentUser.avatar || 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'" fit="cover" class="mr-3" />
<div class="flex-1">
<h2 class="text-lg font-bold text-gray-800">{{ userInfo.name }}</h2>
<h2 class="text-lg font-bold text-gray-800">{{ currentUser.name }}</h2>
<div class="flex items-center mt-1">
<van-icon name="clock-o" size="22" color="#10b981" class="mr-1" />&nbsp;
<van-icon name="chat-o" size="22" color="#10b981" class="mr-1" />&nbsp;
......@@ -106,15 +106,17 @@
<font-awesome-icon v-if="student.gender === 'male'" icon="venus" color="#3b82f6" class="mr-2" style="font-size: 0.85rem;" />
<font-awesome-icon v-else icon="mars" color="#ec4899" class="mr-2" style="font-size: 0.85rem;" />
</div>
<div class="text-sm text-gray-500" style="text-align: left;">{{ student.className }}</div>
<div class="text-sm text-gray-500" style="text-align: left;">
<span v-for="(item, index) in student.class_list" :key="index" class="mr-2">{{ item }}</span>
</div>
</div>
</div>
<div class="text-right">
<div class="flex items-center text-sm text-gray-500 mb-1">
<van-icon name="phone-o" size="12" class="mr-1" />
<span>{{ formatPhone(student.phone) }}</span>
<span>{{ formatPhone(student.mobile) }}</span>
</div>
<div class="text-xs text-gray-400">{{ student.lastActiveTime }}</div>
<div class="text-xs text-gray-400">{{ student.last_checkin_time }}</div>
</div>
<van-icon name="arrow" color="#d1d5db" size="16" class="ml-2" />
</div>
......@@ -156,6 +158,7 @@ import { ref, computed, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import AppLayout from '@/layouts/AppLayout.vue'
import { useTitle } from '@vueuse/core';
import { useAuth } from '@/contexts/auth'
import { getTeacherGradeClassListAPI } from "@/api/teacher";
......@@ -168,11 +171,8 @@ const themeVars = ref({
searchInputHeight: '2.5rem',
})
// 用户信息
const userInfo = ref({
name: '我的班级',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
})
// 获取用户认证状态
const { currentUser } = useAuth()
// 筛选器数据
const selectGradeValue = ref(null);
......@@ -189,8 +189,6 @@ const showSortPopup = ref(false)
// 筛选器选项
const sortOptions = ref([
{ text: '按活跃度', value: '按活跃度' },
{ text: '按姓名', value: '按姓名' },
{ text: '按成绩', value: '按成绩' }
])
// 统计数据
......@@ -204,72 +202,72 @@ const studentList = ref([
id: 1,
name: '张明',
gender: 'male',
className: '高一(3)班',
phone: '13812345678',
lastActiveTime: '5分钟前活跃',
class_list: ['高一(3)班', '高二(1)班', '高二(2)班'],
mobile: '13812345678',
last_checkin_time: '5分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 2,
name: '李华',
gender: 'female',
className: '高一(3)班',
phone: '13987654321',
lastActiveTime: '10分钟前活跃',
class_list: ['高一(3)班', '高二(1)班', '高二(2)班'],
mobile: '13987654321',
last_checkin_time: '10分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 3,
name: '王强',
gender: 'male',
className: '高一(2)班',
phone: '13512349876',
lastActiveTime: '15分钟前活跃',
class_list: ['高一(2)班', '高二(1)班', '高二(2)班'],
mobile: '13512349876',
last_checkin_time: '15分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 4,
name: '赵敏',
gender: 'female',
className: '高一(1)班',
phone: '13643214321',
lastActiveTime: '30分钟前活跃',
class_list: ['高一(1)班', '高二(1)班', '高二(2)班'],
mobile: '13643214321',
last_checkin_time: '30分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 1,
name: '张明',
gender: 'male',
className: '高一(3)班',
phone: '13812345678',
lastActiveTime: '5分钟前活跃',
class_list: ['高一(3)班', '高二(1)班', '高二(2)班'],
mobile: '13812345678',
last_checkin_time: '5分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 2,
name: '李华',
gender: 'female',
className: '高一(3)班',
phone: '13987654321',
lastActiveTime: '10分钟前活跃',
class_list: ['高一(3)班'],
mobile: '13987654321',
last_checkin_time: '10分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 3,
name: '王强',
gender: 'male',
className: '高一(2)班',
phone: '13512349876',
lastActiveTime: '15分钟前活跃',
class_list: ['高一(2)班'],
mobile: '13512349876',
last_checkin_time: '15分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
},
{
id: 4,
name: '赵敏',
gender: 'female',
className: '高一(1)班',
phone: '13643214321',
lastActiveTime: '30分钟前活跃',
class_list: ['高一(1)班'],
mobile: '13643214321',
last_checkin_time: '30分钟前活跃',
avatar: 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
}
])
......
......@@ -2,7 +2,7 @@
* @Author: hookehuyr hookehuyr@gmail.com
* @Date: 2025-06-19 17:12:19
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-06-24 17:23:46
* @LastEditTime: 2025-06-25 17:47:34
* @FilePath: /mlaj/src/views/teacher/studentPage.vue
* @Description: 学生详情页面
-->
......@@ -149,10 +149,19 @@
finished-text="没有更多了" @load="onEvaluationLoad" class="px-4">
<div v-for="evaluation in evaluationList" :key="evaluation.id"
class="bg-white rounded-lg shadow-sm p-4 mb-3 border border-gray-100">
<!-- 第一行：时间 + 日历图标 -->
<div class="flex items-center mb-3">
<van-icon name="calendar-o" size="16" color="#10b981" class="mr-2" />
<span class="text-sm text-gray-600">{{ evaluation.date }}</span>
<!-- 第一行：时间 + 日历图标 + 删除按钮 -->
<div class="flex items-center justify-between mb-3">
<div class="flex items-center">
<van-icon name="calendar-o" size="16" color="#10b981" class="mr-2" />
<span class="text-sm text-gray-600">{{ evaluation.date }}</span>
</div>
<van-icon
name="delete-o"
size="16"
color="#ef4444"
class="cursor-pointer hover:opacity-70"
@click="deleteEvaluation(evaluation.id)"
/>
</div>
<!-- 第二行：点评内容 + 图标 -->
......@@ -168,7 +177,6 @@
<van-icon name="star-o" size="16" color="#f59e0b" class="mr-2" />
<span class="text-sm text-gray-600 mr-3">评分：</span>
<van-rate v-model="evaluation.score" :size="16" color="#ffd21e" void-color="#eee" readonly />
<!-- <span class="text-sm text-gray-500 ml-2">({{ evaluation.score }}/5)</span> -->
</div>
</div>
</van-list>
......@@ -330,6 +338,23 @@
</div>
</div>
</van-popup>
<!-- 删除确认对话框 -->
<van-dialog
v-model:show="showDeleteDialog"
title="温馨提示"
:show-cancel-button="true"
:show-confirm-button="true"
confirm-button-text="确定删除"
cancel-button-text="取消"
confirm-button-color="#ef4444"
@confirm="confirmDelete"
@cancel="cancelDelete"
>
<div class="p-4">
<p class="text-gray-700 text-center">确定要删除这条点评吗？</p>
</div>
</van-dialog>
</div>
</van-config-provider>
</template>
......@@ -343,7 +368,7 @@ import AudioPlayer from "@/components/ui/AudioPlayer.vue";
import { useTitle } from '@vueuse/core';
import dayjs from 'dayjs';
import { getTaskDetailAPI, getUploadTaskListAPI, delUploadTaskInfoAPI, likeUploadTaskInfoAPI, dislikeUploadTaskInfoAPI } from "@/api/checkin";
import { getCheckinTeacherListAPI, delUploadTaskInfoAPI, likeUploadTaskInfoAPI, dislikeUploadTaskInfoAPI } from "@/api/checkin";
const router = useRouter()
......@@ -529,6 +554,10 @@ const records = ref([
const recordLoading = ref(false)
const recordFinished = ref(false)
// 删除对话框相关状态
const showDeleteDialog = ref(false)
const currentDeleteId = ref(null)
// 班主任点评列表数据
const evaluationList = ref([
{
......@@ -621,6 +650,38 @@ const onEvaluationLoad = () => {
}
/**
* 删除点评
* @param {number} evaluationId - 点评ID
*/
const deleteEvaluation = (evaluationId) => {
currentDeleteId.value = evaluationId
showDeleteDialog.value = true
}
/**
* 确认删除操作
*/
const confirmDelete = () => {
// 这里应该调用API删除点评，暂时模拟删除操作
const index = evaluationList.value.findIndex(item => item.id === currentDeleteId.value)
if (index !== -1) {
evaluationList.value.splice(index, 1)
showSuccessToast('删除成功')
}
showDeleteDialog.value = false
currentDeleteId.value = null
}
/**
* 取消删除操作
*/
const cancelDelete = () => {
showDeleteDialog.value = false
currentDeleteId.value = null
console.log('用户取消删除操作')
}
/**
* 组件挂载时初始化数据
*/
const checkinDataList = ref([]);
......@@ -863,7 +924,7 @@ const onLoad = async (date) => {
const nextPage = page.value;
const current_date = date || route.query.date || dayjs().format('YYYY-MM-DD');
//
const res = await getUploadTaskListAPI({
const res = await getCheckinTeacherListAPI({
limit: limit.value,
page: nextPage,
task_id: route.query.id,
......@@ -932,7 +993,7 @@ const formatData = (data) => {
}
</script>
<style lang="less">
<style lang="less" scoped>
.van-back-top {
background-color: #4caf50;
}
......