From 0ae83a895e80a4b9777a27f613d721a7e5e2ac18 Mon Sep 17 00:00:00 2001
From: ali <ali9696@163.com>
Date: 星期二, 03 九月 2024 10:18:27 +0800
Subject: [PATCH] 整体样式修改
---
energy_management_ui/src/views/energyStatistics/energyConsumption/consumption.vue | 758 +++++++++++++++++++++++++++++++++-------------------------
1 files changed, 433 insertions(+), 325 deletions(-)
diff --git a/energy_management_ui/src/views/energyStatistics/energyConsumption/consumption.vue b/energy_management_ui/src/views/energyStatistics/energyConsumption/consumption.vue
index dbb0e10..37cdf87 100644
--- a/energy_management_ui/src/views/energyStatistics/energyConsumption/consumption.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyConsumption/consumption.vue
@@ -1,69 +1,139 @@
<template>
<div class="dashboard-editor-container">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ >
<el-form-item label="鏃ユ湡">
<el-radio-group v-model="queryParams.timeType">
- <el-radio style="margin-right: 10px" v-for="dict in dateTypeOptions" :key="dict.dictValue" :label="dict.dictValue" @change="handleTime(dict.dictValue)">{{dict.dictLabel}}</el-radio>
+ <el-radio
+ style="margin-right: 10px"
+ v-for="dict in dateTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictValue"
+ @change="handleTime(dict.dictValue)"
+ >{{ dict.dictLabel }}</el-radio
+ >
</el-radio-group>
<el-date-picker
v-model="queryParams.beginTime"
:type="dateTypes"
:value-format="valueFormat"
- placeholder="寮�濮嬫棩鏈�">
+ placeholder="寮�濮嬫棩鏈�"
+ >
</el-date-picker>
鍒�
<el-date-picker
v-model="queryParams.endTime"
:type="dateTypes"
:value-format="valueFormat"
- placeholder="缁撴潫鏃ユ湡">
+ placeholder="缁撴潫鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鏌ヨ</el-button>
- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button>
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鏌ヨ</el-button
+ >
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+ >閲嶇疆</el-button
+ >
</el-form-item>
<el-form-item>
- <router-link :to="'/energyConsumption/listEnergyConsumption/'+queryParams.timeType+'/'+queryParams.beginTime+'/'+queryParams.endTime+'/'+queryParams.indexCode+'/'+queryParams.id+'/'+titleName" class="link-type">
+ <router-link
+ :to="
+ '/energyConsumption/listEnergyConsumption/' +
+ queryParams.timeType +
+ '/' +
+ queryParams.beginTime +
+ '/' +
+ queryParams.endTime +
+ '/' +
+ queryParams.indexCode +
+ '/' +
+ queryParams.id +
+ '/' +
+ titleName
+ "
+ class="link-type"
+ >
<el-button size="mini">鑳芥簮娑堣垂鎴愭湰鍒嗘椂鍒嗘瀽鎶ヨ〃</el-button>
</router-link>
</el-form-item>
</el-form>
- <h4 style="float: left; text-align:center;padding: 0;margin: 0px 0px 10px;width: 90%;">鐢熶骇浼佷笟鑳芥簮娑堣�楁垚鏈垎鏋�</h4>
+ <h4
+ style="color:#fff;float: left; text-align:center;padding: 0;margin: 0px 0px 10px;width: 90%;"
+ >
+ 鐢熶骇浼佷笟鑳芥簮娑堣�楁垚鏈垎鏋�
+ </h4>
<el-row :gutter="32">
<el-col :xs="24" :sm="24" :lg="12" style="padding-right: 0">
- <div class="chart-wrapper" >
- <pie-chart ref="PieChart" :chart-data="lineChartData"/>
+ <div class="chart-wrapper">
+ <pie-chart ref="PieChart" :chart-data="lineChartData" />
</div>
</el-col>
<el-col :xs="24" :sm="24" :lg="12" style="padding-right: 0">
- <div class="chart-wrapper" >
- <pieChartCost ref="pieChartCost" :chart-data="lineChartData1"/>
+ <div class="chart-wrapper">
+ <pieChartCost ref="pieChartCost" :chart-data="lineChartData1" />
</div>
</el-col>
</el-row>
<el-row :gutter="32">
<el-col :xs="24" :sm="24" :lg="12" style="padding-right: 0">
- <div class="chart-wrapper" >
- <span style="display: block;color: #333;">鑳芥簮娑堣垂缁撴瀯鎯呭喌瀵规瘮</span>
- <el-checkbox-group v-model="checkList1" style="padding: 10px;border: 1px solid #ddd;margin:10px 0;" @change="handleCheckedCitiesChange1"><!--clickMe -->
- <el-checkbox :indeterminate="isIndeterminate1" v-model="checkAll1" @change="handleCheckAllChange1">鍏ㄩ��</el-checkbox>
- <el-checkbox v-for="dict in list" :key="dict.code" :label="dict.code">{{dict.name}}</el-checkbox>
+ <div class="chart-wrapper">
+ <span style="display: block;color: #fff;">鑳芥簮娑堣垂缁撴瀯鎯呭喌瀵规瘮</span>
+ <el-checkbox-group
+ v-model="checkList1"
+ style="padding: 10px;border: 1px solid #ddd;margin:10px 0;"
+ @change="handleCheckedCitiesChange1"
+ ><!--clickMe -->
+ <el-checkbox
+ :indeterminate="isIndeterminate1"
+ v-model="checkAll1"
+ @change="handleCheckAllChange1"
+ >鍏ㄩ��</el-checkbox
+ >
+ <el-checkbox
+ v-for="dict in list"
+ :key="dict.code"
+ :label="dict.code"
+ >{{ dict.name }}</el-checkbox
+ >
</el-checkbox-group>
- <bar-chart ref="BarChart" :chart-data="lineChartData2"/>
+ <bar-chart ref="BarChart" :chart-data="lineChartData2" />
</div>
</el-col>
<el-col :xs="24" :sm="24" :lg="12" style="padding-right: 0">
<div class="chart-wrapper">
- <span style="display: block;color: #333;">鑳芥簮娑堣垂鎴愭湰鎯呭喌瀵规瘮</span>
- <el-checkbox-group v-model="checkList2" style="padding: 10px;border: 1px solid #ddd;margin:10px 0;" @change="handleCheckedCitiesChange2"><!--clickMe -->
- <el-checkbox :indeterminate="isIndeterminate2" v-model="checkAll2" @change="handleCheckAllChange2">鍏ㄩ��</el-checkbox>
- <el-checkbox v-for="dict in list" :key="dict.code" :label="dict.code">{{dict.name}}</el-checkbox>
+ <span style="display: block;color: #fff;">鑳芥簮娑堣垂鎴愭湰鎯呭喌瀵规瘮</span>
+ <el-checkbox-group
+ v-model="checkList2"
+ style="padding: 10px;border: 1px solid #ddd;margin:10px 0;"
+ @change="handleCheckedCitiesChange2"
+ ><!--clickMe -->
+ <el-checkbox
+ :indeterminate="isIndeterminate2"
+ v-model="checkAll2"
+ @change="handleCheckAllChange2"
+ >鍏ㄩ��</el-checkbox
+ >
+ <el-checkbox
+ v-for="dict in list"
+ :key="dict.code"
+ :label="dict.code"
+ >{{ dict.name }}</el-checkbox
+ >
</el-checkbox-group>
- <!-- <el-checkbox-group v-model="checkList2" style="padding: 10px;border: 1px solid #ddd;margin:10px 0;" @change="clickMe(2)">
+ <!-- <el-checkbox-group v-model="checkList2" style="padding: 10px;border: 1px solid #ddd;margin:10px 0;" @change="clickMe(2)">
<el-checkbox v-for="dict in list" :key="dict.code" :label="dict.code">{{dict.name}}</el-checkbox>
</el-checkbox-group>-->
- <BarCharts ref="BarCharts" :chart-data="lineChartData3"/>
+ <BarCharts ref="BarCharts" :chart-data="lineChartData3" />
</div>
</el-col>
</el-row>
@@ -71,257 +141,204 @@
</template>
<script>
- import BarChart from './BarChart'
- import BarCharts from './BarCharts'
- import PieChart from './PieChart'
- import pieChartCost from './pieChartCost'
- import {getEnergyConstitute,getEnergyConsumption,getSettingIndex} from "@/api/energyStatistics/statistics";
- export default {
- name: 'consumption',
- name: 'Index',
- components: {BarChart,BarCharts,PieChart,pieChartCost},
- props: ["modelCode"],
- data() {
- return {
- // 閬僵灞�
- loading: true,
- total: 0,
- dateTypeOptions:[],
- checkList1:[],
- checkList2:[],
- // 鏌ヨ鍙傛暟
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- beginTime: undefined,
- endTime: undefined,
- dataTime: undefined,
- timeType:'MONTH',
- indexId: undefined,
- procedure: undefined,
- indexCode: "",
- id: undefined,
- },
- list:[],
- arraylist1:[],
- arraylist2:[],
- arraylist3:[],
- arraylist4:[],
- arraylist5:[],
- xAxisListXFCB:[],
- xAxisListZBL:[],
- lineChartData:{
- newVisitis:null,
- },
- lineChartData1:{
- newVisitis:null,
- },
- lineChartData2:{
- newVisitis:null,
- },
- lineChartData3:{
- newVisitis:null,
- },
- lineChartData4:{
- newVisitis:null,
- },
- //dateTypes: 'monthrange',//鏃堕棿鑼冨洿
- dateTypes: 'month',
- valueFormat:'yyyy-MM',
- title:"",
- titleName: "",
- checkAll1: false,
- checkAll2: false,
- isIndeterminate1: true,
- isIndeterminate2: true,
- }
- },
- watch: {
- modelCode: {
- deep: true,
- handler(val) {
- this.getList(val)
- }
+import BarChart from "./BarChart";
+import BarCharts from "./BarCharts";
+import PieChart from "./PieChart";
+import pieChartCost from "./pieChartCost";
+import {
+ getEnergyConstitute,
+ getEnergyConsumption,
+ getSettingIndex
+} from "@/api/energyStatistics/statistics";
+export default {
+ name: "consumption",
+ name: "Index",
+ components: { BarChart, BarCharts, PieChart, pieChartCost },
+ props: ["modelCode"],
+ data() {
+ return {
+ // 閬僵灞�
+ loading: true,
+ total: 0,
+ dateTypeOptions: [],
+ checkList1: [],
+ checkList2: [],
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ beginTime: undefined,
+ endTime: undefined,
+ dataTime: undefined,
+ timeType: "MONTH",
+ indexId: undefined,
+ procedure: undefined,
+ indexCode: "",
+ id: undefined
},
- },
- created() {
- //this.getList();
- this.getDicts("timeType").then(response => {
- this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
- });
- this.getConfigKey("energyStatistics.energyStatisticConsum").then(response => {
- this.skinName=response.msg;
- });
- let endTtime=(new Date().getFullYear()) +'-' +((new Date().getMonth() + 1)>9?(new Date().getMonth() + 1):"0"+(new Date().getMonth() + 1));
- let starTtime= (new Date().getFullYear()-1)+'-' +((new Date().getMonth() + 1)>9?(new Date().getMonth() + 1):"0"+(new Date().getMonth() + 1));
- this.queryParams.beginTime=starTtime;
- this.queryParams.endTime=endTtime;
- },
- methods: {
- modelNodeChange(modelNode) {
- let legendTitle=[];
- this.queryParams.id=modelNode.id;
- this.titleName=modelNode.label;
- this.queryParams.indexCode=modelNode.id;
- getEnergyConstitute(this.queryParams).then(response => {
- this.arraylist1=response.data.listXFL;//娑堣垂閲�
- this.arraylist2=response.data.listZBL;//鎶樻爣閲�
- this.arraylist4=response.data.listXFCB;//娑堣垂鎴愭湰
+ list: [],
+ arraylist1: [],
+ arraylist2: [],
+ arraylist3: [],
+ arraylist4: [],
+ arraylist5: [],
+ xAxisListXFCB: [],
+ xAxisListZBL: [],
+ lineChartData: {
+ newVisitis: null
+ },
+ lineChartData1: {
+ newVisitis: null
+ },
+ lineChartData2: {
+ newVisitis: null
+ },
+ lineChartData3: {
+ newVisitis: null
+ },
+ lineChartData4: {
+ newVisitis: null
+ },
+ //dateTypes: 'monthrange',//鏃堕棿鑼冨洿
+ dateTypes: "month",
+ valueFormat: "yyyy-MM",
+ title: "",
+ titleName: "",
+ checkAll1: false,
+ checkAll2: false,
+ isIndeterminate1: true,
+ isIndeterminate2: true
+ };
+ },
+ watch: {
+ modelCode: {
+ deep: true,
+ handler(val) {
+ this.getList(val);
+ }
+ }
+ },
+ created() {
+ //this.getList();
+ this.getDicts("timeType").then(response => {
+ this.dateTypeOptions = response.data;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
+ });
+ this.getConfigKey("energyStatistics.energyStatisticConsum").then(
+ response => {
+ this.skinName = response.msg;
+ }
+ );
+ let endTtime =
+ new Date().getFullYear() +
+ "-" +
+ (new Date().getMonth() + 1 > 9
+ ? new Date().getMonth() + 1
+ : "0" + (new Date().getMonth() + 1));
+ let starTtime =
+ new Date().getFullYear() -
+ 1 +
+ "-" +
+ (new Date().getMonth() + 1 > 9
+ ? new Date().getMonth() + 1
+ : "0" + (new Date().getMonth() + 1));
+ this.queryParams.beginTime = starTtime;
+ this.queryParams.endTime = endTtime;
+ },
+ methods: {
+ modelNodeChange(modelNode) {
+ let legendTitle = [];
+ this.queryParams.id = modelNode.id;
+ this.titleName = modelNode.label;
+ this.queryParams.indexCode = modelNode.id;
+ getEnergyConstitute(this.queryParams).then(response => {
+ this.arraylist1 = response.data.listXFL; //娑堣垂閲�
+ this.arraylist2 = response.data.listZBL; //鎶樻爣閲�
+ this.arraylist4 = response.data.listXFCB; //娑堣垂鎴愭湰
//鑳借�楁秷璐圭粨鏋� 娑堣垂閲�
- let unitId=[];
- let source=[];
- let title=[];
- for (let i=0; i<this.arraylist1.length;i++){
+ let unitId = [];
+ let source = [];
+ let title = [];
+ for (let i = 0; i < this.arraylist1.length; i++) {
title.push(this.arraylist1[i].indexName);
- unitId.push({"name":this.arraylist1[i].indexName,"value":this.numFilter(this.arraylist1[i].value),"unitId":this.arraylist1[i].unitId});
- };
- for (let i=0; i<this.arraylist2.length;i++){
- source.push({"name":this.arraylist2[i].indexName,"value":this.numFilter(this.arraylist2[i].value)});
+ unitId.push({
+ name: this.arraylist1[i].indexName,
+ value: this.numFilter(this.arraylist1[i].value),
+ unitId: this.arraylist1[i].unitId
+ });
}
- this.lineChartData.datas=unitId;
- this.lineChartData.title=title;
- this.lineChartData.newVisitis=source;
+ for (let i = 0; i < this.arraylist2.length; i++) {
+ source.push({
+ name: this.arraylist2[i].indexName,
+ value: this.numFilter(this.arraylist2[i].value)
+ });
+ }
+ this.lineChartData.datas = unitId;
+ this.lineChartData.title = title;
+ this.lineChartData.newVisitis = source;
this.$refs.PieChart.initChart(this.lineChartData);
//鑳借�楁秷璐规垚鏈�
- let unitIdXFCB=[];
- let sourceXFCB=[];
- let titleXFCB=[];
- for (let i=0; i<this.arraylist4.length;i++){
- sourceXFCB.push({"name":this.arraylist4[i].indexName,"value":this.numFilter(this.arraylist4[i].value)});
- unitIdXFCB.push({"name":this.arraylist4[i].indexName,"value":this.numFilter(this.arraylist4[i].value),"unitId":"涓囧厓"});
- titleXFCB +=this.numFilter(this.arraylist4[i].value);
+ let unitIdXFCB = [];
+ let sourceXFCB = [];
+ let titleXFCB = [];
+ for (let i = 0; i < this.arraylist4.length; i++) {
+ sourceXFCB.push({
+ name: this.arraylist4[i].indexName,
+ value: this.numFilter(this.arraylist4[i].value)
+ });
+ unitIdXFCB.push({
+ name: this.arraylist4[i].indexName,
+ value: this.numFilter(this.arraylist4[i].value),
+ unitId: "涓囧厓"
+ });
+ titleXFCB += this.numFilter(this.arraylist4[i].value);
}
- this.lineChartData1.title=titleXFCB;
- this.lineChartData1.newVisitis=sourceXFCB;
- this.lineChartData1.datas=unitIdXFCB;
+ this.lineChartData1.title = titleXFCB;
+ this.lineChartData1.newVisitis = sourceXFCB;
+ this.lineChartData1.datas = unitIdXFCB;
this.$refs.pieChartCost.initChart(this.lineChartData1);
});
//鑾峰彇妯″瀷鑾峰彇鎸囨爣
- getSettingIndex(this.queryParams.id).then(response => {
- this.list=response.data;
- this.queryParams.indexName="";
- this.list.forEach(item => {
- this.queryParams.indexName+=item.code+",";
- });
- getEnergyConsumption(this.queryParams).then(response => {
- this.arraylist3=response.data.resultListZBL;//鎶樻爣閲�
- this.arraylist5=response.data.resultListXFCB;//鎶樻爣閲�
- //this.arraylist5=response.data.tabledataMap;
- //鑳借�楁秷璐圭粨鏋� 瀵规瘮
- let resultZBL =[];
- let currentValue=[];
- let lastYearValue=[];
- let xAxis=[];
- for(let i=0; i<this.arraylist3.length; i++){
- currentValue.push(this.numFilter(this.arraylist3[i].currentValue));
- lastYearValue.push(this.numFilter(this.arraylist3[i].lastYearValue));
- }
- resultZBL.push(currentValue);
- resultZBL.push(lastYearValue);
- this.xAxisListZBL=response.data.resultZBL;
- for (let i=0;i<this.xAxisListZBL.length;i++){
- xAxis.push(this.xAxisListZBL[i].indexName);
- }
- this.lineChartData2.xAxis=xAxis;
- this.lineChartData2.newVisitis=resultZBL;
- this.lineChartData2.actualData=['鏈湡','鍚屾湡'];
- this.$refs.BarChart.initChart(this.lineChartData2);
- //鑳借�楁秷璐规垚鏈� 瀵规瘮
- let resultXFCB=[];
- let currentValueXFCB=[];
- let lastYearValueXFCB=[];
- let minValue=[];
- let xAxisXFCB=[];
- for(let i=0; i<this.arraylist5.length; i++){
- currentValueXFCB.push(this.arraylist5[i].currentValue);
- lastYearValueXFCB.push(this.arraylist5[i].lastYearValue);
- minValue.push(this.numFilter(this.arraylist5[i].minValue));
- }
- resultXFCB.push(currentValueXFCB);
- resultXFCB.push(lastYearValueXFCB);
- //source.push(minValue);
- //x杞村潗鏍囧悕绉�
- this.xAxisListXFCB=response.data.resultXFCB;
- for (let i=0;i<this.xAxisListXFCB.length;i++){
- xAxisXFCB.push(this.xAxisListXFCB[i].indexName);
- }
- this.lineChartData3.xAxis=xAxisXFCB;
- this.lineChartData3.newVisitis=resultXFCB;
- this.lineChartData3.actualData=['鏈湡','鍚屾湡','棰勭畻'];
- this.$refs.BarCharts.initChart(this.lineChartData3);
- })
- });
- },
-
- handleCheckAllChange1(val) {
- let checke=[];
+ getSettingIndex(this.queryParams.id).then(response => {
+ this.list = response.data;
+ this.queryParams.indexName = "";
this.list.forEach(item => {
- checke.push(item.code);
+ this.queryParams.indexName += item.code + ",";
});
- this.checkList1 =val ? checke : [];
- this.isIndeterminate1 = false;
- this.resultListZBL(checke);
- },
- handleCheckedCitiesChange1(value) {
- let checkedCount = value.length;
- this.checkAll1 = checkedCount === this.list.length;
- this.isIndeterminate1 = checkedCount > 0 && checkedCount < this.list.length;
- this.resultListZBL(value);
- },
- handleCheckAllChange2(val) {
- let checke=[];
- this.list.forEach(item => {
- checke.push(item.code);
- });
- this.checkList2 =val ? checke : [];
- this.isIndeterminate2 = false;
- this.resultListXFCB(checke);
- },
- handleCheckedCitiesChange2(value) {
- this.resultListXFCB(value);
- let checkedCount = value.length;
- this.checkAll2 = checkedCount === this.list.length;
- this.isIndeterminate2 = checkedCount > 0 && checkedCount < this.list.length;
- },
- resultListZBL(value){
- this.queryParams.indexName=value.join(',');
getEnergyConsumption(this.queryParams).then(response => {
- this.arraylist3=response.data.resultListZBL;//鎶樻爣閲�
+ this.arraylist3 = response.data.resultListZBL; //鎶樻爣閲�
+ this.arraylist5 = response.data.resultListXFCB; //鎶樻爣閲�
+ //this.arraylist5=response.data.tabledataMap;
//鑳借�楁秷璐圭粨鏋� 瀵规瘮
- let resultZBL =[];
- let currentValue=[];
- let lastYearValue=[];
- let xAxis=[];
- for(let i=0; i<this.arraylist3.length; i++){
+ let resultZBL = [];
+ let currentValue = [];
+ let lastYearValue = [];
+ let xAxis = [];
+ for (let i = 0; i < this.arraylist3.length; i++) {
currentValue.push(this.numFilter(this.arraylist3[i].currentValue));
- lastYearValue.push(this.numFilter(this.arraylist3[i].lastYearValue));
+ lastYearValue.push(
+ this.numFilter(this.arraylist3[i].lastYearValue)
+ );
}
resultZBL.push(currentValue);
resultZBL.push(lastYearValue);
- let xAxisListZBL=[];
- xAxisListZBL=response.data.resultZBL;
- for (let i=0;i<xAxisListZBL.length;i++){
- xAxis.push(xAxisListZBL[i].indexName);
+ this.xAxisListZBL = response.data.resultZBL;
+ for (let i = 0; i < this.xAxisListZBL.length; i++) {
+ xAxis.push(this.xAxisListZBL[i].indexName);
}
- this.lineChartData2.xAxis=xAxis;
- this.lineChartData2.newVisitis=resultZBL;
- this.lineChartData2.actualData=['鏈湡','鍚屾湡'];
+ this.lineChartData2.xAxis = xAxis;
+ this.lineChartData2.newVisitis = resultZBL;
+ this.lineChartData2.actualData = ["鏈湡", "鍚屾湡"];
this.$refs.BarChart.initChart(this.lineChartData2);
- });
- },
- resultListXFCB(value){
- this.queryParams.indexName=value.join(',');
- //鑳芥簮娑堣垂鎴愭湰鎯呭喌
- getEnergyConsumption(this.queryParams).then(response => {
- this.arraylist5=response.data.resultListXFCB;//鎶樻爣閲�
//鑳借�楁秷璐规垚鏈� 瀵规瘮
- let resultXFCB=[];
- let currentValueXFCB=[];
- let lastYearValueXFCB=[];
- let minValue=[];
- let xAxisXFCB=[];
- for(let i=0; i<this.arraylist5.length; i++){
+ let resultXFCB = [];
+ let currentValueXFCB = [];
+ let lastYearValueXFCB = [];
+ let minValue = [];
+ let xAxisXFCB = [];
+ for (let i = 0; i < this.arraylist5.length; i++) {
currentValueXFCB.push(this.arraylist5[i].currentValue);
lastYearValueXFCB.push(this.arraylist5[i].lastYearValue);
minValue.push(this.numFilter(this.arraylist5[i].minValue));
@@ -330,90 +347,181 @@
resultXFCB.push(lastYearValueXFCB);
//source.push(minValue);
//x杞村潗鏍囧悕绉�
- this.xAxisListXFCB=response.data.resultXFCB;
- for (let i=0;i<this.xAxisListXFCB.length;i++){
+ this.xAxisListXFCB = response.data.resultXFCB;
+ for (let i = 0; i < this.xAxisListXFCB.length; i++) {
xAxisXFCB.push(this.xAxisListXFCB[i].indexName);
}
- this.lineChartData3.xAxis=xAxisXFCB;
- this.lineChartData3.newVisitis=resultXFCB;
- this.lineChartData3.actualData=['鏈湡','鍚屾湡','棰勭畻'];
+ this.lineChartData3.xAxis = xAxisXFCB;
+ this.lineChartData3.newVisitis = resultXFCB;
+ this.lineChartData3.actualData = ["鏈湡", "鍚屾湡", "棰勭畻"];
this.$refs.BarCharts.initChart(this.lineChartData3);
});
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.modelNodeChange(this.queryParams);
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
- handleTime(data){
- let nowDate = new Date();
- let date = {
- year: nowDate.getFullYear(),
- month: nowDate.getMonth() + 1,
- frontMonth: nowDate.getMonth(),
+ });
+ },
+
+ handleCheckAllChange1(val) {
+ let checke = [];
+ this.list.forEach(item => {
+ checke.push(item.code);
+ });
+ this.checkList1 = val ? checke : [];
+ this.isIndeterminate1 = false;
+ this.resultListZBL(checke);
+ },
+ handleCheckedCitiesChange1(value) {
+ let checkedCount = value.length;
+ this.checkAll1 = checkedCount === this.list.length;
+ this.isIndeterminate1 =
+ checkedCount > 0 && checkedCount < this.list.length;
+ this.resultListZBL(value);
+ },
+ handleCheckAllChange2(val) {
+ let checke = [];
+ this.list.forEach(item => {
+ checke.push(item.code);
+ });
+ this.checkList2 = val ? checke : [];
+ this.isIndeterminate2 = false;
+ this.resultListXFCB(checke);
+ },
+ handleCheckedCitiesChange2(value) {
+ this.resultListXFCB(value);
+ let checkedCount = value.length;
+ this.checkAll2 = checkedCount === this.list.length;
+ this.isIndeterminate2 =
+ checkedCount > 0 && checkedCount < this.list.length;
+ },
+ resultListZBL(value) {
+ this.queryParams.indexName = value.join(",");
+ getEnergyConsumption(this.queryParams).then(response => {
+ this.arraylist3 = response.data.resultListZBL; //鎶樻爣閲�
+ //鑳借�楁秷璐圭粨鏋� 瀵规瘮
+ let resultZBL = [];
+ let currentValue = [];
+ let lastYearValue = [];
+ let xAxis = [];
+ for (let i = 0; i < this.arraylist3.length; i++) {
+ currentValue.push(this.numFilter(this.arraylist3[i].currentValue));
+ lastYearValue.push(this.numFilter(this.arraylist3[i].lastYearValue));
}
- if(data=='YEAR'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(data=='MONTH'){
- //this.dateTypes='monthrange'
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
+ resultZBL.push(currentValue);
+ resultZBL.push(lastYearValue);
+ let xAxisListZBL = [];
+ xAxisListZBL = response.data.resultZBL;
+ for (let i = 0; i < xAxisListZBL.length; i++) {
+ xAxis.push(xAxisListZBL[i].indexName);
}
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夎兘鑰楁寚鏍囪秼鍔垮垎鏋愭暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
+ this.lineChartData2.xAxis = xAxis;
+ this.lineChartData2.newVisitis = resultZBL;
+ this.lineChartData2.actualData = ["鏈湡", "鍚屾湡"];
+ this.$refs.BarChart.initChart(this.lineChartData2);
+ });
+ },
+ resultListXFCB(value) {
+ this.queryParams.indexName = value.join(",");
+ //鑳芥簮娑堣垂鎴愭湰鎯呭喌
+ getEnergyConsumption(this.queryParams).then(response => {
+ this.arraylist5 = response.data.resultListXFCB; //鎶樻爣閲�
+ //鑳借�楁秷璐规垚鏈� 瀵规瘮
+ let resultXFCB = [];
+ let currentValueXFCB = [];
+ let lastYearValueXFCB = [];
+ let minValue = [];
+ let xAxisXFCB = [];
+ for (let i = 0; i < this.arraylist5.length; i++) {
+ currentValueXFCB.push(this.arraylist5[i].currentValue);
+ lastYearValueXFCB.push(this.arraylist5[i].lastYearValue);
+ minValue.push(this.numFilter(this.arraylist5[i].minValue));
+ }
+ resultXFCB.push(currentValueXFCB);
+ resultXFCB.push(lastYearValueXFCB);
+ //source.push(minValue);
+ //x杞村潗鏍囧悕绉�
+ this.xAxisListXFCB = response.data.resultXFCB;
+ for (let i = 0; i < this.xAxisListXFCB.length; i++) {
+ xAxisXFCB.push(this.xAxisListXFCB[i].indexName);
+ }
+ this.lineChartData3.xAxis = xAxisXFCB;
+ this.lineChartData3.newVisitis = resultXFCB;
+ this.lineChartData3.actualData = ["鏈湡", "鍚屾湡", "棰勭畻"];
+ this.$refs.BarCharts.initChart(this.lineChartData3);
+ });
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.modelNodeChange(this.queryParams);
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ },
+ handleTime(data) {
+ let nowDate = new Date();
+ let date = {
+ year: nowDate.getFullYear(),
+ month: nowDate.getMonth() + 1,
+ frontMonth: nowDate.getMonth()
+ };
+ if (data == "YEAR") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (data == "MONTH") {
+ //this.dateTypes='monthrange'
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ }
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夎兘鑰楁寚鏍囪秼鍔垮垎鏋愭暟鎹」?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
//return exportEnergyindex(queryParams);
- }).then(response => {
+ })
+ .then(response => {
this.download(response.msg);
- }).catch(function () {
- });
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '') {
- realVal = parseFloat(value).toFixed(this.skinName)
- } else {
- realVal = '--'
- }
- return realVal
- },
+ })
+ .catch(function() {});
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "") {
+ realVal = parseFloat(value).toFixed(this.skinName);
+ } else {
+ realVal = "--";
+ }
+ return realVal;
}
}
+};
</script>
<style lang="scss" scoped>
- .dashboard-editor-container {
- padding: 32px;
- background-color: rgb(240, 242, 245);
- position: relative;
- .chart-wrapper {
- background: #fff;
- padding: 16px 16px 0;
- margin-bottom: 32px;
- }
+.dashboard-editor-container {
+ padding: 32px;
+ // background-color: rgb(240, 242, 245);
+ position: relative;
+ .chart-wrapper {
+ // background: #fff;
+ padding: 16px 16px 0;
+ margin-bottom: 32px;
}
- .chart-title{
- display: block;
- background: #f2f6fc;
- height: 30px;
- line-height: 30px;
- padding: 0 10px;
+}
+.chart-title {
+ display: block;
+ background: #f2f6fc;
+ height: 30px;
+ line-height: 30px;
+ padding: 0 10px;
+}
+@media (max-width: 1024px) {
+ .chart-wrapper {
+ padding: 8px;
}
- @media (max-width:1024px) {
- .chart-wrapper {
- padding: 8px;
- }
- }
+}
</style>
--
Gitblit v1.9.3