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;
}
.collapse.set-params .el-collapse-item__header {
padding-left: 20px;
.collapse.set-params .el-collapse-item.active .el-collapse-item__header {
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;
}

File diff suppressed because one or more lines are too long

View File

@ -176,11 +176,27 @@
}
&.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);
.name {
color: #fff !important;
}
}
}
}
.el-collapse-item__header {
.name{
color: #A8B6C8;
}
}
.table-ul {
.table-li {
width: 100%;

View File

@ -9,13 +9,16 @@
</div>
<el-collapse v-model="$store.state.activeNames">
<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">
{{ item.name }}
<span class="name">{{ item.name }}</span>
</template>
<!-- -->
<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'"
v-if="item1.status >= 0">{{ item1.status
== 0
@ -23,7 +26,9 @@
</li>
</ul>
</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>
</el-collapse>
</div>
@ -33,9 +38,9 @@ export default {
data() {
return {
routerList: [
{ name: '施肥机配方设置', list: [],router:'' },
{ name: '施肥机配方设置', list: [], router: 'formula' },
{
name: '灌溉组配置',router:'', list: [
name: '灌溉组配置', router: 'irrigateSet', list: [
{ name: '1#灌溉组配置', status: -1, router: 'irrigateSet', index: 1 },
{ name: '2#灌溉组配置', status: -1, router: 'irrigateSet', index: 2 },
{ name: '3#灌溉组配置', status: -1, router: 'irrigateSet', index: 3 },
@ -141,14 +146,23 @@ export default {
margin-right: 10px;
}
}
.el-collapse-item {
&.active {}
}
.no-list {
color: #A8B6C8;
&.active {
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.3);
color: #fff;
}
}
.set-tips {
width: 100%;
border-bottom: 1px solid rgba(168, 182, 200, 0.2);