hookehuyr

feat(教师任务主页): 添加筛选状态缓存功能以支持返回时恢复

在任务主页添加筛选状态的缓存功能,当跳转到学生记录页面时保存当前筛选状态到sessionStorage,并在返回时恢复状态。确保不同任务间的状态不会互相污染,并在恢复后清除缓存
......@@ -401,8 +401,32 @@ const getCheckedDates = async (month) => {
}
onMounted(() => {
// 尝试恢复筛选状态
try {
const cacheStr = sessionStorage.getItem('TASK_HOME_FILTER_CACHE')
if (cacheStr) {
const cache = JSON.parse(cacheStr)
// 只有当任务ID一致时才恢复,避免不同任务间状态污染
if (cache.taskId === task_id) {
selectedSubtaskId.value = cache.subtaskId || ''
selected_date.value = cache.date || format_date(new Date())
selected_mode.value = cache.mode || 'today'
specific_label.value = cache.label || '特定日期'
if (cache.calendarDate) {
calendar_default_date.value = new Date(cache.calendarDate)
}
// 恢复 currentMonth,确保日历和打卡点显示正确月份
currentMonth.value = dayjs(selected_date.value).format('YYYY-MM')
}
// 恢复后清除缓存,避免刷新页面或其他情况下的意外恢复(根据需求也可以保留,但"返回"通常是一次性的)
sessionStorage.removeItem('TASK_HOME_FILTER_CACHE')
}
} catch (e) {
console.error('Restore filter state failed:', e)
}
fetchData()
getCheckedDates(dayjs().format('YYYY-MM'));
getCheckedDates(dayjs(selected_date.value).format('YYYY-MM'));
})
/**
......@@ -467,6 +491,17 @@ const go_student_record = (stu) => {
return
}
// 保存当前页面的筛选状态,以便返回时恢复
const cacheState = {
taskId: task_id,
subtaskId: selectedSubtaskId.value,
date: selected_date.value,
mode: selected_mode.value,
label: specific_label.value,
calendarDate: calendar_default_date.value
}
sessionStorage.setItem('TASK_HOME_FILTER_CACHE', JSON.stringify(cacheState))
// 跳转到作业记录页面
$router.push({
name: 'StudentRecord',
......