Merge pull request '添加修改参数页面状态跟随' (#19) from pc-master into portal

Reviewed-on: #19
pull/34/head^2
xiaomeng 2023-10-18 00:10:22 +00:00
commit e8aee0fb3e
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,9 +176,25 @@
}
&.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);
.name {
color: #fff !important;
}
}
}
}
.el-collapse-item__header {
padding-left: 20px;
.name{
color: #A8B6C8;
}
}
.table-ul {

View File

@ -9,21 +9,26 @@
</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">{{
item1.name }} <div class="status" :class="item1.status == 0 ? 'outline' : 'online'"
<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
? '离线' : '在线' }}</div>
</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 },
@ -74,21 +79,21 @@ export default {
methods: {
dataInit() {
var store = this.$store.state
store.nameList.forEach((el,index)=>{
if(index<8){
if(store.equipmentName['fertilization'+store.nameList[index]]){
store.nameList.forEach((el, index) => {
if (index < 8) {
if (store.equipmentName['fertilization' + store.nameList[index]]) {
// store.equipmentName['fertilization'+store.nameList[index]]
this.routerList[0].list.push({
name:'配方'+(index+1),
name: '配方' + (index + 1),
status: -1,
index:index+1,
index: index + 1,
router: 'formula'
})
}
}
})
console.log(this.routerList[0],11);
})
console.log(this.routerList[0], 11);
},
//
toHome(index) {
@ -106,7 +111,7 @@ export default {
this.$router.push({ path: `/irrigateSet?id=${item.index}` })
} else if (item.router == 'formula' && this.$route.query.id != item.index) {
this.$router.push({ path: `/formula?id=${item.index}` })
} else if (item.router != this.routerNow && !item.http) {
} else if (item.router != this.routerNow && !item.http) {
this.$router.push({ name: item.router })
@ -141,14 +146,23 @@ export default {
margin-right: 10px;
}
}
.no-list{
.el-collapse-item {
&.active {}
}
.no-list {
color: #A8B6C8;
&.active{
&.active {
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.3);
color: #fff;
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);