From 73b48dd59a2d47b365b87784371c4ef57dde659b Mon Sep 17 00:00:00 2001 From: Oliver <1070107765@qq.com> Date: 星期四, 22 十二月 2022 11:17:47 +0800 Subject: [PATCH] 首页新增 --- src/views/layout/components/Main/index.vue | 317 +++++++++++++++++++++++++++++++++++----------------- src/views/layout/components/Menu/index.vue | 8 + 2 files changed, 220 insertions(+), 105 deletions(-) diff --git a/src/views/layout/components/Main/index.vue b/src/views/layout/components/Main/index.vue index 5ff6659..5f670e6 100644 --- a/src/views/layout/components/Main/index.vue +++ b/src/views/layout/components/Main/index.vue @@ -5,9 +5,11 @@ <!-- 椤甸潰瀵艰埅鍖哄煙 --> <div class="page-nav" v-if="navFlag"> <div class="nav-item" v-for="item in navList" :key="item.id"> - <div class="nav-title">{{item.title}}</div> + <div class="nav-title">{{ item.title }}</div> <div class="nav-child" v-if="item.children && item.children.length!==0"> - <el-link :underline="false" class="child-item" v-for="child in item.children" @click="handleJump(child.link)" :key="child.id">{{child.label}}</el-link> + <el-link :underline="false" class="child-item" v-for="child in item.children" + @click="handleJump(child.link)" :key="child.id">{{ child.label }} + </el-link> </div> </div> </div> @@ -21,6 +23,7 @@ <script> // import MyFooter from "../Footer" import NavBar from "../NavBar" + export default { name: "Main", components: { @@ -30,143 +33,244 @@ data() { return { navFlag: true, - navList:[ + navList: [ { - id:1, - title:'绯荤粺璁剧疆', - children:[ + id: 1, + title: '绯荤粺璁剧疆', + children: [ { - id:2, - label:'鐢ㄦ埛绠$悊', - link:'/system/userSetting/user', + id: 2, + label: '鐢ㄦ埛绠$悊', + link: '/system/userSetting/user', }, { - id:3, - label:'瑙掕壊绠$悊', - link:'/system/userSetting/role', + id: 3, + label: '瑙掕壊绠$悊', + link: '/system/userSetting/role', }, { - id:4, - label:'閮ㄩ棬绠$悊', - link:'/system/userSetting/department', + id: 4, + label: '閮ㄩ棬绠$悊', + link: '/system/userSetting/department', }, { - id:5, - label:'鍗″彛璁惧绠$悊', - link:'/system/device/bayonet', + id: 4, + label: '鑷畾涔夎彍鍗�', + link: '/system/platform/mySetting', }, { - id:6, - label:'鐐逛綅绠$悊', - link:'/system/device/point', + id: 4, + label: 'logo绠$悊', + link: '/system/platform/portalSetting', + }, + { + id: 4, + label: '椹鹃┒鑸辩鐞�', + link: '/system/platform/cockpitManage', + }, + { + id: 5, + label: '鍗″彛璁惧绠$悊', + link: '/system/device/bayonet', + }, + { + id: 6, + label: '鐐逛綅绠$悊', + link: '/system/device/point', + }, + { + id: 6, + label: '缃戞牸绠$悊', + link: '/system/device/grid', + }, + { + id: 6, + label: '闊虫煴璁惧绠$悊', + link: '/system/device/loudspeaker', + }, + { + id: 6, + label: '鎵嬫寔璁惧绠$悊', + link: '/system/device/handheldTerminal', }, ] }, { - id:7, - title:'杩愯惀绠$悊', - children:[ + id: 7, + title: '杩愯惀绠$悊', + children: [ { - id:8, - label:'妗堜欢姹�', - link:'/operate/casepool/pool', + id: 8, + label: '杩濊浜嬮」璁剧疆', + link: '/operate/baseSetting/violation', }, { - id:9, - label:'涓婃姤绠$悊', - link:'/operate/casepool/escalation', + id: 9, + label: '杩濆缓浜嬮」璁剧疆', + link: '/operate/baseSetting/illegalBuild', }, { - id:10, - label:'璋冨害绠$悊', - link:'/operate/casepool/dispatch', + id: 10, + label: '鎴戠殑寰呭姙', + link: '/operate/myWait', }, { - id:11, - label:'瀹℃牳绠$悊', - link:'/operate/management/myIndex', + id: 11, + label: '妗堜欢鏌ヨ', + link: '/operate/viewEvent', }, { - id:13, - label:'鎴戠殑寰呭姙', - link:'/operate/myWait', + id: 13, + label: '闂ㄥ墠涓夊寘', + link: '/operate/fivepack/threepackage', }, { - id:14, - label:'妗堝嵎鏌ヨ', - link:'/operate/viewEvent', - }, - { - id:15, - label:'杞﹁締绠$悊', - link:'/operate/car/carIndex', - }, - { - id:16, - label:'鍥剧墖绠$悊', - link:'/operate/images', - }, - { - id:17, - label:'瑙嗛绠$悊', - link:'/operate/videoControl', + id: 14, + label: '搴楅摵绠$悊', + link: '/operate/fivepack/shop', }, { - id:18, - label:'娑堟伅绠$悊', - link:'/operate/message/messageIndex', + id: 15, + label: '杞﹁締绠$悊', + link: '/operate/car/carIndex', }, { - id:19, - label:'鐭俊绠$悊', - link:'/operate/sms/smsIndex', + id: 15, + label: '杞ㄨ抗鍒嗘瀽(鎵ф硶杞�)', + link: '/operate/car/lawTrajectory', }, - { - id:20, - label:'鏃ュ織绠$悊', - link:'/operate/log', + { + id: 15, + label: '杞ㄨ抗鍒嗘瀽(娓e湡杞�)', + link: '/operate/car/soilTrajectory', + }, + { + id: 16, + label: '鍥剧墖绠$悊', + link: '/operate/images', + }, + { + id: 17, + label: '瑙嗛绠$悊', + link: '/operate/videoControl', + }, + { + id: 17, + label: '鏂囦功绠$悊', + link: '/operate/writManagement/writ', + }, + { + id: 17, + label: '鏂囦功妯℃澘绠$悊', + link: '/operate/writManagement/writTemplate', + }, + { + id: 18, + label: '娑堟伅绠$悊', + link: '/operate/message/messageIndex', + }, { + id: 18, + label: '鏍忕洰绠$悊', + link: '/operate/message/mycontrol', + }, + { + id: 19, + label: '鐭俊绠$悊', + link: '/operate/sms/smsIndex', + }, { + id: 19, + label: '鐭俊妯℃澘绠$悊', + link: '/operate/sms/smsTemplate', + }, + { + id: 20, + label: '鏃ュ織绠$悊', + link: '/operate/log', }, ] }, { - id:21, - title:'瑙嗛宸℃煡', - children:[ + id: 21, + title: '浜嬮」澶勭疆绠$悊', + children: [ { - id:22, - label:'瑙嗛宸℃煡', - link:'/video', + id: 24, + label: '妗堜欢姹�', + link: '/operate/casepool/pool', + }, { + id: 24, + label: '宸蹭笂鎶ュ埌甯�', + link: '/operate/casepool/escalation', + }, { + id: 24, + label: '璋冨害绠$悊', + link: '/operate/casepool/dispatch', + }, { + id: 24, + label: '鍦ㄥ涔犵鐞�', + link: '/operate/casepool/learn', + }, { + id: 24, + label: '鏆備笉澶勭悊', + link: '/operate/casepool/notDeal', }, ] }, { - id:23, - title:'鏅鸿兘宸℃煡', - children:[ + id: 23, + title: '瀹℃牳绠$悊', + children: [ { - id:24, - label:'棰勮鐮斿垽', - link:'/studyJudge', + id: 24, + label: '瀹℃牳绠$悊', + link: '/operate/management/myIndex', }, { - id:25, - label:'杩濊妫�绱�', - link:'/illegalSearch', + id: 25, + label: '鐭俊瀹℃牳绠$悊', + link: '/operate/management/managementMessage', + }, + ] + }, + { + id: 23, + title: '瑙嗛宸℃煡', + children: [ + { + id: 24, + label: '瑙嗛宸℃煡', + link: '/video', + }, + ] + }, + { + id: 23, + title: '鏅鸿兘宸℃煡', + children: [ + { + id: 24, + label: '棰勮鐮斿垽', + link: '/studyJudge', }, { - id:26, - label:'瓒嬪娍鍒嗘瀽', - link:'/trendAnalysis', + id: 25, + label: '杩濊妫�绱�', + link: '/illegalSearch', }, { - id:27, - label:'杩濈珷缁熻', - link:'/trendAnalysis', + id: 26, + label: '瓒嬪娍鍒嗘瀽', + link: '/trendAnalysis', }, { - id:28, - label:'杩濇硶缁熻', - link:'/typeStatistics', + id: 27, + label: '杩濈珷缁熻', + link: '/trendAnalysis', + }, + { + id: 28, + label: '杩濇硶缁熻', + link: '/typeStatistics', }, ] }, @@ -178,14 +282,14 @@ newPath === '/home' ? this.navFlag = true : this.navFlag = false } }, - created(){ + created() { this.$route.path === '/home' ? this.navFlag = true : this.navFlag = false - }, - methods:{ - handleJump(url){ + }, + methods: { + handleJump(url) { const baseURL = '/home' // 璺敱璺宠浆 - this.$router.push({path:baseURL+url}) + this.$router.push({path: baseURL + url}) } } }; @@ -198,23 +302,29 @@ .content { padding: 11px; height: 100%; - .page-nav{ + + .page-nav { padding: 40px 100px; text-align: left; - .nav-item{ + + .nav-item { line-height: 60px; - .nav-title{ + + .nav-title { color: #4b9bb7; } - .nav-child{ + + .nav-child { display: flex; // justify-content: space-between; flex-wrap: wrap; - .el-link{ + + .el-link { justify-content: flex-start; padding-left: 30px; } - .child-item{ + + .child-item { width: 24%; text-align: left; margin-bottom: 22px; @@ -222,7 +332,8 @@ border: 1px solid #17324c; color: #4b9bb7; position: relative; - &::after{ + + &::after { content: ''; display: block; position: absolute; diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue index 680d186..a482eee 100644 --- a/src/views/layout/components/Menu/index.vue +++ b/src/views/layout/components/Menu/index.vue @@ -2,7 +2,7 @@ <div> <!-- 渚ц竟瀵艰埅鏍� --> <el-aside width="200px"> - <h2 class="siderbar-title">閬傛槍鎵ф硶骞冲彴</h2> + <h2 class="siderbar-title" @click="toHome()">閬傛槍鎵ф硶骞冲彴</h2> <el-scrollbar> <!-- 璺敱 --> <el-menu router class="el-menu-vertical" :default-active="$route.path"> @@ -65,6 +65,7 @@ <script> import users from "@/api/users"; +import router from "@/router"; export default { data() { @@ -85,6 +86,9 @@ }) .catch(err => this.$message.error(err)) }, + toHome(){ + router.push("/home") + } }, }; </script> @@ -186,4 +190,4 @@ } } } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0