完善

src/views/statisticView/SwitchingRoom.vue

@@ -1,26 +1,27 @@
 <template>
   <div class="view-container">
     <div class="date">
-      <span>{{ date }}</span>天气： 晴
+      <span>{{ date }}</span>
+      <!-- 天气： 晴 -->
     </div>
     <div class="dateStatistics">
       <div @click="handleDayView">日统计</div>&nbsp;&nbsp;
       <div @click="handleMonthView">月统计</div>
     </div>
     <div class="adress">
-      <div class="address-opt" @click="getDatas(1)">一路</div>
-      <div @click="getDatas(2)">二路</div>
-      <div @click="getDatas(3)">三路</div>
-      <div @click="getDatas(4)">四路</div>
-      <div @click="getDatas(5)">五路</div>
-      <div @click="getDatas(6)">六路</div>
+      <div :class="current===1?'address-opt':''" @click="getDatas(1)">一路</div>
+      <div :class="current===2?'address-opt':''" @click="getDatas(2)">二路</div>
+      <div :class="current===3?'address-opt':''" @click="getDatas(3)">三路</div>
+      <div :class="current===4?'address-opt':''" @click="getDatas(4)">四路</div>
+      <div :class="current===5?'address-opt':''" @click="getDatas(5)">五路</div>
+      <div :class="current===6?'address-opt':''" @click="getDatas(6)">六路</div>
     </div>
     <div class="sb">
       <a-row type="flex" justify="space-between" :gutter="[20,20]">
         <a-col :span="6">
           <div class="sb-info">
             <div class="sb-info-title">
-              <span>梅康一路汇总数据</span>
+              <span>{{ dataInfo.lineName }}</span>
             </div>
             <div class="sb-info-content">
               <div>
@@ -82,7 +83,7 @@
             </div>
           </div>
         </a-col>
-        <a-col :span="6" v-for="item in 7" :key="item" @click="handleView">
+        <!-- <a-col :span="6" v-for="item in 7" :key="item" @click="handleView">
           <div class="sb-info">
             <div class="sb-info-title">
               <span>2G04</span>
@@ -122,30 +123,30 @@
               <div>低压</div>
             </div>
           </div>
-        </a-col>
-        <a-col :span="6" v-for="item in 4" :key="item">
+        </a-col> -->
+        <a-col :span="6" v-for="(item,i) in dataInfo.dataList" :key="i">
           <div class="sb-info">
             <div class="sb-info-title">
-              <span>2G06</span>
-              <span>10KV开山螺杆B线</span>
+              <!-- <span>2G06</span> -->
+              <span>{{ item.sbName }}</span>
             </div>
             <div class="sb-info-content">
               <div>高压</div>
               <div class="arrow">
                 <div>
-                  <div>电压：32V</div>
+                  <div>电压：{{ item.dianya }}kV</div>
                   <div><img src="../../assets/bgView/jiantouBlue.png" width="65px" alt=""></div>
                 </div>
                 <div style="color:rgba(40, 233, 108, 1)">
-                  <div>电流：32A</div>
+                  <div>电流：{{ item.dianliu }}A</div>
                   <div><img src="../../assets/bgView/jiantouGreen.png" width="65px" alt=""></div>
                 </div>
                 <div style="color:rgba(255, 216, 0, 1)">
-                  <div>有功电度：34V</div>
+                  <div>有功电度：{{ item.yggl }}kW</div>
                   <div><img src="../../assets/bgView/jiantouYellow.png" width="65px" alt=""></div>
                 </div>
-                <div style="color:rgba(255, 216, 0, 1)">
-                  <div>温度：3℃</div>
+                <div v-if="item.wendu" style="color:rgba(255, 216, 0, 1)">
+                  <div>温度：{{ item.wendu }}℃</div>
                   <div><img src="../../assets/bgView/jiantoured.png" width="65px" alt=""></div>
                 </div>
               </div>
@@ -153,7 +154,7 @@
             </div>
           </div>
         </a-col>
-        <a-col :span="6" v-for="item in 4" :key="item">
+        <!-- <a-col :span="6" v-for="item in 4" :key="item">
           <div class="sb-info">
             <div class="sb-info-title">
               <span>2G06</span>
@@ -182,7 +183,7 @@
               <div><img src="../../assets/bgView/shebei.png" width="153px" height="100px" alt=""></div>
             </div>
           </div>
-        </a-col>
+        </a-col> -->
       </a-row>
     </div>
   </div>
@@ -196,13 +197,24 @@ export default {
   },
   data () {
     return {
-      date: this.BaseTool.Moment().format(this.BaseTool.Date.PICKER_NORM_DATE_PATTERN_CHINESE)
+      date: this.BaseTool.Moment().format(this.BaseTool.Date.PICKER_NORM_DATE_PATTERN_CHINESE),
+      current: 1,
+      dataInfo: {}
     }
   },
   methods: {
     getDatas (lineNum) {
+      this.current = lineNum
       getMeasureByLine({ lineNum: lineNum }).then(res => {
         console.log(res.data)
+        this.dataInfo = res.data
+        this.dataInfo.dataList.forEach(item => {
+          item.dianya = item.measureList.find(li => li.type === 5).result
+          item.dianliu = item.measureList.find(li => li.type === 1).result
+          item.yggl = item.measureList.find(li => li.type === 12).result
+          item.wendu = item.measureList.find(li => li.type === 16) ? item.measureList.find(li => li.type === 16).result : null
+        })
+        console.log(this.dataInfo)
       })
     },
     handleView () {
@@ -326,6 +338,9 @@ padding: 80px 67px;
     span:first-child{
       color:#5ACCF8;
       padding-left:10px;
+      overflow:hidden;
+    text-overflow:ellipsis;
+    white-space: nowrap;
     }
   }
   .sb-info-content{
@@ -339,6 +354,9 @@ padding: 80px 67px;
     .arrow{
       font-size:12px;
       transform:scale(.8);
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
     }
   }
 }