n20-common-lib 2.7.0-beta.2 → 2.7.0-beta.21

package/src/components/Layout/HeaderWrap/indexN.vue

@@ -19,17 +19,16 @@
     />
     <!-- <el-divider class="header-wrap-logo-hr" direction="vertical" /> -->
     <div class="m-l-m"></div>
-    <h3 class="header-title m-r-s">{{ headerTitle | $l }}</h3>
-    <div class="m-r-auto p-a-ss pointer header_change_system_box" @click="handleChangeSystem">
+    <h3 :class="['header-title ', showNavigation ? 'm-r-s' : 'm-r-auto']">{{ headerTitle | $l }}</h3>
+    <div v-if="showNavigation" class="m-r-auto p-a-ss pointer header_change_system_box" @click="handleChangeSystem">
       <svg class="icon" aria-hidden="true">
         <use xlink:href="#n20-icon-caidan"></use>
       </svg>
-      <span class="m-l-ss f-s-b color-primary">切换系统</span>
+      <span class="m-l-ss f-s-b color-primary">{{ $lc('导航') }}</span>
       <svg class="icon m-l-ss f-s-s" aria-hidden="true">
         <use xlink:href="#n20-icon-lujing"></use>
       </svg>
     </div>
-    <menuDrawer :visible.sync="menuDrawer" :menus="headerSystem" :callback="getTreeList"></menuDrawer>
 
     <span v-if="byLabel && !inBack" class="header-uif-by">{{ byLabel }}</span>
     <!-- YSCW -->
@@ -78,20 +77,12 @@
       </el-dropdown-menu>
     </el-dropdown>
 
-    <el-tooltip v-if="!hideHelpDoc" :content="'帮助文档' | $lc">
-      <span class="set-user-btn iconfont icon-bangzhuwendang header-color m-l-lg" @click="openHelp"></span>
-    </el-tooltip>
-
-    <el-tooltip v-if="!hideDowApp" :content="'客户端下载' | $lc">
-      <span class="set-user-btn iconfont icon-kehuduanxiazai header-color m-l-lg" @click="dowApp"></span>
-    </el-tooltip>
-
     <el-badge :hidden="noticeNum + afficheNum === 0" :value="noticeNum + afficheNum">
       <span v-if="!noticeDrw" v-popover:noticePop class="news-btn iconfont icon-xiaoxi header-color"></span>
       <span v-else class="news-btn iconfont icon-xiaoxi header-color" @click="customOpt.noticeDrawer"></span>
     </el-badge>
 
-    <el-popover ref="by_popover" v-model="byV" placement="bottom-start" trigger="manual" popper-class="uby-w">
+    <!-- <el-popover ref="by_popover" v-model="byV" placement="bottom-start" trigger="manual" popper-class="uby-w">
       <div class="uby-h flex-box flex-v">
         <i class="uby-h-icon iconfont icon-icon_huanyingmoshi"></i>
         <span
@@ -103,7 +94,7 @@
       <div class="text-r">
         <el-button type="primary" @click="byV = false">{{ '知道了' | $lc }}</el-button>
       </div>
-    </el-popover>
+    </el-popover> -->
 
     <el-dropdown
       ref="userDrop"
@@ -215,6 +206,24 @@
             </el-dropdown-menu>
           </el-dropdown>
         </el-dropdown-item>
+        <el-dropdown-item v-if="!inBack" command="toBack">
+          <div class="flex-box flex-v">
+            <span>{{ '后台管理' | $lc }}</span>
+            <i class="el-icon-caret-right m-l-auto m-r-0"></i>
+          </div>
+        </el-dropdown-item>
+        <el-dropdown-item v-if="!hideHelpDoc" command="openHelp">
+          <div class="flex-box flex-v">
+            <span>{{ '帮助文档' | $lc }}</span>
+            <i class="el-icon-caret-right m-l-auto m-r-0"></i>
+          </div>
+        </el-dropdown-item>
+        <el-dropdown-item v-if="!hideDowApp" command="dowApp">
+          <div class="flex-box flex-v">
+            <span>{{ '客户端下载' | $lc }}</span>
+            <i class="el-icon-caret-right m-l-auto m-r-0"></i>
+          </div>
+        </el-dropdown-item>
         <!-- 系统切换 -->
         <el-dropdown-item v-if="systemChange && systemList && systemList.length">
           <el-dropdown trigger="hover" size="medium" placement="left-start" style="width: 100%">
@@ -223,18 +232,12 @@
               <i class="el-icon-caret-right m-l-auto m-r-0"></i>
             </div>
             <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item v-for="(item, i) in systemList" :key="i" @click.native="clickSystem(item)">
+              <el-dropdown-item v-for="(item, i) in systemList" :key="i" @click.native="clickSystemChange(item)">
                 <span>{{ item.NAME }}</span>
               </el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
         </el-dropdown-item>
-        <el-dropdown-item v-if="!inBack" command="toBack">
-          <div class="flex-box flex-v">
-            <span>{{ '后台管理' | $lc }}</span>
-            <i class="el-icon-caret-right m-l-auto m-r-0"></i>
-          </div>
-        </el-dropdown-item>
         <slot name="header-dropdown"></slot>
         <el-dropdown-item command="logOut">
           <div class="flex-box flex-v">
@@ -285,7 +288,6 @@ import { themeList } from '../../../utils/theme.config'
 import dialogWrap from '../../Dialog/index.vue'
 import operatingStatus from '../../operatingStatus/index.vue'
 import changePwd from './changePwd.vue'
-import menuDrawer from './menuDrawer.vue'
 import noticePop from './noticePop.vue'
 import switchUser from './switchUser.vue'
 
@@ -301,22 +303,86 @@ dayjs.extend(duration)
 import { siteTree2menus } from '../../LoginTemporary/utils'
 
 const prefix = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__ || process.env.BASE_URL || '/'
-
+const SYSTEM_LIST = [
+  {
+    NO: 'CSZHYW',
+    NAME: '财司综合业务系统',
+    ICON: '',
+    LOGIN_MODE: ['account'],
+    LOGIN_FORGET_MODE: ['phoneCode'],
+    OPEN: true
+  },
+  {
+    NO: 'CSYWGL',
+    NAME: '财司业务管理系统',
+    ICON: '',
+    LOGIN_MODE: ['account'],
+    LOGIN_FORGET_MODE: [],
+    OPEN: true
+  },
+  {
+    NO: 'CSFZJC',
+    NAME: '财司辅助决策系统',
+    ICON: '',
+    LOGIN_MODE: ['pthon'],
+    LOGIN_FORGET_MODE: ['ukCode'],
+    OPEN: true
+  },
+  {
+    NO: 'CSWY',
+    NAME: '财司网银系统',
+    ICON: '',
+    LOGIN_MODE: ['qrcode', 'account'],
+    LOGIN_FORGET_MODE: ['phoneCode'],
+    OPEN: true
+  },
+  {
+    NO: 'JTZL',
+    NAME: '财司直连平台系统',
+    ICON: '',
+    LOGIN_MODE: ['accountPthon'],
+    LOGIN_FORGET_MODE: ['phoneCode'],
+    OPEN: true
+  },
+  {
+    NO: 'JRWG',
+    NAME: '金融网关系统',
+    ICON: '',
+    LOGIN_MODE: ['account'],
+    LOGIN_FORGET_MODE: ['ukCode'],
+    OPEN: true
+  },
+  {
+    NO: 'JTSKYWGK',
+    NAME: '集团司库业务管控系统',
+    ICON: '',
+    LOGIN_FORGET_MODE: ['phoneCode'],
+    LOGIN_MODE: ['pthon', 'account'],
+    OPEN: true
+  },
+  {
+    NO: 'JTSKSJFX',
+    NAME: '集团数据分析系统',
+    ICON: '',
+    LOGIN_FORGET_MODE: ['phoneCode'],
+    LOGIN_MODE: ['account'],
+    OPEN: true
+  }
+]
 export default {
   components: {
     dialogWrap,
     changePwd,
     noticePop,
     switchUser,
-    operatingStatus,
-    menuDrawer
+    operatingStatus
   },
   props: {
     beforeLogout: {
       type: Function,
       default: undefined
     },
-    systemChange: {
+    drawerVisible: {
       type: Boolean,
       default: false
     },
@@ -357,6 +423,8 @@ export default {
       hideTheme: undefined,
       userInfo: {},
       userMd: undefined,
+      showNavigation: false,
+      systemChange: false,
       userNo: window.sessionStorage.getItem('userNo'),
       durationTime: $lc('00小时00分00秒'),
       cpwdV: false,
@@ -375,7 +443,6 @@ export default {
       byV: false,
       byLabel: '',
       byEV: false,
-      menuDrawer: false,
       headerUserInfoBg: realUrl('/server-assets/userInfoBg.png'),
       inBack: window.localStorage.getItem('pageInType') === 'inBack'
     }
@@ -388,25 +455,30 @@ export default {
   created() {
     getJsonc('/server-config.jsonc').then(({ _layoutData = {}, loginSetting }) => {
       let _loginSetting = loginSetting || _layoutData.loginSetting
-      this.headerLogoUrl = realUrl(_layoutData.headerLogoUrl, true)
+      this.headerLogoUrl = realUrl(_layoutData.headerLogoUrl)
       this.headerLogoWidth = _layoutData.headerLogoWidth
       this.headerLogoHeight = _layoutData.headerLogoHeight
       this.headerTitle = _layoutData.headerTitle
       this.headerColor = _layoutData.headerColor
-      this.headerBgUrl = realUrl(_layoutData.headerBgUrl, true)
+      this.headerBgUrl = realUrl(_layoutData.headerBgUrl)
       this.headerBgColor = _layoutData.headerBgColor
       this.hideHelpDoc = _layoutData.hideHelpDoc
       this.hideLang = _layoutData.hideLang
       this.hideDowApp = _layoutData.hideDowApp
       this.hideTheme = _layoutData.hideTheme
+      this.showNavigation = _layoutData.showNavigation
+      this.systemChange = _layoutData.systemChange
 
       if (_loginSetting !== 'JSON') {
         this.headerTitle = sessionStorage.getItem('headerTitle') || this.headerTitle
       }
+      if (this.systemChange) {
+        this.systemList = JSON.parse(localStorage.getItem('SYSTEM_LIST')) || SYSTEM_LIST
+      }
       this.show = true
 
       this.getUserImg().catch(() => {
-        this.headerUserUrl = realUrl(_layoutData.headerUserUrl, true)
+        this.headerUserUrl = realUrl(_layoutData.headerUserUrl)
       })
 
       this.getByLabel().then(() => {
@@ -420,7 +492,6 @@ export default {
         }
       })
     })
-    this.systemChange && this.getSystemList()
     this.getNNum()
     document.addEventListener('visibilitychange', this.getNNum)
     window.addEventListener('message', this.updateNotice)
@@ -440,68 +511,58 @@ export default {
     window.removeEventListener('message', this.updateNotice)
   },
   methods: {
-    handleChangeSystem() {
-      this.getTreeList({}, null)
-      let system_list = JSON.parse(localStorage.getItem('SYSTEM_LIST'))
-      let menuTree = JSON.parse(sessionStorage.getItem('menuTree'))
-      let length = system_list.length
+    async handleChangeSystem() {
+      let menuTree = JSON.parse(sessionStorage.getItem('allMenuTree'))
+      this.setMenuData(menuTree)
+    },
+    setMenuData(menuTree) {
+      try {
+        this.headerSystem = SYSTEM_LIST.map((system) => {
+          const icon =
+            {
+              CSZHYW: '#n20-icon-zhcsyw',
+              CSYWGL: '#n20-icon-bianzu',
+              CSFZJC: '#n20-icon-a-bianzu70',
+              CSWY: '#n20-icon-a-bianzu69',
+              JTZL: '#n20-icon-a-bianzu3',
+              JRWG: '#n20-icon-a-bianzu1',
+              JTSKYWGK: '#n20-icon-a-bianzu701',
+              JTSKSJFX: '#n20-icon-a-bianzu2'
+            }[system.NO] || ''
 
-      for (let i = 0; i < length; i++) {
-        switch (system_list[i].NO) {
-          case 'CSZHYW':
-            system_list[i].icon = '#n20-icon-zhcsyw'
-            break
-          case 'CSYWGL':
-            system_list[i].icon = '#n20-icon-bianzu'
-            break
-          case 'CSFZJC':
-            system_list[i].icon = '#n20-icon-a-bianzu70'
-            break
-          case 'CSWY':
-            system_list[i].icon = '#n20-icon-a-bianzu69'
-            break
-          case 'JTZL':
-            system_list[i].icon = '#n20-icon-a-bianzu3'
-            break
-          case 'JRWG':
-            system_list[i].icon = '#n20-icon-a-bianzu1'
-            break
-          case 'JTSKYWGK':
-            system_list[i].icon = '#n20-icon-a-bianzu701'
-            break
-          case 'JTSKSJFX':
-            system_list[i].icon = '#n20-icon-a-bianzu2'
-            break
-        }
-        system_list[i].menuTree = []
-        for (let j = 0; j < menuTree.length; j++) {
-          if (system_list[i].NO === menuTree[j].systemNo && menuTree[j].isBackmenu === '1') {
-            system_list[i].menuTree.push(menuTree[j])
-          }
-        }
+          system.icon = icon
+          system.menuTree = menuTree?.filter(
+            (menu) =>
+              menu.systemNo === system.NO &&
+              menu.isBackmenu === '0' &&
+              (!menu.children || (menu.children && menu.children?.length > 0))
+          )
+          return system
+        }).filter((item) => item.menuTree?.length > 0)
+      } catch (error) {
+        console.log(error)
       }
 
-      this.headerSystem = system_list
-      this.menuDrawer = true
-      console.log(this.headerSystem)
-    },
-    clickMenu(row) {
-      this.$router.push(row.route)
+      this.$emit('update:drawerVisible', !this.drawerVisible)
+      this.$emit('clickSystem', this.headerSystem)
     },
+    async clickSystemChange(item) {
+      await this.getTreeList(item)
+      // localStorage.setItem('pageInType', 'toFront')
+      window.localStorage.setItem('pageInSystemNo', item.NO)
+      // 切换系统的时候清除缓存的页签
+      window.sessionStorage.removeItem('tab-list')
+      let { base = '/' } = this.$router.options
+      if (!/\/$/.test(base)) base += '/'
 
-    /**
-     * 获取系统列表
-     */
-    getSystemList() {
-      this.systemList = JSON.parse(localStorage.getItem('SYSTEM_LIST'))
+      window.location.href = window.location.origin + base + 'dashboard/workplace'
     },
-    async getTreeList(item = {}, resType = 1) {
-      const systemNo = item?.NO
+    async getTreeList(item) {
       let { data } = await axios.get(
         `/bems/1.0/menuTree/tree?t=${Date.now()}`,
         {
-          resType,
-          systemNo
+          resType: 1,
+          systemNo: item.NO
         },
         { loading: false }
       )
@@ -603,6 +664,12 @@ export default {
         case 'toBack':
           this.toBack()
           break
+        case 'dowApp':
+          this.dowApp()
+          break
+        case 'openHelp':
+          this.openHelp()
+          break
         default:
           this.$emit('custom-event', { type: c })
           break

package/src/components/Layout/HeaderWrap/menuDrawer.vue

@@ -1,13 +1,6 @@
 <template>
-  <el-drawer
-    :visible.sync="drawer"
-    custom-class="header-menu-drawer"
-    :with-header="false"
-    :appendToBody="true"
-    direction="ttb"
-    size="45%"
-  >
-    <div class="pointer flex-box flex-wrap">
+  <div class="pointer menu">
+    <div class="menu_drawer_layout menu_drawer_box">
       <div v-for="(item, i) in menus" :key="i" class="menu-system-item">
         <div class="flex-box flex-v" @click="clickSystem(item)">
           <svg
@@ -16,61 +9,77 @@
           >
             <use :xlink:href="item.icon"></use>
           </svg>
-          <span class="m-l-s">{{ item.NAME }}</span>
+          <span class="m-l-s menu-system-item_title">{{ item.NAME }}</span>
         </div>
-        <div v-if="item.menuTree.length" class="flex-box flex-wrap menu-system-child">
-          <div v-for="(row, i) in item.menuTree" :key="i" class="menu-first-item" @click="clickMenu(row)">
-            {{ row.title }}
+        <div v-if="item.menuTree.length" class="menu_drawer_layout menu-system-child">
+          <div
+            v-for="(row, i) in item.menuTree"
+            :key="i"
+            class="menu-first-item"
+            @click="clickMenu(row, item.menuTree)"
+          >
+            <span class="menu-first-item_title">{{ row.title }}</span>
           </div>
         </div>
       </div>
     </div>
-  </el-drawer>
+  </div>
 </template>
 
 <script>
+import axios from '../../../utils/axios.js'
+import { siteTree2menus } from '../../LoginTemporary/utils'
 export default {
   name: 'MenuDrawer',
   props: {
     menus: {
       type: Array,
       default: () => []
-    },
-    visible: {
-      type: Boolean,
-      default: false
-    },
-    callback: {
-      type: Function,
-      default: () => {}
-    }
-  },
-  computed: {
-    drawer: {
-      get() {
-        return this.visible
-      },
-      set(val) {
-        this.$emit('update:visible', val)
-      }
     }
   },
   methods: {
+    async getTreeList(item) {
+      let { data } = await axios.get(
+        `/bems/1.0/menuTree/tree?t=${Date.now()}`,
+        {
+          resType: 1,
+          systemNo: item.NO
+        },
+        { loading: false }
+      )
+      let layoutMenus = siteTree2menus(data || [])
+      sessionStorage.setItem('menuTree', JSON.stringify(layoutMenus))
+    },
     async clickSystem(item) {
-      // localStorage.setItem('pageInType', 'toFront')
+      await this.getTreeList(item)
       window.localStorage.setItem('pageInSystemNo', item.NO)
       // 切换系统的时候清除缓存的页签
       window.sessionStorage.removeItem('tab-list')
       let { base = '/' } = this.$router.options
       if (!/\/$/.test(base)) base += '/'
-
       window.location.href = window.location.origin + base + 'dashboard/workplace'
     },
-    clickMenu(row) {
-      if (row?.children?.length) {
-        this.$router.push(row.children[0].route)
+    async clickMenu(row, MenuTre) {
+      let pageInSystemNo = window.localStorage.getItem('pageInSystemNo')
+      window.localStorage.setItem('pageInType', 'toFront')
+      if (pageInSystemNo === row.systemNo) {
+        this.$emit('clickMenu', false)
+        if (row?.children?.length) {
+          this.$router.push(row.children[0].route)
+        } else {
+          this.$router.push(row.route)
+        }
       } else {
-        this.$router.push(row.route)
+        window.localStorage.setItem('pageInSystemNo', row.systemNo)
+        window.sessionStorage.setItem('menuTree', JSON.stringify(MenuTre))
+        // 切换系统的时候清除缓存的页签
+        window.sessionStorage.removeItem('tab-list')
+        if (row?.children?.length) {
+          window.location.href =
+            window.location.origin + row.children[0].route + `?token=${window.sessionStorage.getItem('token')}`
+        } else {
+          window.location.href = window.location.origin + row.route + `?token=${window.sessionStorage.getItem('token')}`
+        }
       }
     }
   }

package/src/components/Layout/indexN.vue

@@ -7,11 +7,19 @@
       :operation-status="operationStatus"
       :before-logout="beforeLogout"
       :after-logout="afterLogout"
+      :drawerVisible.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>
+    <menuDrawer
+      :class="showDrawerBox ? 'show_drawer' : ''"
+      :menus="systemMenu"
+      @clickMenu="(row) => (this.showDrawerBox = row)"
+    ></menuDrawer>
     <asideNav :menus="menusC" :active-nav="activeNavC" :collapse.sync="collapse" @menu-click="menuClick" />
     <tabsNav
       class="tabs-nav-wrap"
@@ -43,13 +51,15 @@ import { setRela } from '../../utils/relaNo'
 import asideNav from './AsideNav/index.vue'
 import headerWrap from './HeaderWrap/indexN.vue'
 import tabsNav from './TabsNav/index.vue'
+import menuDrawer from './HeaderWrap/menuDrawer.vue'
 
 export default {
   name: 'Layout',
   components: {
     asideNav,
     headerWrap,
-    tabsNav
+    tabsNav,
+    menuDrawer
   },
   filters: {
     keyF({ path, query = {} }) {
@@ -109,7 +119,8 @@ export default {
       clientM,
       clientHeight: document.documentElement.offsetHeight - headerH - tabsH - 1 * clientM,
       collapse: window.localStorage.getItem('aside-nav-collapse') === 'true',
-
+      showDrawerBox: false,
+      systemMenu: [],
       menusC: [],
       menuList: [],
       tabList: [],
@@ -190,6 +201,9 @@ export default {
         refreshTab && this.tabRefresh(refreshTab)
       }
     },
+    clickSystem(menu) {
+      this.systemMenu = menu
+    },
     getCollapse() {
       this.collapse = window.localStorage.getItem('aside-nav-collapse') === 'true'
     },
@@ -207,7 +221,8 @@ export default {
             m.route = base + m.route.replace(/\/$/, '')
             m.route || (m.route = '/')
             m.uuid = m.route
-
+            // 新增一个字段用于接收初始化的url携带参数的处理之后的url
+            m.originPath = getBeforeQuestionMark(m.route)
             menuList.push(m)
           }
         })
@@ -226,6 +241,7 @@ export default {
       this.menusC = menus
       this.menuList = menuList
     },
+
     getTabList() {
       let tabList = JSON.parse(window.sessionStorage.getItem('tab-list')) || []
       this.tabList = tabList
@@ -274,7 +290,6 @@ export default {
     },
     tabClick(tab) {
       this.activeNav = tab.uuid
-
       this.routerPush({
         path: tab.route,
         query: tab.query
@@ -473,8 +488,18 @@ export default {
   }
 }
 
+// 处理携带参数的url，只取参数之前的路径
+function getBeforeQuestionMark(url) {
+  const questionMarkIndex = url.indexOf('?')
+  if (questionMarkIndex !== -1) {
+    return url.slice(0, questionMarkIndex)
+  }
+  return url
+}
+
 function getShowUuid(uuid, list) {
-  let menu = list.find((m) => m.uuid === uuid)
+  // 拿uuid去菜单中找对应的uuid或者originPath,originPath主要用与匹配初始化的菜单上携带参数的问题
+  let menu = list.find((m) => m.uuid === uuid || m.originPath === uuid)
   if (menu) {
     return menu.hide ? menu.pid : menu.uuid
   }