增加菜单权限

src/api/culturalRelic.js

@@ -7,6 +7,16 @@ export function getCulturalRelicList(data) {
     data
   })
 }
+
+export function getCulturalRelicListPer(data) {
+  return request({
+    url: '/bizCulturalRelic/listByPagePer',
+    method: 'post',
+    data
+  })
+}
+
+
 export function addCulturalRelic(data) {
   return request({
     url: '/bizCulturalRelic/add',

src/api/display.js

@@ -8,6 +8,16 @@ export function getList(data) {
     data
   })
 }
+
+// 获取布展列表
+export function getListPer(data) {
+  return request({
+    url: '/bizExhibition/listByPagePer',
+    method: 'post',
+    data
+  })
+}
+
 // 新增
 export function addDisplay(data) {
   return request({

src/api/user.js

@@ -33,7 +33,7 @@ export function logout() {
   })
 }
 
-// 获取菜单权限
+// 获取菜单权限（菜单用此接口）
 export function getMenu() {
   return request({
     url: '/sys/home',

src/api/vitual.js

@@ -9,6 +9,15 @@ export function getVirtualList(data) {
   })
 }
 
+
+export function getVirtualListPer(data) {
+  return request({
+    url: '/bizVirtual/listByPagePer',
+    method: 'post',
+    data
+  })
+}
+
 export function addVirtual(data) {
   return request({
     url: '/bizVirtual/add',

src/layout/components/Sidebar/index.vue

@@ -10,7 +10,7 @@
         :unique-opened="false"
         :active-text-color="variables.menuActiveText"
         :collapse-transition="false"
-        :default-openeds="openeds" 
+        :default-openeds="openeds"
         mode="vertical"
       >
         <sidebar-item
@@ -37,6 +37,9 @@ export default {
     // routes() {
     //   return this.getRoute()
     // },
+    routes() {
+      return this.$store.getters.routerList;
+    },
     activeMenu() {
       const route = this.$route;
       const { meta, path } = route;
@@ -58,25 +61,24 @@ export default {
   },
   data() {
     return {
-      routes: [],
-      openeds:['/business','/system']
+      // routes: [],
+      openeds: ["/business", "/system"],
     };
   },
   created() {
-    this.routes = this.$router.options.routes;
+    // this.routes = this.$router.options.routes;
     // this.routes = this.getRoute()
-  //   let parentArr = []
-  //   for (const key in this.menu) {
-  //     parentArr.push(key+'Menu')
-  //   }
-  //   this.routes.map(item=>{
-  //     parentArr.map(pr=>{
-  //       if (condition) {
-          
-  //       }
-  //     })
-  //   })
-  //   console.log('parentArr',parentArr);
+    //   let parentArr = []
+    //   for (const key in this.menu) {
+    //     parentArr.push(key+'Menu')
+    //   }
+    //   this.routes.map(item=>{
+    //     parentArr.map(pr=>{
+    //       if (condition) {
+    //       }
+    //     })
+    //   })
+    //   console.log('parentArr',parentArr);
   },
   methods: {
     getRoute() {

src/permission.js

 import router from './router'
 import store from './store'
-import {
-  Message
-} from 'element-ui'
+import { Message } from 'element-ui'
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css' // progress bar style
-import {
-  getToken
-} from '@/utils/auth' // get token from cookie
+import { getToken, removeToken } from '@/utils/auth' // get token from cookie
 import getPageTitle from '@/utils/get-page-title'
-
+import { getMenu } from "./api/user";
+import { addRouter } from "./utils/addRouter";
+import user from "./store/modules/user";
 NProgress.configure({
   showSpinner: false
 }) // NProgress Configuration
@@ -24,36 +22,38 @@ router.beforeEach(async (to, from, next) => {
   document.title = getPageTitle(to.meta.title)
 
   // determine whether the user has logged in
-  const hasToken = getToken()
 
-  if (hasToken) {
-    if (to.path === '/login') {
-      // if is logged in, redirect to the home page
-      next({
-        path: '/'
-      })
-      NProgress.done()
+  if (getToken()) {
+    // 判断cookice是否存在 不存在即为未登录
+    if (to.path !== "/login") {
+      if (user.state.init) {
+        // 获取了动态路由 data一定true,就无需再次请求 直接放行
+        next();
+      } else {
+        // data为false,一定没有获取动态路由,就跳转到获取动态路由的方法
+        gotoRouter(to, next);
+      }
     } else {
-      next()
-      NProgress.done()
-      // const hasGetUserInfo = store.getters.name
-      // if (hasGetUserInfo) {
-      //   next()
-      // } else {
-      //   try {
-      //     // get user info
-      //     await store.dispatch('user/getInfo')
-
-      //     next()
-      //   } catch (error) {
-      //     // remove token and go to login page to re-login
-      //     await store.dispatch('user/resetToken')
-      //     Message.error(error || 'Has Error')
-      //     next(`/login?redirect=${to.path}`)
-      //     NProgress.done()
-      //   }
-      // }
+      Message({ message: "您已经登录", type: "info" });
+      next("/");
     }
+    // if (to.path === '/login') {
+    //   // if is logged in, redirect to the home page
+    //   next({
+    //     path: '/'
+    //   })
+    //   NProgress.done()
+    // } else {
+    //   // next()
+    //   // NProgress.done()
+    //   if (user.state.init) {
+    //     // 获取了动态路由 data一定true,就无需再次请求 直接放行
+    //     next();
+    //   } else {
+    //     // data为false,一定没有获取动态路由,就跳转到获取动态路由的方法
+    //     gotoRouter(to, next);
+    //   }
+    // }
   } else {
     /* has no token*/
 
@@ -68,7 +68,34 @@ router.beforeEach(async (to, from, next) => {
   }
 })
 
-router.afterEach(() => {
-  // finish progress bar
-  NProgress.done()
-})
+router.afterEach((to, from) => {
+  NProgress.done(); // 结束Progress
+});
+
+function gotoRouter(to, next) {
+  getMenu() // 获取动态路由的方法
+    .then(res => {
+      console.log("解析后端动态路由", res);
+      const asyncRouter = addRouter(res.data.menus); // 进行递归解析
+      // store.dispatch("user/setroles", res.data.permit);
+      return asyncRouter;
+    })
+    .then(asyncRouter => {
+      // 后置添加404页面,防止刷新404
+      asyncRouter.push({
+        path: "*",
+        redirect: "/404",
+        hidden: true
+      });
+      router.addRoutes(asyncRouter); // vue-router提供的addRouter方法进行路由拼接
+      console.log(asyncRouter);
+      store.dispatch("user/setRouterList", asyncRouter); // 存储到vuex
+      // store.dispatch("user/GetInfo");
+      store.commit("user/set_init", true);
+      next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
+    })
+    .catch(e => {
+      console.log(e);
+      removeToken();
+    });
+}

src/router/index.js

@@ -30,34 +30,54 @@ import Layout from '@/layout'
  * a base page that does not have permission requirements
  * all roles can be accessed
  */
-export const constantRoutes = [{
-    path: '/login',
-    component: () => import('@/views/login/index'),
-    hidden: true
-  },
 
-  {
-    path: '/404',
-    component: () => import('@/views/404'),
-    hidden: true
-  },
 
-  {
-    path: '/',
-    component: Layout,
-    redirect: '/home',
-    name: 'HomeMenu',
-    hidden: false,
-    children: [{
-      path: 'home',
-      name: 'Home',
-      component: () => import('@/views/home/index'),
-      meta: {
-        title: '首页',
-        icon: 'dashboard'
-      }
-    }]
-  },
+/**
+ * 静态路由
+ */
+
+ export const constantRoutes = [{
+  path: '/login',
+  component: () => import('@/views/login/index'),
+  hidden: true
+},
+
+{
+  path: '/404',
+  component: () => import('@/views/404'),
+  hidden: true
+},
+
+{
+  path: '/',
+  component: Layout,
+  redirect: '/home',
+  name: 'HomeMenu',
+  hidden: false,
+  children: [{
+    path: 'home',
+    name: 'Home',
+    component: () => import('@/views/home/index'),
+    meta: {
+      title: '首页',
+      icon: 'dashboard'
+    }
+  }]
+},
+
+// 404 page must be placed at the end !!!
+// {
+//   path: '*',
+//   redirect: '/404',
+//   hidden: true
+// }
+]
+
+
+/**
+ * 需要动态添加的路由
+ */
+export const asyncRouterMap = [
   {
     path: '/business',
     component: Layout,
@@ -163,29 +183,6 @@ export const constantRoutes = [{
       },
     ]
   },
-
-  // {
-  //   path: '/importExport',
-  //   component: Layout,
-  //   name: 'ImportExportMenu',
-  //   hidden: false,
-  //   children: [{
-  //     path: 'importExport',
-  //     name: 'ImportExport',
-  //     component: () => import('@/views/importExport/index'),
-  //     meta: {
-  //       title: '导入记录',
-  //       icon: 'file'
-  //     }
-  //   }]
-  // },
-
-  // 404 page must be placed at the end !!!
-  {
-    path: '*',
-    redirect: '/404',
-    hidden: true
-  }
 ]
 
 const createRouter = () => new Router({

src/store/getters.js

 const getters = {
   sidebar: state => state.app.sidebar,
   device: state => state.app.device,
-  
+
   token: state => state.user.token,
   userInfo: state => state.user.userInfo,
   avatar: state => state.user.avatar,
@@ -10,6 +10,6 @@ const getters = {
 
   dicts: state => state.dict.dicts,
   museumTree: state => state.org.museumTree,
-  
+  routerList: state => state.user.routerList
 }
 export default getters

src/store/modules/user.js

@@ -4,6 +4,7 @@ import {
   getMenu,
   getPermissionTreeAll
 } from '@/api/user'
+import { constantRoutes } from '@/router/index'
 import {
   getToken,
   setToken,
@@ -26,7 +27,9 @@ const getDefaultState = () => {
     menu: getLocalMenu(),
     name: '',
     avatar: '',
-    permissionTree: []
+    permissionTree: [],
+    routerList: [], // 动态路由,
+    init: false, // 是否完成初始化 // 默认未完成
   }
 }
 
@@ -54,6 +57,15 @@ const mutations = {
   SET_PERMISSION_TREE_ALL: (state, permissionTree) => {
     state.permissionTree = permissionTree
   },
+  SET_ROUTER: (state, routerList) => {
+    state.routerList = routerList
+  },
+  set_init: (state, status) => {
+    state.init = status
+  },
+  set_router: (state, routerList) => {
+    state.routerList = routerList
+  },
 }
 
 const actions = {
@@ -80,7 +92,7 @@ const actions = {
         commit('SET_USERINFO', data)
         setToken(data.accessToken)
         setUserInfo(data)
-        resolve()
+        resolve(response)
       }).catch(error => {
         reject(error)
       })
@@ -172,6 +184,10 @@ const actions = {
     })
   },
 
+  // 动态设置路由 此为设置设置途径
+  setRouterList({ commit }, routerList) {
+    commit('set_router', constantRoutes.concat(routerList)) // 进行路由拼接并存储
+  },
 
 }
 

src/utils/addRouter.js

+/**
+ * 生成路由
+ * @param {Array} routerlist 格式化路由
+ * @returns
+ */
+export function addRouter(routerlist) {
+  const router = []
+  try {
+    routerlist.forEach(e => {
+      if (e.path && e.menuName && e.component) {
+        let e_new = {
+          path: e.path,
+          name: e.menuName,
+          component: resolve => e.component === 'Layout' ? require([`@/layout`], resolve) : require([`@/views/${e.component}/index`], resolve)
+        }
+        if (e.children) {
+          const children = addRouter(e.children)
+          // 保存权限
+          e_new = { ...e_new, children: children }
+        }
+        if (e.redirect) {
+          e_new = { ...e_new, redirect: e.redirect }
+        }
+        // if (e.generatemenu === 0) {
+        //   e_new = { ...e_new, hidden: true }
+        // }
+        if (e.icon !== '' && e.menuLabel !== '') {
+          e_new = { ...e_new, meta: { title: e.menuLabel, icon: e.icon } }
+        } else if (e.menuLabel !== '' && e.icon === '') {
+          e_new = { ...e_new, meta: { title: e.menuLabel } }
+        }
+        router.push(e_new)
+      }
+
+    })
+  } catch (error) {
+    console.error(error)
+    return []
+  }
+  return router
+}
\ No newline at end of file

src/utils/index.js

@@ -195,4 +195,28 @@ export function getFullUrl(url) {
 	} else {
 		return (num / 10000).toFixed(1) + 'w'; 
 	}
-}
+}
\ No newline at end of file
+
+// /**
+//  * 树 转 列表
+//  * 广度优先，先进先出
+//  * @param {Array} tree 树状数据
+//  * @param {String} childKey children的key
+//  */
+//  export function treeToList(tree, childKey = 'children') {
+//   let stack = tree.concat([])
+//   let data = []
+//   while (stack.length !== 0) {
+//     // 从stack中拿出来分析
+//     let shift = stack.shift() // stack.pop()  先进后出
+//     data.push(shift)
+//     let children = shift[childKey]
+//     if (children) {
+//       for (let i = 0; i < children.length; i++) {
+//         // 把数据放入stack中
+//         stack.push(children[i])
+//       }
+//     }
+//   }
+//   return data
+// }

src/views/culturalRelic/components/ImportRecordDialog.vue

@@ -111,21 +111,21 @@ export default {
         status: "",
       },
       searchConfig: [
-        {
-          prop: "type",
-          type: "select",
-          label: "所属分类",
-          selectOptions: [
-            {
-              label: "文物",
-              value: "biz_cultural_relic",
-            },
-            {
-              label: "展览",
-              value: "biz_exhibition",
-            },
-          ],
-        },
+        // {
+        //   prop: "type",
+        //   type: "select",
+        //   label: "所属分类",
+        //   selectOptions: [
+        //     {
+        //       label: "文物",
+        //       value: "biz_cultural_relic",
+        //     },
+        //     {
+        //       label: "展览",
+        //       value: "biz_exhibition",
+        //     },
+        //   ],
+        // },
         {
           prop: "batchNum",
           type: "input",

src/views/culturalRelic/index.vue

@@ -143,7 +143,7 @@ import TableOperation from "@/components/Table/TableOperation.vue";
 import SearchBar from "@/components/SearchBar";
 import { title, operates, operations } from "./config";
 import {
-  getCulturalRelicList,
+  getCulturalRelicListPer,
   getRCDetailById,
   deleteCultralRelic,
   editCulturalRelic,
@@ -297,7 +297,7 @@ export default {
       if (params.status == "") {
         delete params.status;
       }
-      let res = await getCulturalRelicList(params);
+      let res = await getCulturalRelicListPer(params);
       if (res.code == 0) {
         this.list = res.data;
       }
@@ -313,7 +313,7 @@ export default {
         page: this.list.current,
         limit: this.list.size,
       };
-      let res = await getCulturalRelicList(params);
+      let res = await getCulturalRelicListPer(params);
       if (res.code == 0) {
         // debugger
         this.list = res.data;

src/views/display/components/ExhibitionUnit.vue

@@ -166,7 +166,7 @@
 <script>
 let euId = 1000;
 import ManualUploader from "@/components/Uploader/ManualUploader.vue";
-import { getCulturalRelicList } from "@/api/culturalRelic";
+import { getCulturalRelicListPer } from "@/api/culturalRelic";
 import VueQuillEditor from "@/components/VueQuillEditor";
 
 export default {
@@ -248,7 +248,7 @@ export default {
       };
       setTimeout(async () => {
         this.loading = false;
-        const res = await getCulturalRelicList(params);
+        const res = await getCulturalRelicListPer(params);
         if (res.code == 0) {
           this.CRList = res.data.records;
         } else {

src/views/display/index.vue

@@ -98,7 +98,7 @@ import TablePage from "@/components/Table/TablePage.vue";
 import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import {
-  getList,
+  getListPer,
   deleteDisplay,
   getDisplayById,
   editDisplay,
@@ -219,7 +219,7 @@ export default {
       if (params.status == "") {
         delete params.status;
       }
-      let res = await getList(params);
+      let res = await getListPer(params);
       if (res.code == 0) {
         this.list = res.data;
       }
@@ -235,7 +235,7 @@ export default {
         page: this.list.current,
         limit: this.list.size,
       };
-      let res = await getList(params);
+      let res = await getListPer(params);
       if (res.code == 0) {
         console.log(res.data);
         this.list = res.data;

src/views/log/index.vue

@@ -6,7 +6,6 @@
     <TablePage
       :data="list.records"
       :tableTitle="tableTitle"
-      :operates="tableOperates"
     >
     </TablePage>
 
@@ -84,9 +83,6 @@ export default {
     tableTitle() {
       return title;
     },
-    tableOperates() {
-      return operates;
-    },
     tableOperations() {
       return operations;
     },

src/views/login/index.vue

@@ -158,7 +158,7 @@ export default {
             .dispatch("user/login", this.loginForm)
             .then(async() => {
               // debugger
-              await this.$store.dispatch('user/getMenuList')
+              // await this.$store.dispatch('user/getMenuList')
               this.$router.push({ path: this.redirect || "/" });
               this.loading = false;
             })

src/views/virtual/index.vue

@@ -75,7 +75,7 @@
 import TablePage from "@/components/Table/TablePage.vue";
 import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
-import { deleteVirtual, editVirtual, getVirtualList } from "@/api/vitual";
+import { deleteVirtual, editVirtual, getVirtualListPer } from "@/api/vitual";
 import InfoEditDialog from "./components/InfoEditDialog";
 import SearchBar from "@/components/SearchBar";
 
@@ -173,7 +173,7 @@ export default {
         delete params.status;
       }
       console.log("params", params);
-      let res = await getVirtualList(params);
+      let res = await getVirtualListPer(params);
       if (res.code == 0) {
         this.list = res.data;
       }
@@ -189,7 +189,7 @@ export default {
         page: this.list.current,
         limit: this.list.size,
       };
-      let res = await getVirtualList(params);
+      let res = await getVirtualListPer(params);
       if (res.code == 0) {
         this.list = res.data;
       }

vue.config.js

@@ -31,8 +31,8 @@ module.exports = {
   lintOnSave: false,
   productionSourceMap: false,
   devServer: {
-    // host: '172.24.100.18',
-    host:'127.0.0.1',
+    host: '172.24.100.139',
+    // host:'127.0.0.1',
     port: port,
     open: true,
     overlay: {
@@ -41,7 +41,7 @@ module.exports = {
     },
     proxy: {
       '/api': {
-        // target: 'http://192.168.1.230:9566/api',
+        // target: 'http://172.24.100.109:8080/',
         target:'http://222.85.214.245:9566/api',
         changeOrigin: true,
         pathRewrite: {