【新增】首页菜单

src/api/dashboard.js

@@ -55,3 +55,12 @@ export function getRebateOrderMsg() {
     method: "get",
   });
 }
+
+// 路由
+export function getRouter(params) {
+  return request({
+    url: `/admin/user/module/list`,
+    method: "get",
+    params,
+  });
+}

src/views/dashboard/index.vue

@@ -1,10 +1,26 @@
 <template>
-  <div class="dashboard-container">
-    <el-row :gutter="10" class="top-container">
-      <el-col :xs="24" :sm="12" :lg="12">
-        <div class="today-content">欢迎登入供应链管理系统</div>
-      </el-col>
-    </el-row>
+  <div class="app-container">
+    <div class="menu-list">
+      <div class="group" v-for="(item, index) in menuList" :key="index">
+        <div v-if="item.moduleName != '首页'">
+          <div class="main-title">
+            <div class="title">{{item.moduleName}}</div>
+          </div>
+          <div class="child" v-if="item.children && item.children.length">
+            <el-row :gutter="20">
+              <el-col class="item" :span="4" v-for="(it, idx) in item.children" :key="idx">
+                <el-link class="link" :underline="false" @click="clickMenu(it.fullUrl)">{{it.moduleName}}</el-link>
+              </el-col>
+            </el-row>
+          </div>
+          <div class="child" v-else>
+            <div class="item">
+              <el-link class="link" :underline="false" @click="clickMenu(item.fullUrl + '/index')">{{item.moduleName}}</el-link>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
 
     <!-- 弹窗 -->
     <el-dialog title="消息" :visible.sync="showMessages" width="50%" :show-close="false" :close-on-click-modal="false">
@@ -115,6 +131,7 @@ import {
   getNoticeDetail,
   confirmCheck,
   getRebateOrderList,
+  getRouter,
 } from "@/api/dashboard";
 import { getFileUrl } from "@/api/common";
 import { mapGetters } from "vuex";
@@ -129,9 +146,16 @@ export default {
       pageNum: this.currentPage,
       readFlag: false,
     });
+
+    getRouter({
+      flag: 'index',
+      adminUserId: this.userid
+    }).then(res => {
+      this.menuList = res.data;
+    })
   },
   computed: {
-    ...mapGetters(["showMessages"]),
+    ...mapGetters(["showMessages", 'userid']),
   },
   data() {
     return {
@@ -147,6 +171,7 @@ export default {
       detailData: [],
       rebateList: [],
       isCustomer: JSON.parse(localStorage.getItem("supply_user")).isCustomer,
+      menuList: [],
     };
   },
 
@@ -314,6 +339,13 @@ export default {
     closeFn() {
       this.$store.commit("user/showMessage", "no");
     },
+
+    // 点击菜单
+    clickMenu(path) {
+      this.$router.push({
+        path
+      })
+    }
   },
 };
 </script>
@@ -335,4 +367,28 @@ export default {
     background-color: #f5f7fa;
   }
 }
+.menu-list {
+  .main-title {
+    margin: 10px 0 0;
+  }
+  .group {
+    margin-bottom: 20px;
+    .child {
+      display: flex;
+      flex-wrap: wrap;
+      padding-left: 10px;
+      .el-row {
+        width: 100%;
+      }
+      .item {
+        margin-top: 16px;
+      }
+    }
+  }
+  ::v-deep .el-link--inner {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
 </style>

src/views/login/index.vue

@@ -392,7 +392,7 @@ $back: #333;
     color: $cursor;
   }
 }
-.el-link--inner {
+.info-item .el-link--inner {
   color: #ffffff;
 }
 /* reset element-ui css */