src/assets/css/main.css

@@ -167,16 +167,8 @@
   left: 10px;
 }
 
-.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 {
+.collapse.set-params .el-collapse-item__header {
+  padding-left: 20px;
   color: #A8B6C8;
 }
 

src/assets/css/main.scss

@@ -176,25 +176,9 @@
     }
 
     &.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 {
-            .name{
+            padding-left: 20px;
             color: #A8B6C8;
-           }
-         
         }
 
         .table-ul {

src/components/setParams.vue

@@ -9,26 +9,21 @@
         </div>
         <el-collapse v-model="$store.state.activeNames">
             <template v-for="item, index in routerList">
-                <el-collapse-item :class="routerNow == item.router ? 'active' : ''" :name="index + 1" :key="index"
-                    v-if="!item.isRouter">
+                <el-collapse-item :name="index + 1" :key="index" v-if="!item.isRouter">
                     <template slot="title" class="collapse-title">
-                        <span class="name">{{ item.name }}</span>
+                        {{ item.name }}
                     </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>
@@ -38,9 +33,9 @@ export default {
     data() {
         return {
             routerList: [
-                { name: '施肥机配方设置', list: [], router: 'formula' },
+                { name: '施肥机配方设置', list: [],router:'' },
                 {
-                    name: '灌溉组配置', router: 'irrigateSet', list: [
+                    name: '灌溉组配置',router:'', 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 },
@@ -79,21 +74,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) {
@@ -111,7 +106,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 })
 
@@ -146,23 +141,14 @@ export default {
             margin-right: 10px;
         }
     }
-
-
-
-    .el-collapse-item {
-        &.active {}
-    }
-
-    .no-list {
+    .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);