框架升级

src/assets/style/theme/theme.scss

@@ -191,20 +191,23 @@
           }
           &:hover {
             color: $theme-aside-item-color-hover;
+            fill: $theme-aside-item-color-hover;
             background: $theme-aside-item-background-color-hover;
             i {
               color: $theme-aside-item-color-hover;
             }
           }
           &:focus {
             color: $theme-aside-item-color-focus;
+            fill: $theme-aside-item-color-focus;
             background: $theme-aside-item-background-color-focus;
             i {
               color: $theme-aside-item-color-focus;
             }
           }
           &.is-active {
             color: $theme-aside-item-color-active;
+            fill: $theme-aside-item-color-active;
             background: $theme-aside-item-background-color-active;
             i {
               color: $theme-aside-item-color-active;

src/layout/header-aside/components/header-size/index.vue

@@ -33,17 +33,17 @@ export default {
     // 注意 这里是关键
     // 因为需要访问 this.$ELEMENT 所以只能在这里使用这种方式
     value: {
-      handler(val) {
-        if (this.$ELEMENT.size !== val) {
-          // 设置 element 全局尺寸
+      handler(val, oldVal) {
+        if (oldVal) {
+          // 这个情况在已经加载完页面 用户改变了尺寸时触发
           this.$ELEMENT.size = val
-          // 清空缓存设置
+          // 由于已经加载过设置 需要清空缓存设置
           this.pageKeepAliveClean()
-          // 刷新此页面
-          const { path, query } = this.$route
-          this.$router.replace({
-            path: '/redirect/' + JSON.stringify({ path, query })
-          })
+          // 由于已经加载过设置 需要刷新此页面
+          this.$router.replace('/refresh')
+        } else {
+          // 这个情况在刷新页面时触发
+          this.$ELEMENT.size = val
         }
       },
       immediate: true

src/layout/header-aside/components/menu-side/index.vue

@@ -64,7 +64,7 @@ export default {
 
         this.active = val[val.length - 1].path
         this.$nextTick(() => {
-          if (this.aside.length > 0) {
+          if (this.aside.length > 0 && this.$refs.menu) {
             this.$refs.menu.activeIndex = this.active
           }
         })

src/plugin/careyshop/index.js

@@ -5,9 +5,6 @@ import 'element-ui/lib/theme-chalk/index.css'
 // flex 布局库
 import 'flex.css'
 
-// store
-import store from '@/store'
-
 // 组件
 import '@/components'
 
@@ -23,28 +20,19 @@ import pluginHas from '@/plugin/has'
 
 export default {
   async install(Vue, options) {
-    // 获得用户设置的全局尺寸
-    const size = await store.dispatch('careyshop/db/get', {
-      dbName: 'sys',
-      path: 'size.value',
-      defaultValue: '',
-      user: true
-    })
-
-    // Element
-    Vue.use(ElementUI, { size })
-
     // 插件
+    Vue.use(ElementUI)
     Vue.use(pluginAxios)
     Vue.use(pluginError)
     Vue.use(pluginLog)
     Vue.use(pluginOpen)
     Vue.use(pluginHas)
+
     // 设置为 false 以阻止 vue 在启动时生成生产提示。
     Vue.config.productionTip = false
     // 当前环境
     Vue.prototype.$env = process.env.NODE_ENV
-    // 简化代码中 process.env.BASE_URL 取值
+    // 当前的 baseUrl
     Vue.prototype.$baseUrl = process.env.BASE_URL
   }
 }

src/router/routes.js

@@ -11,7 +11,37 @@ const frameIn = [
     redirect: { name: 'index' },
     component: layoutHeaderAside,
     children: [
-      { path: 'index', name: 'index', meta, component: () => import('@/views/index') }
+      // 首页 必须 name:index
+      {
+        path: 'index',
+        name: 'index',
+        meta,
+        component: () => import('@/views/index')
+      },
+      // 刷新页面 必须保留
+      {
+        path: 'refresh',
+        name: 'refresh',
+        hidden: true,
+        component: {
+          beforeRouteEnter(to, from, next) {
+            next(vm => vm.$router.replace(from.fullPath))
+          },
+          render: h => h()
+        }
+      },
+      // 页面重定向 必须保留
+      {
+        path: 'redirect/:route*',
+        name: 'redirect',
+        hidden: true,
+        component: {
+          beforeRouteEnter(to, from, next) {
+            next(vm => vm.$router.replace(JSON.parse(from.params.route)))
+          },
+          render: h => h()
+        }
+      }
     ]
   },
   {
@@ -22,31 +52,31 @@ const frameIn = [
       {
         path: 'admin/member',
         name: `${pre}admin-member`,
-        meta: { ...meta, title: '管理员列表' },
+        meta: { ...meta, cache: true, title: '管理员列表' },
         component: () => import('@/views/system/admin/member')
       },
       {
         path: 'auth/group',
         name: `${pre}auth-group`,
-        meta: { ...meta, title: '用户组' },
+        meta: { ...meta, cache: true, title: '用户组' },
         component: () => import('@/views/system/auth/group')
       },
       {
         path: 'auth/rule',
         name: `${pre}auth-rule`,
-        meta: { ...meta, title: '权限规则' },
+        meta: { ...meta, cache: true, title: '权限规则' },
         component: () => import('@/views/system/auth/rule')
       },
       {
         path: 'auth/menu',
         name: `${pre}auth-menu`,
-        meta: { ...meta, title: '菜单管理' },
+        meta: { ...meta, cache: true, title: '菜单管理' },
         component: () => import('@/views/system/auth/menu')
       },
       {
         path: 'action/log',
         name: `${pre}action-log`,
-        meta: { ...meta, title: '日志记录' },
+        meta: { ...meta, cache: true, title: '日志记录' },
         component: () => import('@/views/system/action/log')
       }
     ])('system-')
@@ -57,19 +87,6 @@ const frameIn = [
  * 在主框架之外显示
  */
 const frameOut = [
-  // 页面重定向使用 必须保留
-  {
-    path: '/redirect/:path*',
-    component: {
-      beforeCreate() {
-        const path = this.$route.params.path
-        this.$router.replace(JSON.parse(path))
-      },
-      render: function(h) {
-        return h()
-      }
-    }
-  },
   // 登录
   {
     path: '/login',

src/store/modules/careyshop/modules/page.js

@@ -1,6 +1,9 @@
 import { remove, get } from 'lodash'
 import setting from '@/setting'
 
+// 判定是否需要缓存
+const isKeepAlive = data => get(data, 'meta.cache', false)
+
 export default {
   namespaced: true,
   state: {
@@ -93,7 +96,9 @@ export default {
         page.query = query || page.query
         state.opened.splice(index, 1, page)
         // 增加缓存设置
-        commit('keepAlivePush', page.name)
+        if (isKeepAlive(page)) {
+          commit('keepAlivePush', page.name)
+        }
         // 持久化
         await dispatch('opencsdb')
         // end
@@ -119,7 +124,7 @@ export default {
         // 添加进当前显示的页面数组
         state.opened.push(newTag)
         // 如果这个页面需要缓存 将其添加到缓存设置
-        if (get(newTag, 'meta.cache', false)) {
+        if (isKeepAlive(newTag)) {
           commit('keepAlivePush', tag.name)
         }
         // 持久化
@@ -159,6 +164,7 @@ export default {
         } else {
           // 页面以前没有打开过
           let page = state.pool.find(t => t.name === name)
+          // 如果这里没有找到 page 代表这个路由虽然在框架内 但是不参与标签页显示
           if (page) {
             await dispatch('add', {
               tag: page,
@@ -367,14 +373,7 @@ export default {
      * @param {Object} state vuex state
      */
     keepAliveRefresh(state) {
-      state.keepAlive = state.opened.filter(item => {
-        if (item.meta) {
-          if (item.meta.notCache) {
-            return false
-          }
-        }
-        return true
-      }).map(e => e.name)
+      state.keepAlive = state.opened.filter(item => isKeepAlive(item)).map(e => e.name)
     },
     /**
      * @description 删除一个页面的缓存设置