添加缓存

dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-5357ef54'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.dqt63cksaq"
+    "revision": "0.u3tq2ifuq08"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

src/components/pagination/index.tsx

@@ -1,5 +1,5 @@
 import { Searchs } from '@/utils/searchs';
-import { NDataTable, NPagination } from 'naive-ui';
+import { NPagination } from 'naive-ui';
 import {
   PropType,
   computed,
@@ -11,7 +11,6 @@ import {
   watch
 } from 'vue';
 import { useRoute } from 'vue-router';
-import styles from './index.module.less';
 
 export default defineComponent({
   name: 'table-container',
@@ -46,7 +45,7 @@ export default defineComponent({
     }
   },
   emits: ['update:page', 'update:pageSize', 'list'],
-  setup(props, { slots, attrs, emit }) {
+  setup(props, { emit }) {
     const route = useRoute();
     const state = reactive({
       pageInformation: null as any

src/hooks/use-async.ts

@@ -1,5 +1,5 @@
 import { isReactive, isRef, onMounted } from 'vue';
-import { RouterView, useRoute, useRouter } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
 import { Searchs } from '@/utils/searchs';
 
 function setLoading(loading: any, val: any) {
@@ -35,3 +35,51 @@ export const setTabsCaches = (current: any, key = 'current', routes: any) => {
   const active = searchs.get(routes.path);
   console.log(active, 'setTabsCaches');
 };
+
+/**
+ * 初始化缓存
+ * @param {object} { key 默认form 关键字, saveKey 地址, current 对象, callBack 回调 }
+ */
+export const initCache = (params: any) => {
+  const route = useRoute();
+  if (!params.current) {
+    return;
+  }
+  if (!params.key) {
+    params.key = 'form';
+  }
+  if (!params.saveKey) {
+    params.saveKey = route.path;
+  }
+  const searchs = new Searchs(params.saveKey);
+  const active: any = searchs.get(params.saveKey);
+  const model: any = params.current;
+  const tempActive: any = active[params.key];
+  for (const key in tempActive) {
+    if (Object.prototype.hasOwnProperty.call(model, key)) {
+      const item = tempActive[key];
+      model[key] = item;
+    }
+  }
+  searchs.update({ ...model }, undefined, params.key);
+
+  onMounted(() => {
+    params.callBack && params.callBack(model);
+  });
+};
+
+/**
+ * 设置缓存
+ * @param {object} { key 默认form 关键字, saveKey 默认当前路由地址, current 对象, callBack 回调 }
+ */
+export const setCache = (params: any) => {
+  if (!params.current || !params.saveKey) {
+    return;
+  }
+  if (!params.key) {
+    params.key = 'form';
+  }
+
+  const searchs = new Searchs(params.saveKey);
+  searchs.update({ ...params.current }, undefined, params.key);
+};

src/views/classList/classDetail.tsx

@@ -20,15 +20,15 @@ export default defineComponent({
       { name: '班级管理', path: '/classList' },
       { name: route.query.name, path: '/classDetail' }
     ] as any);
-    // getTabsCache((val: any) => {
-    //   if (val.form.tabName) {
-    //     activeTab.value = val.form.tabName;
-    //   }
-    // });
-    // const setTabs = (val: any) => {
-    //   setTabsCaches(val, 'tabName', route);
-    // };
-    //   onUpdate:value={(val: any) => setTabs(val)}
+
+    getTabsCache((val: any) => {
+      if (val.form.tabName) {
+        activeTab.value = val.form.tabName;
+      }
+    });
+    const setTabs = (val: any) => {
+      setTabsCaches(val, 'tabName', route);
+    };
     const upgradeFlag = ref();
     const getClassGroupDetail = async () => {
       try {
@@ -47,6 +47,7 @@ export default defineComponent({
           <NTabs
             class={styles.customTabs}
             v-model:value={activeTab.value}
+            onUpdate:value={(val: any) => setTabs(val)}
             size="large"
             animated={false}
             pane-wrapper-style="margin: 0 -4px"

src/views/classList/components/afterWork.tsx

@@ -10,7 +10,6 @@ import {
   NSelect,
   NSpace
 } from 'naive-ui';
-import SearchInput from '@/components/searchInput';
 import CSelect from '@/components/CSelect';
 import Pagination from '@/components/pagination';
 import { classGroupDetail, getTrainingList } from '../api';
@@ -23,9 +22,9 @@ import {
   getNowDateAndSunday,
   getTimes
 } from '@/utils/dateFormat';
-import dayjs from 'dayjs';
 import TrainSettings from '../../attend-class/model/train-settings';
 import TheEmpty from '/src/components/TheEmpty';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'afterWork',
   props: {
@@ -33,17 +32,17 @@ export default defineComponent({
       type: Number
     }
   },
-  setup(props, { emit }) {
+  setup(props) {
     const router = useRouter();
     const route = useRoute();
-    const timer = ref<[number, number]>([
-      getNowDateAndMonday(new Date().getTime()),
-      getNowDateAndSunday(new Date().getTime())
-    ]);
     const state = reactive({
       upgradeFlag: props.upgradeFlag == 0 ? true : false, // 是否为历史班
       searchForm: {
-        status: null as any
+        status: null as any,
+        timer: [
+          getNowDateAndMonday(new Date().getTime()),
+          getNowDateAndSunday(new Date().getTime())
+        ] as any
       },
       loading: false,
       pagination: {
@@ -67,28 +66,38 @@ export default defineComponent({
     const search = () => {
       state.pagination.page = 1;
       getList();
+      setCache({ current: state.searchForm, saveKey: 'classDetailAfterWork' });
     };
 
     const onReset = () => {
-      timer.value = [
-        getNowDateAndMonday(new Date().getTime()),
-        getNowDateAndSunday(new Date().getTime())
-      ];
       state.searchForm = {
-        status: null as any
+        status: null as any,
+        timer: [
+          getNowDateAndMonday(new Date().getTime()),
+          getNowDateAndSunday(new Date().getTime())
+        ]
       };
       search();
+      setCache({ current: state.searchForm, saveKey: 'classDetailAfterWork' });
     };
+    initCache({
+      current: state.searchForm,
+      saveKey: 'classDetailAfterWork',
+      callBack: (active: any) => {
+        state.searchForm = active;
+      }
+    });
 
     const getList = async () => {
       state.loading = true;
 
       try {
+        const { timer, ...more } = state.searchForm;
         const res = await getTrainingList({
           classGroupId: route.query.id,
-          ...state.searchForm,
+          ...more,
           ...state.pagination,
-          ...getTimes(timer.value, ['startTime', 'endTime'], 'YYYY-MM-DD')
+          ...getTimes(timer, ['startTime', 'endTime'], 'YYYY-MM-DD')
         });
 
         state.tableList = res.data.rows;
@@ -219,10 +228,10 @@ export default defineComponent({
           <NForm label-placement="left" inline>
             <NFormItem>
               <CDatePicker
-                v-model:value={timer.value}
+                v-model:value={state.searchForm.timer}
                 separator={'至'}
                 type="daterange"
-                timerValue={timer.value}></CDatePicker>
+                timerValue={state.searchForm.timer}></CDatePicker>
             </NFormItem>
 
             <NFormItem>

src/views/classList/components/classRecord.tsx

@@ -12,6 +12,7 @@ import TheEmpty from '/src/components/TheEmpty';
 import CSelect from '/src/components/CSelect';
 import { api_teacherPage } from '../../setting/api';
 import { useUserStore } from '/src/store/modules/users';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'class-record',
   setup() {
@@ -50,6 +51,10 @@ export default defineComponent({
     const search = () => {
       state.pagination.page = 1;
       getList();
+      setCache({
+        current: state.searchForm,
+        saveKey: 'classDetailRecord'
+      });
     };
 
     const onReset = () => {
@@ -58,7 +63,19 @@ export default defineComponent({
         createTimer: formatDefaultTime() as any
       };
       search();
+      setCache({
+        current: state.searchForm,
+        saveKey: 'classDetailRecord'
+      });
     };
+
+    initCache({
+      current: state.searchForm,
+      saveKey: 'classDetailRecord',
+      callBack: (active: any) => {
+        state.searchForm = active;
+      }
+    });
     const getList = async () => {
       state.loading = true;
       try {

src/views/classList/components/classStudent.tsx

@@ -17,6 +17,7 @@ import { getStudentList } from '../api';
 import { useRoute, useRouter } from 'vue-router';
 import TheEmpty from '/src/components/TheEmpty';
 import UpdateStudent from '../../studentList/modals/update-student';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'student-studentList',
   props: {
@@ -52,12 +53,17 @@ export default defineComponent({
     const search = () => {
       state.pagination.page = 1;
       getList();
-      console.log('search', state);
+      setCache({ current: state.searchForm, saveKey: 'classDetailStudent' });
     };
 
     const onReset = () => {
-      state.searchForm = { keyword: '', gender: null as any };
+      state.searchForm = {
+        keyword: '',
+        gender: null as any,
+        membership: null as any
+      };
       search();
+      setCache({ current: state.searchForm, saveKey: 'classDetailStudent' });
     };
     const getList = async () => {
       state.loading = true;
@@ -78,6 +84,13 @@ export default defineComponent({
       }
     };
 
+    initCache({
+      current: state.searchForm,
+      saveKey: 'classDetailStudent',
+      callBack: (active: any) => {
+        state.searchForm = active;
+      }
+    });
     onMounted(() => {
       getList();
     });

src/views/classList/components/classStudentRecode.tsx

@@ -92,12 +92,12 @@ export default defineComponent({
             pane-style="padding-left: 4px; padding-right: 4px; box-sizing: border-box;">
             <NTabPane name="textRcode" tab="练习记录">
               <PracticeData
-              classGroupId={route.query.id as string}
+                classGroupId={route.query.id as string}
                 studentId={route.query.studentId as string}></PracticeData>
             </NTabPane>
             <NTabPane name="evaluatingRcode" tab="评测记录">
               <EvaluationRecords
-               classGroupId={route.query.id as string}
+                classGroupId={route.query.id as string}
                 studentId={route.query.studentId as string}></EvaluationRecords>
             </NTabPane>
           </NTabs>

src/views/classList/components/testRecode.tsx

@@ -28,6 +28,7 @@ import { getTestList, getTrainingStat } from '../api';
 import CDatePicker from '/src/components/CDatePicker';
 import { useRoute, useRouter } from 'vue-router';
 import TheEmpty from '/src/components/TheEmpty';
+import { initCache, setCache } from '/src/hooks/use-async';
 
 export default defineComponent({
   name: 'student-studentList',
@@ -61,6 +62,10 @@ export default defineComponent({
       state.pagination.page = 1;
       getInfo();
       getList();
+      setCache({
+        current: { ...state.searchForm, timer: timer.value },
+        saveKey: 'classDetailTestRecord'
+      });
     };
     const timer = ref<[number, number]>([
       getNowDateAndMonday(new Date().getTime()),
@@ -77,7 +82,20 @@ export default defineComponent({
         vipFlag: null
       };
       search();
+      setCache({
+        current: { ...state.searchForm, timer: timer.value },
+        saveKey: 'classDetailTestRecord'
+      });
     };
+
+    initCache({
+      current: { ...state.searchForm, timer: timer.value },
+      saveKey: 'classDetailTestRecord',
+      callBack: (active: any) => {
+        state.searchForm = active;
+        timer.value = active.timer;
+      }
+    });
     const getList = async () => {
       state.loading = true;
       try {

src/views/classList/index.tsx

@@ -19,16 +19,17 @@ import RestStudentBox from './modals/restStudentBox';
 import { getgradeNumList, classArray } from './contants';
 import add from '@/views/studentList/images/add.png';
 import ClassGuide from '@/custom-plugins/guide-page/class-guide';
-import { useRouter } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
 import TheEmpty from '/src/components/TheEmpty';
 import TheTooltip from '/src/components/TheTooltip';
 import PreviewWindow from '../preview-window';
 import ResetSubject from './modals/resetSubject';
 import UpdateSubject from './modals/updateSubject';
 import { getGradeLevelList, getGradeYearList } from '../home/api';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'class-classList',
-  setup(props, { emit }) {
+  setup() {
     const state = reactive({
       searchForm: {
         keyword: null as any,
@@ -68,10 +69,11 @@ export default defineComponent({
     const formRef = ref();
     const message = useMessage();
     const router = useRouter();
+    const route = useRoute();
     const search = () => {
       state.pagination.page = 1;
       getList();
-      console.log('search', state);
+      setCache({ current: state.searchForm, saveKey: route.path });
     };
     const showGuide = ref(false);
     state.gradeNumList = getgradeNumList();
@@ -88,6 +90,7 @@ export default defineComponent({
         state.searchForm.gradeYear = state.popSelectYearList[1].id;
       }
       getList();
+      setCache({ current: state.searchForm, saveKey: route.path });
     };
 
     const removeClass = async () => {
@@ -355,7 +358,6 @@ export default defineComponent({
     const getYearList = async () => {
       try {
         const { data } = await getGradeYearList();
-        console.log(data, 'data getYearList');
         const temp = data || [];
         temp.forEach((i: any) => {
           i.name = i.name + '学年';
@@ -365,7 +367,7 @@ export default defineComponent({
           name: '全部学年'
         });
         state.popSelectYearList = temp || [];
-        if (temp.length > 0) {
+        if (temp.length > 0 && !state.searchForm.gradeYear) {
           state.searchForm.gradeYear = temp[1].id;
         }
       } catch {
@@ -376,7 +378,6 @@ export default defineComponent({
     const getLevelList = async () => {
       try {
         const { data } = await getGradeLevelList();
-        console.log(data, 'data getLevelList');
         const temp = data || [];
         temp.forEach((i: any) => {
           i.name = i.name + '级';
@@ -386,7 +387,7 @@ export default defineComponent({
           name: '全部学级'
         });
         state.popSelectLevelList = temp || [];
-        if (temp.length > 0) {
+        if (temp.length > 0 && !state.searchForm.gradeLevel) {
           state.searchForm.gradeLevel = temp[0].id;
         }
       } catch {
@@ -394,12 +395,20 @@ export default defineComponent({
       }
     };
 
+    initCache({
+      current: state.searchForm,
+      callBack: (active: any) => {
+        state.searchForm = active;
+      }
+    });
+
     onMounted(async () => {
       state.loading = true;
+      getSubjectList();
       await getYearList();
       await getLevelList();
       await getList();
-      await getSubjectList();
+
       state.loading = false;
     });
     return () => (

src/views/studentList/components/evaluationRecords.tsx

@@ -22,6 +22,7 @@ import { vaildUrl } from '@/utils/urlUtils';
 import CDatePicker from '/src/components/CDatePicker';
 import { useUserStore } from '/src/store/modules/users';
 import TheEmpty from '/src/components/TheEmpty';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'student-practiceData',
   props: {
@@ -153,7 +154,6 @@ export default defineComponent({
         ...getTimes(timer.value, ['startTime', 'endTime'], 'YYYY-MM-DD')
       });
       state.tableList = res.data.rows;
-      console.log(state.tableList, 'state.tableList ');
       state.pagination.pageTotal = res.data.total;
     };
     const gotoRecode = (row: any) => {
@@ -166,6 +166,10 @@ export default defineComponent({
     };
     const search = () => {
       getList();
+      setCache({
+        current: { timer: timer.value },
+        saveKey: 'classStudentRecordEvaluationRecords'
+      });
     };
     const onReset = () => {
       timer.value = [
@@ -173,7 +177,18 @@ export default defineComponent({
         getNowDateAndSunday(new Date().getTime())
       ];
       search();
+      setCache({
+        current: { timer: timer.value },
+        saveKey: 'classStudentRecordEvaluationRecords'
+      });
     };
+    initCache({
+      current: { timer: timer.value },
+      saveKey: 'classStudentRecordEvaluationRecords',
+      callBack: (active: any) => {
+        timer.value = active.timer;
+      }
+    });
     const iframeRef = ref();
     onMounted(() => {
       getList();

src/views/studentList/components/practiceData.tsx

@@ -22,6 +22,7 @@ import {
 } from '/src/utils/dateFormat';
 import CDatePicker from '/src/components/CDatePicker';
 import TheEmpty from '/src/components/TheEmpty';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'student-practiceData',
   props: {
@@ -251,7 +252,10 @@ export default defineComponent({
       state.pagination.page = 1;
       getChartDetail();
       getList();
-      console.log('search');
+      setCache({
+        current: { timer: timer.value },
+        saveKey: 'classStudentRecordPracticeData'
+      });
     };
     const onReset = () => {
       timer.value = [
@@ -260,8 +264,18 @@ export default defineComponent({
       ];
       search();
       getList();
-      console.log('onReset');
+      setCache({
+        current: { timer: timer.value },
+        saveKey: 'classStudentRecordPracticeData'
+      });
     };
+    initCache({
+      current: { timer: timer.value },
+      saveKey: 'classStudentRecordPracticeData',
+      callBack: (active: any) => {
+        timer.value = active.timer;
+      }
+    });
     onMounted(() => {
       console.log(props.studentId);
       getChartDetail();

src/views/studentList/components/studentAfterWork.tsx

@@ -22,6 +22,7 @@ import { trainingStatusArray } from '@/utils/searchArray';
 import StudentTraomomhDetails from '../modals/studentTraomomhDetails';
 import dayjs from 'dayjs';
 import TheEmpty from '/src/components/TheEmpty';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'student-studentList',
   setup() {
@@ -60,7 +61,10 @@ export default defineComponent({
     const search = () => {
       state.pagination.page = 1;
       getList();
-      console.log('search', state);
+      setCache({
+        current: { ...state.searchForm, timer: timer.value },
+        saveKey: 'studentDetailAfterWork'
+      });
     };
 
     const onReset = () => {
@@ -70,7 +74,20 @@ export default defineComponent({
         getNowDateAndSunday(new Date().getTime())
       ];
       search();
+      setCache({
+        current: { ...state.searchForm, timer: timer.value },
+        saveKey: 'studentDetailAfterWork'
+      });
     };
+
+    initCache({
+      current: { ...state.searchForm, timer: timer.value },
+      saveKey: 'studentDetailAfterWork',
+      callBack: (active: any) => {
+        state.searchForm = active;
+        timer.value = active.timer;
+      }
+    });
     const getList = async () => {
       state.loading = true;
       try {

src/views/studentList/index.tsx

@@ -25,6 +25,7 @@ import TheEmpty from '/src/components/TheEmpty';
 // import NoticeModal from './modals/noticeModal';
 import { useUserStore } from '/src/store/modules/users';
 import UpdateStudent from './modals/update-student';
+import { initCache, setCache } from '/src/hooks/use-async';
 export default defineComponent({
   name: 'student-studentList',
   setup(props, { emit }) {
@@ -61,6 +62,7 @@ export default defineComponent({
     const search = () => {
       state.pagination.page = 1;
       getList();
+      setCache({ current: state.searchForm, saveKey: route.path });
     };
     const getClasslist = async () => {
       try {
@@ -94,7 +96,15 @@ export default defineComponent({
         membership: null as any
       };
       search();
+      setCache({ current: state.searchForm, saveKey: route.path });
     };
+
+    initCache({
+      current: state.searchForm,
+      callBack: (active: any) => {
+        state.searchForm = active;
+      }
+    });
     const getList = async () => {
       try {
         const res = await getStudentList({
@@ -113,6 +123,7 @@ export default defineComponent({
       }
       console.log('getList');
     };
+
     onMounted(() => {
       getList();
       getClasslist();

src/views/studentList/studentDetail.tsx

@@ -68,13 +68,18 @@ export default defineComponent({
     onMounted(() => {
       getWorkInfo();
     });
+    getTabsCache((val: any) => {
+      if (val.form.tabName) {
+        activeStudentTab.value = val.form.tabName;
+      }
+    });
     const setTabs = (val: any) => {
       setTabsCaches(val, 'tabName', route);
     };
     return () => (
       <div>
         <CBreadcrumb list={routerList.value}></CBreadcrumb>
-        <div class={[styles.listWrap,styles.infoListWrap]}>
+        <div class={[styles.listWrap, styles.infoListWrap]}>
           <div class={styles.teacherList}>
             <div class={styles.teacherHeader}>
               <div class={styles.teacherHeaderBorder}>
@@ -92,7 +97,7 @@ export default defineComponent({
               <h4 class={styles.studentGender}>
                 {state.studentInfo.nickname}{' '}
                 <NImage
-                previewDisabled
+                  previewDisabled
                   src={
                     state.studentInfo.gender ? maleIcon : femaleIcon
                   }></NImage>