数字水利 手风琴

src/views/leader.vue

@@ -75,14 +75,31 @@
             <div class="i-list-con h-73">
 
               <div class="h-19 overflow-y">
-                <div class="d-l-con" :class="{on:listCurrentIndex2==item.planName}"
-                     v-for="(item,index) in xunLinListOne"
-                     @click="getWaterRecord(item.id, item.reiverLengthId)">
-                  <div class="d-l-l-text">
-                    <i class="i-small"></i>
-                    <h4>{{ item.name }} ({{ item.recordCount }}-{{ item.planCount }})</h4>
+                <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" style="padding-bottom: 1rem;">
+                  <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+                  <div class="i-list-con h-80" style="padding-left: 1rem;">
+                <el-collapse accordion>
+                  <el-collapse-item v-for="(item,index) in xunLinListOne" :key="index">
+                    <template slot="title">
+                      <div class="d-l-con sj-collapse" v-on:click="getWaterRecord(item.id, item.reiverLengthId)">
+                        <div class="d-l-l-text">
+                          <h4 class="collapse-title">{{ item.name }}</h4>
+                        </div>
+                        <div class="d-l-l-count">({{ item.recordCount }} / {{ item.planCount }})</div>
+                      </div>
+                    </template>
+                  </el-collapse-item>
+                </el-collapse>
                   </div>
-                </div>
+                </dv-border-box-13>
+                <!--<div class="d-l-con" :class="{on:listCurrentIndex2==item.planName}"-->
+                     <!--v-for="(item,index) in xunLinListOne"-->
+                     <!--@click="getWaterRecord(item.id, item.reiverLengthId)">-->
+                  <!--<div class="d-l-l-text">-->
+                    <!--<i class="i-small"></i>-->
+                    <!--<h4>{{ item.name }} ({{ item.recordCount }}-{{ item.planCount }})</h4>-->
+                  <!--</div>-->
+                <!--</div>-->
               </div>
             </div>
           </dv-border-box-13>
@@ -259,7 +276,7 @@ export default {
     getWaterRecord(id, reiverLengthId) {
       getWaterRecord(id, reiverLengthId).then(res => {
         console.log("记录",res.data);
-        this.xunLinListOne = res.data;
+        // this.xunLinListOne = res.data;
       })
     },
     //点击左侧人员列表获取计划
@@ -405,4 +422,5 @@ export default {
 .h-27 {
   height: 27rem;
 }
+
 </style>