refactor[store]: refactor tagsView store (#1032)

src/components/SizeSelect/index.vue

@@ -30,17 +30,7 @@ export default {
     },
     refreshView() {
       // In order to make the cached page re-rendered
-      const visitedViews = [...this.$store.getters.visitedViews].map(i => {
-        i.meta.noCache = true
-        return i
-      })
-
-      this.$store.dispatch('delAllViews', this.$route).then(() => {
-        console.log(visitedViews)
-        for (const i of visitedViews) {
-          this.$store.dispatch('addVisitedViews', i)
-        }
-      })
+      this.$store.dispatch('delAllCachedViews', this.$route)
 
       const { path } = this.$route
 

src/store/modules/tagsView.js

@@ -4,24 +4,31 @@ const tagsView = {
     cachedViews: []
   },
   mutations: {
-    ADD_VISITED_VIEWS: (state, view) => {
+    ADD_VISITED_VIEW: (state, view) => {
       if (state.visitedViews.some(v => v.path === view.path)) return
       state.visitedViews.push(
         Object.assign({}, view, {
           title: view.meta.title || 'no-name'
         })
       )
+    },
+    ADD_CACHED_VIEW: (state, view) => {
+      if (state.cachedViews.includes(view.name)) return
       if (!view.meta.noCache) {
         state.cachedViews.push(view.name)
       }
     },
-    DEL_VISITED_VIEWS: (state, view) => {
+
+    DEL_VISITED_VIEW: (state, view) => {
       for (const [i, v] of state.visitedViews.entries()) {
         if (v.path === view.path) {
           state.visitedViews.splice(i, 1)
+          console.log('1')
           break
         }
       }
+    },
+    DEL_CACHED_VIEW: (state, view) => {
       for (const i of state.cachedViews) {
         if (i === view.name) {
           const index = state.cachedViews.indexOf(i)
@@ -30,13 +37,16 @@ const tagsView = {
         }
       }
     },
-    DEL_OTHERS_VIEWS: (state, view) => {
+
+    DEL_OTHERS_VISITED_VIEWS: (state, view) => {
       for (const [i, v] of state.visitedViews.entries()) {
         if (v.path === view.path) {
           state.visitedViews = state.visitedViews.slice(i, i + 1)
           break
         }
       }
+    },
+    DEL_OTHERS_CACHED_VIEWS: (state, view) => {
       for (const i of state.cachedViews) {
         if (i === view.name) {
           const index = state.cachedViews.indexOf(i)
@@ -45,32 +55,94 @@ const tagsView = {
         }
       }
     },
-    DEL_ALL_VIEWS: state => {
+
+    DEL_ALL_VISITED_VIEWS: state => {
       state.visitedViews = []
+    },
+    DEL_ALL_CACHED_VIEWS: state => {
       state.cachedViews = []
     }
+
   },
   actions: {
-    addVisitedViews({ commit }, view) {
-      commit('ADD_VISITED_VIEWS', view)
+    addView({ dispatch }, view) {
+      dispatch('addVisitedView', view)
+      dispatch('addCachedView', view)
+    },
+    addVisitedView({ commit }, view) {
+      commit('ADD_VISITED_VIEW', view)
     },
-    delVisitedViews({ commit, state }, view) {
+    addCachedView({ commit }, view) {
+      commit('ADD_CACHED_VIEW', view)
+    },
+
+    delView({ dispatch, state }, view) {
+      return new Promise(resolve => {
+        dispatch('delVisitedView', view)
+        dispatch('delCachedView', view)
+        resolve({
+          visitedViews: [...state.visitedViews],
+          cachedViews: [...state.cachedViews]
+        })
+      })
+    },
+    delVisitedView({ commit, state }, view) {
       return new Promise(resolve => {
-        commit('DEL_VISITED_VIEWS', view)
+        commit('DEL_VISITED_VIEW', view)
         resolve([...state.visitedViews])
       })
     },
-    delOthersViews({ commit, state }, view) {
+    delCachedView({ commit, state }, view) {
+      return new Promise(resolve => {
+        commit('DEL_CACHED_VIEW', view)
+        resolve([...state.cachedViews])
+      })
+    },
+
+    delOthersViews({ dispatch, state }, view) {
       return new Promise(resolve => {
-        commit('DEL_OTHERS_VIEWS', view)
+        dispatch('delOthersVisitedViews', view)
+        dispatch('delOthersCachedViews', view)
+        resolve({
+          visitedViews: [...state.visitedViews],
+          cachedViews: [...state.cachedViews]
+        })
+      })
+    },
+    delOthersVisitedViews({ commit, state }, view) {
+      return new Promise(resolve => {
+        commit('DEL_OTHERS_VISITED_VIEWS', view)
         resolve([...state.visitedViews])
       })
     },
-    delAllViews({ commit, state }) {
+    delOthersCachedViews({ commit, state }, view) {
       return new Promise(resolve => {
-        commit('DEL_ALL_VIEWS')
+        commit('DEL_OTHERS_CACHED_VIEWS', view)
+        resolve([...state.cachedViews])
+      })
+    },
+
+    delAllViews({ dispatch, state }, view) {
+      return new Promise(resolve => {
+        dispatch('delAllVisitedViews', view)
+        dispatch('delAllCachedViews', view)
+        resolve({
+          visitedViews: [...state.visitedViews],
+          cachedViews: [...state.cachedViews]
+        })
+      })
+    },
+    delAllVisitedViews({ commit, state }) {
+      return new Promise(resolve => {
+        commit('DEL_ALL_VISITED_VIEWS')
         resolve([...state.visitedViews])
       })
+    },
+    delAllCachedViews({ commit, state }) {
+      return new Promise(resolve => {
+        commit('DEL_ALL_CACHED_VIEWS')
+        resolve([...state.cachedViews])
+      })
     }
   }
 }

src/views/layout/components/TagsView.vue

@@ -72,7 +72,7 @@ export default {
       if (!route) {
         return false
       }
-      this.$store.dispatch('addVisitedViews', route)
+      this.$store.dispatch('addView', route)
     },
     moveToCurrentTag() {
       const tags = this.$refs.tag
@@ -86,9 +86,9 @@ export default {
       })
     },
     closeSelectedTag(view) {
-      this.$store.dispatch('delVisitedViews', view).then((views) => {
+      this.$store.dispatch('delView', view).then(({ visitedViews }) => {
         if (this.isActive(view)) {
-          const latestView = views.slice(-1)[0]
+          const latestView = visitedViews.slice(-1)[0]
           if (latestView) {
             this.$router.push(latestView)
           } else {