imatrix-ui 0.0.15 → 0.1.1-up

package/src/router/index.js

@@ -1,69 +1,96 @@
-import Vue from 'vue'
-import Router from 'vue-router'
-
-// in development-env not use lazy-loading, because lazy-loading too many pages will cause webpack hot update too slow. so only in production use lazy-loading;
-// detail: https://panjiachen.github.io/vue-element-admin-site/#/lazy-loading
-
-Vue.use(Router)
-
-/* Layout */
-import Layout from '../views/layout/Layout'
-
-/**
-* hidden: true                   if `hidden:true` will not show in the sidebar(default is false)
-* alwaysShow: true               if set true, will always show the root menu, whatever its child routes length
-*                                if not set alwaysShow, only more than one route under the children
-*                                it will becomes nested mode, otherwise not show the root menu
-* redirect: noredirect           if `redirect:noredirect` will no redirect in the breadcrumb
-* name:'router-name'             the name is used by <keep-alive> (must set!!!)
-* meta : {
-    title: 'title'               the name show in submenu and breadcrumb (recommend set)
-    icon: 'svg-name'             the icon show in the sidebar,
-  }
-**/
-export const publicRouterMap = [
-  {
-    path: '/redirect',
-    component: Layout,
-    hidden: true,
-    children: [
-      {
-        path: '/redirect/:path*',
-        component: () => import('../views/redirect/index')
-      }
-    ]
-  },
-  // {
-  //   path: '/login',
-  //   component: () => import('../views/login/index'),
-  //   hidden: true
-  // },
-  {
-    path: '/auth-redirect',
-    component: () => import('../views/login/authredirect'),
-    hidden: true
-  },
-  {
-    path: '/404',
-    component: () => import('../views/error-page/404'),
-    hidden: true
-  },
-  {
-    path: '/401',
-    component: () => import('../views/error-page/401'),
-    hidden: true
-  }
-
-]
-export const protectedRouterMap = [
-
-]
-export const errorRouterMap = [
-  // 404的映射必须是最后一个
-  { path: '*', redirect: '/404', hidden: true }
-]
-export default new Router({
-  // mode: 'history', //后端支持可开
-  scrollBehavior: () => ({ y: 0 }),
-  routes: publicRouterMap
-})
+import * as Vue from 'vue'
+import * as VueRouter from 'vue-router'
+
+/* Layout */
+import Layout from '../views/layout/NewLayout.vue'
+
+export const publicRouterMap = [
+  {
+    path: '/redirect',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: '/redirect/:path*',
+        component: Vue.defineAsyncComponent(
+          () => import('../views/redirect/index.vue')
+        ),
+      },
+    ],
+  },
+  {
+    path: '/iframe-page',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: 'page',
+        component: Vue.defineAsyncComponent(
+          () => import('../views/layout/components/iframe-page.vue')
+        ),
+        hidden: true,
+      },
+    ],
+  },
+  // {
+  //   path: '/login',
+  //   component: () => import('../views/login/index'),
+  //   hidden: true
+  // },
+  {
+    path: '/auth-redirect',
+    component: Vue.defineAsyncComponent(
+      () => import('../views/login/authredirect.vue')
+    ),
+    hidden: true,
+  },
+  {
+    path: '/404',
+    component: Vue.defineAsyncComponent(
+      () => import('../views/error-page/404.vue')
+    ),
+    hidden: true,
+  },
+  {
+    path: '/401',
+    component: Vue.defineAsyncComponent(
+      () => import('../views/error-page/401.vue')
+    ),
+    hidden: true,
+  },
+  {
+    path: '/show-sub-wf-history',
+    component: Vue.defineAsyncComponent(
+      () => import('../views/wf-history/tache-subprocess-history.vue')
+    ),
+    hidden: true,
+  },
+  {
+    path: '/tab-content-index',
+    component: Vue.defineAsyncComponent(
+      () => import('../views/layout/tab-content-index.vue')
+    ),
+    hidden: true,
+  },
+  {
+    path: '/tab-content-iframe-index',
+    component: Vue.defineAsyncComponent(
+      () => import('../views/layout/tab-content-iframe-index.vue')
+    ),
+    hidden: true,
+  },
+]
+export const protectedRouterMap = []
+// 404的映射必须是最后一个
+export const errorRouterMap = [
+    { path: '*', redirect: '/404', hidden: true }
+]
+
+
+export default VueRouter.createRouter({
+  history: VueRouter.createWebHashHistory(),
+  routes: publicRouterMap, // mode: 'history', //后端支持可开
+  scrollBehavior: () => ({
+    top: 0,
+  }),
+})

package/src/store/getters.js

@@ -1,10 +1,15 @@
-const getters = {
-  sidebar: state => state.app.sidebar,
-  device: state => state.app.device,
-  token: state => state.user.token,
-  name: state => state.user.name,
-  // routers: state => state.permission.routers,
-  protectedRouters: state => state.permission.protectedRouters,
-  currentUserPermissions: state => state.permission.currentUserPermissions
-}
-export default getters
+const getters = {
+  sidebar: (state) => state.app.sidebar,
+  device: (state) => state.app.device,
+  token: (state) => state.user.token,
+  name: (state) => state.user.name,
+  // routers: state => state.permission.routers,
+  protectedRouters: (state) => state.permission.protectedRouters,
+  currentUserPermissions: (state) => state.permission.currentUserPermissions,
+  preventReclick: (state) => state.app.preventReclick,
+  menus: (state) => state.user.menus,
+  openTab: (state) => state.tabContent.openTab,
+  activeIndex: (state) => state.tabContent.activeIndex,
+  whiteList: (state) => state.app.whiteList,
+}
+export default getters

package/src/store/index.js

@@ -1,19 +1,19 @@
-import Vue from 'vue'
-import Vuex from 'vuex'
-import app from './modules/app'
-import user from './modules/user'
-import permission from './modules/permission'
-import getters from './getters'
-
-Vue.use(Vuex)
-
-const store = new Vuex.Store({
-  modules: {
-    app,
-    user,
-    permission
-  },
-  getters
-})
-
-export default store
+import * as Vue from 'vue'
+import * as Vuex from 'vuex'
+import app from './modules/app'
+import user from './modules/user'
+import permission from './modules/permission'
+import tabContent from './modules/tab-content'
+import getters from './getters'
+
+const store = Vuex.createStore({
+  modules: {
+    app,
+    user,
+    permission,
+    tabContent,
+  },
+  getters,
+})
+
+export default store

package/src/store/modules/app.js

@@ -1,42 +1,54 @@
-import sessionStorage from 'sessionstorage'
-const app = {
-  state: {
-    sidebar: {
-      opened: !+sessionStorage.getItem('sidebarStatus'),
-      withoutAnimation: false
-    },
-    device: 'desktop'
-  },
-  mutations: {
-    toggleSidebar: state => {
-      if (state.sidebar.opened) {
-        sessionStorage.setItem('sidebarStatus', 1)
-      } else {
-        sessionStorage.setItem('sidebarStatus', 0)
-      }
-      state.sidebar.opened = !state.sidebar.opened
-      state.sidebar.withoutAnimation = false
-    },
-    closeSidebar: (state, withoutAnimation) => {
-      sessionStorage.setItem('sidebarStatus', 1)
-      state.sidebar.opened = false
-      state.sidebar.withoutAnimation = withoutAnimation
-    },
-    toggleDevice: (state, device) => {
-      state.device = device
-    }
-  },
-  actions: {
-    toggleSidebar: ({ commit }) => {
-      commit('toggleSidebar')
-    },
-    closeSidebar({ commit }, { withoutAnimation }) {
-      commit('closeSidebar', withoutAnimation)
-    },
-    toggelDevice({ commit }, device) {
-      commit('toggleDevice', device)
-    }
-  }
-}
-
-export default app
+const app = {
+  state: {
+    sidebar: {
+      opened: !+window.sessionStorage.getItem('sidebarStatus'),
+      withoutAnimation: false,
+    },
+    device: 'desktop',
+    preventReclick: false,
+    whiteList: [],
+  },
+  mutations: {
+    toggleSidebar: (state) => {
+      if (state.sidebar.opened) {
+        window.sessionStorage.setItem('sidebarStatus', 1)
+      } else {
+        window.sessionStorage.setItem('sidebarStatus', 0)
+      }
+      state.sidebar.opened = !state.sidebar.opened
+      state.sidebar.withoutAnimation = false
+    },
+    closeSidebar: (state, withoutAnimation) => {
+      window.sessionStorage.setItem('sidebarStatus', 1)
+      state.sidebar.opened = false
+      state.sidebar.withoutAnimation = withoutAnimation
+    },
+    toggleDevice: (state, device) => {
+      state.device = device
+    },
+    togglePreventReclick: (state, preventReclick) => {
+      state.preventReclick = preventReclick
+    },
+    setWhiteList: (state, whiteList) => {
+      if (whiteList instanceof Array) {
+        state.whiteList = whiteList
+      }
+    },
+  },
+  actions: {
+    toggleSidebar: ({ commit }) => {
+      commit('toggleSidebar')
+    },
+    closeSidebar({ commit }, { withoutAnimation }) {
+      commit('closeSidebar', withoutAnimation)
+    },
+    toggelDevice({ commit }, device) {
+      commit('toggleDevice', device)
+    },
+    addWhiteList({ commit }, whiteList) {
+      commit('setWhiteList', whiteList)
+    },
+  },
+}
+
+export default app

package/src/store/modules/permission.js

@@ -1,73 +1,137 @@
-import { protectedRouterMap } from '../../router'
-
-/**
- * 通过meta.role判断是否与当前用户权限匹配
- * @param roles
- * @param route
- */
-function hasPermission(currentUserPermissions, route) {
-  let result = false
-  for (const permission of currentUserPermissions) {
-    if (permission.toLowerCase() === route.meta.permission.toLowerCase()) {
-      result = true
-      break
-    }
-  }
-  return result
-}
-
-/**
- * 递归过滤受权限保护的路由表，返回符合用户权限的路由表
- * @param allRoutes 即protectedRouterMap
- * @param currentUserPermissions 后台返回的当前用户具有的权限
- */
-function filterProtectedRouter(allRoutes, currentUserPermissions) {
-  const res = []
-
-  allRoutes.forEach(route => {
-    const tmp = { ...route }
-    if (tmp.children) {
-      tmp.children = filterProtectedRouter(tmp.children, currentUserPermissions)
-      if (tmp.children) {
-        res.push(tmp)
-      }
-    } else {
-      if (hasPermission(currentUserPermissions, tmp)) {
-        res.push(tmp)
-      }
-    }
-  })
-
-  return res
-}
-
-const permission = {
-  state: {
-    // routers: publicRouterMap,
-    protectedRouters: [],
-    currentUserPermissions: []
-  },
-  mutations: {
-    setCurrentUserPermissions: (state, currentUserPermissions) => {
-      state.currentUserPermissions = currentUserPermissions
-    },
-    setRouters: (state, routers) => {
-      state.protectedRouters = routers
-      // 把公共路由，用户有权限的路由，错误路由合并后就是当前用户的完整路由表
-      // state.routers = publicRouterMap.concat(routers).concat(errorRouterMap)
-    }
-  },
-  actions: {
-    generateRoutes({ commit }, data) {
-      return new Promise(resolve => {
-        const currentUserPermissions = data
-        commit('setCurrentUserPermissions', currentUserPermissions)
-        const accessableRouters = filterProtectedRouter(protectedRouterMap, currentUserPermissions)
-        commit('setRouters', accessableRouters)
-        resolve()
-      })
-    }
-  }
-}
-
-export default permission
+import { protectedRouterMap } from '../../router'
+
+/**
+ * 通过meta.role判断是否与当前用户权限匹配
+ * @param roles
+ * @param route
+ */
+function hasPermission(currentUserPermissions, route) {
+  let result = true
+  const orgPermission = route.meta.permission
+  if (orgPermission) {
+    result = false
+    const currentPermission = orgPermission.replace(/\./g, '__')
+    const permissionResult = currentUserPermissions[currentPermission]
+    if (permissionResult !== undefined && permissionResult === true) {
+      result = true
+    }
+  }
+  return result
+}
+
+/**
+ * 递归过滤受权限保护的路由表，返回符合用户权限的路由表
+ * @param allRoutes 即protectedRouterMap
+ * @param currentUserPermissions 后台返回的当前用户具有的权限
+ */
+function filterProtectedRouter(allRoutes, currentUserPermissions) {
+  // console.log('filterProtectedRouter--', allRoutes)
+  const res = []
+  const menuRouters = []
+
+  allRoutes.forEach((route) => {
+    const tmp = { ...route }
+
+    if (tmp.children && tmp.children.length > 0) {
+      const routerResult = filterProtectedRouter(
+        tmp.children,
+        currentUserPermissions
+      )
+      // 所有有权限的路由，包括不是菜单的路由
+      tmp.children = routerResult.allRouters
+      // 所有菜单路由
+      tmp.menuChildren = routerResult.menuRouters
+      if (tmp.menuChildren && tmp.menuChildren.length > 0) {
+        if (tmp.redirectTmp) {
+          tmp.redirectTmp = tmp.redirectTmp + '/' + tmp.menuChildren[0].path
+        } else {
+          tmp.redirectTmp = tmp.path + '/' + tmp.menuChildren[0].path
+        }
+        res.push(tmp)
+        menuRouters.push(tmp)
+      }
+    } else {
+      if (tmp.path === '') {
+        // 表示是空路由,即系统路由
+        res.push(tmp)
+      } else {
+        if (hasPermission(currentUserPermissions, tmp)) {
+          if (
+            typeof tmp.hidden === 'undefined' ||
+            (typeof tmp.hidden !== 'undefined' && tmp.hidden === false)
+          ) {
+            menuRouters.push(tmp)
+          }
+          res.push(tmp)
+        }
+      }
+    }
+  })
+
+  return { allRouters: res, menuRouters: menuRouters }
+}
+
+const permission = {
+  state: {
+    // routers: publicRouterMap,
+    protectedRouters: [],
+    currentUserPermissions: [],
+  },
+  mutations: {
+    setCurrentUserPermissions: (state, currentUserPermissions) => {
+      state.currentUserPermissions = currentUserPermissions
+    },
+    setRouters: (state, routers) => {
+      state.protectedRouters = routers
+      // 把公共路由，用户有权限的路由，错误路由合并后就是当前用户的完整路由表
+      // state.routers = publicRouterMap.concat(routers).concat(errorRouterMap)
+    },
+  },
+  actions: {
+    generateRoutes({ commit }, data) {
+      return new Promise((resolve) => {
+        const currentUserPermissions = data
+        // commit('setCurrentUserPermissions', currentUserPermissions)
+        const accessableRoutersResult = filterProtectedRouter(
+          protectedRouterMap,
+          currentUserPermissions
+        )
+        const accessableRouters = accessableRoutersResult.allRouters
+        const allMenuRoutes = accessableRoutersResult.menuRouters
+        // console.log('有权限的路由表结果==', accessableRouters)
+        // 动态添加空路由（即系统路由）
+        if (accessableRouters.length > 0) {
+          // 获得所有菜单路由
+          // console.log('allMenuRoutes==', allMenuRoutes)
+          const emptyPathRouter = {
+            path: '',
+          }
+          if (allMenuRoutes.length > 0) {
+            if (accessableRouters[0].path !== '') {
+              // 表示不包含空路由，需要添加空路由
+              if (allMenuRoutes[0].redirectTmp) {
+                emptyPathRouter.redirect = allMenuRoutes[0].redirectTmp
+              }
+              accessableRouters.push(emptyPathRouter)
+            } else if (
+              allMenuRoutes.length > 0 &&
+              accessableRouters[0].path === '' &&
+              (!allMenuRoutes[0].children ||
+                allMenuRoutes[0].children.length === 0)
+            ) {
+              // 表示自己配置了空路由，且没有子路由
+              if (allMenuRoutes[0].redirectTmp) {
+                accessableRouters[0].redirect = allMenuRoutes[0].redirectTmp
+              }
+            }
+            // console.log('更新后的有权限的路由表结果，更新了根路由跳转的地址==', accessableRouters)
+          }
+        }
+        commit('setRouters', accessableRouters)
+        resolve()
+      })
+    },
+  },
+}
+
+export default permission

package/src/store/modules/tab-content.js

@@ -0,0 +1,36 @@
+const tabContent = {
+  state: {
+    openTab: [], // 所有打开的路由
+    activeIndex: null, // 激活状态
+  },
+  mutations: {
+    // 添加tabs
+    add_tabs(state, data) {
+      state.openTab.push(data)
+    },
+    // 删除tabs
+    delete_tabs(state, route) {
+      let index = 0
+      for (const option of state.openTab) {
+        if (option.code === route.code) {
+          break
+        }
+        index++
+      }
+      state.openTab.splice(index, 1)
+    },
+    // 设置当前激活的tab
+    set_active_index(state, index) {
+      state.activeIndex = index
+    },
+    // 清空tabs
+    clear_tabs(state, route) {
+      if (state.openTab.length > 0) {
+        state.openTab.splice(0, state.openTab.length)
+      }
+    },
+  },
+  actions: {},
+}
+
+export default tabContent