@luzhaoqi/test 0.0.20 → 0.0.22

package/dist/lib-cjs.js

@@ -17603,7 +17603,7 @@ var variables = {"menuColor":"#bfcbd9","menuLightColor":"rgba(0, 0, 0, 0.7)","me
 
 // import Item from './Item.vue'
 
-var script$x = {
+var script$z = {
   name: 'k-icon',
   data() {
     return {
@@ -17712,10 +17712,10 @@ var normalizeComponent_1 = normalizeComponent;
 var __vue_normalize__ = /*@__PURE__*/getDefaultExportFromCjs(normalizeComponent_1);
 
 /* script */
-const __vue_script__$x = script$x;
+const __vue_script__$z = script$z;
 
 /* template */
-var __vue_render__$y = function () {
+var __vue_render__$B = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -17725,17 +17725,17 @@ var __vue_render__$y = function () {
     _c("img", { attrs: { src: _vm.img, alt: "" } }),
   ])
 };
-var __vue_staticRenderFns__$y = [];
-__vue_render__$y._withStripped = true;
+var __vue_staticRenderFns__$B = [];
+__vue_render__$B._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$y = undefined;
+  const __vue_inject_styles__$B = undefined;
   /* scoped */
-  const __vue_scope_id__$y = undefined;
+  const __vue_scope_id__$B = undefined;
   /* module identifier */
-  const __vue_module_identifier__$y = undefined;
+  const __vue_module_identifier__$B = undefined;
   /* functional template */
-  const __vue_is_functional_template__$y = false;
+  const __vue_is_functional_template__$B = false;
   /* style inject */
   
   /* style inject SSR */
@@ -17744,22 +17744,22 @@ __vue_render__$y._withStripped = true;
   
 
   
-  const __vue_component__$y = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$y, staticRenderFns: __vue_staticRenderFns__$y },
-    __vue_inject_styles__$y,
-    __vue_script__$x,
-    __vue_scope_id__$y,
-    __vue_is_functional_template__$y,
-    __vue_module_identifier__$y,
+  const __vue_component__$B = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$B, staticRenderFns: __vue_staticRenderFns__$B },
+    __vue_inject_styles__$B,
+    __vue_script__$z,
+    __vue_scope_id__$B,
+    __vue_is_functional_template__$B,
+    __vue_module_identifier__$B,
     false,
     undefined,
     undefined,
     undefined
   );
 
-__vue_component__$y.install = function (Vue, option) {
+__vue_component__$B.install = function (Vue, option) {
   setGolbalData(Vue, option);
-  Vue.component(__vue_component__$y.name, __vue_component__$y);
+  Vue.component(__vue_component__$B.name, __vue_component__$B);
 };
 
 var axios$3 = {exports: {}};
@@ -94391,178 +94391,6 @@ var nprogress = {exports: {}};
 var nprogressExports = nprogress.exports;
 var NProgress = /*@__PURE__*/getDefaultExportFromCjs(nprogressExports);
 
-NProgress.configure({ showSpinner: false });
-
-//todo 需要优化
-function chuli(arr) {
-  const hasChildren = (arr) => {
-    arr.forEach((item) => {
-      if (item.children) {
-        hasChildren(item.children);
-      }
-      if (item.component === 'Layout') {
-        console.log('Layout');
-        // item.component = Layout
-      }
-    });
-  };
-  hasChildren(arr);
-}
-
-function createRouter(Vue) {
-  // 判断是否已经use过VueRouter
-  const VueRouterObj = Vue._installedPlugins.filter((item) => {
-    return item.name === 'VueRouter'
-  });
-  if (!(VueRouterObj && VueRouterObj[0])) {
-    Vue.use(VueRouter);
-    const $z = Vue.prototype.$z;
-    const routerOption = $z.router;
-    if (routerOption) {
-      const defaultConfig = {
-        mode: routerOption.mode || 'history', // 去掉url中的#
-        scrollBehavior: () => ({ y: 0 }),
-        routes: routerOption.routes || []
-      };
-      chuli(defaultConfig.routes);
-      const router = new VueRouter(defaultConfig);
-      router.beforeEach((to, from, next) => {
-        if (routerOption.beforeEach) {
-          routerOption.beforeEach(to, from, next);
-        } else {
-          NProgress.start();
-          const httpOption = $z.http || {};
-          const token = getCookie(httpOption.tokenKey || TOKENKEY);
-          const store = $z.store;
-          if (!routerOption.whiteList) {
-            routerOption.whiteList = ['/login', '/register'];
-          }
-          if (token) {
-            if (to.path === '/login') {
-              next({ path: '/' });
-              NProgress.done();
-            } else {
-              // 判断是不是第一次 需要动态加载路由
-              if (!router.options.isAddDynamicMenuRoutes && store) {
-                router.options.isAddDynamicMenuRoutes = true;
-                isRelogin.show = true;
-                store.dispatch('user/GetInfo', $z).then(() => {
-                  isRelogin.show = false;
-                  store.dispatch('permission/GenerateRoutes', $z).then((accessRoutes) => {
-                    // 根据roles权限生成可访问的路由表
-                    router.addRoutes(accessRoutes); // 动态添加可访问路由表
-                    next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
-                  });
-                });
-                next();
-              } else {
-                next();
-              }
-            }
-          } else {
-            // 没有token
-            if (routerOption.whiteList.indexOf(to.path) !== -1) {
-              // 在免登录白名单，直接进入
-              next();
-            } else {
-              next(`/login?redirect=${to.fullPath}`); // 否则全部重定向到登录页
-              NProgress.done();
-            }
-          }
-        }
-      });
-      router.afterEach(() => {
-        if (routerOption.afterEach) {
-          routerOption.afterEach();
-        } else {
-          NProgress.done();
-        }
-      });
-
-      Vue.prototype.$z.$router = router;
-    }
-  }
-}
-
-const state$5 = {
-  token: '',
-  userinfo: {},
-  roles: [],
-  permissions: []
-};
-const mutations$5 = {
-  SET_TOKEN: (state, token) => {
-    state.token = token;
-  },
-  SET_ROLES: (state, roles) => {
-    state.roles = roles;
-  },
-  SET_USERINFO: (state, userinfo) => {
-    state.userinfo = userinfo;
-  },
-  SET_PERMISSIONS: (state, permissions) => {
-    state.permissions = permissions;
-  }
-};
-const actions$5 = {
-  // 登录 todo
-  Login({ commit }, userInfo) {},
-
-  // 获取用户信息
-  GetInfo({ commit }, $z) {
-    return new Promise((resolve, reject) => {
-      const $http = $z.$http;
-      const routerOption = $z.router || {};
-      let api = function () {
-        if ($http) {
-          return $http.request({
-            url: routerOption.getUserInfo || '/getInfo',
-            method: 'get'
-          })
-        } else {
-          Promise.resolve({});
-        }
-      };
-      if (typeof routerOption.getUserInfo === 'function') {
-        api = routerOption.getUserInfo;
-      }
-      api()
-        .then((res) => {
-          commit('SET_USERINFO', res.user || {});
-          commit('SET_PERMISSIONS', res.permissions || '*:*:*');
-          if (res.roles && res.roles.length > 0) {
-            commit('SET_ROLES', res.roles);
-          } else {
-            commit('SET_ROLES', ['ROLE_DEFAULT']);
-          }
-          resolve(res);
-        })
-        .catch((error) => {
-          reject(error);
-        });
-    })
-  },
-
-  // 退出系统 todo
-  LogOut({ commit, state }) {},
-
-  // 前端 登出 todo
-  FedLogOut({ commit }) {}
-};
-
-function registerStateModule$5(store) {
-  if (!store || !store.hasModule) return
-  if (!store.hasModule('user')) {
-    const statesModule = {
-      namespaced: true,
-      state: state$5,
-      mutations: mutations$5,
-      actions: actions$5
-    };
-    store.registerModule('user', statesModule);
-  }
-}
-
 /*!
  * vuex v3.6.2
  * (c) 2021 Evan You
@@ -95533,11 +95361,6 @@ function getModuleByNamespace (store, helper, namespace) {
   return module
 }
 
-//
-//
-//
-//
-//
 //
 //
 //
@@ -95545,11 +95368,11 @@ function getModuleByNamespace (store, helper, namespace) {
 //
 //
 
-var script$w = {
+var script$y = {
   props: {
     src: {
       type: String,
-      default: "/"
+      default: '/'
     },
     iframeId: {
       type: String
@@ -95558,17 +95381,17 @@ var script$w = {
   data() {
     return {
       loading: false,
-      height: document.documentElement.clientHeight - 94.5 + "px;"
-    };
+      height: document.documentElement.clientHeight - 94.5 + 'px;'
+    }
   },
   mounted() {
     var _this = this;
-    const iframeId = ("#" + this.iframeId).replace(/\//g, "\\/");
+    const iframeId = ('#' + this.iframeId).replace(/\//g, '\\/');
     const iframe = document.querySelector(iframeId);
     // iframe页面loading控制
     if (iframe.attachEvent) {
       this.loading = true;
-      iframe.attachEvent("onload", function () {
+      iframe.attachEvent('onload', function () {
         _this.loading = false;
       });
     } else {
@@ -95581,10 +95404,10 @@ var script$w = {
 };
 
 /* script */
-const __vue_script__$w = script$w;
+const __vue_script__$y = script$y;
 
 /* template */
-var __vue_render__$x = function () {
+var __vue_render__$A = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -95610,17 +95433,17 @@ var __vue_render__$x = function () {
     ]
   )
 };
-var __vue_staticRenderFns__$x = [];
-__vue_render__$x._withStripped = true;
+var __vue_staticRenderFns__$A = [];
+__vue_render__$A._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$x = undefined;
+  const __vue_inject_styles__$A = undefined;
   /* scoped */
-  const __vue_scope_id__$x = undefined;
+  const __vue_scope_id__$A = undefined;
   /* module identifier */
-  const __vue_module_identifier__$x = undefined;
+  const __vue_module_identifier__$A = undefined;
   /* functional template */
-  const __vue_is_functional_template__$x = false;
+  const __vue_is_functional_template__$A = false;
   /* style inject */
   
   /* style inject SSR */
@@ -95629,13 +95452,13 @@ __vue_render__$x._withStripped = true;
   
 
   
-  const __vue_component__$x = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$x, staticRenderFns: __vue_staticRenderFns__$x },
-    __vue_inject_styles__$x,
-    __vue_script__$w,
-    __vue_scope_id__$x,
-    __vue_is_functional_template__$x,
-    __vue_module_identifier__$x,
+  const __vue_component__$A = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$A, staticRenderFns: __vue_staticRenderFns__$A },
+    __vue_inject_styles__$A,
+    __vue_script__$y,
+    __vue_scope_id__$A,
+    __vue_is_functional_template__$A,
+    __vue_module_identifier__$A,
     false,
     undefined,
     undefined,
@@ -95656,20 +95479,20 @@ __vue_render__$x._withStripped = true;
 //
 
 
-var script$v = {
-  components: { InnerLink: __vue_component__$x },
+var script$x = {
+  components: { InnerLink: __vue_component__$A },
   computed: {
     iframeViews() {
-      return this.$store.state.tagsView.iframeViews
+      return this.$store.state['z-tagsView'].iframeViews
     }
   }
 };
 
 /* script */
-const __vue_script__$v = script$v;
+const __vue_script__$x = script$x;
 
 /* template */
-var __vue_render__$w = function () {
+var __vue_render__$z = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -95693,17 +95516,17 @@ var __vue_render__$w = function () {
     1
   )
 };
-var __vue_staticRenderFns__$w = [];
-__vue_render__$w._withStripped = true;
+var __vue_staticRenderFns__$z = [];
+__vue_render__$z._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$w = undefined;
+  const __vue_inject_styles__$z = undefined;
   /* scoped */
-  const __vue_scope_id__$w = undefined;
+  const __vue_scope_id__$z = undefined;
   /* module identifier */
-  const __vue_module_identifier__$w = undefined;
+  const __vue_module_identifier__$z = undefined;
   /* functional template */
-  const __vue_is_functional_template__$w = false;
+  const __vue_is_functional_template__$z = false;
   /* style inject */
   
   /* style inject SSR */
@@ -95712,13 +95535,13 @@ __vue_render__$w._withStripped = true;
   
 
   
-  const __vue_component__$w = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$w, staticRenderFns: __vue_staticRenderFns__$w },
-    __vue_inject_styles__$w,
-    __vue_script__$v,
-    __vue_scope_id__$w,
-    __vue_is_functional_template__$w,
-    __vue_module_identifier__$w,
+  const __vue_component__$z = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$z, staticRenderFns: __vue_staticRenderFns__$z },
+    __vue_inject_styles__$z,
+    __vue_script__$x,
+    __vue_scope_id__$z,
+    __vue_is_functional_template__$z,
+    __vue_module_identifier__$z,
     false,
     undefined,
     undefined,
@@ -95738,12 +95561,12 @@ __vue_render__$w._withStripped = true;
 //
 
 
-var script$u = {
+var script$w = {
   name: 'AppMain',
-  components: { iframeToggle: __vue_component__$w },
+  components: { iframeToggle: __vue_component__$z },
   computed: {
     cachedViews() {
-      return this.$store.state.tagsView.cachedViews
+      return this.$store.state['z-tagsView'].cachedViews
     },
     key() {
       return this.$route.path
@@ -95810,10 +95633,10 @@ var browser = createInjector;
 var __vue_create_injector__ = /*@__PURE__*/getDefaultExportFromCjs(browser);
 
 /* script */
-const __vue_script__$u = script$u;
+const __vue_script__$w = script$w;
 
 /* template */
-var __vue_render__$v = function () {
+var __vue_render__$y = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -95844,35 +95667,35 @@ var __vue_render__$v = function () {
     1
   )
 };
-var __vue_staticRenderFns__$v = [];
-__vue_render__$v._withStripped = true;
+var __vue_staticRenderFns__$y = [];
+__vue_render__$y._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$v = function (inject) {
+  const __vue_inject_styles__$y = function (inject) {
     if (!inject) return
-    inject("data-v-e177811c_0", { source: "/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n[data-v-e177811c]:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n.app-main[data-v-e177811c] {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: #30B08F;\n}\n.fixed-header + .app-main[data-v-e177811c] {\n  padding-top: 50px;\n}\n.hasTagsView .app-main[data-v-e177811c] {\n  /* 84 = navbar + tags-view = 50 + 34 */\n  min-height: calc(100vh - 84px);\n}\n.hasTagsView .fixed-header + .app-main[data-v-e177811c] {\n  padding-top: 84px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */", map: {"version":3,"sources":["AppMain.vue","D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\AppMain.vue"],"names":[],"mappings":"AAAA;;;;;;;;;;;;CAYC;AC8BD;ED5BE,kBAAkB;EC8BpB,kCAAA;EACA,wBAAA;EACA,uBAAA;EACA,4BAAA;EACA,0BAAA;ED5BE,qBAAqB;EC8BvB,mBAZA;EAaA,uBAAA;EACA,4BAAA;AD5BA;ACMA;EACA,oBAAA;EACA,8BAAA;EACA,WAAA;EACA,kBAAA;EACA,gBAAA;EACA,aAAA;EACA,cAAA;ADHA;ACMA;EACA,iBAAA;ADHA;ACOA;EACA,sCAAA;EACA,8BAAA;ADJA;ACOA;EACA,iBAAA;ADLA;;AAEA,sCAAsC","file":"AppMain.vue","sourcesContent":["/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n\n.app-main {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: #30B08F;\n}\n\n.fixed-header + .app-main {\n  padding-top: 50px;\n}\n\n.hasTagsView .app-main {\n  /* 84 = navbar + tags-view = 50 + 34 */\n  min-height: calc(100vh - 84px);\n}\n.hasTagsView .fixed-header + .app-main {\n  padding-top: 84px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */","<template>\n  <section class=\"app-main\">\n    <transition name=\"fade-transform\" mode=\"out-in\">\n      <keep-alive :include=\"cachedViews\">\n        <router-view v-if=\"!$route.meta.link\" :key=\"key\" />\n      </keep-alive>\n    </transition>\n    <iframe-toggle />\n  </section>\n</template>\n\n<script>\nimport iframeToggle from './IframeToggle/index.vue'\n\nexport default {\n  name: 'AppMain',\n  components: { iframeToggle },\n  computed: {\n    cachedViews() {\n      return this.$store.state.tagsView.cachedViews\n    },\n    key() {\n      return this.$route.path\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../scss/variables.module.scss';\n.app-main {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: $green;\n}\n\n.fixed-header + .app-main {\n  padding-top: 50px;\n}\n\n.hasTagsView {\n  .app-main {\n    /* 84 = navbar + tags-view = 50 + 34 */\n    min-height: calc(100vh - 84px);\n  }\n\n  .fixed-header + .app-main {\n    padding-top: 84px;\n  }\n}\n</style>\n\n<style lang=\"scss\">\n// fix css style bug in open el-dialog\n.el-popup-parent--hidden {\n  .fixed-header {\n    padding-right: 6px;\n  }\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n</style>\n"]}, media: undefined })
-,inject("data-v-e177811c_1", { source: ".el-popup-parent--hidden .fixed-header {\n  padding-right: 6px;\n}\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\AppMain.vue","AppMain.vue"],"names":[],"mappings":"AA2DA;EACA,kBAAA;AC1DA;AD8DA;EACA,UAAA;EACA,WAAA;AC3DA;AD8DA;EACA,yBAAA;AC3DA;AD8DA;EACA,yBAAA;EACA,kBAAA;AC3DA;;AAEA,sCAAsC","file":"AppMain.vue","sourcesContent":["<template>\n  <section class=\"app-main\">\n    <transition name=\"fade-transform\" mode=\"out-in\">\n      <keep-alive :include=\"cachedViews\">\n        <router-view v-if=\"!$route.meta.link\" :key=\"key\" />\n      </keep-alive>\n    </transition>\n    <iframe-toggle />\n  </section>\n</template>\n\n<script>\nimport iframeToggle from './IframeToggle/index.vue'\n\nexport default {\n  name: 'AppMain',\n  components: { iframeToggle },\n  computed: {\n    cachedViews() {\n      return this.$store.state.tagsView.cachedViews\n    },\n    key() {\n      return this.$route.path\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../scss/variables.module.scss';\n.app-main {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: $green;\n}\n\n.fixed-header + .app-main {\n  padding-top: 50px;\n}\n\n.hasTagsView {\n  .app-main {\n    /* 84 = navbar + tags-view = 50 + 34 */\n    min-height: calc(100vh - 84px);\n  }\n\n  .fixed-header + .app-main {\n    padding-top: 84px;\n  }\n}\n</style>\n\n<style lang=\"scss\">\n// fix css style bug in open el-dialog\n.el-popup-parent--hidden {\n  .fixed-header {\n    padding-right: 6px;\n  }\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n</style>\n",".el-popup-parent--hidden .fixed-header {\n  padding-right: 6px;\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */"]}, media: undefined });
+    inject("data-v-7ff2a9cf_0", { source: "/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n[data-v-7ff2a9cf]:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n.app-main[data-v-7ff2a9cf] {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: #30B08F;\n}\n.fixed-header + .app-main[data-v-7ff2a9cf] {\n  padding-top: 50px;\n}\n.hasTagsView .app-main[data-v-7ff2a9cf] {\n  /* 84 = navbar + tags-view = 50 + 34 */\n  min-height: calc(100vh - 84px);\n}\n.hasTagsView .fixed-header + .app-main[data-v-7ff2a9cf] {\n  padding-top: 84px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */", map: {"version":3,"sources":["AppMain.vue","D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\AppMain.vue"],"names":[],"mappings":"AAAA;;;;;;;;;;;;CAYC;AC8BD;ED5BE,kBAAkB;EC8BpB,kCAAA;EACA,wBAAA;EACA,uBAAA;EACA,4BAAA;EACA,0BAAA;ED5BE,qBAAqB;EC8BvB,mBAZA;EAaA,uBAAA;EACA,4BAAA;AD5BA;ACMA;EACA,oBAAA;EACA,8BAAA;EACA,WAAA;EACA,kBAAA;EACA,gBAAA;EACA,aAAA;EACA,cAAA;ADHA;ACMA;EACA,iBAAA;ADHA;ACOA;EACA,sCAAA;EACA,8BAAA;ADJA;ACOA;EACA,iBAAA;ADLA;;AAEA,sCAAsC","file":"AppMain.vue","sourcesContent":["/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n\n.app-main {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: #30B08F;\n}\n\n.fixed-header + .app-main {\n  padding-top: 50px;\n}\n\n.hasTagsView .app-main {\n  /* 84 = navbar + tags-view = 50 + 34 */\n  min-height: calc(100vh - 84px);\n}\n.hasTagsView .fixed-header + .app-main {\n  padding-top: 84px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */","<template>\n  <section class=\"app-main\">\n    <transition name=\"fade-transform\" mode=\"out-in\">\n      <keep-alive :include=\"cachedViews\">\n        <router-view v-if=\"!$route.meta.link\" :key=\"key\" />\n      </keep-alive>\n    </transition>\n    <iframe-toggle />\n  </section>\n</template>\n\n<script>\nimport iframeToggle from './IframeToggle/index.vue'\n\nexport default {\n  name: 'AppMain',\n  components: { iframeToggle },\n  computed: {\n    cachedViews() {\n      return this.$store.state['z-tagsView'].cachedViews\n    },\n    key() {\n      return this.$route.path\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../scss/variables.module.scss';\n.app-main {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: $green;\n}\n\n.fixed-header + .app-main {\n  padding-top: 50px;\n}\n\n.hasTagsView {\n  .app-main {\n    /* 84 = navbar + tags-view = 50 + 34 */\n    min-height: calc(100vh - 84px);\n  }\n\n  .fixed-header + .app-main {\n    padding-top: 84px;\n  }\n}\n</style>\n\n<style lang=\"scss\">\n// fix css style bug in open el-dialog\n.el-popup-parent--hidden {\n  .fixed-header {\n    padding-right: 6px;\n  }\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n</style>\n"]}, media: undefined })
+,inject("data-v-7ff2a9cf_1", { source: ".el-popup-parent--hidden .fixed-header {\n  padding-right: 6px;\n}\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\AppMain.vue","AppMain.vue"],"names":[],"mappings":"AA2DA;EACA,kBAAA;AC1DA;AD8DA;EACA,UAAA;EACA,WAAA;AC3DA;AD8DA;EACA,yBAAA;AC3DA;AD8DA;EACA,yBAAA;EACA,kBAAA;AC3DA;;AAEA,sCAAsC","file":"AppMain.vue","sourcesContent":["<template>\n  <section class=\"app-main\">\n    <transition name=\"fade-transform\" mode=\"out-in\">\n      <keep-alive :include=\"cachedViews\">\n        <router-view v-if=\"!$route.meta.link\" :key=\"key\" />\n      </keep-alive>\n    </transition>\n    <iframe-toggle />\n  </section>\n</template>\n\n<script>\nimport iframeToggle from './IframeToggle/index.vue'\n\nexport default {\n  name: 'AppMain',\n  components: { iframeToggle },\n  computed: {\n    cachedViews() {\n      return this.$store.state['z-tagsView'].cachedViews\n    },\n    key() {\n      return this.$route.path\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../scss/variables.module.scss';\n.app-main {\n  /* 50= navbar  50  */\n  min-height: calc(100vh - 50px);\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  padding: 20px;\n  color: $green;\n}\n\n.fixed-header + .app-main {\n  padding-top: 50px;\n}\n\n.hasTagsView {\n  .app-main {\n    /* 84 = navbar + tags-view = 50 + 34 */\n    min-height: calc(100vh - 84px);\n  }\n\n  .fixed-header + .app-main {\n    padding-top: 84px;\n  }\n}\n</style>\n\n<style lang=\"scss\">\n// fix css style bug in open el-dialog\n.el-popup-parent--hidden {\n  .fixed-header {\n    padding-right: 6px;\n  }\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n</style>\n",".el-popup-parent--hidden .fixed-header {\n  padding-right: 6px;\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  height: 6px;\n}\n\n::-webkit-scrollbar-track {\n  background-color: #f1f1f1;\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: #c0c0c0;\n  border-radius: 3px;\n}\n\n/*# sourceMappingURL=AppMain.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$v = "data-v-e177811c";
+  const __vue_scope_id__$y = "data-v-7ff2a9cf";
   /* module identifier */
-  const __vue_module_identifier__$v = undefined;
+  const __vue_module_identifier__$y = undefined;
   /* functional template */
-  const __vue_is_functional_template__$v = false;
+  const __vue_is_functional_template__$y = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$v = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$v, staticRenderFns: __vue_staticRenderFns__$v },
-    __vue_inject_styles__$v,
-    __vue_script__$u,
-    __vue_scope_id__$v,
-    __vue_is_functional_template__$v,
-    __vue_module_identifier__$v,
+  const __vue_component__$y = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$y, staticRenderFns: __vue_staticRenderFns__$y },
+    __vue_inject_styles__$y,
+    __vue_script__$w,
+    __vue_scope_id__$y,
+    __vue_is_functional_template__$y,
+    __vue_module_identifier__$y,
     false,
     __vue_create_injector__,
     undefined,
@@ -95890,8 +95713,10 @@ __vue_render__$v._withStripped = true;
 //
 //
 //
+//
+//
 
-var script$t = {
+var script$v = {
   data() {
     return {
       levelList: null
@@ -95910,16 +95735,22 @@ var script$t = {
     this.getBreadcrumb();
   },
   methods: {
+    getIndexRouter() {
+      const arr = this.$store.state['z-permission'].sidebarRouters;
+      const rootItem = arr.find((item) => {
+        return (item.path === '' || item.path === '/') && item.redirect
+      });
+      return { path: '/', meta: { title: rootItem?.meta?.title || '首页' } }
+    },
     getBreadcrumb() {
       // only show routes with meta.title
-      let matched = this.$route.matched.filter(item => item.meta && item.meta.title);
+      let matched = this.$route.matched.filter((item) => item.meta && item.meta.title);
+      matched = matched.filter((item) => item.path !== '' && item.path !== '/');
       const first = matched[0];
-
       if (!this.isDashboard(first)) {
-        matched = [{ path: '/index', meta: { title: '首页' }}].concat(matched);
+        matched = [this.getIndexRouter()].concat(matched);
       }
-
-      this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false);
+      this.levelList = matched.filter((item) => item.meta && item.meta.title && item.meta.breadcrumb !== false);
     },
     isDashboard(route) {
       const name = route && route.name;
@@ -95940,74 +95771,81 @@ var script$t = {
 };
 
 /* script */
-const __vue_script__$t = script$t;
+const __vue_script__$v = script$v;
 
 /* template */
-var __vue_render__$u = function () {
+var __vue_render__$x = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
   return _c(
-    "el-breadcrumb",
-    { staticClass: "app-breadcrumb", attrs: { separator: "/" } },
+    "div",
     [
       _c(
-        "transition-group",
-        { attrs: { name: "breadcrumb" } },
-        _vm._l(_vm.levelList, function (item, index) {
-          return _c("el-breadcrumb-item", { key: item.path }, [
-            item.redirect === "noRedirect" || index == _vm.levelList.length - 1
-              ? _c("span", { staticClass: "no-redirect" }, [
-                  _vm._v(_vm._s(item.meta.title)),
-                ])
-              : _c(
-                  "a",
-                  {
-                    on: {
-                      click: function ($event) {
-                        $event.preventDefault();
-                        return _vm.handleLink(item)
+        "el-breadcrumb",
+        { staticClass: "app-breadcrumb", attrs: { separator: "/" } },
+        [
+          _c(
+            "transition-group",
+            { attrs: { name: "breadcrumb" } },
+            _vm._l(_vm.levelList, function (item, index) {
+              return _c("el-breadcrumb-item", { key: item.path }, [
+                item.redirect === "noRedirect" ||
+                index == _vm.levelList.length - 1
+                  ? _c("span", { staticClass: "no-redirect" }, [
+                      _vm._v(_vm._s(item.meta.title)),
+                    ])
+                  : _c(
+                      "a",
+                      {
+                        on: {
+                          click: function ($event) {
+                            $event.preventDefault();
+                            return _vm.handleLink(item)
+                          },
+                        },
                       },
-                    },
-                  },
-                  [_vm._v(_vm._s(item.meta.title))]
-                ),
-          ])
-        }),
+                      [_vm._v(_vm._s(item.meta.title))]
+                    ),
+              ])
+            }),
+            1
+          ),
+        ],
         1
       ),
     ],
     1
   )
 };
-var __vue_staticRenderFns__$u = [];
-__vue_render__$u._withStripped = true;
+var __vue_staticRenderFns__$x = [];
+__vue_render__$x._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$u = function (inject) {
+  const __vue_inject_styles__$x = function (inject) {
     if (!inject) return
-    inject("data-v-1afc0a5c_0", { source: ".app-breadcrumb.el-breadcrumb[data-v-1afc0a5c] {\n  display: inline-block;\n  font-size: 14px;\n  line-height: 50px;\n  margin-left: 8px;\n}\n.app-breadcrumb.el-breadcrumb .no-redirect[data-v-1afc0a5c] {\n  color: #97a8be;\n  cursor: text;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Breadcrumb\\index.vue","index.vue"],"names":[],"mappings":"AA8DA;EACA,qBAAA;EACA,eAAA;EACA,iBAAA;EACA,gBAAA;AC7DA;AD+DA;EACA,cAAA;EACA,YAAA;AC7DA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n  <el-breadcrumb class=\"app-breadcrumb\" separator=\"/\">\n    <transition-group name=\"breadcrumb\">\n      <el-breadcrumb-item v-for=\"(item,index) in levelList\" :key=\"item.path\">\n        <span v-if=\"item.redirect === 'noRedirect' || index == levelList.length - 1\" class=\"no-redirect\">{{ item.meta.title }}</span>\n        <a v-else @click.prevent=\"handleLink(item)\">{{ item.meta.title }}</a>\n      </el-breadcrumb-item>\n    </transition-group>\n  </el-breadcrumb>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      levelList: null\n    }\n  },\n  watch: {\n    $route(route) {\n      // if you go to the redirect page, do not update the breadcrumbs\n      if (route.path.startsWith('/redirect/')) {\n        return\n      }\n      this.getBreadcrumb()\n    }\n  },\n  created() {\n    this.getBreadcrumb()\n  },\n  methods: {\n    getBreadcrumb() {\n      // only show routes with meta.title\n      let matched = this.$route.matched.filter(item => item.meta && item.meta.title)\n      const first = matched[0]\n\n      if (!this.isDashboard(first)) {\n        matched = [{ path: '/index', meta: { title: '首页' }}].concat(matched)\n      }\n\n      this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)\n    },\n    isDashboard(route) {\n      const name = route && route.name\n      if (!name) {\n        return false\n      }\n      return name.trim() === 'Index'\n    },\n    handleLink(item) {\n      const { redirect, path } = item\n      if (redirect) {\n        this.$router.push(redirect)\n        return\n      }\n      this.$router.push(path)\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.app-breadcrumb.el-breadcrumb {\n  display: inline-block;\n  font-size: 14px;\n  line-height: 50px;\n  margin-left: 8px;\n\n  .no-redirect {\n    color: #97a8be;\n    cursor: text;\n  }\n}\n</style>\n",".app-breadcrumb.el-breadcrumb {\n  display: inline-block;\n  font-size: 14px;\n  line-height: 50px;\n  margin-left: 8px;\n}\n.app-breadcrumb.el-breadcrumb .no-redirect {\n  color: #97a8be;\n  cursor: text;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+    inject("data-v-5878a65c_0", { source: ".app-breadcrumb.el-breadcrumb[data-v-5878a65c] {\n  display: inline-block;\n  font-size: 14px;\n  line-height: 50px;\n  margin-left: 8px;\n}\n.app-breadcrumb.el-breadcrumb .no-redirect[data-v-5878a65c] {\n  color: #97a8be;\n  cursor: text;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Breadcrumb\\index.vue","index.vue"],"names":[],"mappings":"AAsEA;EACA,qBAAA;EACA,eAAA;EACA,iBAAA;EACA,gBAAA;ACrEA;ADsEA;EACA,cAAA;EACA,YAAA;ACpEA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n  <div>\n    <el-breadcrumb class=\"app-breadcrumb\" separator=\"/\">\n      <transition-group name=\"breadcrumb\">\n        <el-breadcrumb-item v-for=\"(item, index) in levelList\" :key=\"item.path\">\n          <span v-if=\"item.redirect === 'noRedirect' || index == levelList.length - 1\" class=\"no-redirect\">{{ item.meta.title }}</span>\n          <a v-else @click.prevent=\"handleLink(item)\">{{ item.meta.title }}</a>\n        </el-breadcrumb-item>\n      </transition-group>\n    </el-breadcrumb>\n  </div>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      levelList: null\n    }\n  },\n  watch: {\n    $route(route) {\n      // if you go to the redirect page, do not update the breadcrumbs\n      if (route.path.startsWith('/redirect/')) {\n        return\n      }\n      this.getBreadcrumb()\n    }\n  },\n  created() {\n    this.getBreadcrumb()\n  },\n  methods: {\n    getIndexRouter() {\n      const arr = this.$store.state['z-permission'].sidebarRouters\n      const rootItem = arr.find((item) => {\n        return (item.path === '' || item.path === '/') && item.redirect\n      })\n      return { path: '/', meta: { title: rootItem?.meta?.title || '首页' } }\n    },\n    getBreadcrumb() {\n      // only show routes with meta.title\n      let matched = this.$route.matched.filter((item) => item.meta && item.meta.title)\n      matched = matched.filter((item) => item.path !== '' && item.path !== '/')\n      const first = matched[0]\n      if (!this.isDashboard(first)) {\n        matched = [this.getIndexRouter()].concat(matched)\n      }\n      this.levelList = matched.filter((item) => item.meta && item.meta.title && item.meta.breadcrumb !== false)\n    },\n    isDashboard(route) {\n      const name = route && route.name\n      if (!name) {\n        return false\n      }\n      return name.trim() === 'Index'\n    },\n    handleLink(item) {\n      const { redirect, path } = item\n      if (redirect) {\n        this.$router.push(redirect)\n        return\n      }\n      this.$router.push(path)\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.app-breadcrumb.el-breadcrumb {\n  display: inline-block;\n  font-size: 14px;\n  line-height: 50px;\n  margin-left: 8px;\n  .no-redirect {\n    color: #97a8be;\n    cursor: text;\n  }\n}\n</style>\n",".app-breadcrumb.el-breadcrumb {\n  display: inline-block;\n  font-size: 14px;\n  line-height: 50px;\n  margin-left: 8px;\n}\n.app-breadcrumb.el-breadcrumb .no-redirect {\n  color: #97a8be;\n  cursor: text;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$u = "data-v-1afc0a5c";
+  const __vue_scope_id__$x = "data-v-5878a65c";
   /* module identifier */
-  const __vue_module_identifier__$u = undefined;
+  const __vue_module_identifier__$x = undefined;
   /* functional template */
-  const __vue_is_functional_template__$u = false;
+  const __vue_is_functional_template__$x = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$u = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$u, staticRenderFns: __vue_staticRenderFns__$u },
-    __vue_inject_styles__$u,
-    __vue_script__$t,
-    __vue_scope_id__$u,
-    __vue_is_functional_template__$u,
-    __vue_module_identifier__$u,
+  const __vue_component__$x = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$x, staticRenderFns: __vue_staticRenderFns__$x },
+    __vue_inject_styles__$x,
+    __vue_script__$v,
+    __vue_scope_id__$x,
+    __vue_is_functional_template__$x,
+    __vue_module_identifier__$x,
     false,
     __vue_create_injector__,
     undefined,
@@ -96041,7 +95879,7 @@ __vue_render__$u._withStripped = true;
 // 隐藏侧边栏路由
 const hideList = ['/index', '/user/profile'];
 
-var script$s = {
+var script$u = {
   data() {
     return {
       // 顶部栏初始数
@@ -96052,7 +95890,7 @@ var script$s = {
   },
   computed: {
     theme() {
-      return this.$store.state.settings.theme
+      return this.$store.state['z-settings'].theme
     },
     // 顶部显示菜单
     topMenus() {
@@ -96071,7 +95909,7 @@ var script$s = {
     },
     // 所有的路由信息
     routers() {
-      return this.$store.state.permission.topbarRouters
+      return this.$store.state['z-permission'].topbarRouters
     },
     // 设置子路由
     childrenMenus() {
@@ -96101,11 +95939,11 @@ var script$s = {
         const tmpPath = path.substring(1, path.length);
         activePath = '/' + tmpPath.substring(0, tmpPath.indexOf('/'));
         if (!this.$route.meta.link) {
-          this.$store.dispatch('app/toggleSideBarHide', false);
+          this.$store.dispatch('z-app/toggleSideBarHide', false);
         }
       } else if (!this.$route.children) {
         activePath = path;
-        this.$store.dispatch('app/toggleSideBarHide', true);
+        this.$store.dispatch('z-app/toggleSideBarHide', true);
       }
       this.activeRoutes(activePath);
       return activePath
@@ -96142,11 +95980,11 @@ var script$s = {
         } else {
           this.$router.push({ path: key });
         }
-        this.$store.dispatch('app/toggleSideBarHide', true);
+        this.$store.dispatch('z-app/toggleSideBarHide', true);
       } else {
         // 显示左侧联动菜单
         this.activeRoutes(key);
-        this.$store.dispatch('app/toggleSideBarHide', false);
+        this.$store.dispatch('z-app/toggleSideBarHide', false);
       }
     },
     // 当前激活的路由
@@ -96162,7 +96000,7 @@ var script$s = {
       if (routes.length > 0) {
         this.$store.commit('SET_SIDEBAR_ROUTERS', routes);
       } else {
-        this.$store.dispatch('app/toggleSideBarHide', true);
+        this.$store.dispatch('z-app/toggleSideBarHide', true);
       }
     },
     ishttp(url) {
@@ -96172,10 +96010,10 @@ var script$s = {
 };
 
 /* script */
-const __vue_script__$s = script$s;
+const __vue_script__$u = script$u;
 
 /* template */
-var __vue_render__$t = function () {
+var __vue_render__$w = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -96228,34 +96066,34 @@ var __vue_render__$t = function () {
     2
   )
 };
-var __vue_staticRenderFns__$t = [];
-__vue_render__$t._withStripped = true;
+var __vue_staticRenderFns__$w = [];
+__vue_render__$w._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$t = function (inject) {
+  const __vue_inject_styles__$w = function (inject) {
     if (!inject) return
-    inject("data-v-58dba194_0", { source: ".topmenu-container.el-menu--horizontal > .el-menu-item {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n  border-bottom: 2px solid var(--theme) !important;\n  color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\TopNav\\index.vue","index.vue"],"names":[],"mappings":"AAgKA;EACA,WAAA;EACA,uBAAA;EACA,4BAAA;EACA,yBAAA;EACA,yBAAA;EACA,yBAAA;AC/JA;ADkKA;;EAEA,gDAAA;EACA,cAAA;AC/JA;;ADkKA,iBAAA;AACA;EACA,WAAA;EACA,uBAAA;EACA,4BAAA;EACA,yBAAA;EACA,yBAAA;EACA,yBAAA;AC/JA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n  <el-menu :default-active=\"activeMenu\" mode=\"horizontal\" @select=\"handleSelect\">\n    <template v-for=\"(item, index) in topMenus\">\n      <el-menu-item :style=\"{ '--theme': theme }\" :index=\"item.path\" :key=\"index\" v-if=\"index < visibleNumber\">\n        <!--        <z-icon :icon-class=\"item.meta.icon\" />-->\n        {{ item.meta.title }}</el-menu-item\n      >\n    </template>\n\n    <!-- 顶部菜单超出数量折叠 -->\n    <el-submenu :style=\"{ '--theme': theme }\" index=\"more\" v-if=\"topMenus.length > visibleNumber\">\n      <template slot=\"title\">更多菜单</template>\n      <template v-for=\"(item, index) in topMenus\">\n        <el-menu-item :index=\"item.path\" :key=\"index\" v-if=\"index >= visibleNumber\">\n          <!--          <z-icon :icon-class=\"item.meta.icon\" />-->\n          {{ item.meta.title }}</el-menu-item\n        >\n      </template>\n    </el-submenu>\n  </el-menu>\n</template>\n\n<script>\nimport { constantRoutes } from '@/router'\n\n// 隐藏侧边栏路由\nconst hideList = ['/index', '/user/profile']\n\nexport default {\n  data() {\n    return {\n      // 顶部栏初始数\n      visibleNumber: 5,\n      // 当前激活菜单的 index\n      currentIndex: undefined\n    }\n  },\n  computed: {\n    theme() {\n      return this.$store.state.settings.theme\n    },\n    // 顶部显示菜单\n    topMenus() {\n      let topMenus = []\n      this.routers.map((menu) => {\n        if (menu.hidden !== true) {\n          // 兼容顶部栏一级菜单内部跳转\n          if (menu.path === '/') {\n            topMenus.push(menu.children[0])\n          } else {\n            topMenus.push(menu)\n          }\n        }\n      })\n      return topMenus\n    },\n    // 所有的路由信息\n    routers() {\n      return this.$store.state.permission.topbarRouters\n    },\n    // 设置子路由\n    childrenMenus() {\n      var childrenMenus = []\n      this.routers.map((router) => {\n        for (var item in router.children) {\n          if (router.children[item].parentPath === undefined) {\n            if (router.path === '/') {\n              router.children[item].path = '/' + router.children[item].path\n            } else {\n              if (!this.ishttp(router.children[item].path)) {\n                router.children[item].path = router.path + '/' + router.children[item].path\n              }\n            }\n            router.children[item].parentPath = router.path\n          }\n          childrenMenus.push(router.children[item])\n        }\n      })\n      return constantRoutes.concat(childrenMenus)\n    },\n    // 默认激活的菜单\n    activeMenu() {\n      const path = this.$route.path\n      let activePath = path\n      if (path !== undefined && path.lastIndexOf('/') > 0 && hideList.indexOf(path) === -1) {\n        const tmpPath = path.substring(1, path.length)\n        activePath = '/' + tmpPath.substring(0, tmpPath.indexOf('/'))\n        if (!this.$route.meta.link) {\n          this.$store.dispatch('app/toggleSideBarHide', false)\n        }\n      } else if (!this.$route.children) {\n        activePath = path\n        this.$store.dispatch('app/toggleSideBarHide', true)\n      }\n      this.activeRoutes(activePath)\n      return activePath\n    }\n  },\n  beforeMount() {\n    window.addEventListener('resize', this.setVisibleNumber)\n  },\n  beforeDestroy() {\n    window.removeEventListener('resize', this.setVisibleNumber)\n  },\n  mounted() {\n    this.setVisibleNumber()\n  },\n  methods: {\n    // 根据宽度计算设置显示栏数\n    setVisibleNumber() {\n      const width = document.body.getBoundingClientRect().width / 3\n      this.visibleNumber = parseInt(width / 85)\n    },\n    // 菜单选择事件\n    handleSelect(key, keyPath) {\n      this.currentIndex = key\n      const route = this.routers.find((item) => item.path === key)\n      if (this.ishttp(key)) {\n        // http(s):// 路径新窗口打开\n        window.open(key, '_blank')\n      } else if (!route || !route.children) {\n        // 没有子路由路径内部打开\n        const routeMenu = this.childrenMenus.find((item) => item.path === key)\n        if (routeMenu && routeMenu.query) {\n          let query = JSON.parse(routeMenu.query)\n          this.$router.push({ path: key, query: query })\n        } else {\n          this.$router.push({ path: key })\n        }\n        this.$store.dispatch('app/toggleSideBarHide', true)\n      } else {\n        // 显示左侧联动菜单\n        this.activeRoutes(key)\n        this.$store.dispatch('app/toggleSideBarHide', false)\n      }\n    },\n    // 当前激活的路由\n    activeRoutes(key) {\n      var routes = []\n      if (this.childrenMenus && this.childrenMenus.length > 0) {\n        this.childrenMenus.map((item) => {\n          if (key == item.parentPath || (key == 'index' && '' == item.path)) {\n            routes.push(item)\n          }\n        })\n      }\n      if (routes.length > 0) {\n        this.$store.commit('SET_SIDEBAR_ROUTERS', routes)\n      } else {\n        this.$store.dispatch('app/toggleSideBarHide', true)\n      }\n    },\n    ishttp(url) {\n      return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.topmenu-container.el-menu--horizontal > .el-menu-item {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n  border-bottom: 2px solid #{'var(--theme)'} !important;\n  color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n</style>\n",".topmenu-container.el-menu--horizontal > .el-menu-item {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n  border-bottom: 2px solid var(--theme) !important;\n  color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+    inject("data-v-7562f229_0", { source: ".topmenu-container.el-menu--horizontal > .el-menu-item {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n  border-bottom: 2px solid var(--theme) !important;\n  color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\TopNav\\index.vue","index.vue"],"names":[],"mappings":"AAgKA;EACA,WAAA;EACA,uBAAA;EACA,4BAAA;EACA,yBAAA;EACA,yBAAA;EACA,yBAAA;AC/JA;ADkKA;;EAEA,gDAAA;EACA,cAAA;AC/JA;;ADkKA,iBAAA;AACA;EACA,WAAA;EACA,uBAAA;EACA,4BAAA;EACA,yBAAA;EACA,yBAAA;EACA,yBAAA;AC/JA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n  <el-menu :default-active=\"activeMenu\" mode=\"horizontal\" @select=\"handleSelect\">\n    <template v-for=\"(item, index) in topMenus\">\n      <el-menu-item :style=\"{ '--theme': theme }\" :index=\"item.path\" :key=\"index\" v-if=\"index < visibleNumber\">\n        <!--        <z-icon :icon-class=\"item.meta.icon\" />-->\n        {{ item.meta.title }}</el-menu-item\n      >\n    </template>\n\n    <!-- 顶部菜单超出数量折叠 -->\n    <el-submenu :style=\"{ '--theme': theme }\" index=\"more\" v-if=\"topMenus.length > visibleNumber\">\n      <template slot=\"title\">更多菜单</template>\n      <template v-for=\"(item, index) in topMenus\">\n        <el-menu-item :index=\"item.path\" :key=\"index\" v-if=\"index >= visibleNumber\">\n          <!--          <z-icon :icon-class=\"item.meta.icon\" />-->\n          {{ item.meta.title }}</el-menu-item\n        >\n      </template>\n    </el-submenu>\n  </el-menu>\n</template>\n\n<script>\nimport { constantRoutes } from '@/router'\n\n// 隐藏侧边栏路由\nconst hideList = ['/index', '/user/profile']\n\nexport default {\n  data() {\n    return {\n      // 顶部栏初始数\n      visibleNumber: 5,\n      // 当前激活菜单的 index\n      currentIndex: undefined\n    }\n  },\n  computed: {\n    theme() {\n      return this.$store.state['z-settings'].theme\n    },\n    // 顶部显示菜单\n    topMenus() {\n      let topMenus = []\n      this.routers.map((menu) => {\n        if (menu.hidden !== true) {\n          // 兼容顶部栏一级菜单内部跳转\n          if (menu.path === '/') {\n            topMenus.push(menu.children[0])\n          } else {\n            topMenus.push(menu)\n          }\n        }\n      })\n      return topMenus\n    },\n    // 所有的路由信息\n    routers() {\n      return this.$store.state['z-permission'].topbarRouters\n    },\n    // 设置子路由\n    childrenMenus() {\n      var childrenMenus = []\n      this.routers.map((router) => {\n        for (var item in router.children) {\n          if (router.children[item].parentPath === undefined) {\n            if (router.path === '/') {\n              router.children[item].path = '/' + router.children[item].path\n            } else {\n              if (!this.ishttp(router.children[item].path)) {\n                router.children[item].path = router.path + '/' + router.children[item].path\n              }\n            }\n            router.children[item].parentPath = router.path\n          }\n          childrenMenus.push(router.children[item])\n        }\n      })\n      return constantRoutes.concat(childrenMenus)\n    },\n    // 默认激活的菜单\n    activeMenu() {\n      const path = this.$route.path\n      let activePath = path\n      if (path !== undefined && path.lastIndexOf('/') > 0 && hideList.indexOf(path) === -1) {\n        const tmpPath = path.substring(1, path.length)\n        activePath = '/' + tmpPath.substring(0, tmpPath.indexOf('/'))\n        if (!this.$route.meta.link) {\n          this.$store.dispatch('z-app/toggleSideBarHide', false)\n        }\n      } else if (!this.$route.children) {\n        activePath = path\n        this.$store.dispatch('z-app/toggleSideBarHide', true)\n      }\n      this.activeRoutes(activePath)\n      return activePath\n    }\n  },\n  beforeMount() {\n    window.addEventListener('resize', this.setVisibleNumber)\n  },\n  beforeDestroy() {\n    window.removeEventListener('resize', this.setVisibleNumber)\n  },\n  mounted() {\n    this.setVisibleNumber()\n  },\n  methods: {\n    // 根据宽度计算设置显示栏数\n    setVisibleNumber() {\n      const width = document.body.getBoundingClientRect().width / 3\n      this.visibleNumber = parseInt(width / 85)\n    },\n    // 菜单选择事件\n    handleSelect(key, keyPath) {\n      this.currentIndex = key\n      const route = this.routers.find((item) => item.path === key)\n      if (this.ishttp(key)) {\n        // http(s):// 路径新窗口打开\n        window.open(key, '_blank')\n      } else if (!route || !route.children) {\n        // 没有子路由路径内部打开\n        const routeMenu = this.childrenMenus.find((item) => item.path === key)\n        if (routeMenu && routeMenu.query) {\n          let query = JSON.parse(routeMenu.query)\n          this.$router.push({ path: key, query: query })\n        } else {\n          this.$router.push({ path: key })\n        }\n        this.$store.dispatch('z-app/toggleSideBarHide', true)\n      } else {\n        // 显示左侧联动菜单\n        this.activeRoutes(key)\n        this.$store.dispatch('z-app/toggleSideBarHide', false)\n      }\n    },\n    // 当前激活的路由\n    activeRoutes(key) {\n      var routes = []\n      if (this.childrenMenus && this.childrenMenus.length > 0) {\n        this.childrenMenus.map((item) => {\n          if (key == item.parentPath || (key == 'index' && '' == item.path)) {\n            routes.push(item)\n          }\n        })\n      }\n      if (routes.length > 0) {\n        this.$store.commit('SET_SIDEBAR_ROUTERS', routes)\n      } else {\n        this.$store.dispatch('z-app/toggleSideBarHide', true)\n      }\n    },\n    ishttp(url) {\n      return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.topmenu-container.el-menu--horizontal > .el-menu-item {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n  border-bottom: 2px solid #{'var(--theme)'} !important;\n  color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n</style>\n",".topmenu-container.el-menu--horizontal > .el-menu-item {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n  border-bottom: 2px solid var(--theme) !important;\n  color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n  float: left;\n  height: 50px !important;\n  line-height: 50px !important;\n  color: #999093 !important;\n  padding: 0 5px !important;\n  margin: 0 10px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$t = undefined;
+  const __vue_scope_id__$w = undefined;
   /* module identifier */
-  const __vue_module_identifier__$t = undefined;
+  const __vue_module_identifier__$w = undefined;
   /* functional template */
-  const __vue_is_functional_template__$t = false;
+  const __vue_is_functional_template__$w = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$t = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$t, staticRenderFns: __vue_staticRenderFns__$t },
-    __vue_inject_styles__$t,
-    __vue_script__$s,
-    __vue_scope_id__$t,
-    __vue_is_functional_template__$t,
-    __vue_module_identifier__$t,
+  const __vue_component__$w = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$w, staticRenderFns: __vue_staticRenderFns__$w },
+    __vue_inject_styles__$w,
+    __vue_script__$u,
+    __vue_scope_id__$w,
+    __vue_is_functional_template__$w,
+    __vue_module_identifier__$w,
     false,
     __vue_create_injector__,
     undefined,
@@ -96278,7 +96116,7 @@ __vue_render__$t._withStripped = true;
 //
 //
 
-var script$r = {
+var script$t = {
   name: 'Hamburger',
   props: {
     isActive: {
@@ -96294,10 +96132,10 @@ var script$r = {
 };
 
 /* script */
-const __vue_script__$r = script$r;
+const __vue_script__$t = script$t;
 
 /* template */
-var __vue_render__$s = function () {
+var __vue_render__$v = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -96328,34 +96166,34 @@ var __vue_render__$s = function () {
     ]
   )
 };
-var __vue_staticRenderFns__$s = [];
-__vue_render__$s._withStripped = true;
+var __vue_staticRenderFns__$v = [];
+__vue_render__$v._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$s = function (inject) {
+  const __vue_inject_styles__$v = function (inject) {
     if (!inject) return
     inject("data-v-3b0f2894_0", { source: "\n.hamburger[data-v-3b0f2894] {\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n  width: 20px;\r\n  height: 20px;\n}\n.hamburger.is-active[data-v-3b0f2894] {\r\n  transform: rotate(180deg);\n}\r\n", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Hamburger\\index.vue"],"names":[],"mappings":";AAiCA;EACA,qBAAA;EACA,sBAAA;EACA,WAAA;EACA,YAAA;AACA;AAEA;EACA,yBAAA;AACA","file":"index.vue","sourcesContent":["<template>\r\n  <div style=\"padding: 0 15px;\" @click=\"toggleClick\">\r\n    <svg\r\n      :class=\"{'is-active':isActive}\"\r\n      class=\"hamburger\"\r\n      viewBox=\"0 0 1024 1024\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      width=\"64\"\r\n      height=\"64\"\r\n    >\r\n      <path d=\"M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z\" />\r\n    </svg>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: 'Hamburger',\r\n  props: {\r\n    isActive: {\r\n      type: Boolean,\r\n      default: false\r\n    }\r\n  },\r\n  methods: {\r\n    toggleClick() {\r\n      this.$emit('toggleClick')\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.hamburger {\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n.hamburger.is-active {\r\n  transform: rotate(180deg);\r\n}\r\n</style>\r\n"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$s = "data-v-3b0f2894";
+  const __vue_scope_id__$v = "data-v-3b0f2894";
   /* module identifier */
-  const __vue_module_identifier__$s = undefined;
+  const __vue_module_identifier__$v = undefined;
   /* functional template */
-  const __vue_is_functional_template__$s = false;
+  const __vue_is_functional_template__$v = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$s = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$s, staticRenderFns: __vue_staticRenderFns__$s },
-    __vue_inject_styles__$s,
-    __vue_script__$r,
-    __vue_scope_id__$s,
-    __vue_is_functional_template__$s,
-    __vue_module_identifier__$s,
+  const __vue_component__$v = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$v, staticRenderFns: __vue_staticRenderFns__$v },
+    __vue_inject_styles__$v,
+    __vue_script__$t,
+    __vue_scope_id__$v,
+    __vue_is_functional_template__$v,
+    __vue_module_identifier__$v,
     false,
     __vue_create_injector__,
     undefined,
@@ -96365,23 +96203,23 @@ __vue_render__$s._withStripped = true;
 /* script */
 
 /* template */
-var __vue_render__$r = function () {
+var __vue_render__$u = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
   return _c("div", [_vm._v("全屏")])
 };
-var __vue_staticRenderFns__$r = [];
-__vue_render__$r._withStripped = true;
+var __vue_staticRenderFns__$u = [];
+__vue_render__$u._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$r = undefined;
+  const __vue_inject_styles__$u = undefined;
   /* scoped */
-  const __vue_scope_id__$r = undefined;
+  const __vue_scope_id__$u = undefined;
   /* module identifier */
-  const __vue_module_identifier__$r = undefined;
+  const __vue_module_identifier__$u = undefined;
   /* functional template */
-  const __vue_is_functional_template__$r = false;
+  const __vue_is_functional_template__$u = false;
   /* style inject */
   
   /* style inject SSR */
@@ -96390,13 +96228,13 @@ __vue_render__$r._withStripped = true;
   
 
   
-  const __vue_component__$r = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$r, staticRenderFns: __vue_staticRenderFns__$r },
-    __vue_inject_styles__$r,
+  const __vue_component__$u = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$u, staticRenderFns: __vue_staticRenderFns__$u },
+    __vue_inject_styles__$u,
     {},
-    __vue_scope_id__$r,
-    __vue_is_functional_template__$r,
-    __vue_module_identifier__$r,
+    __vue_scope_id__$u,
+    __vue_is_functional_template__$u,
+    __vue_module_identifier__$u,
     false,
     undefined,
     undefined,
@@ -96417,7 +96255,7 @@ __vue_render__$r._withStripped = true;
 //
 //
 
-var script$q = {
+var script$s = {
   data() {
     return {
       sizeOptions: [
@@ -96436,7 +96274,7 @@ var script$q = {
   methods: {
     handleSetSize(size) {
       this.$ELEMENT.size = size;
-      this.$store.dispatch('app/setSize', size);
+      this.$store.dispatch('z-app/setSize', size);
       this.refreshView();
       this.$message({
         message: 'Switch Size Success',
@@ -96445,7 +96283,7 @@ var script$q = {
     },
     refreshView() {
       // In order to make the cached page re-rendered
-      this.$store.dispatch('tagsView/delAllCachedViews', this.$route);
+      this.$store.dispatch('z-tagsView/delAllCachedViews', this.$route);
 
       const { fullPath } = this.$route;
 
@@ -96459,10 +96297,10 @@ var script$q = {
 };
 
 /* script */
-const __vue_script__$q = script$q;
+const __vue_script__$s = script$s;
 
 /* template */
-var __vue_render__$q = function () {
+var __vue_render__$t = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -96491,17 +96329,17 @@ var __vue_render__$q = function () {
     1
   )
 };
-var __vue_staticRenderFns__$q = [];
-__vue_render__$q._withStripped = true;
+var __vue_staticRenderFns__$t = [];
+__vue_render__$t._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$q = undefined;
+  const __vue_inject_styles__$t = undefined;
   /* scoped */
-  const __vue_scope_id__$q = undefined;
+  const __vue_scope_id__$t = undefined;
   /* module identifier */
-  const __vue_module_identifier__$q = undefined;
+  const __vue_module_identifier__$t = undefined;
   /* functional template */
-  const __vue_is_functional_template__$q = false;
+  const __vue_is_functional_template__$t = false;
   /* style inject */
   
   /* style inject SSR */
@@ -96510,13 +96348,13 @@ __vue_render__$q._withStripped = true;
   
 
   
-  const __vue_component__$q = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$q, staticRenderFns: __vue_staticRenderFns__$q },
-    __vue_inject_styles__$q,
-    __vue_script__$q,
-    __vue_scope_id__$q,
-    __vue_is_functional_template__$q,
-    __vue_module_identifier__$q,
+  const __vue_component__$t = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$t, staticRenderFns: __vue_staticRenderFns__$t },
+    __vue_inject_styles__$t,
+    __vue_script__$s,
+    __vue_scope_id__$t,
+    __vue_is_functional_template__$t,
+    __vue_module_identifier__$t,
     false,
     undefined,
     undefined,
@@ -96562,7 +96400,7 @@ var Fuse = /*@__PURE__*/getDefaultExportFromCjs(fuse_minExports);
 //
 
 
-var script$p = {
+var script$r = {
   name: 'HeaderSearch',
   data() {
     return {
@@ -96575,7 +96413,7 @@ var script$p = {
   },
   computed: {
     routes() {
-      return this.$store.state.permission.routes
+      return this.$store.state['z-permission'].routes
     }
   },
   watch: {
@@ -96692,10 +96530,10 @@ var script$p = {
 };
 
 /* script */
-const __vue_script__$p = script$p;
+const __vue_script__$r = script$r;
 
 /* template */
-var __vue_render__$p = function () {
+var __vue_render__$s = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -96736,34 +96574,34 @@ var __vue_render__$p = function () {
     1
   )
 };
-var __vue_staticRenderFns__$p = [];
-__vue_render__$p._withStripped = true;
+var __vue_staticRenderFns__$s = [];
+__vue_render__$s._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$p = function (inject) {
+  const __vue_inject_styles__$s = function (inject) {
     if (!inject) return
-    inject("data-v-37c87e35_0", { source: ".header-search[data-v-37c87e35] {\n  font-size: 0 !important;\n}\n.header-search .search-icon[data-v-37c87e35] {\n  cursor: pointer;\n  font-size: 18px;\n  vertical-align: middle;\n}\n.header-search .header-search-select[data-v-37c87e35] {\n  font-size: 18px;\n  transition: width 0.2s;\n  width: 0;\n  overflow: hidden;\n  background: transparent;\n  border-radius: 0;\n  display: inline-block;\n  vertical-align: middle;\n}\n.header-search .header-search-select[data-v-37c87e35]  .el-input__inner {\n  border-radius: 0;\n  border: 0;\n  padding-left: 0;\n  padding-right: 0;\n  box-shadow: none !important;\n  border-bottom: 1px solid #d9d9d9;\n  vertical-align: middle;\n}\n.header-search.show .header-search-select[data-v-37c87e35] {\n  width: 210px;\n  margin-left: 10px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\HeaderSearch\\index.vue","index.vue"],"names":[],"mappings":"AA4JA;EACA,uBAAA;AC3JA;AD4JA;EACA,eAAA;EACA,eAAA;EACA,sBAAA;AC1JA;AD4JA;EACA,eAAA;EACA,sBAAA;EACA,QAAA;EACA,gBAAA;EACA,uBAAA;EACA,gBAAA;EACA,qBAAA;EACA,sBAAA;AC1JA;AD2JA;EACA,gBAAA;EACA,SAAA;EACA,eAAA;EACA,gBAAA;EACA,2BAAA;EACA,gCAAA;EACA,sBAAA;ACzJA;AD6JA;EACA,YAAA;EACA,iBAAA;AC3JA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div :class=\"{ show: show }\" class=\"header-search\">\r\n    <!--    <z-icon class-name=\"search-icon\" icon-class=\"search\" @click.stop=\"click\" />-->\r\n    <el-select\r\n      ref=\"headerSearchSelect\"\r\n      v-model=\"search\"\r\n      :remote-method=\"querySearch\"\r\n      filterable\r\n      default-first-option\r\n      remote\r\n      placeholder=\"Search\"\r\n      class=\"header-search-select\"\r\n      @change=\"change\"\r\n    >\r\n      <el-option v-for=\"option in options\" :key=\"option.item.path\" :value=\"option.item\" :label=\"option.item.title.join(' > ')\" />\r\n    </el-select>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n// fuse is a lightweight fuzzy-search module\r\n// make search results more in line with expectations\r\nimport Fuse from 'fuse.js/dist/fuse.min.js'\r\nimport path from '../../../../utils/utils'\r\n\r\nexport default {\r\n  name: 'HeaderSearch',\r\n  data() {\r\n    return {\r\n      search: '',\r\n      options: [],\r\n      searchPool: [],\r\n      show: false,\r\n      fuse: undefined\r\n    }\r\n  },\r\n  computed: {\r\n    routes() {\r\n      return this.$store.state.permission.routes\r\n    }\r\n  },\r\n  watch: {\r\n    routes() {\r\n      // this.searchPool = this.generateRoutes(this.routes)\r\n    },\r\n    searchPool(list) {\r\n      // this.initFuse(list)\r\n    },\r\n    show(value) {\r\n      if (value) {\r\n        document.body.addEventListener('click', this.close)\r\n      } else {\r\n        document.body.removeEventListener('click', this.close)\r\n      }\r\n    }\r\n  },\r\n  mounted() {\r\n    // this.searchPool = this.generateRoutes(this.routes)\r\n  },\r\n  methods: {\r\n    click() {\r\n      this.show = !this.show\r\n      if (this.show) {\r\n        this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus()\r\n      }\r\n    },\r\n    close() {\r\n      this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur()\r\n      this.options = []\r\n      this.show = false\r\n    },\r\n    change(val) {\r\n      const path = val.path\r\n      if (this.ishttp(val.path)) {\r\n        // http(s):// 路径新窗口打开\r\n        const pindex = path.indexOf('http')\r\n        window.open(path.substr(pindex, path.length), '_blank')\r\n      } else {\r\n        this.$router.push(val.path)\r\n      }\r\n      this.search = ''\r\n      this.options = []\r\n      this.$nextTick(() => {\r\n        this.show = false\r\n      })\r\n    },\r\n    initFuse(list) {\r\n      this.fuse = new Fuse(list, {\r\n        shouldSort: true,\r\n        threshold: 0.4,\r\n        location: 0,\r\n        distance: 100,\r\n        minMatchCharLength: 1,\r\n        keys: [\r\n          {\r\n            name: 'title',\r\n            weight: 0.7\r\n          },\r\n          {\r\n            name: 'path',\r\n            weight: 0.3\r\n          }\r\n        ]\r\n      })\r\n    },\r\n    // Filter out the routes that can be displayed in the sidebar\r\n    // And generate the internationalized title\r\n    generateRoutes(routes, basePath = '/', prefixTitle = []) {\r\n      let res = []\r\n\r\n      for (const router of routes) {\r\n        // skip hidden router\r\n        if (router.hidden) {\r\n          continue\r\n        }\r\n\r\n        const data = {\r\n          path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,\r\n          title: [...prefixTitle]\r\n        }\r\n\r\n        if (router.meta && router.meta.title) {\r\n          data.title = [...data.title, router.meta.title]\r\n\r\n          if (router.redirect !== 'noRedirect') {\r\n            // only push the routes with title\r\n            // special case: need to exclude parent router without redirect\r\n            res.push(data)\r\n          }\r\n        }\r\n\r\n        // recursive child routes\r\n        if (router.children) {\r\n          const tempRoutes = this.generateRoutes(router.children, data.path, data.title)\r\n          if (tempRoutes.length >= 1) {\r\n            res = [...res, ...tempRoutes]\r\n          }\r\n        }\r\n      }\r\n      return res\r\n    },\r\n    querySearch(query) {\r\n      if (query !== '') {\r\n        this.options = this.fuse.search(query)\r\n      } else {\r\n        this.options = []\r\n      }\r\n    },\r\n    ishttp(url) {\r\n      return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.header-search {\r\n  font-size: 0 !important;\r\n  .search-icon {\r\n    cursor: pointer;\r\n    font-size: 18px;\r\n    vertical-align: middle;\r\n  }\r\n  .header-search-select {\r\n    font-size: 18px;\r\n    transition: width 0.2s;\r\n    width: 0;\r\n    overflow: hidden;\r\n    background: transparent;\r\n    border-radius: 0;\r\n    display: inline-block;\r\n    vertical-align: middle;\r\n    ::v-deep .el-input__inner {\r\n      border-radius: 0;\r\n      border: 0;\r\n      padding-left: 0;\r\n      padding-right: 0;\r\n      box-shadow: none !important;\r\n      border-bottom: 1px solid #d9d9d9;\r\n      vertical-align: middle;\r\n    }\r\n  }\r\n  &.show {\r\n    .header-search-select {\r\n      width: 210px;\r\n      margin-left: 10px;\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".header-search {\n  font-size: 0 !important;\n}\n.header-search .search-icon {\n  cursor: pointer;\n  font-size: 18px;\n  vertical-align: middle;\n}\n.header-search .header-search-select {\n  font-size: 18px;\n  transition: width 0.2s;\n  width: 0;\n  overflow: hidden;\n  background: transparent;\n  border-radius: 0;\n  display: inline-block;\n  vertical-align: middle;\n}\n.header-search .header-search-select ::v-deep .el-input__inner {\n  border-radius: 0;\n  border: 0;\n  padding-left: 0;\n  padding-right: 0;\n  box-shadow: none !important;\n  border-bottom: 1px solid #d9d9d9;\n  vertical-align: middle;\n}\n.header-search.show .header-search-select {\n  width: 210px;\n  margin-left: 10px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+    inject("data-v-b6965cc4_0", { source: ".header-search[data-v-b6965cc4] {\n  font-size: 0 !important;\n}\n.header-search .search-icon[data-v-b6965cc4] {\n  cursor: pointer;\n  font-size: 18px;\n  vertical-align: middle;\n}\n.header-search .header-search-select[data-v-b6965cc4] {\n  font-size: 18px;\n  transition: width 0.2s;\n  width: 0;\n  overflow: hidden;\n  background: transparent;\n  border-radius: 0;\n  display: inline-block;\n  vertical-align: middle;\n}\n.header-search .header-search-select[data-v-b6965cc4]  .el-input__inner {\n  border-radius: 0;\n  border: 0;\n  padding-left: 0;\n  padding-right: 0;\n  box-shadow: none !important;\n  border-bottom: 1px solid #d9d9d9;\n  vertical-align: middle;\n}\n.header-search.show .header-search-select[data-v-b6965cc4] {\n  width: 210px;\n  margin-left: 10px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\HeaderSearch\\index.vue","index.vue"],"names":[],"mappings":"AA4JA;EACA,uBAAA;AC3JA;AD4JA;EACA,eAAA;EACA,eAAA;EACA,sBAAA;AC1JA;AD4JA;EACA,eAAA;EACA,sBAAA;EACA,QAAA;EACA,gBAAA;EACA,uBAAA;EACA,gBAAA;EACA,qBAAA;EACA,sBAAA;AC1JA;AD2JA;EACA,gBAAA;EACA,SAAA;EACA,eAAA;EACA,gBAAA;EACA,2BAAA;EACA,gCAAA;EACA,sBAAA;ACzJA;AD6JA;EACA,YAAA;EACA,iBAAA;AC3JA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div :class=\"{ show: show }\" class=\"header-search\">\r\n    <!--    <z-icon class-name=\"search-icon\" icon-class=\"search\" @click.stop=\"click\" />-->\r\n    <el-select\r\n      ref=\"headerSearchSelect\"\r\n      v-model=\"search\"\r\n      :remote-method=\"querySearch\"\r\n      filterable\r\n      default-first-option\r\n      remote\r\n      placeholder=\"Search\"\r\n      class=\"header-search-select\"\r\n      @change=\"change\"\r\n    >\r\n      <el-option v-for=\"option in options\" :key=\"option.item.path\" :value=\"option.item\" :label=\"option.item.title.join(' > ')\" />\r\n    </el-select>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n// fuse is a lightweight fuzzy-search module\r\n// make search results more in line with expectations\r\nimport Fuse from 'fuse.js/dist/fuse.min.js'\r\nimport path from '../../../../utils/utils'\r\n\r\nexport default {\r\n  name: 'HeaderSearch',\r\n  data() {\r\n    return {\r\n      search: '',\r\n      options: [],\r\n      searchPool: [],\r\n      show: false,\r\n      fuse: undefined\r\n    }\r\n  },\r\n  computed: {\r\n    routes() {\r\n      return this.$store.state['z-permission'].routes\r\n    }\r\n  },\r\n  watch: {\r\n    routes() {\r\n      // this.searchPool = this.generateRoutes(this.routes)\r\n    },\r\n    searchPool(list) {\r\n      // this.initFuse(list)\r\n    },\r\n    show(value) {\r\n      if (value) {\r\n        document.body.addEventListener('click', this.close)\r\n      } else {\r\n        document.body.removeEventListener('click', this.close)\r\n      }\r\n    }\r\n  },\r\n  mounted() {\r\n    // this.searchPool = this.generateRoutes(this.routes)\r\n  },\r\n  methods: {\r\n    click() {\r\n      this.show = !this.show\r\n      if (this.show) {\r\n        this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus()\r\n      }\r\n    },\r\n    close() {\r\n      this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur()\r\n      this.options = []\r\n      this.show = false\r\n    },\r\n    change(val) {\r\n      const path = val.path\r\n      if (this.ishttp(val.path)) {\r\n        // http(s):// 路径新窗口打开\r\n        const pindex = path.indexOf('http')\r\n        window.open(path.substr(pindex, path.length), '_blank')\r\n      } else {\r\n        this.$router.push(val.path)\r\n      }\r\n      this.search = ''\r\n      this.options = []\r\n      this.$nextTick(() => {\r\n        this.show = false\r\n      })\r\n    },\r\n    initFuse(list) {\r\n      this.fuse = new Fuse(list, {\r\n        shouldSort: true,\r\n        threshold: 0.4,\r\n        location: 0,\r\n        distance: 100,\r\n        minMatchCharLength: 1,\r\n        keys: [\r\n          {\r\n            name: 'title',\r\n            weight: 0.7\r\n          },\r\n          {\r\n            name: 'path',\r\n            weight: 0.3\r\n          }\r\n        ]\r\n      })\r\n    },\r\n    // Filter out the routes that can be displayed in the sidebar\r\n    // And generate the internationalized title\r\n    generateRoutes(routes, basePath = '/', prefixTitle = []) {\r\n      let res = []\r\n\r\n      for (const router of routes) {\r\n        // skip hidden router\r\n        if (router.hidden) {\r\n          continue\r\n        }\r\n\r\n        const data = {\r\n          path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,\r\n          title: [...prefixTitle]\r\n        }\r\n\r\n        if (router.meta && router.meta.title) {\r\n          data.title = [...data.title, router.meta.title]\r\n\r\n          if (router.redirect !== 'noRedirect') {\r\n            // only push the routes with title\r\n            // special case: need to exclude parent router without redirect\r\n            res.push(data)\r\n          }\r\n        }\r\n\r\n        // recursive child routes\r\n        if (router.children) {\r\n          const tempRoutes = this.generateRoutes(router.children, data.path, data.title)\r\n          if (tempRoutes.length >= 1) {\r\n            res = [...res, ...tempRoutes]\r\n          }\r\n        }\r\n      }\r\n      return res\r\n    },\r\n    querySearch(query) {\r\n      if (query !== '') {\r\n        this.options = this.fuse.search(query)\r\n      } else {\r\n        this.options = []\r\n      }\r\n    },\r\n    ishttp(url) {\r\n      return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.header-search {\r\n  font-size: 0 !important;\r\n  .search-icon {\r\n    cursor: pointer;\r\n    font-size: 18px;\r\n    vertical-align: middle;\r\n  }\r\n  .header-search-select {\r\n    font-size: 18px;\r\n    transition: width 0.2s;\r\n    width: 0;\r\n    overflow: hidden;\r\n    background: transparent;\r\n    border-radius: 0;\r\n    display: inline-block;\r\n    vertical-align: middle;\r\n    ::v-deep .el-input__inner {\r\n      border-radius: 0;\r\n      border: 0;\r\n      padding-left: 0;\r\n      padding-right: 0;\r\n      box-shadow: none !important;\r\n      border-bottom: 1px solid #d9d9d9;\r\n      vertical-align: middle;\r\n    }\r\n  }\r\n  &.show {\r\n    .header-search-select {\r\n      width: 210px;\r\n      margin-left: 10px;\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".header-search {\n  font-size: 0 !important;\n}\n.header-search .search-icon {\n  cursor: pointer;\n  font-size: 18px;\n  vertical-align: middle;\n}\n.header-search .header-search-select {\n  font-size: 18px;\n  transition: width 0.2s;\n  width: 0;\n  overflow: hidden;\n  background: transparent;\n  border-radius: 0;\n  display: inline-block;\n  vertical-align: middle;\n}\n.header-search .header-search-select ::v-deep .el-input__inner {\n  border-radius: 0;\n  border: 0;\n  padding-left: 0;\n  padding-right: 0;\n  box-shadow: none !important;\n  border-bottom: 1px solid #d9d9d9;\n  vertical-align: middle;\n}\n.header-search.show .header-search-select {\n  width: 210px;\n  margin-left: 10px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$p = "data-v-37c87e35";
+  const __vue_scope_id__$s = "data-v-b6965cc4";
   /* module identifier */
-  const __vue_module_identifier__$p = undefined;
+  const __vue_module_identifier__$s = undefined;
   /* functional template */
-  const __vue_is_functional_template__$p = false;
+  const __vue_is_functional_template__$s = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$p = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$p, staticRenderFns: __vue_staticRenderFns__$p },
-    __vue_inject_styles__$p,
-    __vue_script__$p,
-    __vue_scope_id__$p,
-    __vue_is_functional_template__$p,
-    __vue_module_identifier__$p,
+  const __vue_component__$s = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$s, staticRenderFns: __vue_staticRenderFns__$s },
+    __vue_inject_styles__$s,
+    __vue_script__$r,
+    __vue_scope_id__$s,
+    __vue_is_functional_template__$s,
+    __vue_module_identifier__$s,
     false,
     __vue_create_injector__,
     undefined,
@@ -96811,24 +96649,24 @@ __vue_render__$p._withStripped = true;
 //
 
 
-var script$o = {
+var script$q = {
   components: {
-    Breadcrumb: __vue_component__$u,
-    TopNav: __vue_component__$t,
-    Hamburger: __vue_component__$s,
-    Screenfull: __vue_component__$r,
-    SizeSelect: __vue_component__$q,
-    Search: __vue_component__$p
+    Breadcrumb: __vue_component__$x,
+    TopNav: __vue_component__$w,
+    Hamburger: __vue_component__$v,
+    Screenfull: __vue_component__$u,
+    SizeSelect: __vue_component__$t,
+    Search: __vue_component__$s
   },
   computed: {
-    ...mapState('app', ['sidebar', 'device']),
-    ...mapState('user', ['avatar']),
+    ...mapState('z-app', ['sidebar', 'device']),
+    ...mapState('z-user', ['avatar']),
     setting: {
       get() {
-        return this.$store.state.settings.showSettings
+        return this.$store.state['z-settings'].showSettings
       },
       set(val) {
-        this.$store.dispatch('settings/changeSetting', {
+        this.$store.dispatch('z-settings/changeSetting', {
           key: 'showSettings',
           value: val
         });
@@ -96836,13 +96674,13 @@ var script$o = {
     },
     topNav: {
       get() {
-        return this.$store.state.settings.topNav
+        return this.$store.state['z-settings'].topNav
       }
     }
   },
   methods: {
     toggleSideBar() {
-      this.$store.dispatch('app/toggleSideBar');
+      this.$store.dispatch('z-app/toggleSideBar');
     },
     async logout() {
       this.$confirm('确定注销并退出系统吗？', '提示', {
@@ -96861,10 +96699,10 @@ var script$o = {
 };
 
 /* script */
-const __vue_script__$o = script$o;
+const __vue_script__$q = script$q;
 
 /* template */
-var __vue_render__$o = function () {
+var __vue_render__$r = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -96934,34 +96772,34 @@ var __vue_render__$o = function () {
     1
   )
 };
-var __vue_staticRenderFns__$o = [];
-__vue_render__$o._withStripped = true;
+var __vue_staticRenderFns__$r = [];
+__vue_render__$r._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$o = function (inject) {
+  const __vue_inject_styles__$r = function (inject) {
     if (!inject) return
-    inject("data-v-8fbc56cc_0", { source: ".navbar[data-v-8fbc56cc] {\n  height: 50px;\n  overflow: hidden;\n  position: relative;\n  background: #fff;\n  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);\n}\n.navbar .hamburger-container[data-v-8fbc56cc] {\n  line-height: 46px;\n  height: 100%;\n  float: left;\n  cursor: pointer;\n  transition: background 0.3s;\n  -webkit-tap-highlight-color: transparent;\n}\n.navbar .hamburger-container[data-v-8fbc56cc]:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .breadcrumb-container[data-v-8fbc56cc] {\n  float: left;\n}\n.navbar .topmenu-container[data-v-8fbc56cc] {\n  position: absolute;\n  left: 50px;\n}\n.navbar .errLog-container[data-v-8fbc56cc] {\n  display: inline-block;\n  vertical-align: top;\n}\n.navbar .right-menu[data-v-8fbc56cc] {\n  float: right;\n  height: 100%;\n  line-height: 50px;\n}\n.navbar .right-menu[data-v-8fbc56cc]:focus {\n  outline: none;\n}\n.navbar .right-menu .right-menu-item[data-v-8fbc56cc] {\n  display: inline-block;\n  padding: 0 8px;\n  height: 100%;\n  font-size: 18px;\n  color: #5a5e66;\n  vertical-align: text-bottom;\n}\n.navbar .right-menu .right-menu-item.hover-effect[data-v-8fbc56cc] {\n  cursor: pointer;\n  transition: background 0.3s;\n}\n.navbar .right-menu .right-menu-item.hover-effect[data-v-8fbc56cc]:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .right-menu .avatar-container[data-v-8fbc56cc] {\n  margin-right: 30px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper[data-v-8fbc56cc] {\n  margin-top: 5px;\n  position: relative;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .user-avatar[data-v-8fbc56cc] {\n  cursor: pointer;\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .el-icon-caret-bottom[data-v-8fbc56cc] {\n  cursor: pointer;\n  position: absolute;\n  right: -20px;\n  top: 25px;\n  font-size: 12px;\n}\n\n/*# sourceMappingURL=Navbar.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Navbar.vue","Navbar.vue"],"names":[],"mappings":"AAmGA;EACA,YAAA;EACA,gBAAA;EACA,kBAAA;EACA,gBAAA;EACA,2CAAA;AClGA;ADmGA;EACA,iBAAA;EACA,YAAA;EACA,WAAA;EACA,eAAA;EACA,2BAAA;EACA,wCAAA;ACjGA;ADkGA;EACA,gCAAA;AChGA;ADmGA;EACA,WAAA;ACjGA;ADmGA;EACA,kBAAA;EACA,UAAA;ACjGA;ADmGA;EACA,qBAAA;EACA,mBAAA;ACjGA;ADmGA;EACA,YAAA;EACA,YAAA;EACA,iBAAA;ACjGA;ADkGA;EACA,aAAA;AChGA;ADkGA;EACA,qBAAA;EACA,cAAA;EACA,YAAA;EACA,eAAA;EACA,cAAA;EACA,2BAAA;AChGA;ADiGA;EACA,eAAA;EACA,2BAAA;AC/FA;ADgGA;EACA,gCAAA;AC9FA;ADkGA;EACA,kBAAA;AChGA;ADiGA;EACA,eAAA;EACA,kBAAA;AC/FA;ADgGA;EACA,eAAA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;AC9FA;ADgGA;EACA,eAAA;EACA,kBAAA;EACA,YAAA;EACA,SAAA;EACA,eAAA;AC9FA;;AAEA,qCAAqC","file":"Navbar.vue","sourcesContent":["<template>\r\n  <div class=\"navbar\">\r\n    <hamburger id=\"hamburger-container\" :is-active=\"sidebar.opened\" class=\"hamburger-container\" @toggleClick=\"toggleSideBar\" />\r\n\r\n    <breadcrumb id=\"breadcrumb-container\" class=\"breadcrumb-container\" v-if=\"!topNav\" />\r\n    <top-nav id=\"topmenu-container\" class=\"topmenu-container\" v-if=\"topNav\" />\r\n\r\n    <div class=\"right-menu\">\r\n      <template v-if=\"device !== 'mobile'\">\r\n        <search id=\"header-search\" class=\"right-menu-item\" />\r\n\r\n        <screenfull id=\"screenfull\" class=\"right-menu-item hover-effect\" />\r\n\r\n        <el-tooltip content=\"布局大小\" effect=\"dark\" placement=\"bottom\">\r\n          <size-select id=\"size-select\" class=\"right-menu-item hover-effect\" />\r\n        </el-tooltip>\r\n      </template>\r\n\r\n      <!--      <el-dropdown class=\"avatar-container right-menu-item hover-effect\" trigger=\"click\">-->\r\n      <!--        <div class=\"avatar-wrapper\">-->\r\n      <!--          <img :src=\"avatar\" class=\"user-avatar\" />-->\r\n      <!--          <i class=\"el-icon-caret-bottom\" />-->\r\n      <!--        </div>-->\r\n      <!--        <el-dropdown-menu slot=\"dropdown\">-->\r\n      <!--          <router-link to=\"/user/profile\">-->\r\n      <!--            <el-dropdown-item>个人中心</el-dropdown-item>-->\r\n      <!--          </router-link>-->\r\n      <!--          <el-dropdown-item @click.native=\"setting = true\">-->\r\n      <!--            <span>布局设置</span>-->\r\n      <!--          </el-dropdown-item>-->\r\n      <!--          <el-dropdown-item divided @click.native=\"logout\">-->\r\n      <!--            <span>退出登录</span>-->\r\n      <!--          </el-dropdown-item>-->\r\n      <!--        </el-dropdown-menu>-->\r\n      <!--      </el-dropdown>-->\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex'\r\nimport Breadcrumb from './Breadcrumb/index.vue'\r\nimport TopNav from './TopNav/index.vue'\r\nimport Hamburger from './Hamburger/index.vue'\r\nimport Screenfull from './Screenfull/index.vue'\r\nimport SizeSelect from './SizeSelect/index.vue'\r\nimport Search from './HeaderSearch/index.vue'\r\n\r\nexport default {\r\n  components: {\r\n    Breadcrumb,\r\n    TopNav,\r\n    Hamburger,\r\n    Screenfull,\r\n    SizeSelect,\r\n    Search\r\n  },\r\n  computed: {\r\n    ...mapState('app', ['sidebar', 'device']),\r\n    ...mapState('user', ['avatar']),\r\n    setting: {\r\n      get() {\r\n        return this.$store.state.settings.showSettings\r\n      },\r\n      set(val) {\r\n        this.$store.dispatch('settings/changeSetting', {\r\n          key: 'showSettings',\r\n          value: val\r\n        })\r\n      }\r\n    },\r\n    topNav: {\r\n      get() {\r\n        return this.$store.state.settings.topNav\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    toggleSideBar() {\r\n      this.$store.dispatch('app/toggleSideBar')\r\n    },\r\n    async logout() {\r\n      this.$confirm('确定注销并退出系统吗？', '提示', {\r\n        confirmButtonText: '确定',\r\n        cancelButtonText: '取消',\r\n        type: 'warning'\r\n      })\r\n        .then(() => {\r\n          this.$store.dispatch('LogOut').then(() => {\r\n            location.href = '/index'\r\n          })\r\n        })\r\n        .catch(() => {})\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.navbar {\r\n  height: 50px;\r\n  overflow: hidden;\r\n  position: relative;\r\n  background: #fff;\r\n  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);\r\n  .hamburger-container {\r\n    line-height: 46px;\r\n    height: 100%;\r\n    float: left;\r\n    cursor: pointer;\r\n    transition: background 0.3s;\r\n    -webkit-tap-highlight-color: transparent;\r\n    &:hover {\r\n      background: rgba(0, 0, 0, 0.025);\r\n    }\r\n  }\r\n  .breadcrumb-container {\r\n    float: left;\r\n  }\r\n  .topmenu-container {\r\n    position: absolute;\r\n    left: 50px;\r\n  }\r\n  .errLog-container {\r\n    display: inline-block;\r\n    vertical-align: top;\r\n  }\r\n  .right-menu {\r\n    float: right;\r\n    height: 100%;\r\n    line-height: 50px;\r\n    &:focus {\r\n      outline: none;\r\n    }\r\n    .right-menu-item {\r\n      display: inline-block;\r\n      padding: 0 8px;\r\n      height: 100%;\r\n      font-size: 18px;\r\n      color: #5a5e66;\r\n      vertical-align: text-bottom;\r\n      &.hover-effect {\r\n        cursor: pointer;\r\n        transition: background 0.3s;\r\n        &:hover {\r\n          background: rgba(0, 0, 0, 0.025);\r\n        }\r\n      }\r\n    }\r\n    .avatar-container {\r\n      margin-right: 30px;\r\n      .avatar-wrapper {\r\n        margin-top: 5px;\r\n        position: relative;\r\n        .user-avatar {\r\n          cursor: pointer;\r\n          width: 40px;\r\n          height: 40px;\r\n          border-radius: 10px;\r\n        }\r\n        .el-icon-caret-bottom {\r\n          cursor: pointer;\r\n          position: absolute;\r\n          right: -20px;\r\n          top: 25px;\r\n          font-size: 12px;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".navbar {\n  height: 50px;\n  overflow: hidden;\n  position: relative;\n  background: #fff;\n  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);\n}\n.navbar .hamburger-container {\n  line-height: 46px;\n  height: 100%;\n  float: left;\n  cursor: pointer;\n  transition: background 0.3s;\n  -webkit-tap-highlight-color: transparent;\n}\n.navbar .hamburger-container:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .breadcrumb-container {\n  float: left;\n}\n.navbar .topmenu-container {\n  position: absolute;\n  left: 50px;\n}\n.navbar .errLog-container {\n  display: inline-block;\n  vertical-align: top;\n}\n.navbar .right-menu {\n  float: right;\n  height: 100%;\n  line-height: 50px;\n}\n.navbar .right-menu:focus {\n  outline: none;\n}\n.navbar .right-menu .right-menu-item {\n  display: inline-block;\n  padding: 0 8px;\n  height: 100%;\n  font-size: 18px;\n  color: #5a5e66;\n  vertical-align: text-bottom;\n}\n.navbar .right-menu .right-menu-item.hover-effect {\n  cursor: pointer;\n  transition: background 0.3s;\n}\n.navbar .right-menu .right-menu-item.hover-effect:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .right-menu .avatar-container {\n  margin-right: 30px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper {\n  margin-top: 5px;\n  position: relative;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .user-avatar {\n  cursor: pointer;\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .el-icon-caret-bottom {\n  cursor: pointer;\n  position: absolute;\n  right: -20px;\n  top: 25px;\n  font-size: 12px;\n}\n\n/*# sourceMappingURL=Navbar.vue.map */"]}, media: undefined });
+    inject("data-v-4f3f513a_0", { source: ".navbar[data-v-4f3f513a] {\n  height: 50px;\n  overflow: hidden;\n  position: relative;\n  background: #fff;\n  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);\n}\n.navbar .hamburger-container[data-v-4f3f513a] {\n  line-height: 46px;\n  height: 100%;\n  float: left;\n  cursor: pointer;\n  transition: background 0.3s;\n  -webkit-tap-highlight-color: transparent;\n}\n.navbar .hamburger-container[data-v-4f3f513a]:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .breadcrumb-container[data-v-4f3f513a] {\n  float: left;\n}\n.navbar .topmenu-container[data-v-4f3f513a] {\n  position: absolute;\n  left: 50px;\n}\n.navbar .errLog-container[data-v-4f3f513a] {\n  display: inline-block;\n  vertical-align: top;\n}\n.navbar .right-menu[data-v-4f3f513a] {\n  float: right;\n  height: 100%;\n  line-height: 50px;\n}\n.navbar .right-menu[data-v-4f3f513a]:focus {\n  outline: none;\n}\n.navbar .right-menu .right-menu-item[data-v-4f3f513a] {\n  display: inline-block;\n  padding: 0 8px;\n  height: 100%;\n  font-size: 18px;\n  color: #5a5e66;\n  vertical-align: text-bottom;\n}\n.navbar .right-menu .right-menu-item.hover-effect[data-v-4f3f513a] {\n  cursor: pointer;\n  transition: background 0.3s;\n}\n.navbar .right-menu .right-menu-item.hover-effect[data-v-4f3f513a]:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .right-menu .avatar-container[data-v-4f3f513a] {\n  margin-right: 30px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper[data-v-4f3f513a] {\n  margin-top: 5px;\n  position: relative;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .user-avatar[data-v-4f3f513a] {\n  cursor: pointer;\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .el-icon-caret-bottom[data-v-4f3f513a] {\n  cursor: pointer;\n  position: absolute;\n  right: -20px;\n  top: 25px;\n  font-size: 12px;\n}\n\n/*# sourceMappingURL=Navbar.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Navbar.vue","Navbar.vue"],"names":[],"mappings":"AAmGA;EACA,YAAA;EACA,gBAAA;EACA,kBAAA;EACA,gBAAA;EACA,2CAAA;AClGA;ADmGA;EACA,iBAAA;EACA,YAAA;EACA,WAAA;EACA,eAAA;EACA,2BAAA;EACA,wCAAA;ACjGA;ADkGA;EACA,gCAAA;AChGA;ADmGA;EACA,WAAA;ACjGA;ADmGA;EACA,kBAAA;EACA,UAAA;ACjGA;ADmGA;EACA,qBAAA;EACA,mBAAA;ACjGA;ADmGA;EACA,YAAA;EACA,YAAA;EACA,iBAAA;ACjGA;ADkGA;EACA,aAAA;AChGA;ADkGA;EACA,qBAAA;EACA,cAAA;EACA,YAAA;EACA,eAAA;EACA,cAAA;EACA,2BAAA;AChGA;ADiGA;EACA,eAAA;EACA,2BAAA;AC/FA;ADgGA;EACA,gCAAA;AC9FA;ADkGA;EACA,kBAAA;AChGA;ADiGA;EACA,eAAA;EACA,kBAAA;AC/FA;ADgGA;EACA,eAAA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;AC9FA;ADgGA;EACA,eAAA;EACA,kBAAA;EACA,YAAA;EACA,SAAA;EACA,eAAA;AC9FA;;AAEA,qCAAqC","file":"Navbar.vue","sourcesContent":["<template>\r\n  <div class=\"navbar\">\r\n    <hamburger id=\"hamburger-container\" :is-active=\"sidebar.opened\" class=\"hamburger-container\" @toggleClick=\"toggleSideBar\" />\r\n\r\n    <breadcrumb id=\"breadcrumb-container\" class=\"breadcrumb-container\" v-if=\"!topNav\" />\r\n    <top-nav id=\"topmenu-container\" class=\"topmenu-container\" v-if=\"topNav\" />\r\n\r\n    <div class=\"right-menu\">\r\n      <template v-if=\"device !== 'mobile'\">\r\n        <search id=\"header-search\" class=\"right-menu-item\" />\r\n\r\n        <screenfull id=\"screenfull\" class=\"right-menu-item hover-effect\" />\r\n\r\n        <el-tooltip content=\"布局大小\" effect=\"dark\" placement=\"bottom\">\r\n          <size-select id=\"size-select\" class=\"right-menu-item hover-effect\" />\r\n        </el-tooltip>\r\n      </template>\r\n\r\n      <!--      <el-dropdown class=\"avatar-container right-menu-item hover-effect\" trigger=\"click\">-->\r\n      <!--        <div class=\"avatar-wrapper\">-->\r\n      <!--          <img :src=\"avatar\" class=\"user-avatar\" />-->\r\n      <!--          <i class=\"el-icon-caret-bottom\" />-->\r\n      <!--        </div>-->\r\n      <!--        <el-dropdown-menu slot=\"dropdown\">-->\r\n      <!--          <router-link to=\"/user/profile\">-->\r\n      <!--            <el-dropdown-item>个人中心</el-dropdown-item>-->\r\n      <!--          </router-link>-->\r\n      <!--          <el-dropdown-item @click.native=\"setting = true\">-->\r\n      <!--            <span>布局设置</span>-->\r\n      <!--          </el-dropdown-item>-->\r\n      <!--          <el-dropdown-item divided @click.native=\"logout\">-->\r\n      <!--            <span>退出登录</span>-->\r\n      <!--          </el-dropdown-item>-->\r\n      <!--        </el-dropdown-menu>-->\r\n      <!--      </el-dropdown>-->\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex'\r\nimport Breadcrumb from './Breadcrumb/index.vue'\r\nimport TopNav from './TopNav/index.vue'\r\nimport Hamburger from './Hamburger/index.vue'\r\nimport Screenfull from './Screenfull/index.vue'\r\nimport SizeSelect from './SizeSelect/index.vue'\r\nimport Search from './HeaderSearch/index.vue'\r\n\r\nexport default {\r\n  components: {\r\n    Breadcrumb,\r\n    TopNav,\r\n    Hamburger,\r\n    Screenfull,\r\n    SizeSelect,\r\n    Search\r\n  },\r\n  computed: {\r\n    ...mapState('z-app', ['sidebar', 'device']),\r\n    ...mapState('z-user', ['avatar']),\r\n    setting: {\r\n      get() {\r\n        return this.$store.state['z-settings'].showSettings\r\n      },\r\n      set(val) {\r\n        this.$store.dispatch('z-settings/changeSetting', {\r\n          key: 'showSettings',\r\n          value: val\r\n        })\r\n      }\r\n    },\r\n    topNav: {\r\n      get() {\r\n        return this.$store.state['z-settings'].topNav\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    toggleSideBar() {\r\n      this.$store.dispatch('z-app/toggleSideBar')\r\n    },\r\n    async logout() {\r\n      this.$confirm('确定注销并退出系统吗？', '提示', {\r\n        confirmButtonText: '确定',\r\n        cancelButtonText: '取消',\r\n        type: 'warning'\r\n      })\r\n        .then(() => {\r\n          this.$store.dispatch('LogOut').then(() => {\r\n            location.href = '/index'\r\n          })\r\n        })\r\n        .catch(() => {})\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.navbar {\r\n  height: 50px;\r\n  overflow: hidden;\r\n  position: relative;\r\n  background: #fff;\r\n  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);\r\n  .hamburger-container {\r\n    line-height: 46px;\r\n    height: 100%;\r\n    float: left;\r\n    cursor: pointer;\r\n    transition: background 0.3s;\r\n    -webkit-tap-highlight-color: transparent;\r\n    &:hover {\r\n      background: rgba(0, 0, 0, 0.025);\r\n    }\r\n  }\r\n  .breadcrumb-container {\r\n    float: left;\r\n  }\r\n  .topmenu-container {\r\n    position: absolute;\r\n    left: 50px;\r\n  }\r\n  .errLog-container {\r\n    display: inline-block;\r\n    vertical-align: top;\r\n  }\r\n  .right-menu {\r\n    float: right;\r\n    height: 100%;\r\n    line-height: 50px;\r\n    &:focus {\r\n      outline: none;\r\n    }\r\n    .right-menu-item {\r\n      display: inline-block;\r\n      padding: 0 8px;\r\n      height: 100%;\r\n      font-size: 18px;\r\n      color: #5a5e66;\r\n      vertical-align: text-bottom;\r\n      &.hover-effect {\r\n        cursor: pointer;\r\n        transition: background 0.3s;\r\n        &:hover {\r\n          background: rgba(0, 0, 0, 0.025);\r\n        }\r\n      }\r\n    }\r\n    .avatar-container {\r\n      margin-right: 30px;\r\n      .avatar-wrapper {\r\n        margin-top: 5px;\r\n        position: relative;\r\n        .user-avatar {\r\n          cursor: pointer;\r\n          width: 40px;\r\n          height: 40px;\r\n          border-radius: 10px;\r\n        }\r\n        .el-icon-caret-bottom {\r\n          cursor: pointer;\r\n          position: absolute;\r\n          right: -20px;\r\n          top: 25px;\r\n          font-size: 12px;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".navbar {\n  height: 50px;\n  overflow: hidden;\n  position: relative;\n  background: #fff;\n  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);\n}\n.navbar .hamburger-container {\n  line-height: 46px;\n  height: 100%;\n  float: left;\n  cursor: pointer;\n  transition: background 0.3s;\n  -webkit-tap-highlight-color: transparent;\n}\n.navbar .hamburger-container:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .breadcrumb-container {\n  float: left;\n}\n.navbar .topmenu-container {\n  position: absolute;\n  left: 50px;\n}\n.navbar .errLog-container {\n  display: inline-block;\n  vertical-align: top;\n}\n.navbar .right-menu {\n  float: right;\n  height: 100%;\n  line-height: 50px;\n}\n.navbar .right-menu:focus {\n  outline: none;\n}\n.navbar .right-menu .right-menu-item {\n  display: inline-block;\n  padding: 0 8px;\n  height: 100%;\n  font-size: 18px;\n  color: #5a5e66;\n  vertical-align: text-bottom;\n}\n.navbar .right-menu .right-menu-item.hover-effect {\n  cursor: pointer;\n  transition: background 0.3s;\n}\n.navbar .right-menu .right-menu-item.hover-effect:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n.navbar .right-menu .avatar-container {\n  margin-right: 30px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper {\n  margin-top: 5px;\n  position: relative;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .user-avatar {\n  cursor: pointer;\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n}\n.navbar .right-menu .avatar-container .avatar-wrapper .el-icon-caret-bottom {\n  cursor: pointer;\n  position: absolute;\n  right: -20px;\n  top: 25px;\n  font-size: 12px;\n}\n\n/*# sourceMappingURL=Navbar.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$o = "data-v-8fbc56cc";
+  const __vue_scope_id__$r = "data-v-4f3f513a";
   /* module identifier */
-  const __vue_module_identifier__$o = undefined;
+  const __vue_module_identifier__$r = undefined;
   /* functional template */
-  const __vue_is_functional_template__$o = false;
+  const __vue_is_functional_template__$r = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$o = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$o, staticRenderFns: __vue_staticRenderFns__$o },
-    __vue_inject_styles__$o,
-    __vue_script__$o,
-    __vue_scope_id__$o,
-    __vue_is_functional_template__$o,
-    __vue_module_identifier__$o,
+  const __vue_component__$r = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$r, staticRenderFns: __vue_staticRenderFns__$r },
+    __vue_inject_styles__$r,
+    __vue_script__$q,
+    __vue_scope_id__$r,
+    __vue_is_functional_template__$r,
+    __vue_module_identifier__$r,
     false,
     __vue_create_injector__,
     undefined,
@@ -96995,7 +96833,7 @@ var img = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAA
 //
 
 
-var script$n = {
+var script$p = {
   name: 'SidebarLogo',
   props: {
     collapse: {
@@ -97008,7 +96846,7 @@ var script$n = {
       return variables
     },
     sideTheme() {
-      return this.$store.state.settings.sideTheme
+      return this.$store.state['z-settings'].sideTheme
     }
   },
   data() {
@@ -97023,10 +96861,10 @@ var script$n = {
 };
 
 /* script */
-const __vue_script__$n = script$n;
+const __vue_script__$p = script$p;
 
 /* template */
-var __vue_render__$n = function () {
+var __vue_render__$q = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -97117,34 +96955,34 @@ var __vue_render__$n = function () {
     1
   )
 };
-var __vue_staticRenderFns__$n = [];
-__vue_render__$n._withStripped = true;
+var __vue_staticRenderFns__$q = [];
+__vue_render__$q._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$n = function (inject) {
+  const __vue_inject_styles__$q = function (inject) {
     if (!inject) return
-    inject("data-v-4d10e2a6_0", { source: ".sidebarLogoFade-enter-active[data-v-4d10e2a6] {\n  transition: opacity 1.5s;\n}\n.sidebarLogoFade-enter[data-v-4d10e2a6],\n.sidebarLogoFade-leave-to[data-v-4d10e2a6] {\n  opacity: 0;\n}\n.sidebar-logo-container[data-v-4d10e2a6] {\n  position: relative;\n  width: 100%;\n  height: 50px;\n  line-height: 50px;\n  background: #2b2f3a;\n  text-align: center;\n  overflow: hidden;\n}\n.sidebar-logo-container .sidebar-logo-link[data-v-4d10e2a6] {\n  height: 100%;\n  width: 100%;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-logo[data-v-4d10e2a6] {\n  width: 32px;\n  height: 32px;\n  vertical-align: middle;\n  margin-right: 12px;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-title[data-v-4d10e2a6] {\n  display: inline-block;\n  margin: 0;\n  color: #fff;\n  font-weight: 600;\n  line-height: 50px;\n  font-size: 14px;\n  font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;\n  vertical-align: middle;\n}\n.sidebar-logo-container.collapse .sidebar-logo[data-v-4d10e2a6] {\n  margin-right: 0px;\n}\n\n/*# sourceMappingURL=Logo.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Sidebar\\Logo.vue","Logo.vue"],"names":[],"mappings":"AAwDA;EACA,wBAAA;ACvDA;AD0DA;;EAEA,UAAA;ACvDA;AD0DA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;EACA,gBAAA;ACvDA;ADyDA;EACA,YAAA;EACA,WAAA;ACvDA;ADyDA;EACA,WAAA;EACA,YAAA;EACA,sBAAA;EACA,kBAAA;ACvDA;AD0DA;EACA,qBAAA;EACA,SAAA;EACA,WAAA;EACA,gBAAA;EACA,iBAAA;EACA,eAAA;EACA,iEAAA;EACA,sBAAA;ACxDA;AD6DA;EACA,iBAAA;AC3DA;;AAEA,mCAAmC","file":"Logo.vue","sourcesContent":["<template>\r\n  <div\r\n    class=\"sidebar-logo-container\"\r\n    :class=\"{ collapse: collapse }\"\r\n    :style=\"{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }\"\r\n  >\r\n    <transition name=\"sidebarLogoFade\">\r\n      <router-link v-if=\"collapse\" key=\"collapse\" class=\"sidebar-logo-link\" to=\"/\">\r\n        <img v-if=\"logo\" :src=\"logo\" class=\"sidebar-logo\" />\r\n        <h1 v-else class=\"sidebar-title\" :style=\"{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }\">\r\n          {{ $z.title }}\r\n        </h1>\r\n      </router-link>\r\n      <router-link v-else key=\"expand\" class=\"sidebar-logo-link\" to=\"/\">\r\n        <img v-if=\"logo\" :src=\"logo\" class=\"sidebar-logo\" />\r\n        <h1 class=\"sidebar-title\" :style=\"{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }\">\r\n          {{ $z.title }}\r\n        </h1>\r\n      </router-link>\r\n    </transition>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport logoImg from '../../logo/logo.png'\r\nimport variables from '../../scss/variables.module.scss'\r\n\r\nexport default {\r\n  name: 'SidebarLogo',\r\n  props: {\r\n    collapse: {\r\n      type: Boolean,\r\n      required: true\r\n    }\r\n  },\r\n  computed: {\r\n    variables() {\r\n      return variables\r\n    },\r\n    sideTheme() {\r\n      return this.$store.state.settings.sideTheme\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      // title: process.env.VUE_APP_TITLE,\r\n      logo: logoImg\r\n    }\r\n  },\r\n  mounted() {\r\n    // console.log(process.env.VUE_APP_TITLE)\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.sidebarLogoFade-enter-active {\r\n  transition: opacity 1.5s;\r\n}\r\n\r\n.sidebarLogoFade-enter,\r\n.sidebarLogoFade-leave-to {\r\n  opacity: 0;\r\n}\r\n\r\n.sidebar-logo-container {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 50px;\r\n  line-height: 50px;\r\n  background: #2b2f3a;\r\n  text-align: center;\r\n  overflow: hidden;\r\n\r\n  & .sidebar-logo-link {\r\n    height: 100%;\r\n    width: 100%;\r\n\r\n    & .sidebar-logo {\r\n      width: 32px;\r\n      height: 32px;\r\n      vertical-align: middle;\r\n      margin-right: 12px;\r\n    }\r\n\r\n    & .sidebar-title {\r\n      display: inline-block;\r\n      margin: 0;\r\n      color: #fff;\r\n      font-weight: 600;\r\n      line-height: 50px;\r\n      font-size: 14px;\r\n      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;\r\n      vertical-align: middle;\r\n    }\r\n  }\r\n\r\n  &.collapse {\r\n    .sidebar-logo {\r\n      margin-right: 0px;\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".sidebarLogoFade-enter-active {\n  transition: opacity 1.5s;\n}\n\n.sidebarLogoFade-enter,\n.sidebarLogoFade-leave-to {\n  opacity: 0;\n}\n\n.sidebar-logo-container {\n  position: relative;\n  width: 100%;\n  height: 50px;\n  line-height: 50px;\n  background: #2b2f3a;\n  text-align: center;\n  overflow: hidden;\n}\n.sidebar-logo-container .sidebar-logo-link {\n  height: 100%;\n  width: 100%;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-logo {\n  width: 32px;\n  height: 32px;\n  vertical-align: middle;\n  margin-right: 12px;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-title {\n  display: inline-block;\n  margin: 0;\n  color: #fff;\n  font-weight: 600;\n  line-height: 50px;\n  font-size: 14px;\n  font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;\n  vertical-align: middle;\n}\n.sidebar-logo-container.collapse .sidebar-logo {\n  margin-right: 0px;\n}\n\n/*# sourceMappingURL=Logo.vue.map */"]}, media: undefined });
+    inject("data-v-183d881d_0", { source: ".sidebarLogoFade-enter-active[data-v-183d881d] {\n  transition: opacity 1.5s;\n}\n.sidebarLogoFade-enter[data-v-183d881d],\n.sidebarLogoFade-leave-to[data-v-183d881d] {\n  opacity: 0;\n}\n.sidebar-logo-container[data-v-183d881d] {\n  position: relative;\n  width: 100%;\n  height: 50px;\n  line-height: 50px;\n  background: #2b2f3a;\n  text-align: center;\n  overflow: hidden;\n}\n.sidebar-logo-container .sidebar-logo-link[data-v-183d881d] {\n  height: 100%;\n  width: 100%;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-logo[data-v-183d881d] {\n  width: 32px;\n  height: 32px;\n  vertical-align: middle;\n  margin-right: 12px;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-title[data-v-183d881d] {\n  display: inline-block;\n  margin: 0;\n  color: #fff;\n  font-weight: 600;\n  line-height: 50px;\n  font-size: 14px;\n  font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;\n  vertical-align: middle;\n}\n.sidebar-logo-container.collapse .sidebar-logo[data-v-183d881d] {\n  margin-right: 0px;\n}\n\n/*# sourceMappingURL=Logo.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Sidebar\\Logo.vue","Logo.vue"],"names":[],"mappings":"AAwDA;EACA,wBAAA;ACvDA;AD0DA;;EAEA,UAAA;ACvDA;AD0DA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;EACA,gBAAA;ACvDA;ADyDA;EACA,YAAA;EACA,WAAA;ACvDA;ADyDA;EACA,WAAA;EACA,YAAA;EACA,sBAAA;EACA,kBAAA;ACvDA;AD0DA;EACA,qBAAA;EACA,SAAA;EACA,WAAA;EACA,gBAAA;EACA,iBAAA;EACA,eAAA;EACA,iEAAA;EACA,sBAAA;ACxDA;AD6DA;EACA,iBAAA;AC3DA;;AAEA,mCAAmC","file":"Logo.vue","sourcesContent":["<template>\r\n  <div\r\n    class=\"sidebar-logo-container\"\r\n    :class=\"{ collapse: collapse }\"\r\n    :style=\"{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }\"\r\n  >\r\n    <transition name=\"sidebarLogoFade\">\r\n      <router-link v-if=\"collapse\" key=\"collapse\" class=\"sidebar-logo-link\" to=\"/\">\r\n        <img v-if=\"logo\" :src=\"logo\" class=\"sidebar-logo\" />\r\n        <h1 v-else class=\"sidebar-title\" :style=\"{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }\">\r\n          {{ $z.title }}\r\n        </h1>\r\n      </router-link>\r\n      <router-link v-else key=\"expand\" class=\"sidebar-logo-link\" to=\"/\">\r\n        <img v-if=\"logo\" :src=\"logo\" class=\"sidebar-logo\" />\r\n        <h1 class=\"sidebar-title\" :style=\"{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }\">\r\n          {{ $z.title }}\r\n        </h1>\r\n      </router-link>\r\n    </transition>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport logoImg from '../../logo/logo.png'\r\nimport variables from '../../scss/variables.module.scss'\r\n\r\nexport default {\r\n  name: 'SidebarLogo',\r\n  props: {\r\n    collapse: {\r\n      type: Boolean,\r\n      required: true\r\n    }\r\n  },\r\n  computed: {\r\n    variables() {\r\n      return variables\r\n    },\r\n    sideTheme() {\r\n      return this.$store.state['z-settings'].sideTheme\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      // title: process.env.VUE_APP_TITLE,\r\n      logo: logoImg\r\n    }\r\n  },\r\n  mounted() {\r\n    // console.log(process.env.VUE_APP_TITLE)\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.sidebarLogoFade-enter-active {\r\n  transition: opacity 1.5s;\r\n}\r\n\r\n.sidebarLogoFade-enter,\r\n.sidebarLogoFade-leave-to {\r\n  opacity: 0;\r\n}\r\n\r\n.sidebar-logo-container {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 50px;\r\n  line-height: 50px;\r\n  background: #2b2f3a;\r\n  text-align: center;\r\n  overflow: hidden;\r\n\r\n  & .sidebar-logo-link {\r\n    height: 100%;\r\n    width: 100%;\r\n\r\n    & .sidebar-logo {\r\n      width: 32px;\r\n      height: 32px;\r\n      vertical-align: middle;\r\n      margin-right: 12px;\r\n    }\r\n\r\n    & .sidebar-title {\r\n      display: inline-block;\r\n      margin: 0;\r\n      color: #fff;\r\n      font-weight: 600;\r\n      line-height: 50px;\r\n      font-size: 14px;\r\n      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;\r\n      vertical-align: middle;\r\n    }\r\n  }\r\n\r\n  &.collapse {\r\n    .sidebar-logo {\r\n      margin-right: 0px;\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".sidebarLogoFade-enter-active {\n  transition: opacity 1.5s;\n}\n\n.sidebarLogoFade-enter,\n.sidebarLogoFade-leave-to {\n  opacity: 0;\n}\n\n.sidebar-logo-container {\n  position: relative;\n  width: 100%;\n  height: 50px;\n  line-height: 50px;\n  background: #2b2f3a;\n  text-align: center;\n  overflow: hidden;\n}\n.sidebar-logo-container .sidebar-logo-link {\n  height: 100%;\n  width: 100%;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-logo {\n  width: 32px;\n  height: 32px;\n  vertical-align: middle;\n  margin-right: 12px;\n}\n.sidebar-logo-container .sidebar-logo-link .sidebar-title {\n  display: inline-block;\n  margin: 0;\n  color: #fff;\n  font-weight: 600;\n  line-height: 50px;\n  font-size: 14px;\n  font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;\n  vertical-align: middle;\n}\n.sidebar-logo-container.collapse .sidebar-logo {\n  margin-right: 0px;\n}\n\n/*# sourceMappingURL=Logo.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$n = "data-v-4d10e2a6";
+  const __vue_scope_id__$q = "data-v-183d881d";
   /* module identifier */
-  const __vue_module_identifier__$n = undefined;
+  const __vue_module_identifier__$q = undefined;
   /* functional template */
-  const __vue_is_functional_template__$n = false;
+  const __vue_is_functional_template__$q = false;
   /* style inject SSR */
   
   /* style inject shadow dom */
   
 
   
-  const __vue_component__$n = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$n, staticRenderFns: __vue_staticRenderFns__$n },
-    __vue_inject_styles__$n,
-    __vue_script__$n,
-    __vue_scope_id__$n,
-    __vue_is_functional_template__$n,
-    __vue_module_identifier__$n,
+  const __vue_component__$q = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$q, staticRenderFns: __vue_staticRenderFns__$q },
+    __vue_inject_styles__$q,
+    __vue_script__$p,
+    __vue_scope_id__$q,
+    __vue_is_functional_template__$q,
+    __vue_module_identifier__$q,
     false,
     __vue_create_injector__,
     undefined,
@@ -97158,7 +96996,7 @@ __vue_render__$n._withStripped = true;
 //
 //
 
-var script$m = {
+var script$o = {
   name: 'MenuItem',
   props: {
     icon: {
@@ -97173,10 +97011,10 @@ var script$m = {
 };
 
 /* script */
-const __vue_script__$m = script$m;
+const __vue_script__$o = script$o;
 
 /* template */
-var __vue_render__$m = function () {
+var __vue_render__$p = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -97186,17 +97024,17 @@ var __vue_render__$m = function () {
     ]),
   ])
 };
-var __vue_staticRenderFns__$m = [];
-__vue_render__$m._withStripped = true;
+var __vue_staticRenderFns__$p = [];
+__vue_render__$p._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$m = undefined;
+  const __vue_inject_styles__$p = undefined;
   /* scoped */
-  const __vue_scope_id__$m = undefined;
+  const __vue_scope_id__$p = undefined;
   /* module identifier */
-  const __vue_module_identifier__$m = undefined;
+  const __vue_module_identifier__$p = undefined;
   /* functional template */
-  const __vue_is_functional_template__$m = false;
+  const __vue_is_functional_template__$p = false;
   /* style inject */
   
   /* style inject SSR */
@@ -97205,13 +97043,13 @@ __vue_render__$m._withStripped = true;
   
 
   
-  const __vue_component__$m = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$m, staticRenderFns: __vue_staticRenderFns__$m },
-    __vue_inject_styles__$m,
-    __vue_script__$m,
-    __vue_scope_id__$m,
-    __vue_is_functional_template__$m,
-    __vue_module_identifier__$m,
+  const __vue_component__$p = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$p, staticRenderFns: __vue_staticRenderFns__$p },
+    __vue_inject_styles__$p,
+    __vue_script__$o,
+    __vue_scope_id__$p,
+    __vue_is_functional_template__$p,
+    __vue_module_identifier__$p,
     false,
     undefined,
     undefined,
@@ -97226,7 +97064,7 @@ __vue_render__$m._withStripped = true;
 //
 
 
-var script$l = {
+var script$n = {
   props: {
     to: {
       type: [String, Object],
@@ -97261,10 +97099,10 @@ var script$l = {
 };
 
 /* script */
-const __vue_script__$l = script$l;
+const __vue_script__$n = script$n;
 
 /* template */
-var __vue_render__$l = function () {
+var __vue_render__$o = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -97275,17 +97113,17 @@ var __vue_render__$l = function () {
     2
   )
 };
-var __vue_staticRenderFns__$l = [];
-__vue_render__$l._withStripped = true;
+var __vue_staticRenderFns__$o = [];
+__vue_render__$o._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$l = undefined;
+  const __vue_inject_styles__$o = undefined;
   /* scoped */
-  const __vue_scope_id__$l = undefined;
+  const __vue_scope_id__$o = undefined;
   /* module identifier */
-  const __vue_module_identifier__$l = undefined;
+  const __vue_module_identifier__$o = undefined;
   /* functional template */
-  const __vue_is_functional_template__$l = false;
+  const __vue_is_functional_template__$o = false;
   /* style inject */
   
   /* style inject SSR */
@@ -97294,13 +97132,13 @@ __vue_render__$l._withStripped = true;
   
 
   
-  const __vue_component__$l = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$l, staticRenderFns: __vue_staticRenderFns__$l },
-    __vue_inject_styles__$l,
-    __vue_script__$l,
-    __vue_scope_id__$l,
-    __vue_is_functional_template__$l,
-    __vue_module_identifier__$l,
+  const __vue_component__$o = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$o, staticRenderFns: __vue_staticRenderFns__$o },
+    __vue_inject_styles__$o,
+    __vue_script__$n,
+    __vue_scope_id__$o,
+    __vue_is_functional_template__$o,
+    __vue_module_identifier__$o,
     false,
     undefined,
     undefined,
@@ -97310,7 +97148,7 @@ __vue_render__$l._withStripped = true;
 var FixiOSBug = {
   computed: {
     device() {
-      return this.$store.state.app.device
+      return this.$store.state['z-app'].device
     }
   },
   mounted() {
@@ -97361,9 +97199,9 @@ var FixiOSBug = {
 //
 
 
-var script$k = {
+var script$m = {
   name: 'SidebarItem',
-  components: { Item: __vue_component__$m, AppLink: __vue_component__$l },
+  components: { Item: __vue_component__$p, AppLink: __vue_component__$o },
   mixins: [FixiOSBug],
   props: {
     // route object
@@ -97429,10 +97267,10 @@ var script$k = {
 };
 
 /* script */
-const __vue_script__$k = script$k;
+const __vue_script__$m = script$m;
 
 /* template */
-var __vue_render__$k = function () {
+var __vue_render__$n = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -97526,17 +97364,17 @@ var __vue_render__$k = function () {
       )
     : _vm._e()
 };
-var __vue_staticRenderFns__$k = [];
-__vue_render__$k._withStripped = true;
+var __vue_staticRenderFns__$n = [];
+__vue_render__$n._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$k = undefined;
+  const __vue_inject_styles__$n = undefined;
   /* scoped */
-  const __vue_scope_id__$k = undefined;
+  const __vue_scope_id__$n = undefined;
   /* module identifier */
-  const __vue_module_identifier__$k = undefined;
+  const __vue_module_identifier__$n = undefined;
   /* functional template */
-  const __vue_is_functional_template__$k = false;
+  const __vue_is_functional_template__$n = false;
   /* style inject */
   
   /* style inject SSR */
@@ -97545,13 +97383,13 @@ __vue_render__$k._withStripped = true;
   
 
   
-  const __vue_component__$k = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$k, staticRenderFns: __vue_staticRenderFns__$k },
-    __vue_inject_styles__$k,
-    __vue_script__$k,
-    __vue_scope_id__$k,
-    __vue_is_functional_template__$k,
-    __vue_module_identifier__$k,
+  const __vue_component__$n = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$n, staticRenderFns: __vue_staticRenderFns__$n },
+    __vue_inject_styles__$n,
+    __vue_script__$m,
+    __vue_scope_id__$n,
+    __vue_is_functional_template__$n,
+    __vue_module_identifier__$n,
     false,
     undefined,
     undefined,
@@ -97583,12 +97421,12 @@ __vue_render__$k._withStripped = true;
 //
 
 
-var script$j = {
-  components: { SidebarItem: __vue_component__$k, Logo: __vue_component__$n },
+var script$l = {
+  components: { SidebarItem: __vue_component__$n, Logo: __vue_component__$q },
   computed: {
-    ...mapState(['settings']),
-    ...mapState('app', ['sidebar']),
-    ...mapState('permission', ['sidebarRouters']),
+    ...mapState(['z-settings']),
+    ...mapState('z-app', ['sidebar']),
+    ...mapState('z-permission', ['sidebarRouters']),
     activeMenu() {
       const route = this.$route;
       const { meta, path } = route;
@@ -97599,7 +97437,7 @@ var script$j = {
       return path
     },
     showLogo() {
-      return this.$store.state.settings.sidebarLogo
+      return this.$store.state['z-settings'].sidebarLogo
     },
     variables() {
       return variables
@@ -97612,10 +97450,10 @@ var script$j = {
 };
 
 /* script */
-const __vue_script__$j = script$j;
+const __vue_script__$l = script$l;
 
 /* template */
-var __vue_render__$j = function () {
+var __vue_render__$m = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -97625,7 +97463,7 @@ var __vue_render__$j = function () {
       class: { "has-logo": _vm.showLogo },
       style: {
         backgroundColor:
-          _vm.settings.sideTheme === "theme-dark"
+          this["z-settings"].sideTheme === "theme-dark"
             ? _vm.variables.menuBackground
             : _vm.variables.menuLightBackground,
       },
@@ -97638,7 +97476,7 @@ var __vue_render__$j = function () {
       _c(
         "el-scrollbar",
         {
-          class: _vm.settings.sideTheme,
+          class: this["z-settings"].sideTheme,
           attrs: { "wrap-class": "scrollbar-wrapper" },
         },
         [
@@ -97649,15 +97487,15 @@ var __vue_render__$j = function () {
                 "default-active": _vm.activeMenu,
                 collapse: _vm.isCollapse,
                 "background-color":
-                  _vm.settings.sideTheme === "theme-dark"
+                  this["z-settings"].sideTheme === "theme-dark"
                     ? _vm.variables.menuBackground
                     : _vm.variables.menuLightBackground,
                 "text-color":
-                  _vm.settings.sideTheme === "theme-dark"
+                  this["z-settings"].sideTheme === "theme-dark"
                     ? _vm.variables.menuColor
                     : _vm.variables.menuLightColor,
                 "unique-opened": true,
-                "active-text-color": _vm.settings.theme,
+                "active-text-color": this["z-settings"].theme,
                 "collapse-transition": false,
                 mode: "vertical",
               },
@@ -97677,17 +97515,17 @@ var __vue_render__$j = function () {
     1
   )
 };
-var __vue_staticRenderFns__$j = [];
-__vue_render__$j._withStripped = true;
+var __vue_staticRenderFns__$m = [];
+__vue_render__$m._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$j = undefined;
+  const __vue_inject_styles__$m = undefined;
   /* scoped */
-  const __vue_scope_id__$j = undefined;
+  const __vue_scope_id__$m = undefined;
   /* module identifier */
-  const __vue_module_identifier__$j = undefined;
+  const __vue_module_identifier__$m = undefined;
   /* functional template */
-  const __vue_is_functional_template__$j = false;
+  const __vue_is_functional_template__$m = false;
   /* style inject */
   
   /* style inject SSR */
@@ -97696,19 +97534,582 @@ __vue_render__$j._withStripped = true;
   
 
   
-  const __vue_component__$j = /*#__PURE__*/__vue_normalize__(
-    { render: __vue_render__$j, staticRenderFns: __vue_staticRenderFns__$j },
-    __vue_inject_styles__$j,
-    __vue_script__$j,
-    __vue_scope_id__$j,
-    __vue_is_functional_template__$j,
-    __vue_module_identifier__$j,
+  const __vue_component__$m = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$m, staticRenderFns: __vue_staticRenderFns__$m },
+    __vue_inject_styles__$m,
+    __vue_script__$l,
+    __vue_scope_id__$m,
+    __vue_is_functional_template__$m,
+    __vue_module_identifier__$m,
     false,
     undefined,
     undefined,
     undefined
   );
 
+//
+//
+//
+//
+//
+//
+
+const tagAndTagSpacing = 4; // tagAndTagSpacing
+
+var script$k = {
+  name: 'ScrollPane',
+  data() {
+    return {
+      left: 0
+    }
+  },
+  computed: {
+    scrollWrapper() {
+      return this.$refs.scrollContainer.$refs.wrap
+    }
+  },
+  mounted() {
+    this.scrollWrapper.addEventListener('scroll', this.emitScroll, true);
+  },
+  beforeDestroy() {
+    this.scrollWrapper.removeEventListener('scroll', this.emitScroll);
+  },
+  methods: {
+    handleScroll(e) {
+      const eventDelta = e.wheelDelta || -e.deltaY * 40;
+      const $scrollWrapper = this.scrollWrapper;
+      $scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4;
+    },
+    emitScroll() {
+      this.$emit('scroll');
+    },
+    moveToTarget(currentTag) {
+      const $container = this.$refs.scrollContainer.$el;
+      const $containerWidth = $container.offsetWidth;
+      const $scrollWrapper = this.scrollWrapper;
+      const tagList = this.$parent.$refs.tag;
+
+      let firstTag = null;
+      let lastTag = null;
+
+      // find first tag and last tag
+      if (tagList.length > 0) {
+        firstTag = tagList[0];
+        lastTag = tagList[tagList.length - 1];
+      }
+
+      if (firstTag === currentTag) {
+        $scrollWrapper.scrollLeft = 0;
+      } else if (lastTag === currentTag) {
+        $scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth;
+      } else {
+        // find preTag and nextTag
+        const currentIndex = tagList.findIndex(item => item === currentTag);
+        const prevTag = tagList[currentIndex - 1];
+        const nextTag = tagList[currentIndex + 1];
+
+        // the tag's offsetLeft after of nextTag
+        const afterNextTagOffsetLeft = nextTag.$el.offsetLeft + nextTag.$el.offsetWidth + tagAndTagSpacing;
+
+        // the tag's offsetLeft before of prevTag
+        const beforePrevTagOffsetLeft = prevTag.$el.offsetLeft - tagAndTagSpacing;
+
+        if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) {
+          $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth;
+        } else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {
+          $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft;
+        }
+      }
+    }
+  }
+};
+
+/* script */
+const __vue_script__$k = script$k;
+
+/* template */
+var __vue_render__$l = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c(
+    "el-scrollbar",
+    {
+      ref: "scrollContainer",
+      staticClass: "scroll-container",
+      attrs: { vertical: false },
+      nativeOn: {
+        wheel: function ($event) {
+          $event.preventDefault();
+          return _vm.handleScroll.apply(null, arguments)
+        },
+      },
+    },
+    [_vm._t("default")],
+    2
+  )
+};
+var __vue_staticRenderFns__$l = [];
+__vue_render__$l._withStripped = true;
+
+  /* style */
+  const __vue_inject_styles__$l = function (inject) {
+    if (!inject) return
+    inject("data-v-083b80f3_0", { source: ".scroll-container[data-v-083b80f3] {\n  white-space: nowrap;\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n}\n.scroll-container[data-v-083b80f3]  .el-scrollbar__bar {\n  bottom: 0px;\n}\n.scroll-container[data-v-083b80f3]  .el-scrollbar__wrap {\n  height: 49px;\n}\n\n/*# sourceMappingURL=ScrollPane.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\TagsView\\ScrollPane.vue","ScrollPane.vue"],"names":[],"mappings":"AA+EA;EACA,mBAAA;EACA,kBAAA;EACA,gBAAA;EACA,WAAA;AC9EA;ADgFA;EACA,WAAA;AC9EA;ADgFA;EACA,YAAA;AC9EA;;AAEA,yCAAyC","file":"ScrollPane.vue","sourcesContent":["<template>\n  <el-scrollbar ref=\"scrollContainer\" :vertical=\"false\" class=\"scroll-container\" @wheel.native.prevent=\"handleScroll\">\n    <slot />\n  </el-scrollbar>\n</template>\n\n<script>\nconst tagAndTagSpacing = 4 // tagAndTagSpacing\n\nexport default {\n  name: 'ScrollPane',\n  data() {\n    return {\n      left: 0\n    }\n  },\n  computed: {\n    scrollWrapper() {\n      return this.$refs.scrollContainer.$refs.wrap\n    }\n  },\n  mounted() {\n    this.scrollWrapper.addEventListener('scroll', this.emitScroll, true)\n  },\n  beforeDestroy() {\n    this.scrollWrapper.removeEventListener('scroll', this.emitScroll)\n  },\n  methods: {\n    handleScroll(e) {\n      const eventDelta = e.wheelDelta || -e.deltaY * 40\n      const $scrollWrapper = this.scrollWrapper\n      $scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4\n    },\n    emitScroll() {\n      this.$emit('scroll')\n    },\n    moveToTarget(currentTag) {\n      const $container = this.$refs.scrollContainer.$el\n      const $containerWidth = $container.offsetWidth\n      const $scrollWrapper = this.scrollWrapper\n      const tagList = this.$parent.$refs.tag\n\n      let firstTag = null\n      let lastTag = null\n\n      // find first tag and last tag\n      if (tagList.length > 0) {\n        firstTag = tagList[0]\n        lastTag = tagList[tagList.length - 1]\n      }\n\n      if (firstTag === currentTag) {\n        $scrollWrapper.scrollLeft = 0\n      } else if (lastTag === currentTag) {\n        $scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth\n      } else {\n        // find preTag and nextTag\n        const currentIndex = tagList.findIndex(item => item === currentTag)\n        const prevTag = tagList[currentIndex - 1]\n        const nextTag = tagList[currentIndex + 1]\n\n        // the tag's offsetLeft after of nextTag\n        const afterNextTagOffsetLeft = nextTag.$el.offsetLeft + nextTag.$el.offsetWidth + tagAndTagSpacing\n\n        // the tag's offsetLeft before of prevTag\n        const beforePrevTagOffsetLeft = prevTag.$el.offsetLeft - tagAndTagSpacing\n\n        if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) {\n          $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth\n        } else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {\n          $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft\n        }\n      }\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.scroll-container {\n  white-space: nowrap;\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n  ::v-deep {\n    .el-scrollbar__bar {\n      bottom: 0px;\n    }\n    .el-scrollbar__wrap {\n      height: 49px;\n    }\n  }\n}\n</style>\n",".scroll-container {\n  white-space: nowrap;\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n}\n.scroll-container ::v-deep .el-scrollbar__bar {\n  bottom: 0px;\n}\n.scroll-container ::v-deep .el-scrollbar__wrap {\n  height: 49px;\n}\n\n/*# sourceMappingURL=ScrollPane.vue.map */"]}, media: undefined });
+
+  };
+  /* scoped */
+  const __vue_scope_id__$l = "data-v-083b80f3";
+  /* module identifier */
+  const __vue_module_identifier__$l = undefined;
+  /* functional template */
+  const __vue_is_functional_template__$l = false;
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__$l = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$l, staticRenderFns: __vue_staticRenderFns__$l },
+    __vue_inject_styles__$l,
+    __vue_script__$k,
+    __vue_scope_id__$l,
+    __vue_is_functional_template__$l,
+    __vue_module_identifier__$l,
+    false,
+    __vue_create_injector__,
+    undefined,
+    undefined
+  );
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
+
+var script$j = {
+  components: { ScrollPane: __vue_component__$l },
+  data() {
+    return {
+      visible: false,
+      top: 0,
+      left: 0,
+      selectedTag: {},
+      affixTags: []
+    }
+  },
+  computed: {
+    visitedViews() {
+      return this.$store.state['z-tagsView'].visitedViews
+    },
+    routes() {
+      return this.$store.state['z-permission'].routes
+    },
+    theme() {
+      return this.$store.state['z-settings'].theme
+    }
+  },
+  watch: {
+    $route() {
+      this.addTags();
+      this.moveToCurrentTag();
+    },
+    visible(value) {
+      if (value) {
+        document.body.addEventListener('click', this.closeMenu);
+      } else {
+        document.body.removeEventListener('click', this.closeMenu);
+      }
+    }
+  },
+  mounted() {
+    this.initTags();
+    this.addTags();
+  },
+  methods: {
+    isActive(route) {
+      return route.path === this.$route.path
+    },
+    activeStyle(tag) {
+      if (!this.isActive(tag)) return {}
+      return {
+        'background-color': this.theme,
+        'border-color': this.theme
+      }
+    },
+    isAffix(tag) {
+      return tag.meta && tag.meta.affix
+    },
+    isFirstView() {
+      try {
+        return this.selectedTag.fullPath === '/index' || this.selectedTag.fullPath === this.visitedViews[1].fullPath
+      } catch (err) {
+        return false
+      }
+    },
+    isLastView() {
+      try {
+        return this.selectedTag.fullPath === this.visitedViews[this.visitedViews.length - 1].fullPath
+      } catch (err) {
+        return false
+      }
+    },
+    filterAffixTags(routes, basePath = '/') {
+      let tags = [];
+      routes.forEach((route) => {
+        if (route.meta && route.meta.affix) {
+          const tagPath = path.resolve(basePath, route.path);
+          tags.push({
+            fullPath: tagPath,
+            path: tagPath,
+            name: route.name,
+            meta: { ...route.meta }
+          });
+        }
+        if (route.children) {
+          const tempTags = this.filterAffixTags(route.children, route.path);
+          if (tempTags.length >= 1) {
+            tags = [...tags, ...tempTags];
+          }
+        }
+      });
+      return tags
+    },
+    initTags() {
+      const affixTags = (this.affixTags = this.filterAffixTags(this.routes));
+      for (const tag of affixTags) {
+        // Must have tag name
+        if (tag.name) {
+          this.$store.dispatch('z-tagsView/addVisitedView', tag);
+        }
+      }
+    },
+    addTags() {
+      const { name } = this.$route;
+      if (name) {
+        this.$store.dispatch('z-tagsView/addView', this.$route);
+        if (this.$route.meta.link) {
+          this.$store.dispatch('z-tagsView/addIframeView', this.$route);
+        }
+      }
+      return false
+    },
+    moveToCurrentTag() {
+      const tags = this.$refs.tag;
+      this.$nextTick(() => {
+        for (const tag of tags) {
+          if (tag.to.path === this.$route.path) {
+            this.$refs.scrollPane.moveToTarget(tag);
+            // when query is different then update
+            if (tag.to.fullPath !== this.$route.fullPath) {
+              this.$store.dispatch('z-tagsView/updateVisitedView', this.$route);
+            }
+            break
+          }
+        }
+      });
+    },
+    refreshSelectedTag(view) {
+      this.$tab.refreshPage(view);
+      if (this.$route.meta.link) {
+        this.$store.dispatch('z-tagsView/delIframeView', this.$route);
+      }
+    },
+    closeSelectedTag(view) {
+      this.$tab.closePage(view).then(({ visitedViews }) => {
+        if (this.isActive(view)) {
+          this.toLastView(visitedViews, view);
+        }
+      });
+    },
+    closeRightTags() {
+      this.$tab.closeRightPage(this.selectedTag).then((visitedViews) => {
+        if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {
+          this.toLastView(visitedViews);
+        }
+      });
+    },
+    closeLeftTags() {
+      this.$tab.closeLeftPage(this.selectedTag).then((visitedViews) => {
+        if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {
+          this.toLastView(visitedViews);
+        }
+      });
+    },
+    closeOthersTags() {
+      this.$router.push(this.selectedTag.fullPath).catch(() => {});
+      this.$tab.closeOtherPage(this.selectedTag).then(() => {
+        this.moveToCurrentTag();
+      });
+    },
+    closeAllTags(view) {
+      this.$tab.closeAllPage().then(({ visitedViews }) => {
+        if (this.affixTags.some((tag) => tag.path === this.$route.path)) {
+          return
+        }
+        this.toLastView(visitedViews, view);
+      });
+    },
+    toLastView(visitedViews, view) {
+      const latestView = visitedViews.slice(-1)[0];
+      if (latestView) {
+        this.$router.push(latestView.fullPath);
+      } else {
+        // now the default is to redirect to the home page if there is no tags-view,
+        // you can adjust it according to your needs.
+        if (view.name === 'Dashboard') {
+          // to reload home page
+          this.$router.replace({ path: '/redirect' + view.fullPath });
+        } else {
+          this.$router.push('/');
+        }
+      }
+    },
+    openMenu(tag, e) {
+      const menuMinWidth = 105;
+      const offsetLeft = this.$el.getBoundingClientRect().left; // container margin left
+      const offsetWidth = this.$el.offsetWidth; // container width
+      const maxLeft = offsetWidth - menuMinWidth; // left boundary
+      const left = e.clientX - offsetLeft + 15; // 15: margin right
+
+      if (left > maxLeft) {
+        this.left = maxLeft;
+      } else {
+        this.left = left;
+      }
+
+      this.top = e.clientY;
+      this.visible = true;
+      this.selectedTag = tag;
+    },
+    closeMenu() {
+      this.visible = false;
+    },
+    handleScroll() {
+      this.closeMenu();
+    }
+  }
+};
+
+/* script */
+const __vue_script__$j = script$j;
+
+/* template */
+var __vue_render__$k = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c(
+    "div",
+    {
+      staticClass: "tags-view-container",
+      attrs: { id: "tags-view-container" },
+    },
+    [
+      _c(
+        "scroll-pane",
+        {
+          ref: "scrollPane",
+          staticClass: "tags-view-wrapper",
+          on: { scroll: _vm.handleScroll },
+        },
+        _vm._l(_vm.visitedViews, function (tag) {
+          return _c(
+            "router-link",
+            {
+              key: tag.path,
+              ref: "tag",
+              refInFor: true,
+              staticClass: "tags-view-item",
+              class: _vm.isActive(tag) ? "active" : "",
+              style: _vm.activeStyle(tag),
+              attrs: {
+                to: {
+                  path: tag.path,
+                  query: tag.query,
+                  fullPath: tag.fullPath,
+                },
+                tag: "span",
+              },
+              nativeOn: {
+                mouseup: function ($event) {
+                  if ("button" in $event && $event.button !== 1) {
+                    return null
+                  }
+                  !_vm.isAffix(tag) ? _vm.closeSelectedTag(tag) : "";
+                },
+                contextmenu: function ($event) {
+                  $event.preventDefault();
+                  return _vm.openMenu(tag, $event)
+                },
+              },
+            },
+            [
+              _vm._v("\n      " + _vm._s(tag.title) + "\n      "),
+              !_vm.isAffix(tag)
+                ? _c("span", {
+                    staticClass: "el-icon-close",
+                    on: {
+                      click: function ($event) {
+                        $event.preventDefault();
+                        $event.stopPropagation();
+                        return _vm.closeSelectedTag(tag)
+                      },
+                    },
+                  })
+                : _vm._e(),
+            ]
+          )
+        }),
+        1
+      ),
+      _vm._v(" "),
+      _c(
+        "ul",
+        {
+          directives: [
+            {
+              name: "show",
+              rawName: "v-show",
+              value: _vm.visible,
+              expression: "visible",
+            },
+          ],
+          staticClass: "contextmenu",
+          style: { left: _vm.left + "px", top: _vm.top + "px" },
+        },
+        [
+          _c(
+            "li",
+            {
+              on: {
+                click: function ($event) {
+                  return _vm.refreshSelectedTag(_vm.selectedTag)
+                },
+              },
+            },
+            [
+              _c("i", { staticClass: "el-icon-refresh-right" }),
+              _vm._v(" 刷新页面"),
+            ]
+          ),
+          _vm._v(" "),
+          !_vm.isAffix(_vm.selectedTag)
+            ? _c(
+                "li",
+                {
+                  on: {
+                    click: function ($event) {
+                      return _vm.closeSelectedTag(_vm.selectedTag)
+                    },
+                  },
+                },
+                [_c("i", { staticClass: "el-icon-close" }), _vm._v(" 关闭当前")]
+              )
+            : _vm._e(),
+          _vm._v(" "),
+          _c("li", { on: { click: _vm.closeOthersTags } }, [
+            _c("i", { staticClass: "el-icon-circle-close" }),
+            _vm._v(" 关闭其他"),
+          ]),
+          _vm._v(" "),
+          !_vm.isFirstView()
+            ? _c("li", { on: { click: _vm.closeLeftTags } }, [
+                _c("i", { staticClass: "el-icon-back" }),
+                _vm._v(" 关闭左侧"),
+              ])
+            : _vm._e(),
+          _vm._v(" "),
+          !_vm.isLastView()
+            ? _c("li", { on: { click: _vm.closeRightTags } }, [
+                _c("i", { staticClass: "el-icon-right" }),
+                _vm._v(" 关闭右侧"),
+              ])
+            : _vm._e(),
+          _vm._v(" "),
+          _c(
+            "li",
+            {
+              on: {
+                click: function ($event) {
+                  return _vm.closeAllTags(_vm.selectedTag)
+                },
+              },
+            },
+            [
+              _c("i", { staticClass: "el-icon-circle-close" }),
+              _vm._v(" 全部关闭"),
+            ]
+          ),
+        ]
+      ),
+    ],
+    1
+  )
+};
+var __vue_staticRenderFns__$k = [];
+__vue_render__$k._withStripped = true;
+
+  /* style */
+  const __vue_inject_styles__$k = function (inject) {
+    if (!inject) return
+    inject("data-v-1621f612_0", { source: ".tags-view-container[data-v-1621f612] {\n  height: 34px;\n  width: 100%;\n  background: #fff;\n  border-bottom: 1px solid #d8dce5;\n  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);\n}\n.tags-view-container .tags-view-wrapper .tags-view-item[data-v-1621f612] {\n  display: inline-block;\n  position: relative;\n  cursor: pointer;\n  height: 26px;\n  line-height: 26px;\n  border: 1px solid #d8dce5;\n  color: #495060;\n  background: #fff;\n  padding: 0 8px;\n  font-size: 12px;\n  margin-left: 5px;\n  margin-top: 4px;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item[data-v-1621f612]:first-of-type {\n  margin-left: 15px;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item[data-v-1621f612]:last-of-type {\n  margin-right: 15px;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item.active[data-v-1621f612] {\n  background-color: #42b983;\n  color: #fff;\n  border-color: #42b983;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item.active[data-v-1621f612]::before {\n  content: \"\";\n  background: #fff;\n  display: inline-block;\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  position: relative;\n  margin-right: 2px;\n}\n.tags-view-container .contextmenu[data-v-1621f612] {\n  margin: 0;\n  background: #fff;\n  z-index: 3000;\n  position: absolute;\n  list-style-type: none;\n  padding: 5px 0;\n  border-radius: 4px;\n  font-size: 12px;\n  font-weight: 400;\n  color: #333;\n  box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);\n}\n.tags-view-container .contextmenu li[data-v-1621f612] {\n  margin: 0;\n  padding: 7px 16px;\n  cursor: pointer;\n}\n.tags-view-container .contextmenu li[data-v-1621f612]:hover {\n  background: #eee;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\TagsView\\index.vue","index.vue"],"names":[],"mappings":"AAgPA;EACA,YAAA;EACA,WAAA;EACA,gBAAA;EACA,gCAAA;EACA,0EAAA;AC/OA;ADiPA;EACA,qBAAA;EACA,kBAAA;EACA,eAAA;EACA,YAAA;EACA,iBAAA;EACA,yBAAA;EACA,cAAA;EACA,gBAAA;EACA,cAAA;EACA,eAAA;EACA,gBAAA;EACA,eAAA;AC/OA;ADgPA;EACA,iBAAA;AC9OA;ADgPA;EACA,kBAAA;AC9OA;ADgPA;EACA,yBAAA;EACA,WAAA;EACA,qBAAA;AC9OA;AD+OA;EACA,WAAA;EACA,gBAAA;EACA,qBAAA;EACA,UAAA;EACA,WAAA;EACA,kBAAA;EACA,kBAAA;EACA,iBAAA;AC7OA;ADkPA;EACA,SAAA;EACA,gBAAA;EACA,aAAA;EACA,kBAAA;EACA,qBAAA;EACA,cAAA;EACA,kBAAA;EACA,eAAA;EACA,gBAAA;EACA,WAAA;EACA,4CAAA;AChPA;ADiPA;EACA,SAAA;EACA,iBAAA;EACA,eAAA;AC/OA;ADgPA;EACA,gBAAA;AC9OA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div id=\"tags-view-container\" class=\"tags-view-container\">\r\n    <scroll-pane ref=\"scrollPane\" class=\"tags-view-wrapper\" @scroll=\"handleScroll\">\r\n      <router-link\r\n        v-for=\"tag in visitedViews\"\r\n        ref=\"tag\"\r\n        :key=\"tag.path\"\r\n        :class=\"isActive(tag) ? 'active' : ''\"\r\n        :to=\"{ path: tag.path, query: tag.query, fullPath: tag.fullPath }\"\r\n        tag=\"span\"\r\n        class=\"tags-view-item\"\r\n        :style=\"activeStyle(tag)\"\r\n        @click.middle.native=\"!isAffix(tag) ? closeSelectedTag(tag) : ''\"\r\n        @contextmenu.prevent.native=\"openMenu(tag, $event)\"\r\n      >\r\n        {{ tag.title }}\r\n        <span v-if=\"!isAffix(tag)\" class=\"el-icon-close\" @click.prevent.stop=\"closeSelectedTag(tag)\" />\r\n      </router-link>\r\n    </scroll-pane>\r\n    <ul v-show=\"visible\" :style=\"{ left: left + 'px', top: top + 'px' }\" class=\"contextmenu\">\r\n      <li @click=\"refreshSelectedTag(selectedTag)\"><i class=\"el-icon-refresh-right\"></i> 刷新页面</li>\r\n      <li v-if=\"!isAffix(selectedTag)\" @click=\"closeSelectedTag(selectedTag)\"><i class=\"el-icon-close\"></i> 关闭当前</li>\r\n      <li @click=\"closeOthersTags\"><i class=\"el-icon-circle-close\"></i> 关闭其他</li>\r\n      <li v-if=\"!isFirstView()\" @click=\"closeLeftTags\"><i class=\"el-icon-back\"></i> 关闭左侧</li>\r\n      <li v-if=\"!isLastView()\" @click=\"closeRightTags\"><i class=\"el-icon-right\"></i> 关闭右侧</li>\r\n      <li @click=\"closeAllTags(selectedTag)\"><i class=\"el-icon-circle-close\"></i> 全部关闭</li>\r\n    </ul>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport ScrollPane from './ScrollPane.vue'\r\nimport { path } from '../../../../utils/utils.js'\r\n\r\nexport default {\r\n  components: { ScrollPane },\r\n  data() {\r\n    return {\r\n      visible: false,\r\n      top: 0,\r\n      left: 0,\r\n      selectedTag: {},\r\n      affixTags: []\r\n    }\r\n  },\r\n  computed: {\r\n    visitedViews() {\r\n      return this.$store.state['z-tagsView'].visitedViews\r\n    },\r\n    routes() {\r\n      return this.$store.state['z-permission'].routes\r\n    },\r\n    theme() {\r\n      return this.$store.state['z-settings'].theme\r\n    }\r\n  },\r\n  watch: {\r\n    $route() {\r\n      this.addTags()\r\n      this.moveToCurrentTag()\r\n    },\r\n    visible(value) {\r\n      if (value) {\r\n        document.body.addEventListener('click', this.closeMenu)\r\n      } else {\r\n        document.body.removeEventListener('click', this.closeMenu)\r\n      }\r\n    }\r\n  },\r\n  mounted() {\r\n    this.initTags()\r\n    this.addTags()\r\n  },\r\n  methods: {\r\n    isActive(route) {\r\n      return route.path === this.$route.path\r\n    },\r\n    activeStyle(tag) {\r\n      if (!this.isActive(tag)) return {}\r\n      return {\r\n        'background-color': this.theme,\r\n        'border-color': this.theme\r\n      }\r\n    },\r\n    isAffix(tag) {\r\n      return tag.meta && tag.meta.affix\r\n    },\r\n    isFirstView() {\r\n      try {\r\n        return this.selectedTag.fullPath === '/index' || this.selectedTag.fullPath === this.visitedViews[1].fullPath\r\n      } catch (err) {\r\n        return false\r\n      }\r\n    },\r\n    isLastView() {\r\n      try {\r\n        return this.selectedTag.fullPath === this.visitedViews[this.visitedViews.length - 1].fullPath\r\n      } catch (err) {\r\n        return false\r\n      }\r\n    },\r\n    filterAffixTags(routes, basePath = '/') {\r\n      let tags = []\r\n      routes.forEach((route) => {\r\n        if (route.meta && route.meta.affix) {\r\n          const tagPath = path.resolve(basePath, route.path)\r\n          tags.push({\r\n            fullPath: tagPath,\r\n            path: tagPath,\r\n            name: route.name,\r\n            meta: { ...route.meta }\r\n          })\r\n        }\r\n        if (route.children) {\r\n          const tempTags = this.filterAffixTags(route.children, route.path)\r\n          if (tempTags.length >= 1) {\r\n            tags = [...tags, ...tempTags]\r\n          }\r\n        }\r\n      })\r\n      return tags\r\n    },\r\n    initTags() {\r\n      const affixTags = (this.affixTags = this.filterAffixTags(this.routes))\r\n      for (const tag of affixTags) {\r\n        // Must have tag name\r\n        if (tag.name) {\r\n          this.$store.dispatch('z-tagsView/addVisitedView', tag)\r\n        }\r\n      }\r\n    },\r\n    addTags() {\r\n      const { name } = this.$route\r\n      if (name) {\r\n        this.$store.dispatch('z-tagsView/addView', this.$route)\r\n        if (this.$route.meta.link) {\r\n          this.$store.dispatch('z-tagsView/addIframeView', this.$route)\r\n        }\r\n      }\r\n      return false\r\n    },\r\n    moveToCurrentTag() {\r\n      const tags = this.$refs.tag\r\n      this.$nextTick(() => {\r\n        for (const tag of tags) {\r\n          if (tag.to.path === this.$route.path) {\r\n            this.$refs.scrollPane.moveToTarget(tag)\r\n            // when query is different then update\r\n            if (tag.to.fullPath !== this.$route.fullPath) {\r\n              this.$store.dispatch('z-tagsView/updateVisitedView', this.$route)\r\n            }\r\n            break\r\n          }\r\n        }\r\n      })\r\n    },\r\n    refreshSelectedTag(view) {\r\n      this.$tab.refreshPage(view)\r\n      if (this.$route.meta.link) {\r\n        this.$store.dispatch('z-tagsView/delIframeView', this.$route)\r\n      }\r\n    },\r\n    closeSelectedTag(view) {\r\n      this.$tab.closePage(view).then(({ visitedViews }) => {\r\n        if (this.isActive(view)) {\r\n          this.toLastView(visitedViews, view)\r\n        }\r\n      })\r\n    },\r\n    closeRightTags() {\r\n      this.$tab.closeRightPage(this.selectedTag).then((visitedViews) => {\r\n        if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {\r\n          this.toLastView(visitedViews)\r\n        }\r\n      })\r\n    },\r\n    closeLeftTags() {\r\n      this.$tab.closeLeftPage(this.selectedTag).then((visitedViews) => {\r\n        if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {\r\n          this.toLastView(visitedViews)\r\n        }\r\n      })\r\n    },\r\n    closeOthersTags() {\r\n      this.$router.push(this.selectedTag.fullPath).catch(() => {})\r\n      this.$tab.closeOtherPage(this.selectedTag).then(() => {\r\n        this.moveToCurrentTag()\r\n      })\r\n    },\r\n    closeAllTags(view) {\r\n      this.$tab.closeAllPage().then(({ visitedViews }) => {\r\n        if (this.affixTags.some((tag) => tag.path === this.$route.path)) {\r\n          return\r\n        }\r\n        this.toLastView(visitedViews, view)\r\n      })\r\n    },\r\n    toLastView(visitedViews, view) {\r\n      const latestView = visitedViews.slice(-1)[0]\r\n      if (latestView) {\r\n        this.$router.push(latestView.fullPath)\r\n      } else {\r\n        // now the default is to redirect to the home page if there is no tags-view,\r\n        // you can adjust it according to your needs.\r\n        if (view.name === 'Dashboard') {\r\n          // to reload home page\r\n          this.$router.replace({ path: '/redirect' + view.fullPath })\r\n        } else {\r\n          this.$router.push('/')\r\n        }\r\n      }\r\n    },\r\n    openMenu(tag, e) {\r\n      const menuMinWidth = 105\r\n      const offsetLeft = this.$el.getBoundingClientRect().left // container margin left\r\n      const offsetWidth = this.$el.offsetWidth // container width\r\n      const maxLeft = offsetWidth - menuMinWidth // left boundary\r\n      const left = e.clientX - offsetLeft + 15 // 15: margin right\r\n\r\n      if (left > maxLeft) {\r\n        this.left = maxLeft\r\n      } else {\r\n        this.left = left\r\n      }\r\n\r\n      this.top = e.clientY\r\n      this.visible = true\r\n      this.selectedTag = tag\r\n    },\r\n    closeMenu() {\r\n      this.visible = false\r\n    },\r\n    handleScroll() {\r\n      this.closeMenu()\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.tags-view-container {\r\n  height: 34px;\r\n  width: 100%;\r\n  background: #fff;\r\n  border-bottom: 1px solid #d8dce5;\r\n  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);\r\n  .tags-view-wrapper {\r\n    .tags-view-item {\r\n      display: inline-block;\r\n      position: relative;\r\n      cursor: pointer;\r\n      height: 26px;\r\n      line-height: 26px;\r\n      border: 1px solid #d8dce5;\r\n      color: #495060;\r\n      background: #fff;\r\n      padding: 0 8px;\r\n      font-size: 12px;\r\n      margin-left: 5px;\r\n      margin-top: 4px;\r\n      &:first-of-type {\r\n        margin-left: 15px;\r\n      }\r\n      &:last-of-type {\r\n        margin-right: 15px;\r\n      }\r\n      &.active {\r\n        background-color: #42b983;\r\n        color: #fff;\r\n        border-color: #42b983;\r\n        &::before {\r\n          content: '';\r\n          background: #fff;\r\n          display: inline-block;\r\n          width: 8px;\r\n          height: 8px;\r\n          border-radius: 50%;\r\n          position: relative;\r\n          margin-right: 2px;\r\n        }\r\n      }\r\n    }\r\n  }\r\n  .contextmenu {\r\n    margin: 0;\r\n    background: #fff;\r\n    z-index: 3000;\r\n    position: absolute;\r\n    list-style-type: none;\r\n    padding: 5px 0;\r\n    border-radius: 4px;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    color: #333;\r\n    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);\r\n    li {\r\n      margin: 0;\r\n      padding: 7px 16px;\r\n      cursor: pointer;\r\n      &:hover {\r\n        background: #eee;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n\r\n<style lang=\"scss\">\r\n//reset element css of el-icon-close\r\n.tags-view-wrapper {\r\n  .tags-view-item {\r\n    .el-icon-close {\r\n      width: 16px;\r\n      height: 16px;\r\n      vertical-align: 2px;\r\n      border-radius: 50%;\r\n      text-align: center;\r\n      transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\r\n      transform-origin: 100% 50%;\r\n      &:before {\r\n        transform: scale(0.6);\r\n        display: inline-block;\r\n        vertical-align: -3px;\r\n      }\r\n      &:hover {\r\n        background-color: #b4bccc;\r\n        color: #fff;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".tags-view-container {\n  height: 34px;\n  width: 100%;\n  background: #fff;\n  border-bottom: 1px solid #d8dce5;\n  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);\n}\n.tags-view-container .tags-view-wrapper .tags-view-item {\n  display: inline-block;\n  position: relative;\n  cursor: pointer;\n  height: 26px;\n  line-height: 26px;\n  border: 1px solid #d8dce5;\n  color: #495060;\n  background: #fff;\n  padding: 0 8px;\n  font-size: 12px;\n  margin-left: 5px;\n  margin-top: 4px;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item:first-of-type {\n  margin-left: 15px;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item:last-of-type {\n  margin-right: 15px;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item.active {\n  background-color: #42b983;\n  color: #fff;\n  border-color: #42b983;\n}\n.tags-view-container .tags-view-wrapper .tags-view-item.active::before {\n  content: \"\";\n  background: #fff;\n  display: inline-block;\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  position: relative;\n  margin-right: 2px;\n}\n.tags-view-container .contextmenu {\n  margin: 0;\n  background: #fff;\n  z-index: 3000;\n  position: absolute;\n  list-style-type: none;\n  padding: 5px 0;\n  border-radius: 4px;\n  font-size: 12px;\n  font-weight: 400;\n  color: #333;\n  box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);\n}\n.tags-view-container .contextmenu li {\n  margin: 0;\n  padding: 7px 16px;\n  cursor: pointer;\n}\n.tags-view-container .contextmenu li:hover {\n  background: #eee;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined })
+,inject("data-v-1621f612_1", { source: ".tags-view-wrapper .tags-view-item .el-icon-close {\n  width: 16px;\n  height: 16px;\n  vertical-align: 2px;\n  border-radius: 50%;\n  text-align: center;\n  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n  transform-origin: 100% 50%;\n}\n.tags-view-wrapper .tags-view-item .el-icon-close:before {\n  transform: scale(0.6);\n  display: inline-block;\n  vertical-align: -3px;\n}\n.tags-view-wrapper .tags-view-item .el-icon-close:hover {\n  background-color: #b4bccc;\n  color: #fff;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\TagsView\\index.vue","index.vue"],"names":[],"mappings":"AAuTA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;EACA,kBAAA;EACA,kBAAA;EACA,yDAAA;EACA,0BAAA;ACtTA;ADuTA;EACA,qBAAA;EACA,qBAAA;EACA,oBAAA;ACrTA;ADuTA;EACA,yBAAA;EACA,WAAA;ACrTA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div id=\"tags-view-container\" class=\"tags-view-container\">\r\n    <scroll-pane ref=\"scrollPane\" class=\"tags-view-wrapper\" @scroll=\"handleScroll\">\r\n      <router-link\r\n        v-for=\"tag in visitedViews\"\r\n        ref=\"tag\"\r\n        :key=\"tag.path\"\r\n        :class=\"isActive(tag) ? 'active' : ''\"\r\n        :to=\"{ path: tag.path, query: tag.query, fullPath: tag.fullPath }\"\r\n        tag=\"span\"\r\n        class=\"tags-view-item\"\r\n        :style=\"activeStyle(tag)\"\r\n        @click.middle.native=\"!isAffix(tag) ? closeSelectedTag(tag) : ''\"\r\n        @contextmenu.prevent.native=\"openMenu(tag, $event)\"\r\n      >\r\n        {{ tag.title }}\r\n        <span v-if=\"!isAffix(tag)\" class=\"el-icon-close\" @click.prevent.stop=\"closeSelectedTag(tag)\" />\r\n      </router-link>\r\n    </scroll-pane>\r\n    <ul v-show=\"visible\" :style=\"{ left: left + 'px', top: top + 'px' }\" class=\"contextmenu\">\r\n      <li @click=\"refreshSelectedTag(selectedTag)\"><i class=\"el-icon-refresh-right\"></i> 刷新页面</li>\r\n      <li v-if=\"!isAffix(selectedTag)\" @click=\"closeSelectedTag(selectedTag)\"><i class=\"el-icon-close\"></i> 关闭当前</li>\r\n      <li @click=\"closeOthersTags\"><i class=\"el-icon-circle-close\"></i> 关闭其他</li>\r\n      <li v-if=\"!isFirstView()\" @click=\"closeLeftTags\"><i class=\"el-icon-back\"></i> 关闭左侧</li>\r\n      <li v-if=\"!isLastView()\" @click=\"closeRightTags\"><i class=\"el-icon-right\"></i> 关闭右侧</li>\r\n      <li @click=\"closeAllTags(selectedTag)\"><i class=\"el-icon-circle-close\"></i> 全部关闭</li>\r\n    </ul>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport ScrollPane from './ScrollPane.vue'\r\nimport { path } from '../../../../utils/utils.js'\r\n\r\nexport default {\r\n  components: { ScrollPane },\r\n  data() {\r\n    return {\r\n      visible: false,\r\n      top: 0,\r\n      left: 0,\r\n      selectedTag: {},\r\n      affixTags: []\r\n    }\r\n  },\r\n  computed: {\r\n    visitedViews() {\r\n      return this.$store.state['z-tagsView'].visitedViews\r\n    },\r\n    routes() {\r\n      return this.$store.state['z-permission'].routes\r\n    },\r\n    theme() {\r\n      return this.$store.state['z-settings'].theme\r\n    }\r\n  },\r\n  watch: {\r\n    $route() {\r\n      this.addTags()\r\n      this.moveToCurrentTag()\r\n    },\r\n    visible(value) {\r\n      if (value) {\r\n        document.body.addEventListener('click', this.closeMenu)\r\n      } else {\r\n        document.body.removeEventListener('click', this.closeMenu)\r\n      }\r\n    }\r\n  },\r\n  mounted() {\r\n    this.initTags()\r\n    this.addTags()\r\n  },\r\n  methods: {\r\n    isActive(route) {\r\n      return route.path === this.$route.path\r\n    },\r\n    activeStyle(tag) {\r\n      if (!this.isActive(tag)) return {}\r\n      return {\r\n        'background-color': this.theme,\r\n        'border-color': this.theme\r\n      }\r\n    },\r\n    isAffix(tag) {\r\n      return tag.meta && tag.meta.affix\r\n    },\r\n    isFirstView() {\r\n      try {\r\n        return this.selectedTag.fullPath === '/index' || this.selectedTag.fullPath === this.visitedViews[1].fullPath\r\n      } catch (err) {\r\n        return false\r\n      }\r\n    },\r\n    isLastView() {\r\n      try {\r\n        return this.selectedTag.fullPath === this.visitedViews[this.visitedViews.length - 1].fullPath\r\n      } catch (err) {\r\n        return false\r\n      }\r\n    },\r\n    filterAffixTags(routes, basePath = '/') {\r\n      let tags = []\r\n      routes.forEach((route) => {\r\n        if (route.meta && route.meta.affix) {\r\n          const tagPath = path.resolve(basePath, route.path)\r\n          tags.push({\r\n            fullPath: tagPath,\r\n            path: tagPath,\r\n            name: route.name,\r\n            meta: { ...route.meta }\r\n          })\r\n        }\r\n        if (route.children) {\r\n          const tempTags = this.filterAffixTags(route.children, route.path)\r\n          if (tempTags.length >= 1) {\r\n            tags = [...tags, ...tempTags]\r\n          }\r\n        }\r\n      })\r\n      return tags\r\n    },\r\n    initTags() {\r\n      const affixTags = (this.affixTags = this.filterAffixTags(this.routes))\r\n      for (const tag of affixTags) {\r\n        // Must have tag name\r\n        if (tag.name) {\r\n          this.$store.dispatch('z-tagsView/addVisitedView', tag)\r\n        }\r\n      }\r\n    },\r\n    addTags() {\r\n      const { name } = this.$route\r\n      if (name) {\r\n        this.$store.dispatch('z-tagsView/addView', this.$route)\r\n        if (this.$route.meta.link) {\r\n          this.$store.dispatch('z-tagsView/addIframeView', this.$route)\r\n        }\r\n      }\r\n      return false\r\n    },\r\n    moveToCurrentTag() {\r\n      const tags = this.$refs.tag\r\n      this.$nextTick(() => {\r\n        for (const tag of tags) {\r\n          if (tag.to.path === this.$route.path) {\r\n            this.$refs.scrollPane.moveToTarget(tag)\r\n            // when query is different then update\r\n            if (tag.to.fullPath !== this.$route.fullPath) {\r\n              this.$store.dispatch('z-tagsView/updateVisitedView', this.$route)\r\n            }\r\n            break\r\n          }\r\n        }\r\n      })\r\n    },\r\n    refreshSelectedTag(view) {\r\n      this.$tab.refreshPage(view)\r\n      if (this.$route.meta.link) {\r\n        this.$store.dispatch('z-tagsView/delIframeView', this.$route)\r\n      }\r\n    },\r\n    closeSelectedTag(view) {\r\n      this.$tab.closePage(view).then(({ visitedViews }) => {\r\n        if (this.isActive(view)) {\r\n          this.toLastView(visitedViews, view)\r\n        }\r\n      })\r\n    },\r\n    closeRightTags() {\r\n      this.$tab.closeRightPage(this.selectedTag).then((visitedViews) => {\r\n        if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {\r\n          this.toLastView(visitedViews)\r\n        }\r\n      })\r\n    },\r\n    closeLeftTags() {\r\n      this.$tab.closeLeftPage(this.selectedTag).then((visitedViews) => {\r\n        if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {\r\n          this.toLastView(visitedViews)\r\n        }\r\n      })\r\n    },\r\n    closeOthersTags() {\r\n      this.$router.push(this.selectedTag.fullPath).catch(() => {})\r\n      this.$tab.closeOtherPage(this.selectedTag).then(() => {\r\n        this.moveToCurrentTag()\r\n      })\r\n    },\r\n    closeAllTags(view) {\r\n      this.$tab.closeAllPage().then(({ visitedViews }) => {\r\n        if (this.affixTags.some((tag) => tag.path === this.$route.path)) {\r\n          return\r\n        }\r\n        this.toLastView(visitedViews, view)\r\n      })\r\n    },\r\n    toLastView(visitedViews, view) {\r\n      const latestView = visitedViews.slice(-1)[0]\r\n      if (latestView) {\r\n        this.$router.push(latestView.fullPath)\r\n      } else {\r\n        // now the default is to redirect to the home page if there is no tags-view,\r\n        // you can adjust it according to your needs.\r\n        if (view.name === 'Dashboard') {\r\n          // to reload home page\r\n          this.$router.replace({ path: '/redirect' + view.fullPath })\r\n        } else {\r\n          this.$router.push('/')\r\n        }\r\n      }\r\n    },\r\n    openMenu(tag, e) {\r\n      const menuMinWidth = 105\r\n      const offsetLeft = this.$el.getBoundingClientRect().left // container margin left\r\n      const offsetWidth = this.$el.offsetWidth // container width\r\n      const maxLeft = offsetWidth - menuMinWidth // left boundary\r\n      const left = e.clientX - offsetLeft + 15 // 15: margin right\r\n\r\n      if (left > maxLeft) {\r\n        this.left = maxLeft\r\n      } else {\r\n        this.left = left\r\n      }\r\n\r\n      this.top = e.clientY\r\n      this.visible = true\r\n      this.selectedTag = tag\r\n    },\r\n    closeMenu() {\r\n      this.visible = false\r\n    },\r\n    handleScroll() {\r\n      this.closeMenu()\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.tags-view-container {\r\n  height: 34px;\r\n  width: 100%;\r\n  background: #fff;\r\n  border-bottom: 1px solid #d8dce5;\r\n  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);\r\n  .tags-view-wrapper {\r\n    .tags-view-item {\r\n      display: inline-block;\r\n      position: relative;\r\n      cursor: pointer;\r\n      height: 26px;\r\n      line-height: 26px;\r\n      border: 1px solid #d8dce5;\r\n      color: #495060;\r\n      background: #fff;\r\n      padding: 0 8px;\r\n      font-size: 12px;\r\n      margin-left: 5px;\r\n      margin-top: 4px;\r\n      &:first-of-type {\r\n        margin-left: 15px;\r\n      }\r\n      &:last-of-type {\r\n        margin-right: 15px;\r\n      }\r\n      &.active {\r\n        background-color: #42b983;\r\n        color: #fff;\r\n        border-color: #42b983;\r\n        &::before {\r\n          content: '';\r\n          background: #fff;\r\n          display: inline-block;\r\n          width: 8px;\r\n          height: 8px;\r\n          border-radius: 50%;\r\n          position: relative;\r\n          margin-right: 2px;\r\n        }\r\n      }\r\n    }\r\n  }\r\n  .contextmenu {\r\n    margin: 0;\r\n    background: #fff;\r\n    z-index: 3000;\r\n    position: absolute;\r\n    list-style-type: none;\r\n    padding: 5px 0;\r\n    border-radius: 4px;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    color: #333;\r\n    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);\r\n    li {\r\n      margin: 0;\r\n      padding: 7px 16px;\r\n      cursor: pointer;\r\n      &:hover {\r\n        background: #eee;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n\r\n<style lang=\"scss\">\r\n//reset element css of el-icon-close\r\n.tags-view-wrapper {\r\n  .tags-view-item {\r\n    .el-icon-close {\r\n      width: 16px;\r\n      height: 16px;\r\n      vertical-align: 2px;\r\n      border-radius: 50%;\r\n      text-align: center;\r\n      transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\r\n      transform-origin: 100% 50%;\r\n      &:before {\r\n        transform: scale(0.6);\r\n        display: inline-block;\r\n        vertical-align: -3px;\r\n      }\r\n      &:hover {\r\n        background-color: #b4bccc;\r\n        color: #fff;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".tags-view-wrapper .tags-view-item .el-icon-close {\n  width: 16px;\n  height: 16px;\n  vertical-align: 2px;\n  border-radius: 50%;\n  text-align: center;\n  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n  transform-origin: 100% 50%;\n}\n.tags-view-wrapper .tags-view-item .el-icon-close:before {\n  transform: scale(0.6);\n  display: inline-block;\n  vertical-align: -3px;\n}\n.tags-view-wrapper .tags-view-item .el-icon-close:hover {\n  background-color: #b4bccc;\n  color: #fff;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+
+  };
+  /* scoped */
+  const __vue_scope_id__$k = "data-v-1621f612";
+  /* module identifier */
+  const __vue_module_identifier__$k = undefined;
+  /* functional template */
+  const __vue_is_functional_template__$k = false;
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__$k = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$k, staticRenderFns: __vue_staticRenderFns__$k },
+    __vue_inject_styles__$k,
+    __vue_script__$j,
+    __vue_scope_id__$k,
+    __vue_is_functional_template__$k,
+    __vue_module_identifier__$k,
+    false,
+    __vue_create_injector__,
+    undefined,
+    undefined
+  );
+
 //
 //
 //
@@ -97728,18 +98129,19 @@ __vue_render__$j._withStripped = true;
 var script$i = {
   name: 'z-layout',
   components: {
-    AppMain: __vue_component__$v,
-    Navbar: __vue_component__$o,
-    Sidebar: __vue_component__$j
+    AppMain: __vue_component__$y,
+    Navbar: __vue_component__$r,
+    Sidebar: __vue_component__$m,
+    TagsView: __vue_component__$k
   },
   computed: {
     ...mapState({
-      theme: (state) => state.settings.theme,
-      sideTheme: (state) => state.settings.sideTheme,
-      sidebar: (state) => state.app.sidebar,
-      device: (state) => state.app.device,
-      needTagsView: (state) => state.settings.tagsView,
-      fixedHeader: (state) => state.settings.fixedHeader
+      theme: (state) => state['z-settings'].theme,
+      sideTheme: (state) => state['z-settings'].sideTheme,
+      sidebar: (state) => state['z-app'].sidebar,
+      device: (state) => state['z-app'].device,
+      needTagsView: (state) => state['z-settings'].tagsView,
+      fixedHeader: (state) => state['z-settings'].fixedHeader
     }),
     classObj() {
       return {
@@ -97755,7 +98157,7 @@ var script$i = {
   },
   methods: {
     handleClickOutside() {
-      this.$store.dispatch('app/closeSideBar', { withoutAnimation: false });
+      this.$store.dispatch('z-app/closeSideBar', { withoutAnimation: false });
     }
   }
 };
@@ -97764,7 +98166,7 @@ var script$i = {
 const __vue_script__$i = script$i;
 
 /* template */
-var __vue_render__$i = function () {
+var __vue_render__$j = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -97800,7 +98202,11 @@ var __vue_render__$i = function () {
           _c(
             "div",
             { class: { "fixed-header": _vm.fixedHeader } },
-            [_c("Navbar"), _vm._v(" "), _c("div")],
+            [
+              _c("Navbar"),
+              _vm._v(" "),
+              _vm.needTagsView ? _c("TagsView") : _vm._e(),
+            ],
             1
           ),
           _vm._v(" "),
@@ -97812,21 +98218,62 @@ var __vue_render__$i = function () {
     1
   )
 };
-var __vue_staticRenderFns__$i = [];
-__vue_render__$i._withStripped = true;
+var __vue_staticRenderFns__$j = [];
+__vue_render__$j._withStripped = true;
 
   /* style */
-  const __vue_inject_styles__$i = function (inject) {
+  const __vue_inject_styles__$j = function (inject) {
     if (!inject) return
-    inject("data-v-2785cad2_0", { source: "/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n[data-v-2785cad2]:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n.app-wrapper[data-v-2785cad2] {\n  position: relative;\n  height: 100%;\n  width: 100%;\n}\n.app-wrapper[data-v-2785cad2]:after {\n  content: \"\";\n  display: table;\n  clear: both;\n}\n.app-wrapper.mobile.openSidebar[data-v-2785cad2] {\n  position: fixed;\n  top: 0;\n}\n.drawer-bg[data-v-2785cad2] {\n  background: #000;\n  opacity: 0.3;\n  width: 100%;\n  top: 0;\n  height: 100%;\n  position: absolute;\n  z-index: 999;\n}\n.fixed-header[data-v-2785cad2] {\n  position: fixed;\n  top: 0;\n  right: 0;\n  z-index: 9;\n  width: calc(100% - 200px);\n  transition: width 0.28s;\n}\n.hideSidebar .fixed-header[data-v-2785cad2] {\n  width: calc(100% - 54px);\n}\n.sidebarHide .fixed-header[data-v-2785cad2] {\n  width: 100%;\n}\n.mobile .fixed-header[data-v-2785cad2] {\n  width: 100%;\n}\n\n/*# sourceMappingURL=layout.vue.map */", map: {"version":3,"sources":["layout.vue","D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\layout.vue"],"names":[],"mappings":"AAAA;;;;;;;;;;;;CAYC;AACD;EACE,kBAAkB;EAClB,kCAAkC;EAClC,wBAAwB;EACxB,uBAAuB;EACvB,4BAA4B;EAC5B,0BAA0B;EAC1B,qBAAqB;EACrB,mBAAmB;EACnB,uBAAuB;EACvB,4BAA4B;AAC9B;ACoCA;EAEA,kBAAA;EACA,YAAA;EACA,WAAA;ADlCA;AACA;EACE,WAAW;EACX,cAAc;EACd,WAAW;AACb;AC8BA;EACA,eAAA;EACA,MAAA;AD5BA;AC+BA;EACA,gBAAA;EACA,YAAA;EACA,WAAA;EACA,MAAA;EACA,YAAA;EACA,kBAAA;EACA,YAAA;AD5BA;AC8BA;EACA,eAAA;EACA,MAAA;EACA,QAAA;EACA,UAAA;EACA,yBAAA;EACA,uBAAA;AD3BA;AC6BA;EACA,wBAAA;AD1BA;AC4BA;EACA,WAAA;ADzBA;AC2BA;EACA,WAAA;ADxBA;;AAEA,qCAAqC","file":"layout.vue","sourcesContent":["/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n\n.app-wrapper {\n  position: relative;\n  height: 100%;\n  width: 100%;\n}\n.app-wrapper:after {\n  content: \"\";\n  display: table;\n  clear: both;\n}\n.app-wrapper.mobile.openSidebar {\n  position: fixed;\n  top: 0;\n}\n\n.drawer-bg {\n  background: #000;\n  opacity: 0.3;\n  width: 100%;\n  top: 0;\n  height: 100%;\n  position: absolute;\n  z-index: 999;\n}\n\n.fixed-header {\n  position: fixed;\n  top: 0;\n  right: 0;\n  z-index: 9;\n  width: calc(100% - 200px);\n  transition: width 0.28s;\n}\n\n.hideSidebar .fixed-header {\n  width: calc(100% - 54px);\n}\n\n.sidebarHide .fixed-header {\n  width: 100%;\n}\n\n.mobile .fixed-header {\n  width: 100%;\n}\n\n/*# sourceMappingURL=layout.vue.map */","<template>\r\n  <div :class=\"classObj\" class=\"app-wrapper\" :style=\"{ '--current-color': theme }\">\r\n    <div v-if=\"device === 'mobile' && sidebar.opened\" class=\"drawer-bg\" @click=\"handleClickOutside\" />\r\n    <Sidebar v-if=\"!sidebar.hide\" class=\"sidebar-container\" />\r\n    <div :class=\"{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }\" class=\"main-container\">\r\n      <div :class=\"{ 'fixed-header': fixedHeader }\">\r\n        <Navbar />\r\n        <div></div>\r\n      </div>\r\n      <AppMain></AppMain>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex'\r\nimport variables from './scss/variables.module.scss'\r\nimport AppMain from './components/AppMain.vue'\r\nimport Navbar from './components/Navbar.vue'\r\nimport Sidebar from './components/Sidebar/index.vue'\r\n\r\nexport default {\r\n  name: 'z-layout',\r\n  components: {\r\n    AppMain,\r\n    Navbar,\r\n    Sidebar\r\n  },\r\n  computed: {\r\n    ...mapState({\r\n      theme: (state) => state.settings.theme,\r\n      sideTheme: (state) => state.settings.sideTheme,\r\n      sidebar: (state) => state.app.sidebar,\r\n      device: (state) => state.app.device,\r\n      needTagsView: (state) => state.settings.tagsView,\r\n      fixedHeader: (state) => state.settings.fixedHeader\r\n    }),\r\n    classObj() {\r\n      return {\r\n        hideSidebar: !this.sidebar.opened,\r\n        openSidebar: this.sidebar.opened,\r\n        withoutAnimation: this.sidebar.withoutAnimation,\r\n        mobile: this.device === 'mobile'\r\n      }\r\n    },\r\n    variables() {\r\n      return variables\r\n    }\r\n  },\r\n  methods: {\r\n    handleClickOutside() {\r\n      this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@import './scss/mixin.scss';\r\n@import './scss/variables.module.scss';\r\n.app-wrapper {\r\n  @include clearfix;\r\n  position: relative;\r\n  height: 100%;\r\n  width: 100%;\r\n  &.mobile.openSidebar {\r\n    position: fixed;\r\n    top: 0;\r\n  }\r\n}\r\n.drawer-bg {\r\n  background: #000;\r\n  opacity: 0.3;\r\n  width: 100%;\r\n  top: 0;\r\n  height: 100%;\r\n  position: absolute;\r\n  z-index: 999;\r\n}\r\n.fixed-header {\r\n  position: fixed;\r\n  top: 0;\r\n  right: 0;\r\n  z-index: 9;\r\n  width: calc(100% - #{$base-sidebar-width});\r\n  transition: width 0.28s;\r\n}\r\n.hideSidebar .fixed-header {\r\n  width: calc(100% - 54px);\r\n}\r\n.sidebarHide .fixed-header {\r\n  width: 100%;\r\n}\r\n.mobile .fixed-header {\r\n  width: 100%;\r\n}\r\n</style>\r\n"]}, media: undefined });
+    inject("data-v-18391fbc_0", { source: "/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n[data-v-18391fbc]:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n.app-wrapper[data-v-18391fbc] {\n  position: relative;\n  height: 100%;\n  width: 100%;\n}\n.app-wrapper[data-v-18391fbc]:after {\n  content: \"\";\n  display: table;\n  clear: both;\n}\n.app-wrapper.mobile.openSidebar[data-v-18391fbc] {\n  position: fixed;\n  top: 0;\n}\n.drawer-bg[data-v-18391fbc] {\n  background: #000;\n  opacity: 0.3;\n  width: 100%;\n  top: 0;\n  height: 100%;\n  position: absolute;\n  z-index: 999;\n}\n.fixed-header[data-v-18391fbc] {\n  position: fixed;\n  top: 0;\n  right: 0;\n  z-index: 9;\n  width: calc(100% - 200px);\n  transition: width 0.28s;\n}\n.hideSidebar .fixed-header[data-v-18391fbc] {\n  width: calc(100% - 54px);\n}\n.sidebarHide .fixed-header[data-v-18391fbc] {\n  width: 100%;\n}\n.mobile .fixed-header[data-v-18391fbc] {\n  width: 100%;\n}\n\n/*# sourceMappingURL=layout.vue.map */", map: {"version":3,"sources":["layout.vue","D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\layout.vue"],"names":[],"mappings":"AAAA;;;;;;;;;;;;CAYC;AACD;EACE,kBAAkB;EAClB,kCAAkC;EAClC,wBAAwB;EACxB,uBAAuB;EACvB,4BAA4B;EAC5B,0BAA0B;EAC1B,qBAAqB;EACrB,mBAAmB;EACnB,uBAAuB;EACvB,4BAA4B;AAC9B;ACsCA;EAEA,kBAAA;EACA,YAAA;EACA,WAAA;ADpCA;AACA;EACE,WAAW;EACX,cAAc;EACd,WAAW;AACb;ACgCA;EACA,eAAA;EACA,MAAA;AD9BA;ACiCA;EACA,gBAAA;EACA,YAAA;EACA,WAAA;EACA,MAAA;EACA,YAAA;EACA,kBAAA;EACA,YAAA;AD9BA;ACgCA;EACA,eAAA;EACA,MAAA;EACA,QAAA;EACA,UAAA;EACA,yBAAA;EACA,uBAAA;AD7BA;AC+BA;EACA,wBAAA;AD5BA;AC8BA;EACA,WAAA;AD3BA;AC6BA;EACA,WAAA;AD1BA;;AAEA,qCAAqC","file":"layout.vue","sourcesContent":["/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n:export {\n  menuColor: #bfcbd9;\n  menuLightColor: rgba(0, 0, 0, 0.7);\n  menuColorActive: #f4f4f5;\n  menuBackground: #304156;\n  menuLightBackground: #ffffff;\n  subMenuBackground: #1f2d3d;\n  subMenuHover: #001528;\n  sideBarWidth: 200px;\n  logoTitleColor: #ffffff;\n  logoLightTitleColor: #001529;\n}\n\n.app-wrapper {\n  position: relative;\n  height: 100%;\n  width: 100%;\n}\n.app-wrapper:after {\n  content: \"\";\n  display: table;\n  clear: both;\n}\n.app-wrapper.mobile.openSidebar {\n  position: fixed;\n  top: 0;\n}\n\n.drawer-bg {\n  background: #000;\n  opacity: 0.3;\n  width: 100%;\n  top: 0;\n  height: 100%;\n  position: absolute;\n  z-index: 999;\n}\n\n.fixed-header {\n  position: fixed;\n  top: 0;\n  right: 0;\n  z-index: 9;\n  width: calc(100% - 200px);\n  transition: width 0.28s;\n}\n\n.hideSidebar .fixed-header {\n  width: calc(100% - 54px);\n}\n\n.sidebarHide .fixed-header {\n  width: 100%;\n}\n\n.mobile .fixed-header {\n  width: 100%;\n}\n\n/*# sourceMappingURL=layout.vue.map */","<template>\r\n  <div :class=\"classObj\" class=\"app-wrapper\" :style=\"{ '--current-color': theme }\">\r\n    <div v-if=\"device === 'mobile' && sidebar.opened\" class=\"drawer-bg\" @click=\"handleClickOutside\" />\r\n    <Sidebar v-if=\"!sidebar.hide\" class=\"sidebar-container\" />\r\n    <div :class=\"{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }\" class=\"main-container\">\r\n      <div :class=\"{ 'fixed-header': fixedHeader }\">\r\n        <Navbar />\r\n        <TagsView v-if=\"needTagsView\" />\r\n      </div>\r\n      <AppMain></AppMain>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex'\r\nimport variables from './scss/variables.module.scss'\r\nimport AppMain from './components/AppMain.vue'\r\nimport Navbar from './components/Navbar.vue'\r\nimport Sidebar from './components/Sidebar/index.vue'\r\nimport TagsView from './components/TagsView/index.vue'\r\n\r\nexport default {\r\n  name: 'z-layout',\r\n  components: {\r\n    AppMain,\r\n    Navbar,\r\n    Sidebar,\r\n    TagsView\r\n  },\r\n  computed: {\r\n    ...mapState({\r\n      theme: (state) => state['z-settings'].theme,\r\n      sideTheme: (state) => state['z-settings'].sideTheme,\r\n      sidebar: (state) => state['z-app'].sidebar,\r\n      device: (state) => state['z-app'].device,\r\n      needTagsView: (state) => state['z-settings'].tagsView,\r\n      fixedHeader: (state) => state['z-settings'].fixedHeader\r\n    }),\r\n    classObj() {\r\n      return {\r\n        hideSidebar: !this.sidebar.opened,\r\n        openSidebar: this.sidebar.opened,\r\n        withoutAnimation: this.sidebar.withoutAnimation,\r\n        mobile: this.device === 'mobile'\r\n      }\r\n    },\r\n    variables() {\r\n      return variables\r\n    }\r\n  },\r\n  methods: {\r\n    handleClickOutside() {\r\n      this.$store.dispatch('z-app/closeSideBar', { withoutAnimation: false })\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@import './scss/mixin.scss';\r\n@import './scss/variables.module.scss';\r\n.app-wrapper {\r\n  @include clearfix;\r\n  position: relative;\r\n  height: 100%;\r\n  width: 100%;\r\n  &.mobile.openSidebar {\r\n    position: fixed;\r\n    top: 0;\r\n  }\r\n}\r\n.drawer-bg {\r\n  background: #000;\r\n  opacity: 0.3;\r\n  width: 100%;\r\n  top: 0;\r\n  height: 100%;\r\n  position: absolute;\r\n  z-index: 999;\r\n}\r\n.fixed-header {\r\n  position: fixed;\r\n  top: 0;\r\n  right: 0;\r\n  z-index: 9;\r\n  width: calc(100% - #{$base-sidebar-width});\r\n  transition: width 0.28s;\r\n}\r\n.hideSidebar .fixed-header {\r\n  width: calc(100% - 54px);\r\n}\r\n.sidebarHide .fixed-header {\r\n  width: 100%;\r\n}\r\n.mobile .fixed-header {\r\n  width: 100%;\r\n}\r\n</style>\r\n"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$i = "data-v-2785cad2";
+  const __vue_scope_id__$j = "data-v-18391fbc";
+  /* module identifier */
+  const __vue_module_identifier__$j = undefined;
+  /* functional template */
+  const __vue_is_functional_template__$j = false;
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__$j = /*#__PURE__*/__vue_normalize__(
+    { render: __vue_render__$j, staticRenderFns: __vue_staticRenderFns__$j },
+    __vue_inject_styles__$j,
+    __vue_script__$i,
+    __vue_scope_id__$j,
+    __vue_is_functional_template__$j,
+    __vue_module_identifier__$j,
+    false,
+    __vue_create_injector__,
+    undefined,
+    undefined
+  );
+
+/* script */
+
+/* template */
+var __vue_render__$i = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("router-view")
+};
+var __vue_staticRenderFns__$i = [];
+__vue_render__$i._withStripped = true;
+
+  /* style */
+  const __vue_inject_styles__$i = undefined;
+  /* scoped */
+  const __vue_scope_id__$i = undefined;
   /* module identifier */
   const __vue_module_identifier__$i = undefined;
   /* functional template */
   const __vue_is_functional_template__$i = false;
+  /* style inject */
+  
   /* style inject SSR */
   
   /* style inject shadow dom */
@@ -97836,26 +98283,28 @@ __vue_render__$i._withStripped = true;
   const __vue_component__$i = /*#__PURE__*/__vue_normalize__(
     { render: __vue_render__$i, staticRenderFns: __vue_staticRenderFns__$i },
     __vue_inject_styles__$i,
-    __vue_script__$i,
+    {},
     __vue_scope_id__$i,
     __vue_is_functional_template__$i,
     __vue_module_identifier__$i,
     false,
-    __vue_create_injector__,
+    undefined,
     undefined,
     undefined
   );
 
-const state$4 = {
+const state$5 = {
   routes: [],
   addRoutes: [],
   defaultRoutes: [],
   topbarRouters: [],
   sidebarRouters: []
 };
-const mutations$4 = {
-  SET_ROUTES: (state, routes) => {
+const mutations$5 = {
+  SET_ADD_ROUTES: (state, routes) => {
     state.addRoutes = routes;
+  },
+  SET_ROUTES: (state, routes) => {
     state.routes = routes;
   },
   SET_DEFAULT_ROUTES: (state, routes) => {
@@ -97868,7 +98317,7 @@ const mutations$4 = {
     state.sidebarRouters = routes;
   }
 };
-const actions$4 = {
+const actions$5 = {
   // 生成路由
   GenerateRoutes({ commit }, $z) {
     return new Promise((resolve) => {
@@ -97893,8 +98342,11 @@ const actions$4 = {
         const sidebarRoutes = filterAsyncRouter(sdata);
         const rewriteRoutes = filterAsyncRouter(rdata, false, true);
         rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true });
-        commit('SET_ROUTES', rewriteRoutes);
-        commit('SET_SIDEBAR_ROUTERS', sidebarRoutes);
+        const constantRoutes = $z.router.routes || [];
+
+        commit('SET_ADD_ROUTES', rewriteRoutes);
+        commit('SET_ROUTES', constantRoutes.concat(rewriteRoutes));
+        commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes));
         commit('SET_DEFAULT_ROUTES', sidebarRoutes);
         commit('SET_TOPBAR_ROUTES', sidebarRoutes);
         resolve(rewriteRoutes);
@@ -97909,16 +98361,13 @@ function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
     if (type && route.children) {
       route.children = filterChildren(route.children);
     }
-    if (route.component) {
-      // Layout ParentView 组件特殊处理
+    if (route.component && typeof route.component === 'string') {
       if (route.component === 'Layout') {
-        route.component = __vue_component__$i;
+        route.component = __vue_component__$j;
       } else if (route.component === 'ParentView') {
         route.component = __vue_component__$i;
-        // route.component = ParentView
       } else if (route.component === 'InnerLink') {
-        route.component = __vue_component__$i;
-        // route.component = InnerLink
+        route.component = __vue_component__$A;
       } else {
         route.component = loadView(route.component);
       }
@@ -97927,7 +98376,9 @@ function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
       route.children = filterAsyncRouter(route.children, route, type);
     } else {
       delete route['children'];
-      delete route['redirect'];
+      if (route.path !== '' && route.path !== '/') {
+        delete route['redirect'];
+      }
     }
     return true
   })
@@ -97962,27 +98413,183 @@ const loadView = (view) => {
     // 使用 import 实现生产环境的路由懒加载
     return () => import(`@/views/${view}.vue`)
   }
-  // return () => import(`@/views/${view}.vue`)
+};
+
+function registerStateModule$5(store) {
+  if (!store || !store.hasModule) return
+  if (!store.hasModule('z-permission')) {
+    const statesModule = {
+      namespaced: true,
+      state: state$5,
+      mutations: mutations$5,
+      actions: actions$5
+    };
+    store.registerModule('z-permission', statesModule);
+  }
+}
+
+NProgress.configure({ showSpinner: false });
+
+function createRouter(Vue) {
+  // 判断是否已经use过VueRouter
+  const VueRouterObj = Vue._installedPlugins.filter((item) => {
+    return item.name === 'VueRouter'
+  });
+  if (!(VueRouterObj && VueRouterObj[0])) {
+    Vue.use(VueRouter);
+    const $z = Vue.prototype.$z;
+    const routerOption = $z.router;
+    if (routerOption) {
+      const defaultConfig = {
+        mode: routerOption.mode || 'history', // 去掉url中的#
+        scrollBehavior: () => ({ y: 0 }),
+        routes: routerOption.routes || []
+      };
+      filterAsyncRouter(defaultConfig.routes);
+      const router = new VueRouter(defaultConfig);
+      router.beforeEach((to, from, next) => {
+        if (routerOption.beforeEach) {
+          routerOption.beforeEach(to, from, next);
+        } else {
+          NProgress.start();
+          const httpOption = $z.http || {};
+          const token = getCookie(httpOption.tokenKey || TOKENKEY);
+          const store = $z.store;
+          if (!routerOption.whiteList) {
+            routerOption.whiteList = ['/login', '/register'];
+          }
+          if (token) {
+            if (to.path === '/login') {
+              next({ path: '/' });
+              NProgress.done();
+            } else {
+              // 判断是不是第一次 需要动态加载路由
+              if (!router.options.isAddDynamicMenuRoutes && store) {
+                router.options.isAddDynamicMenuRoutes = true;
+                isRelogin.show = true;
+                store.dispatch('z-user/GetInfo', $z).then(() => {
+                  isRelogin.show = false;
+                  store.dispatch('z-permission/GenerateRoutes', $z).then((accessRoutes) => {
+                    // 根据roles权限生成可访问的路由表
+                    router.addRoutes(accessRoutes); // 动态添加可访问路由表
+                    router.options.routes = Object.assign(router.options.routes, accessRoutes);
+                    next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
+                  });
+                });
+                next();
+              } else {
+                next();
+              }
+            }
+          } else {
+            // 没有token
+            if (routerOption.whiteList.indexOf(to.path) !== -1) {
+              // 在免登录白名单，直接进入
+              next();
+            } else {
+              next(`/login?redirect=${to.fullPath}`); // 否则全部重定向到登录页
+              NProgress.done();
+            }
+          }
+        }
+      });
+      router.afterEach(() => {
+        if (routerOption.afterEach) {
+          routerOption.afterEach();
+        } else {
+          NProgress.done();
+        }
+      });
+
+      Vue.prototype.$z.$router = router;
+    }
+  }
+}
+
+const state$4 = {
+  token: '',
+  userinfo: {},
+  roles: [],
+  permissions: []
+};
+const mutations$4 = {
+  SET_TOKEN: (state, token) => {
+    state.token = token;
+  },
+  SET_ROLES: (state, roles) => {
+    state.roles = roles;
+  },
+  SET_USERINFO: (state, userinfo) => {
+    state.userinfo = userinfo;
+  },
+  SET_PERMISSIONS: (state, permissions) => {
+    state.permissions = permissions;
+  }
+};
+const actions$4 = {
+  // 登录 todo
+  Login({ commit }, userInfo) {},
+
+  // 获取用户信息
+  GetInfo({ commit }, $z) {
+    return new Promise((resolve, reject) => {
+      const $http = $z.$http;
+      const routerOption = $z.router || {};
+      let api = function () {
+        if ($http) {
+          return $http.request({
+            url: routerOption.getUserInfo || '/getInfo',
+            method: 'get'
+          })
+        } else {
+          Promise.resolve({});
+        }
+      };
+      if (typeof routerOption.getUserInfo === 'function') {
+        api = routerOption.getUserInfo;
+      }
+      api()
+        .then((res) => {
+          commit('SET_USERINFO', res.user || {});
+          commit('SET_PERMISSIONS', res.permissions || '*:*:*');
+          if (res.roles && res.roles.length > 0) {
+            commit('SET_ROLES', res.roles);
+          } else {
+            commit('SET_ROLES', ['ROLE_DEFAULT']);
+          }
+          resolve(res);
+        })
+        .catch((error) => {
+          reject(error);
+        });
+    })
+  },
+
+  // 退出系统 todo
+  LogOut({ commit, state }) {},
+
+  // 前端 登出 todo
+  FedLogOut({ commit }) {}
 };
 
 function registerStateModule$4(store) {
   if (!store || !store.hasModule) return
-  if (!store.hasModule('permission')) {
+  if (!store.hasModule('z-user')) {
     const statesModule = {
       namespaced: true,
       state: state$4,
       mutations: mutations$4,
       actions: actions$4
     };
-    store.registerModule('permission', statesModule);
+    store.registerModule('z-user', statesModule);
   }
 }
 
 function install$2(Vue, option = {}) {
   const z = Vue.prototype.$z;
   const store = z.store;
-  registerStateModule$5(store);
   registerStateModule$4(store);
+  registerStateModule$5(store);
   setGolbalData(Vue, option);
   createRouter(Vue);
 }
@@ -99444,14 +100051,14 @@ const actions$2 = {
 
 function registerStateModule$2(store) {
   if (!store || !store.hasModule) return
-  if (!store.hasModule('settings')) {
+  if (!store.hasModule('z-settings')) {
     const statesModule = {
       namespaced: true,
       state: state$2,
       mutations: mutations$2,
       actions: actions$2
     };
-    store.registerModule('settings', statesModule);
+    store.registerModule('z-settings', statesModule);
   }
 }
 
@@ -99515,14 +100122,14 @@ const actions$1 = {
 
 function registerStateModule$1(store) {
   if (!store || !store.hasModule) return
-  if (!store.hasModule('app')) {
+  if (!store.hasModule('z-app')) {
     const statesModule = {
       namespaced: true,
       state: state$1,
       mutations: mutations$1,
       actions: actions$1
     };
-    store.registerModule('app', statesModule);
+    store.registerModule('z-app', statesModule);
   }
 }
 
@@ -99750,20 +100357,20 @@ const actions = {
 
 function registerStateModule(store) {
   if (!store || !store.hasModule) return
-  if (!store.hasModule('tagsView')) {
+  if (!store.hasModule('z-tagsView')) {
     const statesModule = {
       namespaced: true,
       state,
       mutations,
       actions
     };
-    store.registerModule('tagsView', statesModule);
+    store.registerModule('z-tagsView', statesModule);
   }
 }
 
-__vue_component__$i.install = function (Vue, option = {}) {
+__vue_component__$j.install = function (Vue, option = {}) {
   setGolbalData(Vue, option);
-  Vue.component(__vue_component__$i.name, __vue_component__$i);
+  Vue.component(__vue_component__$j.name, __vue_component__$j);
   const z = Vue.prototype.$z;
   const store = z.store;
   registerStateModule$2(store);
@@ -100767,7 +101374,7 @@ if (typeof window !== 'undefined' && window.Vue) {
   install(window.Vue);
 }
 const components = [
-  __vue_component__$y,
+  __vue_component__$B,
   __vue_component__,
   RequestZ,
   RouterZ,
@@ -100789,7 +101396,7 @@ const components = [
   __vue_component__$3,
   __vue_component__$2,
   __vue_component__$1,
-  __vue_component__$i
+  __vue_component__$j
 ];
 const install = (Vue, option = {}) => {
   setGolbalData(Vue, option);
@@ -100812,9 +101419,9 @@ exports.DictZ = DictZ;
 exports.FooterZ = __vue_component__$8;
 exports.HeaderZ = __vue_component__$7;
 exports.Icon2Z = __vue_component__;
-exports.IconZ = __vue_component__$y;
+exports.IconZ = __vue_component__$B;
 exports.InputZ = __vue_component__$6;
-exports.LayoutZ = __vue_component__$i;
+exports.LayoutZ = __vue_component__$j;
 exports.ListZ = __vue_component__$g;
 exports.MainZ = __vue_component__$5;
 exports.OptionZ = __vue_component__$4;