n20-common-lib 2.18.12 → 2.18.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "n20-common-lib",
-  "version": "2.18.12",
+  "version": "2.18.13",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/Layout/indexN.vue

@@ -1,36 +1,36 @@
 <template>
   <div class="layout-wrap">
     <headerWrap
+      v-if="!isMobile"
       class="header-wrap"
       :ectad="ectad"
       :system-change="systemChange"
       :operation-status="operationStatus"
       :before-logout="beforeLogout"
       :after-logout="afterLogout"
-      :drawerVisible.sync="showDrawerBox"
+      :drawer-visible.sync="showDrawerBox"
       @clickSystem="clickSystem"
       @custom-event="(par) => $emit('custom-event', par)"
     >
       <slot slot="header-ectad" name="header-ectad"></slot>
       <slot slot="header-dropdown" name="header-dropdown"></slot>
     </headerWrap>
-    <div
-      v-if="showDrawerBox"
-      class="wrapper-mask"
-      @click="showDrawerBox = false"
-    ></div>
+    <div v-if="showDrawerBox && !isMobile" class="wrapper-mask" @click="showDrawerBox = false"></div>
     <menuDrawer
+      v-if="!isMobile"
       :class="showDrawerBox ? 'show_drawer' : ''"
       :menus="systemMenu"
       @clickMenu="(row) => (this.showDrawerBox = row)"
-    ></menuDrawer>
+    />
     <asideNav
+      v-if="!isMobile"
       :menus="menusC"
       :active-nav="activeNavC"
       :collapse.sync="collapse"
       @menu-click="menuClick"
     />
     <tabsNav
+      v-if="!isMobile"
       class="tabs-nav-wrap"
       :tab-list="tabList"
       :active-nav="activeNav"
@@ -40,20 +40,11 @@
       @tab-close-others="tabCloseOthers"
       @tab-refresh="tabRefresh"
     />
-    <div ref="content-wrap" class="content-wrap">
+    <div ref="content-wrap" class="content-wrap" :class="{ isMobile: isMobile }">
       <keep-alive v-if="dnsKey" :max="32">
-        <router-view
-          v-if="!$route.meta.noCache"
-          ref="content-cache"
-          :key="$route | keyF"
-          class="content-box"
-        />
+        <router-view v-if="!$route.meta.noCache" ref="content-cache" :key="$route | keyF" class="content-box" />
       </keep-alive>
-      <router-view
-        v-if="!dnsKey || $route.meta.noCache"
-        :key="$route | keyF"
-        class="content-box"
-      />
+      <router-view v-if="!dnsKey || $route.meta.noCache" :key="$route | keyF" class="content-box" />
     </div>
   </div>
 </template>
@@ -84,13 +75,7 @@ export default {
   },
   filters: {
     keyF({ path, query = {} }) {
-      return (
-        path +
-        '^' +
-        JSON.stringify({ ...query, _fromNo: undefined }) +
-        '^' +
-        window._tab_route_key[path]
-      )
+      return path + '^' + JSON.stringify({ ...query, _fromNo: undefined }) + '^' + window._tab_route_key[path]
     }
   },
   props: {
@@ -140,13 +125,11 @@ export default {
       dnsKey:
         this.isCache ||
         this.isTest ||
-        (process.env.NODE_ENV === 'production' &&
-          process.env.VUE_APP_KEEP_ALIVE === 'true'),
+        (process.env.NODE_ENV === 'production' && process.env.VUE_APP_KEEP_ALIVE === 'true'),
       headerH,
       tabsH,
       clientM,
-      clientHeight:
-        document.documentElement.offsetHeight - headerH - tabsH - 1 * clientM,
+      clientHeight: document.documentElement.offsetHeight - headerH - tabsH - 1 * clientM,
       collapse: window.localStorage.getItem('aside-nav-collapse') === 'true',
       showDrawerBox: false,
       systemMenu: [],
@@ -157,6 +140,9 @@ export default {
     }
   },
   computed: {
+    isMobile() {
+      return window.innerWidth <= 768
+    },
     activeNavC() {
       let acTab = this.tabList.find((t) => t.uuid === this.activeNav)
       let acNav = acTab?.query?.startPath || this.activeNav
@@ -182,9 +168,7 @@ export default {
     },
     clientHeight: {
       handler(val) {
-        document
-          .querySelector('body')
-          .style.setProperty('--client-height', val + 'px')
+        document.querySelector('body').style.setProperty('--client-height', val + 'px')
       },
       immediate: true
     }
@@ -238,15 +222,7 @@ export default {
       }
     },
     setMainTab(ev) {
-      const {
-        targetName,
-        replaceTab,
-        addTab,
-        closeTab,
-        setTabName,
-        addTabO,
-        refreshTab
-      } = ev.data
+      const { targetName, replaceTab, addTab, closeTab, setTabName, addTabO, refreshTab } = ev.data
 
       if (targetName === 'main') {
         replaceTab && this.tabReplace(replaceTab)
@@ -261,8 +237,7 @@ export default {
       this.systemMenu = menu
     },
     getCollapse() {
-      this.collapse =
-        window.localStorage.getItem('aside-nav-collapse') === 'true'
+      this.collapse = window.localStorage.getItem('aside-nav-collapse') === 'true'
     },
     contentChange(dom) {
       this.clientHeight = dom.clientHeight - 2 * this.clientM
@@ -316,9 +291,7 @@ export default {
       }
     },
     getActiveNav() {
-      let tab = this.tabList.find(
-        (t) => this.$route.path === t.uuid || this.$route.path === t.route
-      )
+      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) {
@@ -492,10 +465,7 @@ export default {
       if (tab) {
         this.addRouterKey(tab.route, tab.query)
         if (this.activeNav === tab.uuid) {
-          if (
-            this.$route.matched.length &&
-            this.$route.matched[0]['path'] !== '*'
-          ) {
+          if (this.$route.matched.length && this.$route.matched[0]['path'] !== '*') {
             this.$forceUpdate()
           } else {
             window.postMessage({
@@ -523,17 +493,13 @@ export default {
     removeCacheTimerFn() {
       this.removeCacheTimer = setInterval(() => {
         if (this.$refs['content-cache']) {
-          let cache =
-            this.$refs['content-cache'].$vnode.parent.componentInstance.cache
+          let cache = this.$refs['content-cache'].$vnode.parent.componentInstance.cache
           for (let k in cache) {
             if (cache[k]) {
               let kM = k.split('^')
               let _K = kM[0]
               let _V = kM[2]
-              if (
-                window._tab_route_key[_K] &&
-                window._tab_route_key[_K] !== Number(_V)
-              ) {
+              if (window._tab_route_key[_K] && window._tab_route_key[_K] !== Number(_V)) {
                 cache[k].componentInstance.destroy?.()
                 cache[k] = null
               }
@@ -578,3 +544,12 @@ function getShowUuid(uuid, list) {
   return '/'
 }
 </script>
+<style>
+.isMobile {
+  left: 0 !important;
+  top: 8px !important;
+}
+.isMobile .content-box {
+  height: calc(100vh - 16px) !important;
+}
+</style>