运营分析用电用水等对应名称分析

src/components/business/analysis/analysis.vue

@@ -35,121 +35,114 @@ export default {
     BusinessHotDetail,
     BusinessColdDetail,
     BusinessPvDetail,
-
   },
   data() {
     return {
       queryData: {
-        companyId: '0',
-        energy: '0',
-        timeRange: this.$util.dateUtil.getNearlyMonthRange()
+        companyId: "0",
+        energy: "0",
+        timeRange: this.$util.dateUtil.getNearlyMonthRange(),
       },
       oriCoreData: [],
       coreData: [
         {
-          title: '总用量(kwh)',
+          title: "总用量(kwh)",
           num: 0,
-          historyDesc: '同比',
-          historyNum: 0
+          historyDesc: "同比",
+          historyNum: 0,
         },
         {
-          title: '总用量(㎡)',
+          title: "总用量(㎡)",
           num: 0,
-          historyDesc: '同比',
-          historyNum: 0
+          historyDesc: "同比",
+          historyNum: 0,
         },
         {
-          title: '总能耗成本(元)',
+          title: "总能耗成本(元)",
           num: 0,
-          historyDesc: '同比',
-          historyNum: 0
+          historyDesc: "同比",
+          historyNum: 0,
         },
         {
-          title: '人均能耗成本(元/人)',
+          title: "人均能耗成本(元/人)",
           num: 0,
-          historyDesc: '同比',
-          historyNum: 0
+          historyDesc: "同比",
+          historyNum: 0,
         },
         {
           type: 1,
-          title: '值得关注',
+          title: "值得关注",
           showStar: true,
-          content: ''
+          content: "",
         },
-      ]
+      ],
     };
   },
   watch: {
     "queryData.energy": function (val) {
-      this.handleTypeChange(val)
-    }
+      this.handleTypeChange(val);
+    },
   },
   created() {
     this.oriCoreData = JSON.parse(JSON.stringify(this.coreData));
   },
   mounted() {
-    this.init()
+    this.init();
   },
   methods: {
     init() {
-      this.$store.loadingStore().loadingWithApi(this.getCoreData(), 2000)
+      this.$store.loadingStore().loadingWithApi(this.getCoreData(), 2000);
     },
     handleTypeChange(type) {
       this.coreData = JSON.parse(JSON.stringify(this.oriCoreData));
-      if ('electric'==type) {
+      if ("electric" == type) {
         // 用电
-        this.coreData[0].title = '总用电量(kwh)'
-        this.coreData[1].title = '人均用电量(kwh/人)'
-      } else if ('water'==type) {
+        this.coreData[0].title = "总用电量(kwh)";
+        this.coreData[1].title = "人均用电量(kwh/人)";
+      } else if ("water" == type) {
         // 用水
-        this.coreData[0].title = '总用水量(m³)'
-        this.coreData[1].title = '人均用水量(m³/人)'
-
-      } else if ('hot'==type) {
+        this.coreData[0].title = "总用水量(m³)";
+        this.coreData[1].title = "人均用水量(m³/人)";
+      } else if ("hot" == type) {
         // 用热
-        this.coreData[0].title = '总用热量(kwh)'
-        this.coreData[1].title = '人均用热量(kwh/人)'
-
-      } else if ('cold'==type) {
+        this.coreData[0].title = "总用热量(kwh)";
+        this.coreData[1].title = "人均用热量(kwh/人)";
+      } else if ("cold" == type) {
         // 用冷
-        this.coreData[0].title = '总用冷量(kwh)'
-        this.coreData[1].title = '人均用冷量(kwh/人)'
-
-      } else if ('pv'==type) {
+        this.coreData[0].title = "总用冷量(kwh)";
+        this.coreData[1].title = "人均用冷量(kwh/人)";
+      } else if ("pv" == type) {
         // 光伏
-        this.coreData[0].title = '总发电量(kwh)'
-        this.coreData[1].title = '平均发电量量(kwh/台)'
-
+        this.coreData[0].title = "总发电量(kwh)";
+        this.coreData[1].title = "平均发电量量(kwh/台)";
       } else {
         // 全部
-        this.coreData[0].title = '总用量(kwh)'
-        this.coreData[1].title = '总用量m³)'
+        this.coreData[0].title = "总用量(kwh)";
+        this.coreData[1].title = "总用量m³)";
       }
       this.getCoreData();
     },
-    reset() {
-
-    },
+    reset() {},
     search() {
       this.$util.asyncPromise(
-          this.getCoreData(),
-          this.$refs.anaChart.getData(),
-      )
+        this.getCoreData(),
+        this.$refs.anaChart.getData()
+      );
       this.$refs.anaDetail.refresh();
     },
     getCoreData() {
-      return apiOperationAnalysis.getCoreData(this.queryData).then(res=>{
-        this.coreData[0].num = res.list[0].value
-        this.coreData[0].historyNum = res.list[0].compare
-        this.coreData[1].num = res.list[1].value
-        this.coreData[1].historyNum = res.list[1].compare
-        this.coreData[2].num = res.list[2].value
-        this.coreData[2].historyNum = res.list[2].compare
-        this.coreData[3].num = res.list[3].value
-        this.coreData[3].historyNum = res.list[3].compare
-        this.coreData[4].content = res.worthAttention
-      })
-    }
+      return apiOperationAnalysis.getCoreData(this.queryData).then((res) => {
+        this.coreData[0].num = res.list[0].value;
+        this.coreData[0].historyNum = res.list[0].compare;
+        this.coreData[1].num = res.list[1].value;
+        this.coreData[1].historyNum = res.list[1].compare;
+        this.coreData[2].num = res.list[2].value;
+        this.coreData[2].historyNum = res.list[2].compare;
+        this.coreData[3].num = res.list[3].value;
+        this.coreData[3].historyNum = res.list[3].compare;
+        this.coreData[4].content = res.worthAttention;
+      });
+    },
   },
 };
 </script>
@@ -157,55 +150,150 @@ export default {
 <template>
   <div>
     <div class="page-query-core">
-      <query :show="['company','energy','time']" :query-data.sync="queryData" :reset="reset" :search="search"></query>
+      <query
+        :show="['company', 'energy', 'time']"
+        :query-data.sync="queryData"
+        :reset="reset"
+        :search="search"
+      ></query>
       <card :title="'核心指标'">
         <CoreData :data-list="coreData"></CoreData>
       </card>
     </div>
 
     <div class="analysis-energy-body">
-      <a-row :gutter="[12,12]">
+      <a-row :gutter="[12, 12]">
         <a-col :span="18">
           <div class="ioc-card-content">
-            <Card title="能源趋势">
+            <card :title="'用电趋势'" v-if="queryData.energy == 'electric'">
+              <div class="analysis-energy-body-left">
+                <BusinessElectricChart
+                  ref="anaChart"
+                  :query-data="queryData"
+                  :height="430"
+                ></BusinessElectricChart>
+              </div>
+            </card>
+            <card :title="'用水趋势'" v-else-if="queryData.energy == 'water'">
+              <div class="analysis-energy-body-left">
+                <BusinessElectricChart
+                  ref="anaChart"
+                  :query-data="queryData"
+                  :height="430"
+                ></BusinessElectricChart>
+              </div>
+            </card>
+            <card :title="'用热趋势'" v-else-if="queryData.energy == 'hot'">
+              <div class="analysis-energy-body-left">
+                <div style="margin-top: 15px">
+                  <BusinessElectricChart
+                    ref="anaChart"
+                    :query-data="queryData"
+                    :height="450"
+                  ></BusinessElectricChart>
+                </div>
+              </div>
+            </card>
+            <card :title="'用冷趋势'" v-else-if="queryData.energy == 'cold'">
+              <div class="analysis-energy-body-left">
+                <div style="margin-top: 15px">
+                  <BusinessElectricChart
+                    ref="anaChart"
+                    :query-data="queryData"
+                    :height="450"
+                  ></BusinessElectricChart>
+                </div>
+              </div>
+            </card>
+            <card :title="'光伏趋势'" v-else-if="queryData.energy == 'pv'">
               <div class="analysis-energy-body-left">
-                <BusinessElectricChart ref="anaChart" :query-data="queryData" :height="430" v-if="queryData.energy=='electric'" ></BusinessElectricChart>
-                <BusinessWaterChart ref="anaChart" :query-data="queryData" :height="430" v-if="queryData.energy=='water'"></BusinessWaterChart>
                 <div style="margin-top: 15px">
-                  <BusinessHotChart ref="anaChart" :query-data="queryData" :height="450" v-if="queryData.energy=='hot'"></BusinessHotChart>
-                  <BusinessColdChart ref="anaChart" :query-data="queryData" :height="450" v-if="queryData.energy=='cold'"></BusinessColdChart>
-                  <BusinessPvChart ref="anaChart" :query-data="queryData" :height="450" v-if="queryData.energy=='pv'"></BusinessPvChart>
-                  <BusinessEnergyChart ref="anaChart" :query-data="queryData" :height="450" v-if="queryData.energy=='0'"></BusinessEnergyChart>
+                  <BusinessElectricChart
+                    ref="anaChart"
+                    :query-data="queryData"
+                    :height="450"
+                  ></BusinessElectricChart>
                 </div>
               </div>
-            </Card>
+            </card>
+            <card :title="'能源趋势'" v-else-if="queryData.energy == '0'">
+              <div class="analysis-energy-body-left">
+                <div style="margin-top: 15px">
+                  <BusinessElectricChart
+                    ref="anaChart"
+                    :query-data="queryData"
+                    :height="450"
+                  ></BusinessElectricChart>
+                </div>
+              </div>
+            </card>
           </div>
-
         </a-col>
         <a-col :span="6">
           <div class="ioc-card-content">
-            <Card title="能源分析">
-              <div class="analysis-energy-body-right ">
-                <BusinessElectricDetail ref="anaDetail" :query-data="queryData"  v-if="queryData.energy=='electric'"/>
-                <BusinessWaterDetail ref="anaDetail" :query-data="queryData" v-if="queryData.energy=='water'"/>
+            <card :title="'用电分析'" v-if="queryData.energy == 'electric'">
+              <div class="analysis-energy-body-right">
+                <BusinessElectricDetail
+                  ref="anaDetail"
+                  :query-data="queryData"
+                />
+              </div>
+            </card>
+            <card :title="'用水分析'" v-else-if="queryData.energy == 'water'">
+              <div class="analysis-energy-body-right">
+                <BusinessElectricDetail
+                  ref="anaDetail"
+                  :query-data="queryData"
+                />
+              </div>
+            </card>
+            <card :title="'用热分析'" v-else-if="queryData.energy == 'hot'">
+              <div class="analysis-energy-body-right">
                 <div style="margin-top: 15px">
-                  <BusinessHotDetail ref="anaDetail" :query-data="queryData" v-if="queryData.energy=='hot'"/>
-                  <BusinessColdDetail ref="anaDetail" :query-data="queryData" v-if="queryData.energy=='cold'"/>
-                  <BusinessPvDetail ref="anaDetail" :query-data="queryData" v-if="queryData.energy=='pv'"/>
-                  <BusinessEnergyDetail ref="anaDetail" :query-data="queryData" v-if="queryData.energy=='0'"/>
+                  <BusinessElectricDetail
+                    ref="anaDetail"
+                    :query-data="queryData"
+                  />
                 </div>
               </div>
-            </Card></div>
-
+            </card>
+            <card :title="'用冷分析'" v-else-if="queryData.energy == 'cold'">
+              <div class="analysis-energy-body-right">
+                <div style="margin-top: 15px">
+                  <BusinessElectricDetail
+                    ref="anaDetail"
+                    :query-data="queryData"
+                  />
+                </div>
+              </div>
+            </card>
+            <card :title="'光伏分析'" v-else-if="queryData.energy == 'pv'">
+              <div class="analysis-energy-body-right">
+                <div style="margin-top: 15px">
+                  <BusinessElectricDetail
+                    ref="anaDetail"
+                    :query-data="queryData"
+                  />
+                </div>
+              </div>
+            </card>
+            <card :title="'能源分析'" v-else-if="queryData.energy == '0'">
+              <div class="analysis-energy-body-right">
+                <div style="margin-top: 15px">
+                  <BusinessElectricDetail
+                    ref="anaDetail"
+                    :query-data="queryData"
+                  />
+                </div>
+              </div>
+            </card>
+          </div>
         </a-col>
       </a-row>
     </div>
-
   </div>
 </template>
 
-
-
 <style lang="less" scoped>
 .analysis-energy-body {
   margin-top: 12px;
@@ -218,4 +306,4 @@ export default {
     overflow: hidden;
   }
 }
-</style>
+</style>

src/components/scene/meeting/config/meetingRoomItem.vue

@@ -3,7 +3,10 @@
     <a-row>
       <a-col :span="24">
         <div class="meetingRoomItem-title">
-          {{ obj.name }} <span style="font-size: 15px">{{ "[" + obj.timeRange[0] + "-" + obj.timeRange[1] + "]" }}</span>
+          {{ obj.name }}
+          <span style="font-size: 15px">{{
+            "[" + obj.timeRange[0] + "-" + obj.timeRange[1] + "]"
+          }}</span>
         </div>
       </a-col>
       <a-col :span="16" style="z-index:999;">
@@ -25,15 +28,21 @@
       <a-col :span="8">
         <div style="">
           <div class="meetingRoomItem-state" :style="{ color: color.primary }">
-            <span v-if="obj.status == 1">会议中</span> <span v-if="obj.status == 2">闲置中</span>
+            <span v-if="obj.status == 1">会议中</span>
+            <span v-if="obj.status == 2">闲置中</span>
             <span v-if="obj.status == 3">已预订</span>
           </div>
-          <div class="meetingRoomItem-num" :style="{ color: color.primary }">{{ obj.time }}</div>
+          <div class="meetingRoomItem-num" :style="{ color: color.primary }">
+            {{ obj.time }}
+          </div>
         </div>
       </a-col>
       <a-col>
         <div class="meetingRoomItem-opr">
-          <a-button class="meetingRoomItem-opr-btn" :style="{ backgroundColor: color.dark }" @click="viewDetails"
+          <a-button
+            class="meetingRoomItem-opr-btn"
+            :style="{ backgroundColor: color.dark }"
+            @click="viewDetails"
             >查看信息</a-button
           >
           <!-- update-LiuMengxiang:会议中的会议，配置策略不可点击。添加disabled属性 -->
@@ -53,7 +62,7 @@
       v-model="detailVisible"
       title="会议室详情"
       :width="1000"
-      style="height: 650px;overflow-y: auto"
+      style="height: 650px; overflow-y: auto"
       :footer="null"
     >
       <MeetingRoomDetails :data="obj" />
@@ -64,7 +73,7 @@
       v-model="configVisible"
       title="配置策略"
       :width="1000"
-      style="height: 650px;overflow-y: auto"
+      style="height: 650px; overflow-y: auto"
       :footer="null"
     >
       <MeetingRoomConfig
@@ -89,7 +98,7 @@ export default {
       color: {
         primary: "#3CC2AC",
         light: "rgba(60,194,172,0.5)",
-        dark: "#3CC2AC"
+        dark: "#3CC2AC",
       },
       devicesMap: {
         audio: "麦克风",
@@ -98,35 +107,35 @@ export default {
         control: "门禁",
         notification: "喇叭",
         unlock: "门锁",
-        "safety-certificate": "监控"
-      }
+        "safety-certificate": "监控",
+      },
     };
   },
   components: {
     MeetingRoomDetails,
-    MeetingRoomConfig
+    MeetingRoomConfig,
   },
   props: {
-    obj: Object
+    obj: Object,
   },
   mounted() {
     if (this.obj.status == 1) {
       this.color = {
         primary: "#3CC2AC",
         light: "rgba(60,194,172,0.5)",
-        dark: "#3CC2AC"
+        dark: "#3CC2AC",
       };
     } else if (this.obj.status == 2) {
       this.color = {
         primary: "#3AA7E6",
         light: "rgba(58,167,230,0.5)",
-        dark: "#3AA7E6"
+        dark: "#3AA7E6",
       };
     } else if (this.obj.status == 3) {
       this.color = {
         primary: "#EE8242",
         light: "rgba(238,130,66,0.5)",
-        dark: "#EE8242"
+        dark: "#EE8242",
       };
     }
   },
@@ -140,8 +149,8 @@ export default {
       } else {
         this.configVisible = true;
       }
-    }
-  }
+    },
+  },
 };
 </script>