缓存

src/components/category/TemplateManage.vue

@@ -174,7 +174,6 @@ export default {
       classificationList: [], //系统模板>分类
       theTemplateList: [], //系统模板>分类>模板
       checkIndex: 0, // 系统模板>分类>选中效果
-      TemplateType: 0, //个人模板or系统模板>选中效果
       MyCategories: [], // 个人模板>分类
       ClassificationPopups: false, //个人模板>分类>添加弹窗
       checkClassification: 0, //个人模板>分类>选择效果
@@ -197,11 +196,30 @@ export default {
     CopyTemplate,
     rename,
   },
+  computed: {
+    //个人模板or系统模板>选中效果
+    TemplateType() {
+      return this.$store.getters.get_templateType;
+    },
+    TemplateDate() {
+      return this.$store.getters.get_templateData;
+    },
+  },
   created() {
-    this.listOfSystem();
-    if (this.$route.query.type) {
-      this.TemplateType = 1;
+    if (this.TemplateType === 0) {
+      // 系统模板
+      this.listOfSystem();
+      if (!this.TemplateDate.index) return;
+      this.switchClassification(
+        this.TemplateDate.item,
+        this.TemplateDate.index
+      );
+    } else {
       this.getFolderList();
+      this.switchPersonalClassification(
+        this.TemplateDate.item,
+        this.TemplateDate.index
+      );
     }
   },
   methods: {
@@ -329,6 +347,7 @@ export default {
     },
     // 个人模板>分类>切换
     switchPersonalClassification(item, index) {
+      this.$store.commit("setTemplateData", { item, index });
       this.checkClassification = index;
       this.getpersonalList(item.id);
     },
@@ -355,20 +374,23 @@ export default {
       });
       if (res) {
         this.MyCategories = res.data.results;
+        if (this.TemplateDate.index) return;
         this.getpersonalList(this.MyCategories[0].id);
         this.checkClassification = 0;
       }
     },
     //个人模板or系统模板切换
     SwitchTemplate(key) {
-      console.log(key);
       switch (key) {
         case 0:
-          this.TemplateType = 1;
+          this.$store.commit("setTemplateType", 1);
+          this.$store.commit("setTemplateData", {});
           this.getFolderList();
           break;
         case 1:
-          this.TemplateType = 0;
+          this.$store.commit("setTemplateType", 0);
+          this.$store.commit("setTemplateData", {});
+          this.listOfSystem();
           break;
         default:
           break;
@@ -384,6 +406,9 @@ export default {
     },
     // 系统模板下的分类切换
     switchClassification(item, index) {
+      if (index !== this.TemplateDate.index) {
+        this.$store.commit("setTemplateData", { item, index });
+      }
       this.checkIndex = index;
       if (item.detail) {
         this.theTemplateList = item.detail;
@@ -401,6 +426,7 @@ export default {
       });
       if (res) {
         this.classificationList = res.data.results;
+        if (this.TemplateDate.index) return;
         if (res.data.results[0].detail) {
           this.theTemplateList = res.data.results[0].detail;
           this.$store.commit(

src/store/getters.ts

@@ -2,6 +2,8 @@ import { StateTypes } from "./types";
 import { GetterTree } from "vuex";
 
 const getters: GetterTree<StateTypes, any> = {
+    get_templateType: state => state.templateType,
+    get_templateData: state => state.templateData,
 };
 
 export default getters;

src/store/mutations.ts

@@ -50,7 +50,14 @@ const mutations: MutationTree<StateTypes> = {
   },
   setChainStatus(state, str) {
     state.chainStatus = str
-  }
+  },
+  setTemplateType(state, num) {
+    state.templateType = num
+  },
+  setTemplateData(state, data) {
+    state.templateData = data
+  },
+  // templateData
 };
 
 export default mutations;

src/store/state.ts

@@ -14,7 +14,9 @@ const state: StateTypes = {
   userInfos: {},
   templateNum: 0, //模板数量
   theAnchor: -1,
-  chainStatus: ''
+  chainStatus: '',
+  templateType: 0,
+  templateData: {}
 };
 
 export default state;

src/store/types.ts

@@ -13,6 +13,8 @@ export interface StateTypes {
   userInfos: object, // 用户信息
   templateNum: number, // 模板数量
   theAnchor: number, //用于记录增量列表的展开
-  chainStatus: string
+  chainStatus: string,
+  templateType: number,
+  templateData:any
 }