feat(教师任务主页): 添加筛选状态缓存功能以支持返回时恢复
在任务主页添加筛选状态的缓存功能,当跳转到学生记录页面时保存当前筛选状态到sessionStorage,并在返回时恢复状态。确保不同任务间的状态不会互相污染,并在恢复后清除缓存
Showing
1 changed file
with
36 additions
and
1 deletions
| ... | @@ -401,8 +401,32 @@ const getCheckedDates = async (month) => { | ... | @@ -401,8 +401,32 @@ const getCheckedDates = async (month) => { |
| 401 | } | 401 | } |
| 402 | 402 | ||
| 403 | onMounted(() => { | 403 | onMounted(() => { |
| 404 | + // 尝试恢复筛选状态 | ||
| 405 | + try { | ||
| 406 | + const cacheStr = sessionStorage.getItem('TASK_HOME_FILTER_CACHE') | ||
| 407 | + if (cacheStr) { | ||
| 408 | + const cache = JSON.parse(cacheStr) | ||
| 409 | + // 只有当任务ID一致时才恢复,避免不同任务间状态污染 | ||
| 410 | + if (cache.taskId === task_id) { | ||
| 411 | + selectedSubtaskId.value = cache.subtaskId || '' | ||
| 412 | + selected_date.value = cache.date || format_date(new Date()) | ||
| 413 | + selected_mode.value = cache.mode || 'today' | ||
| 414 | + specific_label.value = cache.label || '特定日期' | ||
| 415 | + if (cache.calendarDate) { | ||
| 416 | + calendar_default_date.value = new Date(cache.calendarDate) | ||
| 417 | + } | ||
| 418 | + // 恢复 currentMonth,确保日历和打卡点显示正确月份 | ||
| 419 | + currentMonth.value = dayjs(selected_date.value).format('YYYY-MM') | ||
| 420 | + } | ||
| 421 | + // 恢复后清除缓存,避免刷新页面或其他情况下的意外恢复(根据需求也可以保留,但"返回"通常是一次性的) | ||
| 422 | + sessionStorage.removeItem('TASK_HOME_FILTER_CACHE') | ||
| 423 | + } | ||
| 424 | + } catch (e) { | ||
| 425 | + console.error('Restore filter state failed:', e) | ||
| 426 | + } | ||
| 427 | + | ||
| 404 | fetchData() | 428 | fetchData() |
| 405 | - getCheckedDates(dayjs().format('YYYY-MM')); | 429 | + getCheckedDates(dayjs(selected_date.value).format('YYYY-MM')); |
| 406 | }) | 430 | }) |
| 407 | 431 | ||
| 408 | /** | 432 | /** |
| ... | @@ -467,6 +491,17 @@ const go_student_record = (stu) => { | ... | @@ -467,6 +491,17 @@ const go_student_record = (stu) => { |
| 467 | return | 491 | return |
| 468 | } | 492 | } |
| 469 | 493 | ||
| 494 | + // 保存当前页面的筛选状态,以便返回时恢复 | ||
| 495 | + const cacheState = { | ||
| 496 | + taskId: task_id, | ||
| 497 | + subtaskId: selectedSubtaskId.value, | ||
| 498 | + date: selected_date.value, | ||
| 499 | + mode: selected_mode.value, | ||
| 500 | + label: specific_label.value, | ||
| 501 | + calendarDate: calendar_default_date.value | ||
| 502 | + } | ||
| 503 | + sessionStorage.setItem('TASK_HOME_FILTER_CACHE', JSON.stringify(cacheState)) | ||
| 504 | + | ||
| 470 | // 跳转到作业记录页面 | 505 | // 跳转到作业记录页面 |
| 471 | $router.push({ | 506 | $router.push({ |
| 472 | name: 'StudentRecord', | 507 | name: 'StudentRecord', | ... | ... |
-
Please register or login to post a comment