From 30ab871400e5064bc38085ef64931b8dc1f64fb9 Mon Sep 17 00:00:00 2001
From: yangys <y_ys79@sina.com>
Date: 星期二, 16 一月 2024 22:15:37 +0800
Subject: [PATCH] Merge branch 'master' of http://www.beijingsoft.cn:9090/r/mdc-front
---
src/container/home/index.vue | 260 +++++++++++++++++++++++++++++++++++----------------
1 files changed, 179 insertions(+), 81 deletions(-)
diff --git a/src/container/home/index.vue b/src/container/home/index.vue
index d341892..a29f5de 100644
--- a/src/container/home/index.vue
+++ b/src/container/home/index.vue
@@ -2,55 +2,14 @@
<Home>
<template slot="menu">
<div class="menu-container">
- <ul class="">
- <!-- <li :class="activeId ==='1' ? 'active' : ''" @click="navigateTo('1')">鐘舵�佺洃鎺�</li> -->
- <li :class="activeId ==='preview' ? 'active' : ''" @click="navigateTo('preview')">澶у睆灞曠ず</li>
- <li :class="activeId ==='2' ? 'active' : ''" @click="navigateTo('2')">
+ <ul class="nav">
+ <li v-for="item in navs" :key="item.id" :class="activeId === item.id ? 'active' : ''" @click="goTo(item)">
<span>
- 杞﹂棿鍦板浘
+ {{ item.label }}
+ <i class="el-icon-caret-bottom" v-show="item.children && item.children.length > 0"></i>
</span>
-
- </li>
- <li :class="activeId ==='3' ? 'active' : ''" @click="navigateTo('3')">
- <span>
- 杞﹂棿鍒楄〃<i class="el-icon-caret-bottom"></i>
- </span>
- <ul v-if="showSub" class="sub">
- <li v-for="item in workshopList" :key="item.id" @click.stop="navigateTo('workshop',item)">{{ item.name }}</li>
- </ul>
- </li>
- <li :class="activeId ==='4' ? 'active' : ''" @click="navigateTo('4')">
- <span>
- 璁惧淇濆吇<i class="el-icon-caret-bottom"></i>
- </span>
- <ul v-if="showSub">
- <li @click="navigateTo('maintenance', {style: 1})">鏃ュ父淇濆吇</li>
- <li @click="navigateTo('maintenance', {style: 2})">涓�绾�</li>
- <li @click="navigateTo('maintenance', {style: 3})">浜岀骇</li>
- <li @click="navigateTo('maintenance', {style: 4})">涓夌骇</li>
- </ul>
- </li>
- <!-- <li :class="activeId ==='5' ? 'active' : ''" @click="navigateTo('5')">
- <span>
- 鎶ヨ〃鐢熸垚<i class="el-icon-caret-bottom"></i>
- </span>
- <ul v-if="showSub">
- <li>2鍘�</li>
- <li>2鍘�</li>
- <li>2鍘�</li>
- <li>2鍘�</li>
- </ul>
- </li> -->
- <!-- <li :class="activeId ==='6' ? 'active' : ''" @click="navigateTo('6')">鐝璁剧疆</li> -->
- <li :class="activeId ==='7' ? 'active' : ''" @click="navigateTo('7')">宸ヤ欢淇℃伅</li>
- <li :class="activeId ==='8' ? 'active' : ''" @click="navigateTo('8')">
- <span>
- 鏇村鑿滃崟<i class="el-icon-caret-bottom"></i>
- </span>
- <ul v-if="showSub">
- <li @click="navigateTo('ledger')">鍙拌处</li>
- <li @click="navigateTo('deviceType')">璁惧绫诲瀷绠＄悊</li>
- <!-- <li @click="navigateTo('devicemaintenance')">鏈哄簥缁存姢</li> -->
+ <ul class="nav-sub" v-if="item.children && item.children.length > 0 && activeId === item.id && showSub">
+ <li v-for="child in item.children" @click="goTo(child)">{{ child.label }}</li>
</ul>
</li>
</ul>
@@ -74,12 +33,163 @@
},
data () {
return {
+ navs: [
+ {
+ label: '鐘舵�佺洃鎺�',
+ pathName: '',
+ id: 1,
+ chilren: []
+ },
+ {
+ label: '澶у睆灞曠ず',
+ pathName: 'preview',
+ id: 2,
+ chilren: []
+ },
+ {
+ label: '杞﹂棿鍦板浘',
+ pathName: '',
+ id: 3,
+ children: [
+ {
+ label: '鍦板浘灞曠ず',
+ pathName: 'mapPreview'
+ },
+ {
+ label: '鍦板浘缂栬緫',
+ pathName: 'map'
+ }
+ ]
+ },
+ {
+ label: '杞﹂棿鍒楄〃',// workshop
+ id: 4,
+ children: []
+ },
+ {
+ label: '璁惧淇濆吇',
+ id: 5,
+ children:[
+ {
+ label: '鏃ュ父淇濆吇',
+ pathName: 'maintenance',
+ params: {style: 1},
+ query: {}
+ },
+ {
+ label: '涓�绾т繚鍏�',
+ pathName: 'maintenance',
+ params: {style: 2},
+ query: {}
+ },
+ {
+ label: '浜岀骇淇濆吇',
+ pathName: 'maintenance',
+ params: {style: 3},
+ query: {}
+ },
+ {
+ label: '涓夌骇淇濆吇',
+ pathName: 'maintenance',
+ params: {style: 4},
+ query: {}
+ },
+ ]
+ },
+ {
+ label: '鎶ヨ〃鐢熸垚',
+ id: 6,
+ children: [
+ {
+ label: '璁捐鍣�',
+ href: '/mdc/ureport/designer'
+ },
+ {
+ label: '鎶ヨ〃鐢熸垚1'
+ },
+ {
+ label: '鎶ヨ〃鐢熸垚1'
+ },
+ {
+ label: '鎶ヨ〃鐢熸垚1'
+ },
+ ]
+ },
+ {
+ label: '鐝璁剧疆',
+ id: 7,
+ chilren: []
+ },
+ {
+ label: '宸ヤ欢淇℃伅',
+ pathName: 'component',
+ id: 8,
+ chilren: []
+ },
+ {
+ label: '鏇村鑿滃崟',
+ id: 9,
+ children: [
+ {
+ label: '鍙拌处绠＄悊',
+ pathName: 'ledger'
+ },
+ {
+ label: '璁惧绫诲瀷',
+ pathName: 'deviceType'
+ },
+ {
+ label: '鏈哄簥閲囬泦',
+ pathName: 'machineList'
+ }
+ ]
+ },
+ ],
activeId: '',
showSub: false,
}
},
computed: {
...mapGetters(['userInfo','workshopList'])
+ },
+ watch: {
+ workshopList() {
+ this.$set(this.navs,3 ,{
+ ...this.navs[3],
+ children: this.workshopList.map(item => {
+ return {
+ label: item.name,
+ value: item.id,
+ pathName: 'workshop',
+ params: {
+ id: item.id
+ },
+ query: {
+ name: item.name
+ }
+ }
+ })
+ })
+ }
+ },
+ created () {
+ this.$set(this.navs, 3 ,{
+ ...this.navs[3],
+ children: this.workshopList.map(item => {
+ return {
+ label: item.name,
+ value: item.id,
+ pathName: 'workshop',
+ params: {
+ id: item.id
+ },
+ query: {
+ name: item.name
+ }
+ }
+ })
+ })
+ // this.navs[3].children = workshopList
},
methods: {
logout() {
@@ -88,43 +198,23 @@
this.$router.push('/')
})
},
- navigateTo (name,v) {
- let routers = {
- 2: 'map',
- workshop: 'workshop',
- maintenance: 'maintenance',
- 7: 'component',
- ledger: 'ledger',
- deviceType: 'deviceType',
- preview: 'preview',
- devicemaintenance: 'devicemaintenance'
- }
-
- if (['3','4','5','8'].includes(name)) {
- if (name === this.activeId) {
+ goTo (item) {
+ if (item.id) {
+ if (item.id === this.activeId) {
this.showSub = !this.showSub
} else {
this.showSub = true
}
- this.activeId = name
- } else {
- this.activeId = name
- let params = {}
- let query = {}
- if ('workshop' === name) {
- params.id = v.id
- query.name = v.name
+ this.activeId = item.id || this.activeId
+ if(item.pathName) {
+ this.$router.push({name: item.pathName,params: item.params,query: item.query})
}
- if (name === 'maintenance') {
- params.style = v.style
- }
- this.$router.push({name: routers[name],params: params,query: query})
- this.$nextTick(() => {
- this.showSub = false
- })
+ } else if(item.pathName){//浜岀骇鑿滃崟
+ this.$router.push({name: item.pathName,params: item.params,query: item.query})
+ } else if(item.href) {
+ window.open(item.href)
}
-
- }
+ },
},
}
</script>
@@ -142,9 +232,14 @@
list-style: none;
display: flex;
& > li {
+ width: 112px;
+ height: 40px;
+ line-height: 38px;
+ text-align: center;
cursor: pointer;
- background: #27394E;
- padding: 0 12px;
+ // background: #27394E;
+ background: url('./nav-li.png') 100% 100% no-repeat;
+ background-size: contain;
white-space: nowrap;
text-overflow: ellipsis;
position: relative;
@@ -155,9 +250,12 @@
// user-select:none;
}
& > li.active {
- & > ul {
+ background: url('./nav-li-active.png') 100% 100% no-repeat;
+ background-size: contain;
+ & > ul.nav-sub {
padding: 0;
margin: 0;
+ margin-top: 5px;
padding-inline: 0;
list-style: none;
min-width: 100%;
--
Gitblit v1.9.3