pull/19/head
孙萌 2023-10-17 18:34:03 +08:00
parent d90bf7bef1
commit e42de203fb
4 changed files with 62 additions and 24 deletions

View File

@ -167,8 +167,16 @@
left: 10px; left: 10px;
} }
.collapse.set-params .el-collapse-item__header { .collapse.set-params .el-collapse-item.active .el-collapse-item__header {
padding-left: 20px; background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.3);
}
.collapse.set-params .el-collapse-item.active .el-collapse-item__header .name {
color: #fff !important;
}
.collapse.set-params .el-collapse-item__header .name {
color: #A8B6C8; color: #A8B6C8;
} }

File diff suppressed because one or more lines are too long

View File

@ -176,11 +176,27 @@
} }
&.set-params { &.set-params {
.el-collapse-item {
&.active{
.el-collapse-item__header { .el-collapse-item__header {
padding-left: 20px; background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.3);
.name {
color: #fff !important;
}
}
}
}
.el-collapse-item__header {
.name{
color: #A8B6C8; color: #A8B6C8;
} }
}
.table-ul { .table-ul {
.table-li { .table-li {
width: 100%; width: 100%;

View File

@ -9,13 +9,16 @@
</div> </div>
<el-collapse v-model="$store.state.activeNames"> <el-collapse v-model="$store.state.activeNames">
<template v-for="item, index in routerList"> <template v-for="item, index in routerList">
<el-collapse-item :name="index + 1" :key="index" v-if="!item.isRouter"> <el-collapse-item :class="routerNow == item.router ? 'active' : ''" :name="index + 1" :key="index"
v-if="!item.isRouter">
<template slot="title" class="collapse-title"> <template slot="title" class="collapse-title">
{{ item.name }} <span class="name">{{ item.name }}</span>
</template> </template>
<!-- --> <!-- -->
<ul class="table-ul"> <ul class="table-ul">
<li @click="toRouter(item1)" :class="routerNow == item1.router&&routerIndex==index1+1 ? 'active' : ''" class="table-li" v-for="item1, index1 in item.list" :key="index1">{{ <li @click="toRouter(item1)"
:class="routerNow == item1.router && routerIndex == index1 + 1 ? 'active' : ''" class="table-li"
v-for="item1, index1 in item.list" :key="index1">{{
item1.name }} <div class="status" :class="item1.status == 0 ? 'outline' : 'online'" item1.name }} <div class="status" :class="item1.status == 0 ? 'outline' : 'online'"
v-if="item1.status >= 0">{{ item1.status v-if="item1.status >= 0">{{ item1.status
== 0 == 0
@ -23,7 +26,9 @@
</li> </li>
</ul> </ul>
</el-collapse-item> </el-collapse-item>
<div @click="toRouter(item)" :class="routerNow==item.router?'active':''" class="no-list" v-else>{{ item.name }}</div> <div @click="toRouter(item)" :class="routerNow == item.router ? 'active' : ''" class="no-list" v-else>{{
item.name
}}</div>
</template> </template>
</el-collapse> </el-collapse>
</div> </div>
@ -33,9 +38,9 @@ export default {
data() { data() {
return { return {
routerList: [ routerList: [
{ name: '施肥机配方设置', list: [],router:'' }, { name: '施肥机配方设置', list: [], router: 'formula' },
{ {
name: '灌溉组配置',router:'', list: [ name: '灌溉组配置', router: 'irrigateSet', list: [
{ name: '1#灌溉组配置', status: -1, router: 'irrigateSet', index: 1 }, { name: '1#灌溉组配置', status: -1, router: 'irrigateSet', index: 1 },
{ name: '2#灌溉组配置', status: -1, router: 'irrigateSet', index: 2 }, { name: '2#灌溉组配置', status: -1, router: 'irrigateSet', index: 2 },
{ name: '3#灌溉组配置', status: -1, router: 'irrigateSet', index: 3 }, { name: '3#灌溉组配置', status: -1, router: 'irrigateSet', index: 3 },
@ -74,20 +79,20 @@ export default {
methods: { methods: {
dataInit() { dataInit() {
var store = this.$store.state var store = this.$store.state
store.nameList.forEach((el,index)=>{ store.nameList.forEach((el, index) => {
if(index<8){ if (index < 8) {
if(store.equipmentName['fertilization'+store.nameList[index]]){ if (store.equipmentName['fertilization' + store.nameList[index]]) {
// store.equipmentName['fertilization'+store.nameList[index]] // store.equipmentName['fertilization'+store.nameList[index]]
this.routerList[0].list.push({ this.routerList[0].list.push({
name:'配方'+(index+1), name: '配方' + (index + 1),
status: -1, status: -1,
index:index+1, index: index + 1,
router: 'formula' router: 'formula'
}) })
} }
} }
}) })
console.log(this.routerList[0],11); console.log(this.routerList[0], 11);
}, },
// //
@ -141,14 +146,23 @@ export default {
margin-right: 10px; margin-right: 10px;
} }
} }
.no-list{
.el-collapse-item {
&.active {}
}
.no-list {
color: #A8B6C8; color: #A8B6C8;
&.active{
&.active {
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.3);
color: #fff; color: #fff;
} }
} }
.set-tips { .set-tips {
width: 100%; width: 100%;
border-bottom: 1px solid rgba(168, 182, 200, 0.2); border-bottom: 1px solid rgba(168, 182, 200, 0.2);