系统能效查询添加合计值项

src/views/centerairC/overview/index.vue

@@ -107,13 +107,23 @@
             <div class="charts-title">{{ this.titleDate }}能源总览</div>
             <div class="charts_refs" ref="charts_refs"></div>
             <div class="table-content" style="width: 100%">
-              <el-table :data="tableData" style="width: 100%" stripe>
+              <el-table :data="tableData" style="width: 100%" stripe :row-class-name="tableRowClassName">
                 <el-table-column prop="date" label="时间"> </el-table-column>
                 <el-table-column prop="coldData" label="制冷量(kwh)">
+                  <template slot-scope="{ row }">
+                    <span :class="{ 'sum-cold': row.isSum }">{{ row.coldData }}</span>
+                  </template>
                 </el-table-column>
                 <el-table-column prop="electData" label="用电量(kwh)">
+                  <template slot-scope="{ row }">
+                    <span :class="{ 'sum-elect': row.isSum }">{{ row.electData }}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="copData" label="EER">
+                  <template slot-scope="{ row }">
+                    <span :class="{ 'sum-cop': row.isSum }">{{ row.copData }}</span>
+                  </template>
                 </el-table-column>
-                <el-table-column prop="copData" label="EER"> </el-table-column>
               </el-table>
               <div class="page">
                 <el-pagination
@@ -227,6 +237,7 @@ export default {
       totalColdData: "",
       /** 用电量合计（后端返回） */
       totalElectData: "",
+      totalEERData:"",
       pageParm: {
         page: 1, //开始页面页数，初始页
         pageSize: 10, //每页的数据条数
@@ -255,6 +266,13 @@ export default {
     window.removeEventListener("resize", this.screenAdapter);
   },
   methods: {
+    /** 合计行样式类名 */
+    tableRowClassName({ row }) {
+      if (row.isSum) {
+        return "sum-row";
+      }
+      return "";
+    },
     /** 查询系统类型-字典数据列表 */
     getDictList() {
       let data = {
@@ -432,14 +450,16 @@ export default {
             copData: res.data[2].cop[index].toString(), // 转换为字符串
           }));
           /** 获取后端返回的制冷量和用电量合计值 */
-          this.totalColdData = res.data[3].totalCold ? res.data[3].totalCold.toString() : "0";
-          this.totalElectData = res.data[3].totalElect ? res.data[3].totalElect.toString() : "0";
+          this.totalColdData = res.data[6].totalCold ? res.data[6].totalCold.toString() : "0";
+          this.totalElectData = res.data[6].totalMeter ? res.data[6].totalMeter.toString() : "0";
+          this.totalEERData = res.data[6].totalCop ? res.data[6].totalCop.toString() : "0";
           /** 在表格最后添加合计行 */
           this.tableData.push({
             date: "合计",
             coldData: this.totalColdData,
             electData: this.totalElectData,
-            copData: "",
+            copData: this.totalEERData,
+            isSum: true, /** 标记为合计行 */
           });
           this.pageParm.total = res.data[5].total;
         } else {
@@ -1039,3 +1059,30 @@ export default {
   }
 }
 </style>
+
+<style scoped>
+/** 合计行样式 - 穿透scoped */
+::v-deep .el-table .sum-row {
+  background-color: #042f61 !important;
+  font-weight: bold;
+}
+::v-deep .el-table .sum-row td {
+  background-color: #042f61 !important;
+  font-weight: bold;
+}
+/** 合计行制冷量颜色 */
+.sum-cold {
+  color: rgba(1, 102, 251, 1);
+  font-weight: bold;
+}
+/** 合计行用电量颜色 */
+.sum-elect {
+  color: rgba(0, 224, 225, 1);
+  font-weight: bold;
+}
+/** 合计行EER颜色 */
+.sum-cop {
+  color: #EE5217;
+  font-weight: bold;
+}
+</style>