对接后端饼状图

src/api/dashboard/apiDashboard.js

@@ -53,6 +53,9 @@ const getElectricityCoreData = (param) => {
 const getElectricityTrendData = (param) => {
     return Request.get('/electricity/getElectricityInfoList', param)
 }
+const getElectricityCircleInfoList = (param) => {
+    return Request.get('/electricity/getElectricityCircleInfoList', param)
+}
 
 // 用水
 const getWaterCoreData = (param) => {
@@ -61,6 +64,9 @@ const getWaterCoreData = (param) => {
 const getWaterTrendData = (param) => {
     return Request.get('/water/getWaterInfoList', param)
 }
+const getWaterCircleInfoList = (param) => {
+    return Request.get('/water/getWaterCircleInfoList', param)
+}
 
 // 用热
 const getHotCoreData = (param) => {
@@ -108,9 +114,11 @@ export default {
 
     getElectricityCoreData,
     getElectricityTrendData,
+    getElectricityCircleInfoList,
 
     getWaterCoreData,
     getWaterTrendData,
+    getWaterCircleInfoList,
 
     getHotCoreData,
     getHotTrendData,

src/api/life/apiLifePark.js

@@ -9,7 +9,17 @@ const getTrafficflowSituation = (param) => {
     return Request.post('/parking/getTrafficflowSituation', param)
 }
 
+const getStopViolation = (param) => {
+    return Request.post('/parking/getStopViolation', param)
+}
+
+const getOccupationOfParkingSpace = (param) => {
+    return Request.post('/parking/getOccupationOfParkingSpace', param)
+}
+
 export default {
     getCoreData,
     getTrafficflowSituation,
+    getStopViolation,
+    getOccupationOfParkingSpace
 }

src/api/life/apiLifeRestaurant.js

@@ -13,8 +13,18 @@ const getConsumptionAnalysis = (param) => {
     return Request.post('/restaurant/getConsumptionAnalysis', param)
 }
 
+const getProfitAnalysis = (param) => {
+    return Request.post('/restaurant/getProfitAnalysis', param)
+}
+
+const getPaymentAnalysis = (param) => {
+    return Request.post('/restaurant/getPaymentAnalysis', param)
+}
+
 export default {
     getCoreData,
     getMealAnalysis,
     getConsumptionAnalysis,
+    getProfitAnalysis,
+    getPaymentAnalysis,
 }

src/api/operation/apiOperationAnalysis.js

@@ -52,6 +52,44 @@ const getEnergyTrendsAnalyseCpvInfo = (timeRange) => {
     return Request.post('/analyse/getEnergyTrendsAnalyseCpvInfo', timeRange)
 }
 
+const getEnergyAnalysisTotalInfo = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisTotalInfo', timeRange)
+}
+const getEnergyAnalysisTotal = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisTotal', timeRange)
+}
+
+const getEnergyAnalysisPowerInfo = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisPowerInfo', timeRange)
+}
+
+const getEnergyAnalysisPower = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisPower', timeRange)
+}
+
+const getEnergyAnalysisWaterInfo = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisWaterInfo', timeRange)
+}
+
+const getEnergyAnalysisWater = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisWater', timeRange)
+}
+
+const getEnergyAnalysisHotInfo = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisHotInfo', timeRange)
+}
+
+const getEnergyAnalysisHot = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisHot', timeRange)
+}
+const getEnergyAnalysisClod = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisClod', timeRange)
+}
+
+const getEnergyAnalysisCpv = (timeRange) => {
+    return Request.post('/analyse/getEnergyAnalysisCpv', timeRange)
+}
+
 
 export default {
     getCoreData,
@@ -62,4 +100,16 @@ export default {
     getEnergyTrendsAnalyseCold,
     getEnergyTrendsAnalyseCpv,
     getEnergyTrendsAnalyseCpvInfo,
+
+    getEnergyAnalysisTotalInfo,
+    getEnergyAnalysisTotal,
+    getEnergyAnalysisPowerInfo,
+    getEnergyAnalysisPower,
+    getEnergyAnalysisWaterInfo,
+    getEnergyAnalysisWater,
+    getEnergyAnalysisHotInfo,
+    getEnergyAnalysisHot,
+    getEnergyAnalysisClod,
+    getEnergyAnalysisCpv,
+
 }

src/api/operation/apiOperationMoney.js

@@ -5,6 +5,11 @@ const getCoreData = (timeRange) => {
     return Request.post('/operation_asset/getOperAssetCoreIndicators', timeRange)
 }
 
+const getScrapAndMaintain = (timeRange) => {
+    return Request.post('/operation_asset/getScrapAndMaintain', timeRange)
+}
+
 export default {
     getCoreData,
+    getScrapAndMaintain,
 }

src/api/security/apiSecurityAlarmMgr.js

@@ -17,9 +17,14 @@ const getAlarmClassification = (timeRange) => {
     return Request.post('/security_linkage/getAlarmClassification', timeRange)
 }
 
+const getFloorAlarmDistribution = (timeRange) => {
+    return Request.post('/security_linkage/getFloorAlarmDistribution', timeRange)
+}
+
 export default {
     getCoreData,
     getAlarmTrend,
     getEquipmentOnline,
     getAlarmClassification,
+    getFloorAlarmDistribution,
 }

src/components/business/analysis/all/businessEnergyDetail.vue

@@ -2,25 +2,41 @@
 import {requireImg} from "@/utils/requireImg";
 import BusinessEnergyDistributeChart from "@/components/business/analysis/all/businessEnergyDistributeChart.vue";
 import BusinessEnergySummaryTbl from "@/components/business/analysis/common/businessEnergySummaryTbl.vue";
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
 
 export default {
   components: {
     BusinessEnergyDistributeChart,
     BusinessEnergySummaryTbl
   },
-  methods: {requireImg},
+  mounted() {
+    this.init();
+  },
+  methods: {
+    requireImg,
+    init() {
+      this.getData();
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisTotalInfo({}).then(res=>{
+        let data = this.$util.dataUtil.circleChartArrToObj(res);
+        this.tableData[0].num = data['monthlyEnergySaving']
+        this.tableData[1].num = data['annualEnergySaving']
+      })
+    }
+  },
   data() {
     return {
       tableData: [
         {
           icon: 'business/energy/energy.png',
           title: '月度同比节能',
-          num: 36,
+          num: 0,
           unit: '元/人'
-        },{
+        }, {
           icon: 'business/energy/energy.png',
           title: '年度同比节能',
-          num: 36,
+          num: 0,
           unit: '元/人'
         }
 
@@ -48,17 +64,20 @@ export default {
 .businessEnergyDetail {
   width: 100%;
   height: 100%;
+
   .businessEnergyDetail-icon {
     display: inline-block;
     margin-right: 6px;
     vertical-align: middle;
   }
+
   .businessEnergyDetail-num {
     display: inline-block;
     padding: 0 20px;
     color: #4D4D4D;
     background-color: #f7fbff;
   }
+
   .businessEnergyDetail-chart {
     margin-top: 30px;
   }

src/components/business/analysis/all/businessEnergyDistributeChart.vue

@@ -3,34 +3,12 @@
 </template>
 
 <script>
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.init()
-    })
-  },
-  methods: {
-    init() {
-      let chart = this.$echarts.init(this.$refs.myChart);
-      let nameList = ["用电", "用水", "用热", "用冷", "光伏"]; // 名字
-      let valueList = [100, 140, 230, 100, 130]; // 分数,最大值为100
-
-      let indicatorList = [];
-      nameList.map((item, index) => {
-        indicatorList.push({
-          name: item,
-          value: valueList[index],
-          max: 250,
-        });
-      });
-
-      let options = {
+    return {
+      option: {
         legend: {
           top: "10",
           icon: 'circle',
@@ -40,31 +18,19 @@ export default {
           data: ["年度环比节能（元）"],
         },
         radar: {
-          indicator: indicatorList,
-          center: ["50%", "50%"],
-          radius: "60%",
-          axisName: {
-            formatter: function (value, indicator) {
-              return `{a|${value}}`;
-            },
-            rich: {
-              a: {
-                fontSize: "14px",
-                fontFamily: " Source Han Sans CN-Regular",
-                fontWeight: 400,
-                color: "#333333",
-                padding: [0, 8, 0, 0],
-              },
-              b: {
-                padding: [4, 8, 4, 8],
-                backgroundColor: "rgba(229, 243, 255, 0.6500)",
-                borderRadius: 50,
-                fontFamily: "Source Han Sans CN-Medium",
-                fontWeight: 500,
-                color: "#3AA7E6",
-              },
+          name: {
+            textStyle: {
+              color: '#333333',
+              fontSize: 14,
             },
           },
+          indicator: [],
+          center: ["50%", "50%"],
+          radius: "60%",
+        },
+        tooltip: {
+          show: true,
+          trigger: 'item',
         },
         series: [
           {
@@ -72,20 +38,59 @@ export default {
             type: "radar",
             color: "#3AA7E6",
             label: {
-              show: false,
+              show: true,
             },
             areaStyle: {
               color: "rgba(170, 217, 255, 0.35)",
             },
             data: [
               {
-                value: valueList,
+                value: [],
               },
             ],
           },
         ],
-      };
-      chart.setOption(options);
+      },
+    }
+  },
+  props: {
+    height: Number
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.init()
+    })
+  },
+  methods: {
+    init() {
+      let chart = this.$echarts.init(this.$refs.myChart);
+      this.chart = chart;
+      this.getData()
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisTotal({}).then(res=>{
+        let values = []
+        let indicatorList = [];
+        let max = 0;
+        if (res) {
+          res.forEach((item, index) => {
+            values.push(item.value)
+            max = Math.max(max, item.value);
+            indicatorList.push({
+              name: item.name,
+              value: item.value,
+            });
+          });
+        }
+        max = Math.max(max*2, 200);
+        console.log(max)
+        indicatorList.forEach(item => {
+          item.max = max;
+        });
+        this.option.radar.indicator = indicatorList;
+        this.option.series[0].data[0].value = values;
+        this.chart.setOption(this.option);
+      })
     }
   }
 }

src/components/business/analysis/cold/BusinessColdDetail.vue

@@ -1,34 +1,33 @@
 <script>
 import {requireImg} from "@/utils/requireImg";
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
 
 export default {
   components: {},
-  methods: {
-    requireImg,
-
-  },
   data() {
     return {
+      running: 0,
+      total: 0,
       tableData: [
         {
           icon: 'business/energy/cold.png',
           title: '总用冷量',
-          num: 36,
+          num: 0,
           unit: 'kwh'
         },{
           icon: 'business/energy/cold.png',
           title: '人均成本',
-          num: 36,
+          num: 0,
           unit: '元/人/年'
         },{
           icon: 'business/energy/cold.png',
           title: '进水温度',
-          num: 36,
+          num: 0,
           unit: '摄氏度'
         },{
           icon: 'business/energy/cold.png',
           title: '出水温度',
-          num: 36,
+          num: 0,
           unit: '摄氏度'
         }
 
@@ -36,6 +35,25 @@ export default {
     }
   },
   mounted() {
+    this.init()
+  },
+  methods: {
+    requireImg,
+    init() {
+      this.getData();
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisClod({}).then(res=>{
+        let data = this.$util.dataUtil.circleChartArrToObj(res);
+        this.running = data['function']
+        this.total = data['whole']
+        this.tableData[0].num = data['clodTotal']
+        this.tableData[1].num = data['perCapitaCost']
+        this.tableData[3].num = data['inletWaterTemperature']
+        this.tableData[4].num = data['outletWaterTemperature']
+      })
+    }
+
   },
 }
 </script>
@@ -49,7 +67,7 @@ export default {
           <a-col :span="11">
             <div style="margin: 10% 0 0 30%">
               <a-avatar :size="28" :src="requireImg('business/energy/device-air.png')"></a-avatar>
-              <span style="font-size: 20px;display: inline-block;margin-left: 20%">12</span>
+              <span style="font-size: 20px;display: inline-block;margin-left: 20%">{{ running }}</span>
             </div>
             <div style="margin: 10% 0 0 30%;color: #B2B2B2;font-size: 14px">正在运行(台)</div>
           </a-col>
@@ -59,9 +77,9 @@ export default {
           <a-col :span="11">
             <div style="margin: 10% 0 0 30%">
               <a-avatar :size="28" :src="requireImg('business/energy/device-air.png')"></a-avatar>
-              <span style="font-size: 20px;display: inline-block;margin-left: 20%">20</span>
+              <span style="font-size: 20px;display: inline-block;margin-left: 20%">{{ total }}</span>
             </div>
-            <div style="margin: 10% 0 0 30%;color: #B2B2B2;font-size: 14px">正在运行(台)</div>
+            <div style="margin: 10% 0 0 30%;color: #B2B2B2;font-size: 14px">总数量(台)</div>
           </a-col>
         </a-row>
       </div>

src/components/business/analysis/electric/BusinessElectricDetail.vue

@@ -2,22 +2,12 @@
 import {requireImg} from "@/utils/requireImg";
 import BusinessElectricDistributeChart
   from "@/components/business/analysis/electric/BusinessElectricDistributeChart.vue";
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
 
 export default {
   components: {
     BusinessElectricDistributeChart
   },
-  methods: {
-    requireImg,
-    handleTagSelect(item) {
-      for (const key in this.tagCheck) {
-        this.tagCheck[key] = false;
-      }
-      this.currCheck = item;
-      this.tagCheck[item] = true;
-    },
-
-  },
   data() {
     return {
       currCheck: '',
@@ -30,12 +20,12 @@ export default {
         {
           icon: 'business/energy/electric.png',
           title: '总用电量',
-          num: 36,
+          num: 0,
           unit: '元/人'
         },{
           icon: 'business/energy/electric.png',
           title: '环比节约',
-          num: 36,
+          num: 0,
           unit: '元/人'
         }
 
@@ -43,7 +33,29 @@ export default {
     }
   },
   mounted() {
-    this.handleTagSelect('all')
+    this.init();
+  },
+  methods: {
+    requireImg,
+    init() {
+      this.handleTagSelect('all');
+      this.getData();
+    },
+    handleTagSelect(item) {
+      for (const key in this.tagCheck) {
+        this.tagCheck[key] = false;
+      }
+      this.currCheck = item;
+      this.tagCheck[item] = true;
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisPowerInfo({}).then(res=>{
+        let data = this.$util.dataUtil.circleChartArrToObj(res);
+        this.tableData[0].num = data['powerConsumptionTotal'];
+        this.tableData[1].num = data['energyConservation'];
+      })
+    }
+
   },
 }
 </script>

src/components/business/analysis/electric/BusinessElectricDistributeChart.vue

@@ -1,20 +1,10 @@
 <script>
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number,
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.initChart()
-    })
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+    return {
+      option: {
         color: ['#80D4FF', '#A6A6FF', '#FFB580', '#FFDF80', '#79F2E8'],
         tooltip: {
           trigger: 'item'
@@ -31,13 +21,7 @@ export default {
             type: 'pie',
             radius: ['40%', '70%'],
             center: ['50%','35%'],
-            data: [
-              { value: 1048, name: '信息机房' },
-              { value: 735, name: '空调' },
-              { value: 580, name: '照明' },
-              { value: 484, name: '插座' },
-              { value: 300, name: '其他' }
-            ],
+            data: [],
             emphasis: {
               itemStyle: {
                 shadowBlur: 10,
@@ -47,8 +31,29 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option)
+      }
+    }
+  },
+  props: {
+    height: Number,
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option)
+      this.getData();
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisPower({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option);
+      })
     }
   }
 }

src/components/business/analysis/hot/BusinessHotDetail.vue

@@ -1,27 +1,24 @@
 <script>
 import {requireImg} from "@/utils/requireImg";
 import BusinessHotDistributeChart from "@/components/business/analysis/hot/BusinessHotDistributeChart.vue";
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
 
 export default {
   components: {
     BusinessHotDistributeChart
   },
-  methods: {
-    requireImg,
-
-  },
   data() {
     return {
       tableData: [
         {
           icon: 'business/energy/hot.png',
           title: '总用热量',
-          num: 36,
+          num: 0,
           unit: '元/人'
         },{
           icon: 'business/energy/hot.png',
           title: '人均成本',
-          num: 36,
+          num: 0,
           unit: '元/人/年'
         }
 
@@ -29,6 +26,20 @@ export default {
     }
   },
   mounted() {
+    this.init()
+  },
+  methods: {
+    requireImg,
+    init() {
+      this.getData()
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisHotInfo({}).then(res=>{
+        let data = this.$util.dataUtil.circleChartArrToObj(res);
+        this.tableData[0].num = data['heatConsumptionTotal']
+        this.tableData[1].num = data['perCapitaCost']
+      })
+    }
   },
 }
 </script>

src/components/business/analysis/hot/BusinessHotDistributeChart.vue

@@ -1,20 +1,10 @@
 <script>
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number,
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.initChart()
-    })
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+    return {
+      option: {
         color: ['#80D4FF', '#A6A6FF', '#FFB580', '#FFDF80', '#79F2E8'],
         tooltip: {
           trigger: 'item'
@@ -32,11 +22,6 @@ export default {
             radius: ['40%', '70%'],
             center: ['50%','35%'],
             data: [
-              { value: 1048, name: '办公区域' },
-              { value: 735, name: '餐厅' },
-              { value: 735, name: '机房' },
-              { value: 735, name: '停车场' },
-              { value: 735, name: '其他' },
             ],
             emphasis: {
               itemStyle: {
@@ -47,8 +32,28 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option)
+      }
+    }
+  },
+  props: {
+    height: Number,
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      this.getData()
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisHot({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 }

src/components/business/analysis/pv/BusinessPvDetail.vue

@@ -1,32 +1,31 @@
 <script>
 import {requireImg} from "@/utils/requireImg";
 import businessPvMoneyChart from "@/components/business/analysis/pv/BusinessPvMoneyChart.vue";
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
 
 export default {
   components: {
     businessPvMoneyChart
   },
-  methods: {
-    requireImg,
-
-  },
   data() {
     return {
+      running: 0,
+      total: 0,
       tableData: [
         {
           icon: 'business/energy/pv.png',
           title: '总发电量',
-          num: 36,
+          num: 0,
           unit: 'kwh'
         },{
           icon: 'business/energy/pv.png',
           title: '发电时间',
-          num: 36,
+          num: 0,
           unit: 'h'
         },{
           icon: 'business/energy/pv.png',
           title: '总收益',
-          num: 36,
+          num: 0,
           unit: '元'
         }
 
@@ -34,6 +33,23 @@ export default {
     }
   },
   mounted() {
+    this.init()
+  },
+  methods: {
+    requireImg,
+    init() {
+      this.getData()
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisCpv({}).then(res=>{
+        let data = this.$util.dataUtil.circleChartArrToObj(res)
+        this.running = data['function']
+        this.total = data['whole']
+        this.tableData[0].num = data['electricTotal']
+        this.tableData[1].num = data['electricDate']
+        this.tableData[2].num = data['profitTotal']
+      })
+    }
   },
 }
 </script>
@@ -47,7 +63,7 @@ export default {
           <a-col :span="11">
             <div style="margin: 10% 0 0 30%">
               <a-avatar :size="28" :src="requireImg('business/energy/device-pv.png')"></a-avatar>
-              <span style="font-size: 20px;display: inline-block;margin-left: 20%">12</span>
+              <span style="font-size: 20px;display: inline-block;margin-left: 20%">{{ running }}</span>
             </div>
             <div style="margin: 10% 0 0 30%;color: #B2B2B2;font-size: 14px">正在运行(台)</div>
           </a-col>
@@ -57,9 +73,9 @@ export default {
           <a-col :span="11">
             <div style="margin: 10% 0 0 30%">
               <a-avatar :size="28" :src="requireImg('business/energy/device-pv.png')"></a-avatar>
-              <span style="font-size: 20px;display: inline-block;margin-left: 20%">20</span>
+              <span style="font-size: 20px;display: inline-block;margin-left: 20%">{{ total }}</span>
             </div>
-            <div style="margin: 10% 0 0 30%;color: #B2B2B2;font-size: 14px">正在运行(台)</div>
+            <div style="margin: 10% 0 0 30%;color: #B2B2B2;font-size: 14px">总数量(台)</div>
           </a-col>
         </a-row>
       </div>

src/components/business/analysis/water/BusinessWaterDetail.vue

@@ -1,22 +1,12 @@
 <script>
 import {requireImg} from "@/utils/requireImg";
 import BusinessWaterDistributeChart from "@/components/business/analysis/water/BusinessWaterDistributeChart.vue";
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
 
 export default {
   components: {
     BusinessWaterDistributeChart
   },
-  methods: {
-    requireImg,
-    handleTagSelect(item) {
-      for (const key in this.tagCheck) {
-        this.tagCheck[key] = false;
-      }
-      this.currCheck = item;
-      this.tagCheck[item] = true;
-    },
-
-  },
   data() {
     return {
       currCheck: '',
@@ -29,12 +19,12 @@ export default {
         {
           icon: 'business/energy/water.png',
           title: '总用水量',
-          num: 36,
+          num: 0,
           unit: 'm³'
         },{
           icon: 'business/energy/water.png',
           title: '人均成本',
-          num: 36,
+          num: 0,
           unit: '元/人/年'
         }
 
@@ -42,7 +32,29 @@ export default {
     }
   },
   mounted() {
-    this.handleTagSelect('all')
+    this.init();
+  },
+  methods: {
+    requireImg,
+    init() {
+      this.handleTagSelect('all');
+      this.getData();
+    },
+    handleTagSelect(item) {
+      for (const key in this.tagCheck) {
+        this.tagCheck[key] = false;
+      }
+      this.currCheck = item;
+      this.tagCheck[item] = true;
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisWaterInfo({}).then(res=>{
+        let data = this.$util.dataUtil.circleChartArrToObj(res);
+        this.tableData[0].num = data['waterConsumptionTotal']
+        this.tableData[1].num = data['perCapitaCost']
+      })
+    }
+
   },
 }
 </script>

src/components/business/analysis/water/BusinessWaterDistributeChart.vue

@@ -1,20 +1,10 @@
 <script>
+import apiOperationAnalysis from "@/api/operation/apiOperationAnalysis";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number,
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.initChart()
-    })
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+    return {
+      option: {
         color: ['#80D4FF', '#A6A6FF', '#FFB580', '#FFDF80', '#79F2E8'],
         tooltip: {
           trigger: 'item'
@@ -31,8 +21,6 @@ export default {
             radius: ['40%', '70%'],
             center: ['50%','35%'],
             data: [
-              { value: 1048, name: '自来水' },
-              { value: 735, name: '中水' },
             ],
             emphasis: {
               itemStyle: {
@@ -43,8 +31,29 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option)
+      }
+    }
+  },
+  props: {
+    height: Number,
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option)
+      this.getData()
+    },
+    getData() {
+      apiOperationAnalysis.getEnergyAnalysisWater({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 }

src/components/business/asset/charts/assetMoneyRepairChart.vue

@@ -3,22 +3,12 @@
 </template>
 
 <script>
+import apiOperationMoney from "@/api/operation/apiOperationMoney";
+
 export default {
   data() {
     return {
-
-    }
-  },
-  props: {
-    height: Number
-  },
-  mounted() {
-    this.initChart()
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+      option: {
         color: ['#80D4FF', '#A6A6FF','#FFDF80'],
         tooltip: {
           trigger: 'item'
@@ -30,7 +20,7 @@ export default {
         },
         series: [
           {
-            name: '排放量',
+            name: '个数',
             type: 'pie',
             radius: ['40%', '70%'],
             center: ['50%','40%'],
@@ -56,8 +46,27 @@ export default {
             ]
           }
         ]
-      };
-      chart.setOption(option);
+      }
+    }
+  },
+  props: {
+    height: Number
+  },
+  mounted() {
+    this.initChart()
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option);
+      this.getData()
+    },
+    getData() {
+      apiOperationMoney.getScrapAndMaintain({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 }

src/components/dashboard/message/dashboardMessageCard.vue

@@ -31,6 +31,9 @@ export default {
   methods: {
     callback(key) {
     },
+    toMsg() {
+      this.$router.push({path: '/notice'})
+    }
   }
 }
 </script>
@@ -48,6 +51,10 @@ export default {
         <DashboardMsgList></DashboardMsgList>
       </a-tab-pane>
     </a-tabs>
+    <div @click="toMsg" style="float: right;margin-right: 8px;margin-top: 8px;color: #C6C8CC;font-size: 12px;cursor:pointer;">
+      查看全部
+      <a-icon type="right"></a-icon>
+    </div>
   </div>
 </template>
 

src/components/dashboard/portrait/electricity/electricityDistributionChart.vue

@@ -1,21 +1,11 @@
 <script>
+import apiDashboard from "@/api/dashboard/apiDashboard";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number,
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.initChart()
-    })
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
-        color: ['#80D4FF', '#A6A6FF', '#FFB580', '#FFDF80', '#79F2E8'],
+    return {
+      option: {
+        color: ['#3AA7E6', '#9790F8', '#4ACFB8', '#F4955F', '#F8797E'],
         tooltip: {
           trigger: 'item'
         },
@@ -31,11 +21,6 @@ export default {
             type: 'pie',
             radius: '50%',
             data: [
-              { value: 1048, name: '公共用电' },
-              { value: 735, name: '动力用电' },
-              { value: 580, name: '照明用电' },
-              { value: 484, name: '信息机房用电' },
-              { value: 300, name: '其他用电' }
             ],
             emphasis: {
               itemStyle: {
@@ -46,8 +31,29 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option)
+      },
+    }
+  },
+  props: {
+    height: Number,
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option);
+      this.getData();
+    },
+    getData() {
+      apiDashboard.getElectricityCircleInfoList({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 }

src/components/dashboard/portrait/water/waterDistributionChart.vue

@@ -1,21 +1,11 @@
 <script>
+import apiDashboard from "@/api/dashboard/apiDashboard";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number,
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.initChart()
-    })
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
-        color: ['#80D4FF', '#FFDF80'],
+    return {
+      option: {
+        color: ['#3AA7E6', '#F4955F'],
         tooltip: {
           trigger: 'item'
         },
@@ -29,8 +19,7 @@ export default {
             type: 'pie',
             radius: '50%',
             data: [
-              { value: 53, name: '自来水' },
-              { value: 235, name: '中水' },
+
             ],
             emphasis: {
               itemStyle: {
@@ -41,8 +30,29 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option)
+      },
+    }
+  },
+  props: {
+    height: Number,
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option)
+      this.getData()
+    },
+    getData() {
+      apiDashboard.getWaterCircleInfoList({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option);
+      })
     }
   }
 }

src/components/life/parking/components/lifeParkConsumeChart.vue

@@ -5,22 +5,12 @@
 </template>
 
 <script>
+import apiLifePark from "@/api/life/apiLifePark";
+
 export default {
   data() {
     return {
-
-    }
-  },
-  props: {
-    height: Number
-  },
-  mounted() {
-    this.init();
-  },
-  methods: {
-    init() {
-      let chart = this.$echarts.init(this.$refs.myChart);
-      let option = {
+      option: {
         color: ['#3AA7E6', '#4ACFB8','#F4955F','#9790f8','#f8797e'],
         tooltip: {
           trigger: 'item'
@@ -37,11 +27,6 @@ export default {
             radius: ['40%', '60%'],
             center: ['50%','40%'],
             data: [
-              { value: 850, name: '北京规划院' },
-              { value: 735, name: '中迅院' },
-              { value: 580, name: '单位3' },
-              { value: 484, name: '单位4' },
-              { value: 300, name: '单位5' }
             ],
             emphasis: {
               itemStyle: {
@@ -52,8 +37,27 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option);
+      },
+    }
+  },
+  props: {
+    height: Number
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option);
+      this.getData()
+    },
+    getData() {
+      apiLifePark.getOccupationOfParkingSpace({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 

src/components/life/parking/components/lifeParkUnNormalChart.vue

@@ -5,22 +5,12 @@
 </template>
 
 <script>
+import apiLifePark from "@/api/life/apiLifePark";
+
 export default {
   data() {
     return {
-
-    }
-  },
-  props: {
-    height: Number
-  },
-  mounted() {
-    this.init();
-  },
-  methods: {
-    init() {
-      let chart = this.$echarts.init(this.$refs.myChart);
-      let option = {
+      option: {
         color: ['#3AA7E6', '#4ACFB8','#F4955F','#9790f8','#f8797e'],
         tooltip: {
           trigger: 'item'
@@ -52,8 +42,27 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option);
+      }
+    }
+  },
+  props: {
+    height: Number
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option);
+      this.getData()
+    },
+    getData() {
+      apiLifePark.getStopViolation({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 

src/components/life/restaurant/components/LifeRestPayChart.vue

@@ -3,22 +3,12 @@
 </template>
 
 <script>
+import apiLifeRestaurant from "@/api/life/apiLifeRestaurant";
+
 export default {
   data() {
     return {
-
-    }
-  },
-  props: {
-    height: Number
-  },
-  mounted() {
-    this.initChart()
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+      option: {
         color: ['#3AA7E6', '#4ACFB8','#F4955F','#9790f8'],
         tooltip: {
           trigger: 'item'
@@ -49,15 +39,31 @@ export default {
               show: true
             },
             data: [
-              { value: 1048, name: '人脸支付' },
-              { value: 735, name: '扫码' },
-              { value: 678, name: '刷卡' },
-              { value: 580, name: '线下' },
+
             ]
           }
         ]
-      };
-      chart.setOption(option);
+      }
+    }
+  },
+  props: {
+    height: Number
+  },
+  mounted() {
+    this.initChart()
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option);
+      this.getData();
+    },
+    getData() {
+      apiLifeRestaurant.getProfitAnalysis({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 }

src/components/life/restaurant/components/LifeRestProfitChart.vue

@@ -3,22 +3,12 @@
 </template>
 
 <script>
+import apiLifeRestaurant from "@/api/life/apiLifeRestaurant";
+
 export default {
   data() {
     return {
-
-    }
-  },
-  props: {
-    height: Number
-  },
-  mounted() {
-    this.initChart()
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+      option: {
         color: ['#3AA7E6', '#4ACFB8','#F4955F'],
         tooltip: {
           trigger: 'item'
@@ -49,14 +39,30 @@ export default {
               show: true
             },
             data: [
-              { value: 1048, name: '早餐' },
-              { value: 735, name: '午餐' },
-              { value: 580, name: '晚餐' },
             ]
           }
         ]
-      };
-      chart.setOption(option);
+      }
+    }
+  },
+  props: {
+    height: Number
+  },
+  mounted() {
+    this.initChart()
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      chart.setOption(this.option);
+      this.getData();
+    },
+    getData() {
+      apiLifeRestaurant.getProfitAnalysis({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option)
+      })
     }
   }
 }

src/components/security/alarm/manage/securityAlarmManageDistribute.vue

@@ -1,20 +1,10 @@
 <script>
+import apiSecurityAlarmMgr from "@/api/security/apiSecurityAlarmMgr";
+
 export default {
   data() {
-    return {}
-  },
-  props: {
-    height: Number,
-  },
-  mounted() {
-    this.$nextTick(()=>{
-      this.initChart()
-    })
-  },
-  methods: {
-    initChart() {
-      let chart = this.$echarts.init(this.$refs.myChart)
-      let option = {
+    return {
+      option: {
         color: ['#80D4FF', '#A6A6FF', '#FFB580', '#FFDF80', '#79F2E8'],
         tooltip: {
           trigger: 'item'
@@ -30,9 +20,6 @@ export default {
             radius: '50%',
             center: ['50%','40%'],
             data: [
-              { value: 177, name: '一层' },
-              { value: 150, name: 'B1停车场' },
-              { value: 100, name: 'B2停车场' },
             ],
             emphasis: {
               itemStyle: {
@@ -43,8 +30,28 @@ export default {
             }
           }
         ]
-      };
-      chart.setOption(option)
+      }
+    }
+  },
+  props: {
+    height: Number,
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      let chart = this.$echarts.init(this.$refs.myChart)
+      this.chart = chart;
+      this.getData();
+    },
+    getData() {
+      apiSecurityAlarmMgr.getFloorAlarmDistribution({}).then(res=>{
+        this.option.series[0].data = res;
+        this.chart.setOption(this.option);
+      })
     }
   }
 }

src/utils/dataUtil.js

@@ -37,7 +37,18 @@ const refreshEchartsData = (instance, option, data) => {
     instance.setOption(option)
 }
 
+const circleChartArrToObj = (arr) => {
+  let obj = {};
+  if (arr) {
+      for (let i = 0; i < arr.length; i++) {
+          obj[arr[i].name] = arr[i].value;
+      }
+  }
+  return obj;
+}
+
 export default {
     covertDataToEcharts,
     refreshEchartsData,
+    circleChartArrToObj,
 }