n20-common-lib 1.3.4 → 1.3.7

package/src/components/Layout/index.vue

@@ -1,518 +1,518 @@
-<template>
-  <div class="layout-wrap">
-    <headerWrap
-      class="header-wrap"
-      @custom-event="(par) => $emit('custom-event', par)"
-    />
-    <asideNav
-      :menus="menusC"
-      :active-nav="activeNavC"
-      :collapse.sync="collapse"
-      @menu-click="menuClick"
-    />
-    <tabsNav
-      class="tabs-nav-wrap"
-      :tab-list="tabList"
-      :active-nav="activeNav"
-      @tab-click="tabClick"
-      @tab-close="tabClose"
-      @tab-close-nexts="tabCloseNexts"
-      @tab-close-others="tabCloseOthers"
-      @tab-refresh="tabRefresh"
-    />
-    <div ref="content-wrap" class="content-wrap">
-      <keep-alive v-if="dnsKey">
-        <router-view
-          ref="content-cache"
-          :key="$route.path"
-          class="content-box"
-          :no-cache="$route.meta.noCache"
-        />
-      </keep-alive>
-      <router-view
-        v-else
-        ref="content-cache"
-        class="content-box"
-        :no-cache="$route.meta.noCache"
-      />
-    </div>
-  </div>
-</template>
-
-<script>
-const TestProduction = process.env.VUE_APP_TestProduction === 'true'
-const routerBase = process.env.BASE_URL
-const routerBaseRe = new RegExp('^' + routerBase)
-
-import { addListener, removeListener } from 'resize-detector'
-import forEachs from '../../utils/forEachs'
-import { setRela } from '../../utils/relaNo'
-import asideNav from './AsideNav/index.vue'
-import headerWrap from './HeaderWrap/index.vue'
-import tabsNav from './TabsNav/index.vue'
-
-export default {
-  name: 'Layout',
-  components: {
-    asideNav,
-    headerWrap,
-    tabsNav
-  },
-  props: {
-    menus: {
-      type: Array,
-      default: () => []
-    },
-    keepTab: {
-      type: String,
-      default: ''
-    },
-    isTest: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    let headerH = 48
-    let tabsH = 35
-    let clientM = 10 + 1
-
-    return {
-      dnsKey: this.isTest || TestProduction,
-      headerH,
-      tabsH,
-      clientM,
-      clientHeight:
-        document.documentElement.offsetHeight - headerH - tabsH - 2 * clientM,
-      collapse: window.localStorage.getItem('aside-nav-collapse') === 'true',
-
-      menusC: [],
-      menuList: [],
-      tabList: [],
-      activeNav: ''
-    }
-  },
-  computed: {
-    activeNavC() {
-      return getShowUuid(this.activeNav, this.menuList)
-    }
-  },
-  watch: {
-    menus: {
-      handler() {
-        this.getMenuList()
-      },
-      immediate: true
-    },
-    collapse: {
-      handler(val) {
-        if (val) {
-          document.querySelector('body').classList.add('aside-nav--collapse')
-        } else {
-          document.querySelector('body').classList.remove('aside-nav--collapse')
-        }
-      },
-      immediate: true
-    },
-    clientHeight: {
-      handler(val) {
-        document
-          .querySelector('body')
-          .style.setProperty('--client-height', val + 'px')
-      },
-      immediate: true
-    }
-  },
-  created() {
-    window._tab_cache_route = undefined
-    window._pending_update_cache = {}
-
-    setRela()
-
-    this.getCollapse()
-    this.getTabList()
-    setTimeout(() => {
-      this.getActiveNav()
-    }, 60)
-
-    window.addEventListener('message', this.setMainTab)
-
-    window.addEventListener('beforeunload', this.setTabList)
-  },
-  mounted() {
-    addListener(this.$refs['content-wrap'], this.contentChange)
-  },
-  beforeDestroy() {
-    removeListener(this.$refs['content-wrap'], this.contentChange)
-    this.setTabList()
-
-    window.removeEventListener('message', this.setMainTab)
-
-    window.removeEventListener('beforeunload', this.setTabList)
-  },
-  methods: {
-    setMainTab(ev) {
-      const {
-        targetName,
-        replaceTab,
-        addTab,
-        closeTab,
-        setTabName,
-        addTabO,
-        refreshTab
-      } = ev.data
-
-      if (targetName === 'main') {
-        replaceTab && this.tabReplace(replaceTab)
-        addTab && this.tabAdd(addTab)
-        addTabO && this.tabAddO(addTabO)
-        closeTab && this.tabClose(closeTab)
-        setTabName && this.tabSetName(setTabName)
-        refreshTab && this.tabRefresh(refreshTab)
-      }
-    },
-    getCollapse() {
-      this.collapse =
-        window.localStorage.getItem('aside-nav-collapse') === 'true'
-    },
-    contentChange(dom) {
-      this.clientHeight = dom.clientHeight - 2 * this.clientM
-    },
-    getMenuList() {
-      let menus = JSON.parse(JSON.stringify(this.menus))
-      let menuList = []
-      menus.forEach((sub) => {
-        let base = sub.base
-        forEachs(sub.menu, (m, i, a, p) => {
-          if (m.route) {
-            m.pid = p.uuid
-            m.route = base + m.route.replace(/\/$/, '')
-            m.route || (m.route = '/')
-            m.uuid = m.route
-
-            menuList.push(m)
-          }
-        })
-      })
-
-      menus.forEach((sub) => {
-        sub.menu = sub.menu.filter((c) => !c.hide)
-        forEachs(sub.menu, (m) => {
-          if (m.children) {
-            let cN = m.children.filter((c) => !c.hide)
-            m.children = cN.length ? cN : undefined
-          }
-        })
-      })
-
-      this.menusC = menus
-      this.menuList = menuList
-    },
-    getTabList() {
-      let tabList = JSON.parse(window.sessionStorage.getItem('tab-list')) || []
-      this.tabList = tabList
-    },
-    setTabList() {
-      window.sessionStorage.setItem('tab-list', JSON.stringify(this.tabList))
-    },
-    getActiveNav() {
-      let tab = this.tabList.find(
-        (t) => this.$route.path === t.uuid || this.$route.path === t.route
-      )
-      if (tab) {
-        this.activeNav = tab.uuid
-      } else if (this.keepTab) {
-        this.$router.replace({
-          path: this.keepTab
-        })
-      }
-    },
-    routerPush({ path, query = {} }) {
-      if (path !== this.$route.path) {
-        this.$router.push({
-          path: path,
-          query: query
-        })
-      } else if (JSON.stringify(query) !== JSON.stringify(this.$route.query)) {
-        this.$router.push({
-          path: path,
-          query: query
-        })
-      }
-    },
-    menuClick(menu) {
-      this.routerPush({ path: menu.route })
-    },
-    tabClick(tab) {
-      this.activeNav = tab.uuid
-
-      this.routerPush({
-        path: tab.route,
-        query: tab.query
-      })
-    },
-    tabReplace(opt) {
-      let { path } = opt
-      path = path.replace(routerBaseRe, '/')
-      path = path.replace(/\/$/, '')
-
-      let tab = this.tabList.find((t) => t.uuid === this.activeNav)
-      if (tab) {
-        if (window._tab_cache_route === tab.route) {
-          setTimeout(() => {
-            window._tab_cache_route = undefined
-          }, 100)
-        } else {
-          this.removeOcache({ path: tab.route })
-        }
-
-        this.$set(tab, 'route', path)
-        for (let k in opt) {
-          k !== 'path' && this.$set(tab, k, opt[k])
-        }
-      }
-    },
-    tabAddO(opt) {
-      let { path, query } = opt
-      path = path.replace(routerBaseRe, '/')
-      path = path.replace(/\/$/, '')
-      path || (path = '/')
-
-      let tab = this.tabList.find((t) => t.route === path)
-      if (tab) {
-        this.activeNav = tab.uuid
-
-        let queryStr = JSON.stringify({ ...tab.query, _fromNo: undefined })
-        let queryStrN = JSON.stringify({ ...query, _fromNo: undefined })
-
-        this.$set(tab, 'route', path)
-        for (let k in opt) {
-          k !== 'path' && this.$set(tab, k, opt[k])
-        }
-
-        queryStr !== queryStrN && this.tabRefresh({ uuid: tab.uuid })
-      } else {
-        let tabI = this.tabList.findIndex((t) => t.uuid === path)
-        tab = this.tabList[tabI]
-        if (tab) {
-          if (window._tab_cache_route === tab.route) {
-            setTimeout(() => {
-              window._tab_cache_route = undefined
-            }, 100)
-          } else {
-            this.removeOcache({ path: tab.route })
-          }
-
-          for (let k in opt) {
-            k !== 'path' && this.$set(tab, k, opt[k])
-          }
-        } else {
-          let tabN = {
-            ...opt,
-            route: path,
-            path: undefined,
-            uuid: path,
-            keep: path === this.keepTab ? true : undefined
-          }
-          this.tabList.push(tabN)
-          this.activeNav = path
-        }
-      }
-    },
-    tabAdd(opt) {
-      let { path, query } = opt
-      this.$router.push({ path, query })
-      this.$nextTick(() => {
-        this.tabAddO(opt)
-      })
-    },
-    tabClose({ uuid, path }) {
-      let tabI = -1
-      if (uuid) {
-        tabI = this.tabList.findIndex((t) => t.uuid === uuid)
-      } else if (path) {
-        tabI = this.tabList.findIndex((t) => t.route === path)
-      }
-      if (tabI !== -1) {
-        uuid = this.tabList[tabI].uuid
-        let path = this.tabList[tabI].route
-
-        this.tabList.splice(tabI, 1)
-        if (uuid === this.activeNav) {
-          let tabN = this.tabList[tabI] || this.tabList[tabI - 1]
-          if (tabN) {
-            if (tabN.uuid !== this.activeNav) {
-              this.routerPush({
-                path: tabN.route,
-                query: tabN.query
-              })
-            }
-          } else {
-            this.routerPush({
-              path: '/'
-            })
-          }
-        }
-
-        setTimeout(() => {
-          this.removeOcache({ path: path })
-        }, 100)
-      } else {
-        console.warn('请求关闭的Tab页签不存在')
-      }
-    },
-    tabCloseNexts(uuid) {
-      let tabI = this.tabList.findIndex((t) => t.uuid === uuid)
-      let nextTabs = this.tabList.splice(tabI + 1)
-
-      if (!this.tabList.some((t) => t.uuid === this.activeNav)) {
-        let tab = this.tabList[tabI]
-        this.activeNav = tab.uuid
-        this.routerPush({
-          path: tab.route,
-          query: tab.query
-        })
-      }
-
-      setTimeout(() => {
-        nextTabs.forEach((t) => {
-          this.removeOcache({ path: t.route })
-        })
-        nextTabs = undefined
-      }, 100)
-    },
-    tabCloseOthers(uuid) {
-      let tab = this.tabList.find((t) => t.uuid === uuid)
-      let tabs = []
-      let otherTabs = []
-      this.tabList.forEach((t) => {
-        if (t.uuid === uuid) {
-          tabs.push(t)
-          tab = t
-        } else if (t.keep) {
-          tabs.push(t)
-        } else {
-          otherTabs.push(t)
-        }
-      })
-
-      this.tabList = tabs
-      if (this.activeNav !== tab.uuid) {
-        this.activeNav = tab.uuid
-        this.routerPush({
-          path: tab.route,
-          query: tab.query
-        })
-      }
-
-      setTimeout(() => {
-        otherTabs.forEach((t) => {
-          this.removeOcache({ path: t.route })
-        })
-        otherTabs = undefined
-      }, 100)
-    },
-    tabRefresh({ uuid, path }) {
-      let tab = undefined
-      if (uuid) {
-        tab = this.tabList.find((t) => uuid === t.uuid)
-      } else if (path) {
-        tab = this.tabList.find((t) => t.route === path)
-      }
-
-      if (
-        tab.uuid === this.activeNav &&
-        this.$route.matched[0]['path'] !== '*'
-      ) {
-        let path = this.$route.path
-        let oTab = JSON.parse(
-          JSON.stringify({
-            path: this.$route.path,
-            query: this.$route.query
-          })
-        )
-
-        this.$router.replace('/loading')
-        this.removeOcache({ path: path })
-        this.$nextTick(() => {
-          this.$router.replace(oTab)
-        })
-      } else {
-        this.removeOcache({ path: tab.route })
-      }
-    },
-    tabSetName({ uuid, path, title }) {
-      let tabI = -1
-      if (uuid) {
-        tabI = this.tabList.findIndex((t) => t.uuid === uuid)
-      } else if (path) {
-        tabI = this.tabList.findIndex((t) => t.route === path)
-      }
-      if (tabI !== -1) {
-        let tab = this.tabList[tabI]
-        tab.title = title
-      }
-    },
-    removeOcache({ path }) {
-      if (!this.dnsKey) return
-
-      let componentInstance =
-        this.$refs['content-cache']?.$vnode.parent.componentInstance
-
-      if (componentInstance) {
-        let kI = componentInstance.keys.findIndex((k) => k === path)
-        if (kI !== -1) {
-          window._pending_update_cache[path] = true
-          window.postMessage({
-            updateCache: true,
-            targetName: '*',
-            originName: 'main'
-          })
-          let isNull = componentInstance.cache[path].componentInstance.isNull
-          if (isNull) {
-            return
-          }
-          let destroy = componentInstance.cache[path].componentInstance.destroy
-          destroy && destroy()
-
-          delete componentInstance.cache[path]
-          componentInstance.keys.splice(kI, 1)
-
-          // console.log({
-          //   cache: componentInstance.cache,
-          //   keys: componentInstance.keys
-          // })
-        } else {
-          window._pending_update_cache[path] = true
-          window.postMessage({
-            updateCache: true,
-            targetName: '*',
-            originName: 'main'
-          })
-        }
-      } else {
-        window._pending_update_cache[path] = true
-        window.postMessage({
-          updateCache: true,
-          targetName: '*',
-          originName: 'main'
-        })
-      }
-    }
-  }
-}
-
-function getShowUuid(uuid, list) {
-  let menu = list.find((m) => m.uuid === uuid)
-  if (menu) {
-    return menu.hide ? menu.pid : menu.uuid
-  }
-
-  let pid = uuid.replace(/\/[^\/]+\/*$/, '')
-  if (pid !== '' && pid !== '/') {
-    return getShowUuid(pid, list)
-  }
-
-  return '/'
-}
-</script>
+<template>
+  <div class="layout-wrap">
+    <headerWrap
+      class="header-wrap"
+      @custom-event="(par) => $emit('custom-event', par)"
+    />
+    <asideNav
+      :menus="menusC"
+      :active-nav="activeNavC"
+      :collapse.sync="collapse"
+      @menu-click="menuClick"
+    />
+    <tabsNav
+      class="tabs-nav-wrap"
+      :tab-list="tabList"
+      :active-nav="activeNav"
+      @tab-click="tabClick"
+      @tab-close="tabClose"
+      @tab-close-nexts="tabCloseNexts"
+      @tab-close-others="tabCloseOthers"
+      @tab-refresh="tabRefresh"
+    />
+    <div ref="content-wrap" class="content-wrap">
+      <keep-alive v-if="dnsKey">
+        <router-view
+          ref="content-cache"
+          :key="$route.path"
+          class="content-box"
+          :no-cache="$route.meta.noCache"
+        />
+      </keep-alive>
+      <router-view
+        v-else
+        ref="content-cache"
+        class="content-box"
+        :no-cache="$route.meta.noCache"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+const TestProduction = process.env.VUE_APP_TestProduction === 'true'
+const routerBase = process.env.BASE_URL
+const routerBaseRe = new RegExp('^' + routerBase)
+
+import { addListener, removeListener } from 'resize-detector'
+import forEachs from '../../utils/forEachs'
+import { setRela } from '../../utils/relaNo'
+import asideNav from './AsideNav/index.vue'
+import headerWrap from './HeaderWrap/index.vue'
+import tabsNav from './TabsNav/index.vue'
+
+export default {
+  name: 'Layout',
+  components: {
+    asideNav,
+    headerWrap,
+    tabsNav
+  },
+  props: {
+    menus: {
+      type: Array,
+      default: () => []
+    },
+    keepTab: {
+      type: String,
+      default: ''
+    },
+    isTest: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    let headerH = 48
+    let tabsH = 35
+    let clientM = 10 + 1
+
+    return {
+      dnsKey: this.isTest || TestProduction,
+      headerH,
+      tabsH,
+      clientM,
+      clientHeight:
+        document.documentElement.offsetHeight - headerH - tabsH - 2 * clientM,
+      collapse: window.localStorage.getItem('aside-nav-collapse') === 'true',
+
+      menusC: [],
+      menuList: [],
+      tabList: [],
+      activeNav: ''
+    }
+  },
+  computed: {
+    activeNavC() {
+      return getShowUuid(this.activeNav, this.menuList)
+    }
+  },
+  watch: {
+    menus: {
+      handler() {
+        this.getMenuList()
+      },
+      immediate: true
+    },
+    collapse: {
+      handler(val) {
+        if (val) {
+          document.querySelector('body').classList.add('aside-nav--collapse')
+        } else {
+          document.querySelector('body').classList.remove('aside-nav--collapse')
+        }
+      },
+      immediate: true
+    },
+    clientHeight: {
+      handler(val) {
+        document
+          .querySelector('body')
+          .style.setProperty('--client-height', val + 'px')
+      },
+      immediate: true
+    }
+  },
+  created() {
+    window._tab_cache_route = undefined
+    window._pending_update_cache = {}
+
+    setRela()
+
+    this.getCollapse()
+    this.getTabList()
+    setTimeout(() => {
+      this.getActiveNav()
+    }, 60)
+
+    window.addEventListener('message', this.setMainTab)
+
+    window.addEventListener('beforeunload', this.setTabList)
+  },
+  mounted() {
+    addListener(this.$refs['content-wrap'], this.contentChange)
+  },
+  beforeDestroy() {
+    removeListener(this.$refs['content-wrap'], this.contentChange)
+    this.setTabList()
+
+    window.removeEventListener('message', this.setMainTab)
+
+    window.removeEventListener('beforeunload', this.setTabList)
+  },
+  methods: {
+    setMainTab(ev) {
+      const {
+        targetName,
+        replaceTab,
+        addTab,
+        closeTab,
+        setTabName,
+        addTabO,
+        refreshTab
+      } = ev.data
+
+      if (targetName === 'main') {
+        replaceTab && this.tabReplace(replaceTab)
+        addTab && this.tabAdd(addTab)
+        addTabO && this.tabAddO(addTabO)
+        closeTab && this.tabClose(closeTab)
+        setTabName && this.tabSetName(setTabName)
+        refreshTab && this.tabRefresh(refreshTab)
+      }
+    },
+    getCollapse() {
+      this.collapse =
+        window.localStorage.getItem('aside-nav-collapse') === 'true'
+    },
+    contentChange(dom) {
+      this.clientHeight = dom.clientHeight - 2 * this.clientM
+    },
+    getMenuList() {
+      let menus = JSON.parse(JSON.stringify(this.menus))
+      let menuList = []
+      menus.forEach((sub) => {
+        let base = sub.base
+        forEachs(sub.menu, (m, i, a, p) => {
+          if (m.route) {
+            m.pid = p.uuid
+            m.route = base + m.route.replace(/\/$/, '')
+            m.route || (m.route = '/')
+            m.uuid = m.route
+
+            menuList.push(m)
+          }
+        })
+      })
+
+      menus.forEach((sub) => {
+        sub.menu = sub.menu.filter((c) => !c.hide)
+        forEachs(sub.menu, (m) => {
+          if (m.children) {
+            let cN = m.children.filter((c) => !c.hide)
+            m.children = cN.length ? cN : undefined
+          }
+        })
+      })
+
+      this.menusC = menus
+      this.menuList = menuList
+    },
+    getTabList() {
+      let tabList = JSON.parse(window.sessionStorage.getItem('tab-list')) || []
+      this.tabList = tabList
+    },
+    setTabList() {
+      window.sessionStorage.setItem('tab-list', JSON.stringify(this.tabList))
+    },
+    getActiveNav() {
+      let tab = this.tabList.find(
+        (t) => this.$route.path === t.uuid || this.$route.path === t.route
+      )
+      if (tab) {
+        this.activeNav = tab.uuid
+      } else if (this.keepTab) {
+        this.$router.replace({
+          path: this.keepTab
+        })
+      }
+    },
+    routerPush({ path, query = {} }) {
+      if (path !== this.$route.path) {
+        this.$router.push({
+          path: path,
+          query: query
+        })
+      } else if (JSON.stringify(query) !== JSON.stringify(this.$route.query)) {
+        this.$router.push({
+          path: path,
+          query: query
+        })
+      }
+    },
+    menuClick(menu) {
+      this.routerPush({ path: menu.route })
+    },
+    tabClick(tab) {
+      this.activeNav = tab.uuid
+
+      this.routerPush({
+        path: tab.route,
+        query: tab.query
+      })
+    },
+    tabReplace(opt) {
+      let { path } = opt
+      path = path.replace(routerBaseRe, '/')
+      path = path.replace(/\/$/, '')
+
+      let tab = this.tabList.find((t) => t.uuid === this.activeNav)
+      if (tab) {
+        if (window._tab_cache_route === tab.route) {
+          setTimeout(() => {
+            window._tab_cache_route = undefined
+          }, 100)
+        } else {
+          this.removeOcache({ path: tab.route })
+        }
+
+        this.$set(tab, 'route', path)
+        for (let k in opt) {
+          k !== 'path' && this.$set(tab, k, opt[k])
+        }
+      }
+    },
+    tabAddO(opt) {
+      let { path, query } = opt
+      path = path.replace(routerBaseRe, '/')
+      path = path.replace(/\/$/, '')
+      path || (path = '/')
+
+      let tab = this.tabList.find((t) => t.route === path)
+      if (tab) {
+        this.activeNav = tab.uuid
+
+        let queryStr = JSON.stringify({ ...tab.query, _fromNo: undefined })
+        let queryStrN = JSON.stringify({ ...query, _fromNo: undefined })
+
+        this.$set(tab, 'route', path)
+        for (let k in opt) {
+          k !== 'path' && this.$set(tab, k, opt[k])
+        }
+
+        queryStr !== queryStrN && this.tabRefresh({ uuid: tab.uuid })
+      } else {
+        let tabI = this.tabList.findIndex((t) => t.uuid === path)
+        tab = this.tabList[tabI]
+        if (tab) {
+          if (window._tab_cache_route === tab.route) {
+            setTimeout(() => {
+              window._tab_cache_route = undefined
+            }, 100)
+          } else {
+            this.removeOcache({ path: tab.route })
+          }
+
+          for (let k in opt) {
+            k !== 'path' && this.$set(tab, k, opt[k])
+          }
+        } else {
+          let tabN = {
+            ...opt,
+            route: path,
+            path: undefined,
+            uuid: path,
+            keep: path === this.keepTab ? true : undefined
+          }
+          this.tabList.push(tabN)
+          this.activeNav = path
+        }
+      }
+    },
+    tabAdd(opt) {
+      let { path, query } = opt
+      this.$router.push({ path, query })
+      this.$nextTick(() => {
+        this.tabAddO(opt)
+      })
+    },
+    tabClose({ uuid, path }) {
+      let tabI = -1
+      if (uuid) {
+        tabI = this.tabList.findIndex((t) => t.uuid === uuid)
+      } else if (path) {
+        tabI = this.tabList.findIndex((t) => t.route === path)
+      }
+      if (tabI !== -1) {
+        uuid = this.tabList[tabI].uuid
+        let path = this.tabList[tabI].route
+
+        this.tabList.splice(tabI, 1)
+        if (uuid === this.activeNav) {
+          let tabN = this.tabList[tabI] || this.tabList[tabI - 1]
+          if (tabN) {
+            if (tabN.uuid !== this.activeNav) {
+              this.routerPush({
+                path: tabN.route,
+                query: tabN.query
+              })
+            }
+          } else {
+            this.routerPush({
+              path: '/'
+            })
+          }
+        }
+
+        setTimeout(() => {
+          this.removeOcache({ path: path })
+        }, 100)
+      } else {
+        console.warn('请求关闭的Tab页签不存在')
+      }
+    },
+    tabCloseNexts(uuid) {
+      let tabI = this.tabList.findIndex((t) => t.uuid === uuid)
+      let nextTabs = this.tabList.splice(tabI + 1)
+
+      if (!this.tabList.some((t) => t.uuid === this.activeNav)) {
+        let tab = this.tabList[tabI]
+        this.activeNav = tab.uuid
+        this.routerPush({
+          path: tab.route,
+          query: tab.query
+        })
+      }
+
+      setTimeout(() => {
+        nextTabs.forEach((t) => {
+          this.removeOcache({ path: t.route })
+        })
+        nextTabs = undefined
+      }, 100)
+    },
+    tabCloseOthers(uuid) {
+      let tab = this.tabList.find((t) => t.uuid === uuid)
+      let tabs = []
+      let otherTabs = []
+      this.tabList.forEach((t) => {
+        if (t.uuid === uuid) {
+          tabs.push(t)
+          tab = t
+        } else if (t.keep) {
+          tabs.push(t)
+        } else {
+          otherTabs.push(t)
+        }
+      })
+
+      this.tabList = tabs
+      if (this.activeNav !== tab.uuid) {
+        this.activeNav = tab.uuid
+        this.routerPush({
+          path: tab.route,
+          query: tab.query
+        })
+      }
+
+      setTimeout(() => {
+        otherTabs.forEach((t) => {
+          this.removeOcache({ path: t.route })
+        })
+        otherTabs = undefined
+      }, 100)
+    },
+    tabRefresh({ uuid, path }) {
+      let tab = undefined
+      if (uuid) {
+        tab = this.tabList.find((t) => uuid === t.uuid)
+      } else if (path) {
+        tab = this.tabList.find((t) => t.route === path)
+      }
+
+      if (
+        tab.uuid === this.activeNav &&
+        this.$route.matched[0]['path'] !== '*'
+      ) {
+        let path = this.$route.path
+        let oTab = JSON.parse(
+          JSON.stringify({
+            path: this.$route.path,
+            query: this.$route.query
+          })
+        )
+
+        this.$router.replace('/loading')
+        this.removeOcache({ path: path })
+        this.$nextTick(() => {
+          this.$router.replace(oTab)
+        })
+      } else {
+        this.removeOcache({ path: tab.route })
+      }
+    },
+    tabSetName({ uuid, path, title }) {
+      let tabI = -1
+      if (uuid) {
+        tabI = this.tabList.findIndex((t) => t.uuid === uuid)
+      } else if (path) {
+        tabI = this.tabList.findIndex((t) => t.route === path)
+      }
+      if (tabI !== -1) {
+        let tab = this.tabList[tabI]
+        tab.title = title
+      }
+    },
+    removeOcache({ path }) {
+      if (!this.dnsKey) return
+
+      let componentInstance =
+        this.$refs['content-cache']?.$vnode.parent.componentInstance
+
+      if (componentInstance) {
+        let kI = componentInstance.keys.findIndex((k) => k === path)
+        if (kI !== -1) {
+          window._pending_update_cache[path] = true
+          window.postMessage({
+            updateCache: true,
+            targetName: '*',
+            originName: 'main'
+          })
+          let isNull = componentInstance.cache[path].componentInstance.isNull
+          if (isNull) {
+            return
+          }
+          let destroy = componentInstance.cache[path].componentInstance.destroy
+          destroy && destroy()
+
+          delete componentInstance.cache[path]
+          componentInstance.keys.splice(kI, 1)
+
+          // console.log({
+          //   cache: componentInstance.cache,
+          //   keys: componentInstance.keys
+          // })
+        } else {
+          window._pending_update_cache[path] = true
+          window.postMessage({
+            updateCache: true,
+            targetName: '*',
+            originName: 'main'
+          })
+        }
+      } else {
+        window._pending_update_cache[path] = true
+        window.postMessage({
+          updateCache: true,
+          targetName: '*',
+          originName: 'main'
+        })
+      }
+    }
+  }
+}
+
+function getShowUuid(uuid, list) {
+  let menu = list.find((m) => m.uuid === uuid)
+  if (menu) {
+    return menu.hide ? menu.pid : menu.uuid
+  }
+
+  let pid = uuid.replace(/\/[^\/]+\/*$/, '')
+  if (pid !== '' && pid !== '/') {
+    return getShowUuid(pid, list)
+  }
+
+  return '/'
+}
+</script>