浏览代码

Merge branch 'dev' of http://94.191.59.107:3000/wukai/lzga-doc into dev

yxc 2 年之前
父节点
当前提交
5e8e4aebc8
共有 2 个文件被更改,包括 275 次插入213 次删除
  1. 28 5
      src/store/modules/permission.js
  2. 247 208
      src/views1/HomeView.vue

+ 28 - 5
src/store/modules/permission.js

@@ -1,6 +1,11 @@
 import auth from '@/plugins/auth'
-import router, { constantRoutes, dynamicRoutes } from '@/router'
-import { getRouters } from '@/api/menu'
+import router, {
+  constantRoutes,
+  dynamicRoutes
+} from '@/router'
+import {
+  getRouters
+} from '@/api/menu'
 import Layout from '@/layout/index'
 import ParentView from '@/components/ParentView'
 import InnerLink from '@/layout/components/InnerLink'
@@ -30,7 +35,9 @@ const permission = {
   },
   actions: {
     // 生成路由
-    GenerateRoutes({ commit }) {
+    GenerateRoutes({
+      commit
+    }) {
       return new Promise(resolve => {
         // 向后端请求路由数据
         getRouters().then(res => {
@@ -39,7 +46,11 @@ const permission = {
           const sidebarRoutes = filterAsyncRouter(sdata)
           const rewriteRoutes = filterAsyncRouter(rdata, false, true)
           const asyncRoutes = filterDynamicRoutes(dynamicRoutes);
-          rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true })
+          rewriteRoutes.push({
+            path: '*',
+            redirect: '/404',
+            hidden: true
+          })
           router.addRoutes(asyncRoutes);
           commit('SET_ROUTES', rewriteRoutes)
           commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes))
@@ -67,7 +78,11 @@ function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
       } else if (route.component === 'InnerLink') {
         route.component = InnerLink
       } else {
-        route.component = loadView(route.component)
+        if (route.path.startsWith("/home")) {
+          route.component = loadView1(route.component)
+        } else {
+          route.component = loadView(route.component)
+        }
       }
     }
     if (route.children != null && route.children && route.children.length) {
@@ -129,5 +144,13 @@ export const loadView = (view) => {
     return () => import(`@/views/${view}`)
   }
 }
+export const loadView1 = (view) => {
+  if (process.env.NODE_ENV === 'development') {
+    return (resolve) => require([`@/views1/${view}`], resolve)
+  } else {
+    // 使用 import 实现生产环境的路由懒加载
+    return () => import(`@/views1/${view}`)
+  }
+}
 
 export default permission

+ 247 - 208
src/views1/HomeView.vue

@@ -17,10 +17,10 @@
               <img :src="srcIndex == '0'
                   ? icoUrl[0]['home1']
                   : icoUrl[0]['home2']
-                " /> 
+                " />
             </span>首页
             <!-- <span class="nav1">
-              <img :src="icoUrl[srcIndex]['home'+srcIndex]" /> 
+              <img :src="icoUrl[srcIndex]['home'+srcIndex]" />
             </span>首页 -->
           </el-menu-item>
           <el-menu-item index="/home/retrieval">
@@ -35,13 +35,17 @@
               <span class="nav1">
                 <img :src="srcIndex == '2' ? icoUrl[2]['doc1'] : icoUrl[2]['doc2']" /> </span>文档管理
             </template>
-            <el-menu-item index="/home/file/part">部门文档</el-menu-item>
-            <el-menu-item index="/home/file/publi">公共文档</el-menu-item>
+            <template v-for="(item, index) in  docMenus">
+              <el-menu-item :index="item.path">{{item.meta.title}}</el-menu-item>
+            </template>
+            <!-- <li v-for="(item, index) in arr" :key="index"> -->
+            <!-- <el-menu-item index="/home/file/part">部门文档</el-menu-item>
+            <el-menu-item index="/home/doc/public">公共文档</el-menu-item>
             <el-menu-item index="/home/file/Storage">分组文档</el-menu-item>
-            <el-menu-item index="/home/file/individual">个人文档</el-menu-item>
-            <!-- <el-menu-item index="/home/file/set">文档设置</el-menu-item> -->
+            <el-menu-item index="/home/file/set">文档设置</el-menu-item>
             <el-menu-item index="/home/file/level">文档级别</el-menu-item>
-            <el-menu-item index="/home/file/demand">扩容申请</el-menu-item>
+            <el-menu-item index="/home/file/demand">扩容申请</el-menu-item> -->
+            <!-- <el-menu-item index="/home/file/individual">个人文档</el-menu-item> -->
           </el-submenu>
           <el-submenu index="3">
             <template slot="title">
@@ -52,12 +56,15 @@
                   " />
                 <!-- <img src="../assets/img/nav-person1.png"> --> </span>个人设置
             </template>
-            <el-menu-item index="/home/personal/Partspace">部门存储空间</el-menu-item>
+            <template v-for="(item, index) in  settingMenus">
+              <el-menu-item :index="item.path">{{item.meta.title}}</el-menu-item>
+            </template>
+            <!-- <el-menu-item index="/home/personal/Partspace">部门存储空间</el-menu-item>
             <el-menu-item index="/home/personal/Publispace">公共存储空间</el-menu-item>
             <el-menu-item index="/home/personal/Storagespace">分组存储空间</el-menu-item>
             <el-menu-item index="/home/personal/space">个人存储空间</el-menu-item>
             <el-menu-item index="/home/personal/modify">登录密码修改</el-menu-item>
-            <el-menu-item index="/home/personal/identificat">文字识别</el-menu-item>
+            <el-menu-item index="/home/personal/identificat">文字识别</el-menu-item> -->
           </el-submenu>
           <!-- <el-submenu index="4">
             <template slot="title">
@@ -110,252 +117,284 @@
 </template>
 
 <script>
-// import page from "./Page/PageView";
-// import retrieval from "./Retrieval/RetrievalView";
-// import file from "./File/FileView";
-// import personal from "./Personal/PersonalView";
-// import system from "./System/SystemView";
+  // import page from "./Page/PageView";
+  // import retrieval from "./Retrieval/RetrievalView";
+  // import file from "./File/FileView";
+  // import personal from "./Personal/PersonalView";
+  // import system from "./System/SystemView";
+  import {
+    constantRoutes
+  } from "@/router";
 
-export default {
-  data() {
-    return {
-      // activeIndex: '',
-      srcIndex: "",
-      // username:this.$store.username,
+  export default {
+    data() {
+      return {
+        // activeIndex: '',
+        srcIndex: "",
+        // username:this.$store.username,
 
-      // 图片数组
-      icoUrl: [
-        {
-          home1: require("../assets/img/nav-home1.png"),
-          home2: require("../assets/img/nav-home.png"),
-        },
-        {
-          search1: require("../assets/img/nav-search1.png"),
-          search2: require("../assets/img/nav-search.png"),
-        },
-        {
-          doc1: require("../assets/img/nav-doc1.png"),
-          doc2: require("../assets/img/nav-doc.png"),
-        },
-        {
-          person1: require("../assets/img/nav-person1.png"),
-          person2: require("../assets/img/nav-person.png"),
-        },
-        {
-          search1: require("../assets/img/nav-setting1.png"),
-          search2: require("../assets/img/nav-setting.png"),
-        },
-        {
-          group1: require("../assets/img/nav-group1.png"),
-          group2: require("../assets/img/nav-group.png"),
-        },
-      ],
-    };
-  },
-  // components: {
-  //   page,
-  //   retrieval,
-  //   file,
-  //   personal,
-  //   system
-  // },
-  created() {
-    // console.log(this.$cache.local.get('USERNAME')) // 输出'local value'
-  },
-  mounted() {
-    this.srcIndex = localStorage.getItem('currentSrcIndex')
-  },
-  methods: {
-    handleSelect(key,keyPath) {
-      // console.log(keyPath);
-      this.getSrcIndex(keyPath)      
-      //点击之后存到本地存储,便于刷新之后调用
-      localStorage.setItem('currentSrcIndex', this.srcIndex)
-    },
-    getSrcIndex(keyPathArr) {
-      // 如果是顶级目录,需要手动判断 srcIndex
-      if (keyPathArr.length == 1) {
-        if (keyPathArr[0] == '/home/page') {
-          this.srcIndex = '0'
-        } else if (keyPathArr[0] == '/home/retrieval') {
-          this.srcIndex = '1'
-        }
-      } else {
-        const currentSrcIndex = keyPathArr[0]
-        this.srcIndex = currentSrcIndex
-      }
+        // 图片数组
+        icoUrl: [{
+            home1: require("../assets/img/nav-home1.png"),
+            home2: require("../assets/img/nav-home.png"),
+          },
+          {
+            search1: require("../assets/img/nav-search1.png"),
+            search2: require("../assets/img/nav-search.png"),
+          },
+          {
+            doc1: require("../assets/img/nav-doc1.png"),
+            doc2: require("../assets/img/nav-doc.png"),
+          },
+          {
+            person1: require("../assets/img/nav-person1.png"),
+            person2: require("../assets/img/nav-person.png"),
+          },
+          {
+            search1: require("../assets/img/nav-setting1.png"),
+            search2: require("../assets/img/nav-setting.png"),
+          },
+          {
+            group1: require("../assets/img/nav-group1.png"),
+            group2: require("../assets/img/nav-group.png"),
+          },
+        ]
+      };
     },
-    exit() {
-      alert("你确定要注销界面吗?");
-      this.$router.push("/login1");
+    // components: {
+    //   page,
+    //   retrieval,
+    //   file,
+    //   personal,
+    //   system
+    // },
+    created() {
+      console.log(this.routers)
+
     },
-  },
-  computed: {
-    activeIndex() {
-      const path = this.$route.path;
-      return path;
+    mounted() {
+      this.srcIndex = localStorage.getItem('currentSrcIndex')
     },
-    names(){
-      const paths = this.$store.state.user.uname;
-      return paths;
+    methods: {
+      handleSelect(key, keyPath) {
+        // console.log(keyPath);
+        this.getSrcIndex(keyPath)
+        //点击之后存到本地存储,便于刷新之后调用
+        localStorage.setItem('currentSrcIndex', this.srcIndex)
+      },
+      getNavTable() {
+        // getNavTableApi().then
+      },
+      getSrcIndex(keyPathArr) {
+        // 如果是顶级目录,需要手动判断 srcIndex
+        if (keyPathArr.length == 1) {
+          if (keyPathArr[0] == '/home/page') {
+            this.srcIndex = '0'
+          } else if (keyPathArr[0] == '/home/retrieval') {
+            this.srcIndex = '1'
+          }
+        } else {
+          const currentSrcIndex = keyPathArr[0]
+          this.srcIndex = currentSrcIndex
+        }
+      },
+      exit() {
+        alert("你确定要注销界面吗?");
+        this.$router.push("/login1");
+      },
     },
-  }
-};
+    computed: {
+
+      // 文档菜单
+      docMenus() {
+        let docMenus = [];
+        this.routers.map((menu) => {
+          if (menu.path === "/home-doc") {
+            docMenus = menu.children;
+          }
+        });
+        return docMenus;
+      },
+      // 设置菜单
+      settingMenus() {
+        let settingMenus = [];
+        this.routers.map((menu) => {
+          if (menu.path === "/home-setting") {
+            settingMenus = menu.children;
+          }
+        });
+        return settingMenus;
+      },
+
+      // 所有的路由信息
+      routers() {
+        return this.$store.state.permission.topbarRouters;
+      },
+      activeIndex() {
+        const path = this.$route.path;
+        return path;
+      },
+      names() {
+        const paths = this.$store.state.user.uname;
+        return paths;
+      },
+    }
+  };
 </script>
 
 <style scoped lang="scss">
-.container {
-  background: #0c0827ff;
-  background-size: 100% 100%;
-  width: 100%;
-  height: 100%;
-
-  .header {
-    height: calc(100vh * (70 / 1080));
+  .container {
+    background: #0c0827ff;
+    background-size: 100% 100%;
     width: 100%;
-    padding-top: calc(100vh * (10 / 1080));
+    height: 100%;
 
-    // 顶部板块
-    .top {
-      height: calc(100vh * (40 / 1080));
+    .header {
+      height: calc(100vh * (70 / 1080));
       width: 100%;
-      padding-right: calc(100vh * (17 / 1920));
-      padding-left: calc(100vh * (55 / 1920));
-      display: flex;
+      padding-top: calc(100vh * (10 / 1080));
 
-      //顶部左边板块
-      .left {
-        width: calc(100vw * (369 / 1920));
+      // 顶部板块
+      .top {
         height: calc(100vh * (40 / 1080));
+        width: 100%;
+        padding-right: calc(100vh * (17 / 1920));
+        padding-left: calc(100vh * (55 / 1920));
         display: flex;
 
-        .left1 {
-          width: calc(100vw * (28 / 1920));
-          height: calc(100vh * (30 / 1080));
-          margin-top: calc(100vh * (8 / 1080));
+        //顶部左边板块
+        .left {
+          width: calc(100vw * (369 / 1920));
+          height: calc(100vh * (40 / 1080));
+          display: flex;
 
-          img {
+          .left1 {
             width: calc(100vw * (28 / 1920));
             height: calc(100vh * (30 / 1080));
-          }
-        }
+            margin-top: calc(100vh * (8 / 1080));
 
-        .left2 {
-          width: calc(100vw * (295 / 1920));
-          height: calc(100vh * (32 / 1080));
-          margin-left: calc(100vw * (10 / 1920));
-          margin-top: calc(100vw * (5 / 1080));
+            img {
+              width: calc(100vw * (28 / 1920));
+              height: calc(100vh * (30 / 1080));
+            }
+          }
 
-          img {
+          .left2 {
             width: calc(100vw * (295 / 1920));
             height: calc(100vh * (32 / 1080));
+            margin-left: calc(100vw * (10 / 1920));
+            margin-top: calc(100vw * (5 / 1080));
+
+            img {
+              width: calc(100vw * (295 / 1920));
+              height: calc(100vh * (32 / 1080));
+            }
           }
         }
-      }
 
-      // 顶部中间板块
-      .el-menu-demo {
-        width: calc(100vw * (1000 / 1920));
-        margin-left: calc(100vw * (280 / 1920));
-        padding-bottom: calc(100vh * (8 / 1080));
-        border: none;
-        display: flex;
+        // 顶部中间板块
+        .el-menu-demo {
+          width: calc(100vw * (1000 / 1920));
+          margin-left: calc(100vw * (280 / 1920));
+          padding-bottom: calc(100vh * (8 / 1080));
+          border: none;
+          display: flex;
 
-        li {
-          height: calc(100vh * (40 / 1080));
-          line-height: calc(100vh * (40 / 1080));
-          margin-right: calc(100vw * (60 / 1920));
+          li {
+            height: calc(100vh * (40 / 1080));
+            line-height: calc(100vh * (40 / 1080));
+            margin-right: calc(100vw * (60 / 1920));
 
-          :hover {
-            background: #1e497cff !important;
+            :hover {
+              background: #1e497cff !important;
+            }
           }
-        }
 
-        .nav1>img {
-          width: calc(100vw * (24 / 1920));
-          height: calc(100vh * (24 / 1080));
-          margin-bottom: calc(100vw * (5 / 1920));
-          margin-right: calc(100vh * (5 / 1080));
+          .nav1>img {
+            width: calc(100vw * (24 / 1920));
+            height: calc(100vh * (24 / 1080));
+            margin-bottom: calc(100vw * (5 / 1920));
+            margin-right: calc(100vh * (5 / 1080));
+          }
         }
-      }
 
-      // 顶部右边板块
-      .right {
-        width: calc(100vw * (220 / 1920));
-        height: calc(100vh * (40 / 1080));
-        margin-left: calc(100vw * (80 / 1920));
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        // background: salmon;
-        // .right_1>img {
-        //   width: calc(100vw * (20 / 1920));
-        //   height: calc(100vh * (20 / 1080));
-        //   margin-right: calc(100vw * (5 / 1920));
-        // }
+        // 顶部右边板块
+        .right {
+          width: calc(100vw * (220 / 1920));
+          height: calc(100vh * (40 / 1080));
+          margin-left: calc(100vw * (80 / 1920));
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          // background: salmon;
+          // .right_1>img {
+          //   width: calc(100vw * (20 / 1920));
+          //   height: calc(100vh * (20 / 1080));
+          //   margin-right: calc(100vw * (5 / 1920));
+          // }
 
-        .right_2 {
-          font-size: 12px;
-          color: white;
-        }
+          .right_2 {
+            font-size: 12px;
+            color: white;
+          }
 
-        .right_3 {
-          width: 1px;
-          height: 13px;
-          background: #02aac0;
-          border-radius: 0px 0px 0px 0px;
-          opacity: 1;
-        }
+          .right_3 {
+            width: 1px;
+            height: 13px;
+            background: #02aac0;
+            border-radius: 0px 0px 0px 0px;
+            opacity: 1;
+          }
 
-        .right_4>img {
-          width: calc(100vw * (26 / 1920));
-          height: calc(100vh * (26 / 1080));
+          .right_4>img {
+            width: calc(100vw * (26 / 1920));
+            height: calc(100vh * (26 / 1080));
+          }
         }
       }
-    }
 
-    //顶部下边图片板块
-    .bottom {
-      height: calc(100vh * (20 / 1080));
-      width: 100%;
-      background: url("../assets/img/nav-decorate.png");
-      background-size: 100% calc(100vh * (20 / 1080));
+      //顶部下边图片板块
+      .bottom {
+        height: calc(100vh * (20 / 1080));
+        width: 100%;
+        background: url("../assets/img/nav-decorate.png");
+        background-size: 100% calc(100vh * (20 / 1080));
+      }
     }
   }
-}
 
-::v-deep .el-menu-item {
-  padding: 0;
-  padding-bottom: (100vh * (50 / 1080));
-}
+  ::v-deep .el-menu-item {
+    padding: 0;
+    padding-bottom: (100vh * (50 / 1080));
+  }
 
-::v-deep .el-submenu__title {
-  padding: 0;
-  padding-bottom: (100vh * (50 / 1080));
-}
+  ::v-deep .el-submenu__title {
+    padding: 0;
+    padding-bottom: (100vh * (50 / 1080));
+  }
 
-::v-deep .el-menu--horizontal>.el-submenu .el-submenu__title {
-  height: calc(100vh * (40 / 1080));
-  line-height: calc(100vh * (40 / 1080));
-}
+  ::v-deep .el-menu--horizontal>.el-submenu .el-submenu__title {
+    height: calc(100vh * (40 / 1080));
+    line-height: calc(100vh * (40 / 1080));
+  }
 
-::v-deep li:hover {
-  background: #1e497cff !important;
-}
+  ::v-deep li:hover {
+    background: #1e497cff !important;
+  }
 
-::v-deep .el-menu--horizontal .el-menu-item:not(.isdisabled):hover {
-  background: #1e497cff !important;
-}
+  ::v-deep .el-menu--horizontal .el-menu-item:not(.isdisabled):hover {
+    background: #1e497cff !important;
+  }
 </style>
 
 <style>
-/* 下拉框 */
-.el-menu--horizontal .el-menu .el-menu-item {
-  background: #0f1540ff !important;
-}
+  /* 下拉框 */
+  .el-menu--horizontal .el-menu .el-menu-item {
+    background: #0f1540ff !important;
+  }
 
-.el-menu--horizontal .el-menu .el-menu-item:hover {
-  background: #1e497cff !important;
-  color: #ffffff !important;
-}
+  .el-menu--horizontal .el-menu .el-menu-item:hover {
+    background: #1e497cff !important;
+    color: #ffffff !important;
+  }
 </style>