agilebuilder-ui 1.0.0

package/src/router/index.js

@@ -0,0 +1,92 @@
+import * as Vue from 'vue'
+import * as VueRouter from 'vue-router'
+
+/* Layout */
+import Layout from '../views/layout/NewLayout.vue'
+
+/**
+* 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.vue'),
+      },
+    ],
+  },
+  {
+    path: '/iframe-page',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: 'page',
+        component: () => import('../views/layout/components/iframe-page.vue'),
+        hidden: true,
+      },
+    ],
+  },
+  // {
+  //   path: '/login',
+  //   component: () => import('../views/login/index'),
+  //   hidden: true
+  // },
+  {
+    path: '/auth-redirect',
+    component: () => import('../views/login/authredirect.vue'),
+    hidden: true,
+  },
+  {
+    path: '/404',
+    component: () => import('../views/error-page/404.vue'),
+    hidden: true,
+  },
+  {
+    path: '/401',
+    component: () => import('../views/error-page/401.vue'),
+    hidden: true,
+  },
+  {
+    path: '/show-sub-wf-history',
+    component: () => import('../views/wf-history/tache-subprocess-history.vue'),
+    hidden: true,
+  },
+  {
+    path: '/tab-content-index',
+    component: ()=>import('../views/layout/tab-content-index.vue'),
+    hidden: true,
+  },
+  {
+    path: '/tab-content-iframe-index',
+    component: () => import('../views/layout/tab-content-iframe-index.vue'),
+    hidden: true,
+  },
+]
+export const protectedRouterMap = []
+export const errorRouterMap = [
+  // 404的映射必须是最后一个
+  { path: '*', redirect: '/404', hidden: true },
+]
+
+
+export default VueRouter.createRouter({
+  history: VueRouter.createWebHashHistory(),
+  routes: publicRouterMap,
+  scrollBehavior: () => ({
+    top: 0,
+  }),
+})

package/src/store/getters.js

@@ -0,0 +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,
+  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

@@ -0,0 +1,19 @@
+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

@@ -0,0 +1,54 @@
+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

@@ -0,0 +1,143 @@
+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 (
+            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 a = new Date().getTime()
+        const accessableRoutersResult = filterProtectedRouter(
+          protectedRouterMap,
+          currentUserPermissions
+        )
+        const b = new Date().getTime()
+        window.sessionStorage.setItem('generateRoutes==>执行时间:', b - a + '')
+        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)
+        const c = new Date().getTime()
+        window.sessionStorage.setItem(
+          'generateRoutes==>执行时间c-a:',
+          c - a + ''
+        )
+        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