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/benchmarking/realTimeBenchmarking/realTimeBenchmarking.vue | 87
energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/LineChart.vue | 7
energy_management_ui/src/views/dashboard/PanelGroup.vue | 45
energy_management_ui/src/views/electricityPrice/electricity/index.vue | 707
energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/BarChart.vue | 191
energy_management_ui/src/components/shrink/index.vue | 17
energy_management_ui/src/views/energyStatistics/energyStructure/index.vue | 114
energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/BarChart.vue | 191
energy_management_ui/src/views/energyExamine/assessmentResults/index.vue | 122
energy_management_ui/src/views/reportForm/monthlyReport/index.vue | 367
energy_management_ui/src/views/basicsetting/limitType/index.vue | 272
energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/BarChart.vue | 191
energy_management_ui/src/views/power-statistics-analyse/per-passu/index.vue | 6
energy_management_ui/src/assets/image/index3.png | 0
energy_management_ui/src/views/index.vue | 774 -
energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/LineChart.vue | 102
energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/index.vue | 6
energy_management_ui/src/views/energyPrice/index.vue | 3
energy_management_ui/src/views/keyEquipment/yearkeyEquipment/BarChart.vue | 191
energy_management_ui/public/logo.png | 0
energy_management_ui/src/views/energyStatistics/energyConsumption/consumption.vue | 758 +
energy_management_ui/src/views/energyPlan/energyForecast/energyForecast.vue | 305
energy_management_ui/src/views/stage/alarm/alarmIndex.vue | 1089 +-
energy_management_ui/src/layout/components/Sidebar/index.vue | 8
energy_management_ui/src/views/energyBalance/energyBalance/LineChart.vue | 201
energy_management_ui/src/views/equipmentMonitor/keyEquipment/LineChart.vue | 88
energy_management_ui/src/views/energyBalance/energyBalance/index.vue | 118
energy_management_ui/src/views/energyStatistics/energyStructure/EnergyIndex.vue | 4
energy_management_ui/src/views/dataMonitoring/energyPercent/waterPercent.vue | 16
energy_management_ui/src/views/dataMonitoring/realTimeTrend/index.vue | 4
energy_management_ui/src/views/stage/alarm/LinChart.vue | 84
energy_management_ui/src/views/meter/implementCount/importIndexTable.vue | 135
energy_management_ui/src/views/keyEquipment/yearkeyEquipment/LineChart.vue | 82
energy_management_ui/src/views/energyPlan/energyMonitoring/energyMonitoring.vue | 166
energy_management_ui/src/layout/components/AppMain.vue | 21
energy_management_ui/src/assets/image/index4.jpeg | 0
energy_management_ui/src/views/basicSetup/equipmentfile/trendLineChart.vue | 371
energy_management_ui/src/assets/styles/variables.scss | 42
energy_management_ui/src/views/electricityPrice/statistics/index.vue | 120
energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/BarChart.vue | 191
energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/index.vue | 113
energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/LineChart.vue | 87
energy_management_ui/src/views/energyPlan/energyForecast/LineChart.vue | 280
energy_management_ui/src/views/energyExamine/assessmentIndex/addIndexTable.vue | 67
energy_management_ui/src/views/dataMonitoring/energyPercent/energyPercent.vue | 2
energy_management_ui/src/views/energyBalance/energyLoss/PieChart.vue | 161
energy_management_ui/src/views/login.vue | 37
energy_management_ui/src/views/power-statistics-analyse/pari-passu/BarChart.vue | 10
energy_management_ui/src/views/energyStatistics/energyConsumption/BarCharts.vue | 133
energy_management_ui/src/views/dashboard/PieChart.vue | 8
energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/index.vue | 11
energy_management_ui/src/views/energyStatistics/energyConsumption/BarChart.vue | 131
energy_management_ui/src/layout/components/Navbar.vue | 3
energy_management_ui/src/views/basicsetting/energyIndex/index.vue | 71
energy_management_ui/src/views/energyExamine/assessmentIndex/index.vue | 129
energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/LineChart.vue | 87
energy_management_ui/src/views/energyBalance/energyPic/energyPic.vue | 361
energy_management_ui/src/views/history/query/historyIndex.vue | 524
energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/LineChart.vue | 82
energy_management_ui/src/views/energyPlan/actualOutput/index.vue | 117
energy_management_ui/src/assets/styles/sidebar.scss | 44
energy_management_ui/src/views/energyStatistics/energyStructure/lineChart.vue | 246
energy_management_ui/src/views/equipmentMonitor/keyEquipment/pieChart.vue | 153
energy_management_ui/src/views/energyStatistics/energyConsumption/pieChartCost.vue | 129
energy_management_ui/src/views/equipmentMonitor/realTimeMonitoring/parametersTable.vue | 251
energy_management_ui/src/components/Pagination/index.vue | 39
energy_management_ui/src/views/benchmarking/phaseBenchmarking/phaseBenchmarking.vue | 171
energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/BarChart.vue | 206
energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/lineChart.vue | 246
energy_management_ui/src/views/benchmarking/realTimeBenchmarking/LineChart.vue | 224
energy_management_ui/src/assets/styles/element-ui.scss | 98
energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/index.vue | 290
energy_management_ui/src/api/electricityPrice/statistics.js | 26
energy_management_ui/src/views/benchmarking/phaseBenchmarking/LineChart.vue | 224
energy_management_ui/src/views/energyBalance/energyBalance/pie_chart.vue | 79
energy_management_ui/src/views/reportForm/statements/index.vue | 6
energy_management_ui/src/layout/components/Sidebar/Logo.vue | 50
energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/index.vue | 420
energy_management_ui/src/views/energyAlarm/historicalAlarm/realIndex.vue | 279
energy_management_ui/src/views/energyPlan/energyForecast/index.vue | 122
energy_management_ui/src/views/equipmentMonitor/energyConsumption/lineChart.vue | 220
energy_management_ui/src/views/basicsetting/device/index.vue | 87
energy_management_ui/src/views/keyEquipment/dailykeyEquipment/LineChart.vue | 82
energy_management_ui/src/settings.js | 8
energy_management_ui/src/views/energyStatistics/energyConsumption/PieChart.vue | 113
energy_management_ui/src/components/common/basic-container.vue | 17
energy_management_ui/src/views/dashboard/BarChart.vue | 12
energy_management_ui/src/views/energyBalance/energyPic/index.vue | 129
energy_management_ui/src/views/energyPlan/energyEstablishment/index.vue | 121
energy_management_ui/src/views/energyStatistics/energyConsumption/index.vue | 114
energy_management_ui/src/views/system/menu/index.vue | 310
energy_management_ui/src/assets/image/index2.png | 0
energy_management_ui/src/assets/logo/logo.png | 0
energy_management_ui/src/utils/index.js | 235
energy_management_ui/src/views/energyExamine/assessmentResults/assessmentResults.vue | 246
energy_management_ui/src/views/energyPlan/energyMonitoring/LineChart.vue | 211
energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/BarChart.vue | 2
energy_management_ui/src/views/reportForm/dailyReport/index.vue | 395
energy_management_ui/src/views/meter/implement/index.vue | 597
energy_management_ui/src/views/dataMonitoring/realTimeTrend/LineChart.vue | 5
energy_management_ui/src/App.vue | 6
energy_management_ui/src/views/power-statistics-analyse/pari-passu/index.vue | 6
energy_management_ui/src/router/index.js | 227
energy_management_ui/src/views/energyAlarm/realTimeAlarm/LineChart.vue | 126
energy_management_ui/src/views/dashboard/RaddarChart.vue | 126
energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/LineChart.vue | 87
energy_management_ui/src/views/equipmentMonitor/parameters/modelMonitorSetting.vue | 295
energy_management_ui/src/views/basicsetting/energyIndex/energyIndex.vue | 440
energy_management_ui/src/views/basicsetting/modelNode/modelNode.vue | 10
energy_management_ui/src/views/energyBalance/energyLoss/energyLoss.vue | 300
energy_management_ui/src/views/energyBalance/energyBalance/energyBalance.vue | 290
energy_management_ui/src/views/meter/implement/importIndexTable.vue | 144
energy_management_ui/src/views/energyBalance/energyLoss/index.vue | 116
energy_management_ui/src/views/energyAlarm/realTimeAlarm/modelRealTimeAlarmSetting.vue | 272
energy_management_ui/src/views/energyAlarm/historicalAlarm/LChart.vue | 174
energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/comprehensive.vue | 481
energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/index.vue | 3
energy_management_ui/src/assets/image/image.png | 0
energy_management_ui/src/views/energyPlan/energyMonitoring/index.vue | 120
energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue | 563
energy_management_ui/src/views/dataMonitoring/historyDataTrend/index.vue | 4
energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/EnergyIndex.vue | 517
energy_management_ui/src/views/energyPlan/plannedOutput/index.vue | 116
energy_management_ui/src/views/energyConsumptionAlarm/monitorAlarm/index.vue | 65
energy_management_ui/src/views/reportForm/statements/BarChart.vue | 6
energy_management_ui/src/views/workingProcedure/dailyWorkingProcedure/LineChart.vue | 87
energy_management_ui/src/components/IconSelect/index.vue | 81
energy_management_ui/src/assets/styles/index.scss | 67
energy_management_ui/src/views/index_bak.vue | 841 +
energy_management_ui/src/views/basicsetting/modelNode/index.vue | 105
energy_management_ui/src/views/energyAlarm/realTimeAlarm/index.vue | 63
energy_management_ui/src/views/alarm/collectionIndex.vue | 498
energy_management_ui/src/views/electricityPrice/statistics/pieChart.vue | 179
energy_management_ui/src/views/power-statistics-analyse/pari-passu/LineChart.vue | 5
energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/LineChart.vue | 87
/dev/null | 10
energy_management_ui/src/views/energyBalance/energyBalance/PieChart.vue | 139
energy_management_ui/src/views/energyMonitoring/e-gasMonitoring/index.vue | 338
energy_management_ui/src/views/keyEquipment/dailykeyEquipment/BarChart.vue | 191
energy_management_ui/src/views/dataMonitoring/historyDataTrend/historyMonitoringSetting.vue | 18
energy_management_ui/src/assets/styles/ruoyi.scss | 120
energy_management_ui/src/assets/image/index.png | 0
energy_management_ui/src/views/alarmItem/modelWarnSetting.vue | 34
energy_management_ui/src/views/keyEquipment/dailykeyEquipment/index.vue | 241
energy_management_ui/src/views/dashboard/LineChart.vue | 116
energy_management_ui/src/views/reportForm/annualReport/index.vue | 331
146 files changed, 13,420 insertions(+), 10,442 deletions(-)
diff --git a/energy_management_ui/public/logo.png b/energy_management_ui/public/logo.png
new file mode 100644
index 0000000..0f0d73a
--- /dev/null
+++ b/energy_management_ui/public/logo.png
Binary files differ
diff --git a/energy_management_ui/public/toray_group_icon.png b/energy_management_ui/public/toray_group_icon.png
deleted file mode 100644
index 6c56317..0000000
--- a/energy_management_ui/public/toray_group_icon.png
+++ /dev/null
Binary files differ
diff --git a/energy_management_ui/src/App.vue b/energy_management_ui/src/App.vue
index e448b11..ac6b216 100644
--- a/energy_management_ui/src/App.vue
+++ b/energy_management_ui/src/App.vue
@@ -5,7 +5,7 @@
</template>
<script>
-export default {
- name: 'App'
-}
+export default {
+ name: "App"
+};
</script>
diff --git a/energy_management_ui/src/api/electricityPrice/statistics.js b/energy_management_ui/src/api/electricityPrice/statistics.js
index 5457ad3..e865a43 100644
--- a/energy_management_ui/src/api/electricityPrice/statistics.js
+++ b/energy_management_ui/src/api/electricityPrice/statistics.js
@@ -1,4 +1,4 @@
-import request from '@/utils/request'
+import request from "@/utils/request";
// 鏌ヨelectricity鍒楄〃
export function getStatisticsList(query) {
@@ -8,18 +8,28 @@
if(query.timeType=='YEAR'){
query.timeType="MONTH"
}*/
- query.timeType="HOUR"
+ query.timeType = "HOUR";
return request({
- url: '/electricityPrice/statistics/getStatisticsList',
- method: 'get',
+ url: "/electricityPrice/statistics/getStatisticsList",
+ method: "get",
params: query
- })
+ });
}
// 鏌ヨelectricity鍒楄〃
export function getDataStatistics(query) {
return request({
- url: '/electricityPrice/statistics/getDataStatistics',
- method: 'get',
+ url: "/electricityPrice/statistics/getDataStatistics",
+ method: "get",
params: query
- })
+ });
+}
+
+// 灏栧嘲骞宠胺 缁熻 鏌ヨ
+// 鎺ュ彛 锛� electricityDataItem/getDataStatistics?modelCode=1&nodeId=1&timeType=DAY&queryTime=2024-08
+export function getElectricityDataItemStatistics(query) {
+ return request({
+ url: "/electricityDataItem/getDataStatistics",
+ method: "get",
+ params: query
+ });
}
diff --git a/energy_management_ui/src/assets/image/image.png b/energy_management_ui/src/assets/image/image.png
new file mode 100644
index 0000000..3a505a6
--- /dev/null
+++ b/energy_management_ui/src/assets/image/image.png
Binary files differ
diff --git a/energy_management_ui/src/assets/image/index.png b/energy_management_ui/src/assets/image/index.png
new file mode 100644
index 0000000..8bc563c
--- /dev/null
+++ b/energy_management_ui/src/assets/image/index.png
Binary files differ
diff --git a/energy_management_ui/src/assets/image/index2.png b/energy_management_ui/src/assets/image/index2.png
new file mode 100644
index 0000000..f07bafd
--- /dev/null
+++ b/energy_management_ui/src/assets/image/index2.png
Binary files differ
diff --git a/energy_management_ui/src/assets/image/index3.png b/energy_management_ui/src/assets/image/index3.png
new file mode 100644
index 0000000..13ee271
--- /dev/null
+++ b/energy_management_ui/src/assets/image/index3.png
Binary files differ
diff --git a/energy_management_ui/src/assets/image/index4.jpeg b/energy_management_ui/src/assets/image/index4.jpeg
new file mode 100644
index 0000000..7980be4
--- /dev/null
+++ b/energy_management_ui/src/assets/image/index4.jpeg
Binary files differ
diff --git a/energy_management_ui/src/assets/logo/logo.png b/energy_management_ui/src/assets/logo/logo.png
new file mode 100644
index 0000000..86f718f
--- /dev/null
+++ b/energy_management_ui/src/assets/logo/logo.png
Binary files differ
diff --git a/energy_management_ui/src/assets/logo/logo2.png b/energy_management_ui/src/assets/logo/logo2.png
deleted file mode 100644
index 380134d..0000000
--- a/energy_management_ui/src/assets/logo/logo2.png
+++ /dev/null
Binary files differ
diff --git a/energy_management_ui/src/assets/styles/element-ui.scss b/energy_management_ui/src/assets/styles/element-ui.scss
index 9581d56..dbd35f7 100644
--- a/energy_management_ui/src/assets/styles/element-ui.scss
+++ b/energy_management_ui/src/assets/styles/element-ui.scss
@@ -52,6 +52,10 @@
left: 0;
position: relative;
margin: 0 auto;
+ background: #001233;
+ .el-dialog__title{
+ color: #fff;
+ }
}
// refine element ui upload
@@ -77,3 +81,97 @@
.el-range-editor.el-input__inner {
display: inline-flex !important;
}
+
+.el-form-item__label {
+ color: #fff;
+}
+
+.el-table {
+ background: none
+}
+
+.el-table .el-table__header-wrapper th, .el-table th {
+ background-color: #054586 !important;
+ color: #fff !important;
+}
+
+.el-table tr {
+ color: #fff;
+ background-color: #021441;
+}
+
+.el-table th.is-leaf, .el-table td {
+ border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+}
+
+.el-table__footer-wrapper td {
+ border-top: 1px solid rgba(255, 255, 255, 0.15);
+
+}
+
+.el-table__header-wrapper tbody td, .el-table__footer-wrapper tbody td {
+ color: #fff;
+ background-color: #021441;
+}
+
+.el-table--group, .el-table--border {
+ border: 1px solid #366cb9;
+}
+
+.el-table--border th, .el-table--border td {
+ border-right: 1px solid #366cb9 !important;
+}
+
+.el-table--border th {
+ border-bottom: 1px solid #366cb9;
+}
+
+.el-table::before, .el-table--group::after, .el-table--border::after {
+ background-color: rgba(0, 0, 0, 0);
+}
+
+.el-table__empty-block {
+ color: #fff;
+ background-color: #021441;
+}
+
+.el-table tbody tr:hover > .is-center {
+ background-color: rgba(5, 64, 149, 0.5) !important;
+}
+
+.el-loading-mask {
+ background-color: rgba(5, 64, 149, 0.3)
+}
+
+.el-tabs--card > .el-tabs__header .el-tabs__nav {
+ border: 1px solid #366CB9;
+}
+
+.el-tabs--card > .el-tabs__header {
+ border-bottom: 1px solid #366CB9;
+}
+
+.el-table__fixed::before {
+ background-color: rgba(0, 0, 0, 0);
+}
+
+.el-card__body{
+ .el-tabs--card {
+ .el-tabs__header {
+ .el-tabs__item{
+ border-left:0;
+ color: #95c1fd;
+ }
+ .el-tabs__item.is-active {
+ color: #fff;
+ background: #24CAFF;
+ border-bottom: 0;
+ border-left: 0;
+ }
+ }
+ }
+}
+
+
+
+
diff --git a/energy_management_ui/src/assets/styles/index.scss b/energy_management_ui/src/assets/styles/index.scss
index 0f46af8..cf4c563 100644
--- a/energy_management_ui/src/assets/styles/index.scss
+++ b/energy_management_ui/src/assets/styles/index.scss
@@ -77,6 +77,10 @@
display: block;
}
+.flex{
+ display: flex;
+}
+
.pointer {
cursor: pointer;
}
@@ -127,10 +131,6 @@
.components-container {
margin: 30px 50px;
position: relative;
-}
-
-.pagination-container {
- margin-top: 30px;
}
.text-center {
@@ -189,3 +189,62 @@
.multiselect--active {
z-index: 1000 !important;
}
+
+.search-wrapper {
+ // padding-bottom: 12px;
+}
+
+.el-dialog__footer {
+ border-top: 1px solid #366cb9 ;
+}
+
+.el-dialog__header {
+ border-bottom: 1px solid #366cb9;
+}
+.el-drawer {
+ background: #061844;
+}
+.el-drawer__header {
+ color: #fff;
+}
+.el-input__inner, .el-textarea__inner, .vue-treeselect__control {
+ background: rgb(54, 108, 185, 0.2) !important;
+ background-color: rgb(54, 108, 185, 0.2) !important;
+ border: 1px solid #366cb9 !important;
+ color: #fff !important;
+}
+.vue-treeselect__input {
+ background-color: rgb(54, 108, 185, 0.2);
+ border: 1px solid #366cb9;
+ color: #fff;
+}
+.el-date-editor .el-range-input {
+ background-color: transparent;
+ color: #fff;
+}
+.el-date-editor .el-range-separator {
+ color: #fff;
+}
+.vue-treeselect__single-value {
+ color: #fff;
+}
+.el-pagination__total {
+ color: #fff;
+}
+.el-pagination__jump {
+ color: #fff;
+}
+
+aside {
+ background: transparent;
+}
+.el-tabs__item {
+ color: #fff;
+}
+.el-tabs__item.is-active {
+ color: $primary-color;
+}
+.el-collapse-item__header {
+ background-color: #061844;
+ color: #fff;
+}
\ No newline at end of file
diff --git a/energy_management_ui/src/assets/styles/ruoyi.scss b/energy_management_ui/src/assets/styles/ruoyi.scss
index 0ca1268..4eef1c6 100644
--- a/energy_management_ui/src/assets/styles/ruoyi.scss
+++ b/energy_management_ui/src/assets/styles/ruoyi.scss
@@ -3,7 +3,7 @@
* Copyright (c) 2019 ruoyi
*/
.el-table tbody tr:hover > td {
- background-color: #CFDCF5 !important
+ background-color: rgba(5,64,149,.5) !important;
}
.el-table .el-table__header-wrapper th {
@@ -22,10 +22,7 @@
}
-.el-table th {
- background: #D5D5D5;
- color: #515a6e;
-}
+
/** 鍩虹閫氱敤 **/
.pt5 {
@@ -106,14 +103,6 @@
padding-bottom: 5px
}
-/** 琛ㄦ牸甯冨眬 **/
-.pagination-container {
- position: relative;
- height: 25px;
- margin-bottom: 10px;
- margin-top: 15px;
- padding: 10px 20px !important;
-}
.pagination-container .el-pagination {
right: 0;
@@ -127,6 +116,42 @@
width: inherit;
}
+.el-button{
+ background: #0083CF;
+ border-radius: 6px 6px 6px 6px;
+ color: #FFFFFF;
+ border: none;
+}
+.el-button--text {
+ background: transparent !important;
+}
+.el-button--primary{
+ background: #24CAFF;
+}
+.el-button--primary:hover{
+ background: #24CAFF;
+}
+.treeBg{
+ background: url("../image/treeBg.png") no-repeat;
+ background-size: 100% 100%;
+}
+.el-tree{
+ background: rgba(0,0,0,0);
+ color: #A3CBFF;
+}
+.el-tree-node:focus>.el-tree-node__content{
+ background-color: rgba(5, 64, 149,0.3);
+}
+
+.el-tree-node__content:hover {
+ background-color: rgba(5, 64, 149,0.3);
+}
+
+.el-collapse-item__wrap{
+ background: #001233;
+ border-bottom: none;
+}
+.el-button,
.el-tree-node__content > .el-checkbox {
margin-right: 8px;
}
@@ -140,7 +165,7 @@
}
.list-group {
- padding-left: 0px;
+ padding-left: 0;
list-style: none;
}
@@ -148,7 +173,7 @@
border-bottom: 1px solid #e7eaec;
border-top: 1px solid #e7eaec;
margin-bottom: -1px;
- padding: 11px 0px;
+ padding: 11px 0;
font-size: 13px;
}
@@ -156,14 +181,16 @@
float: right !important;
}
-.el-card__header {
- padding: 14px 15px 7px;
- min-height: 40px;
+.el-card{
+ border: none;
+ background-color: #061844;
+ overflow: hidden;
+ color: #fff;
}
-.el-card__body {
- padding: 27px 20px;
-}
+// .el-card__body {
+// padding: 27px 20px;
+// }
.card-box {
padding-right: 15px;
@@ -242,14 +269,19 @@
overflow: auto;
}
}
+.el-card__header{
+ border-bottom: none;
+ background: #09256B;
+}
.modelnode-tree {
- margin-top: 8px;
+ // margin-top: 8px;
.custom-tree-node {
flex: 1;
padding-right: 8px;
// line-height: 26px;
+ font-size: 14px;
}
.node-opt {
@@ -266,7 +298,7 @@
.model-node-setting {
.el-card__body {
padding: 8px 10px 10px 10px;
- height: calc(100vh - 220px);
+ height: calc(100vh - 270px);
overflow: auto;
}
}
@@ -297,3 +329,45 @@
margin-top: calc(50vh - 180px);
}
}
+.shrink-col-block {
+ position: absolute;
+ top: 20px;
+ right: 16px;
+ cursor: pointer;
+}
+
+// 缇庡寲婊氬姩鏉�
+::-webkit-scrollbar {
+ width: 11px;
+ height: 10px;
+}
+
+::-webkit-scrollbar-track {
+ width: 6px;
+ background: rgba(#101F1C, 0.1) ;
+ -webkit-border-radius: 2em;
+ -moz-border-radius: 2em;
+ border-radius: 2em;
+}
+
+::-webkit-scrollbar-thumb {
+ background-color:#4E6BBA;
+ background-clip: padding-box;
+ min-height: 28px;
+ -webkit-border-radius: 2em;
+ -moz-border-radius: 2em;
+ border-radius: 2em;
+ transition: background-color .3s;
+ cursor: pointer;
+}
+
+::-webkit-scrollbar-thumb:hover {
+ background-color: rgba(144,147,153,.3);
+}
+::-webkit-scrollbar-track-piece {
+ background-color: #021441
+}
+::-webkit-scrollbar-corner {
+ background-color: #061844 ;
+}
+
diff --git a/energy_management_ui/src/assets/styles/sidebar.scss b/energy_management_ui/src/assets/styles/sidebar.scss
index 363446f..65ca224 100644
--- a/energy_management_ui/src/assets/styles/sidebar.scss
+++ b/energy_management_ui/src/assets/styles/sidebar.scss
@@ -1,12 +1,13 @@
#app {
.main-container {
- height: 100vh;
+ // height: 100vh; //鎵撳紑涓嶆樉绀烘粴鍔ㄦ潯
overflow: hidden;
transition: margin-left .28s;
margin-left: $sideBarWidth;
position: relative;
- background: rgba(235, 237, 240, 1);
+ // background: rgba(235, 237, 240, 1);
+ background: #001233;
}
.sidebar-container {
@@ -20,7 +21,13 @@
bottom: 0;
left: 0;
z-index: 1001;
- overflow: hidden;
+ // overflow: hidden;
+
+ // background: url("../image/navbar/Group.png") no-repeat;background-size: 100% 100%;
+ // padding-left: 13px;
+ // padding-right: 31px;
+ // padding-top: 27px;
+ // margin-top: 10px;
// reset element-ui css
.horizontal-collapse-transition {
@@ -28,15 +35,26 @@
}
.scrollbar-wrapper {
- overflow-x: hidden !important;
+ // overflow-x: hidden !important; 婊氬姩鏉�
+ // overflow: auto;
+ height: 100%;
}
+ ::-webkit-scrollbar {
+ width: 5px;
+ }
+
.el-scrollbar__bar.is-vertical {
right: 0px;
+ width: 0;
}
.el-scrollbar {
height: 100%;
+ background: url("../image/navbar/Group.png") no-repeat;background-size: 100% 100%;
+ padding-left: 3px;
+ padding-right: 24px;
+ padding-top: 13px;
}
&.has-logo {
@@ -56,33 +74,38 @@
}
.svg-icon {
- margin-right: 16px;
+ margin-right: 12px;
}
.el-menu {
border: none;
height: 100%;
width: 100% !important;
+ background-color: rgba(0, 0, 0, 0);
}
// menu hover
.submenu-title-noDropdown,
.el-submenu__title {
- font-size: 16px;
+ height: 44px;
+ line-height: 44px;
&:hover {
background-color: $menuHover !important;
}
}
.is-active>.el-submenu__title {
- font-size: 16px;
// color: rgba(11, 107, 241, 1) !important;
font-weight: 500;
}
& .nest-menu .el-submenu>.el-submenu__title,
& .el-submenu .el-menu-item {
+ height: 44px;
+ line-height: 44px;
min-width: $sideBarWidth !important;
+ margin-left: 8px;
+ padding-left: 32px !important;
&:hover {
background-color: $subMenuHover !important;
}
@@ -179,17 +202,22 @@
.el-menu--vertical {
&>.el-menu {
.svg-icon {
- margin-right: 16px;
+ margin-right: 12px;
}
}
.nest-menu .el-submenu>.el-submenu__title,
.el-menu-item {
+ height: 44px;
+ line-height: 44px;
&:hover {
// you can use $subMenuHover
background-color: $menuHover !important;
}
}
+ .is-active {
+ color: #38bcbf !important;
+ }
// the scroll bar appears when the subMenu is too long
>.el-menu--popup {
diff --git a/energy_management_ui/src/assets/styles/variables.scss b/energy_management_ui/src/assets/styles/variables.scss
index 9d2b5e0..c4eda7c 100644
--- a/energy_management_ui/src/assets/styles/variables.scss
+++ b/energy_management_ui/src/assets/styles/variables.scss
@@ -1,5 +1,28 @@
+// // base color
+// $primary-color: #38BCBF;
+// $blue:#324157;
+// $light-blue:#3A71A8;
+// $red:#C03639;
+// $pink: #E65D6E;
+// $green: #30B08F;
+// $tiffany: #4AB7BD;
+// $yellow:#FEC171;
+// $panGreen: #30B08F;
+
+// // sidebar
+// $menuText:#629FF2;
+// $menuActiveText: #fff;
+// $subMenuActiveText:#38BCBF; // https://github.com/ElemeFE/element/issues/12951
+
+// $menuBg:rgba(255, 255, 255, 1);
+// $menuHover:rgba(246, 250, 255, 1);
+
+// $subMenuBg:#38BCBF;
+// $subMenuHover:rgba(246, 250, 255, 1)s;
+// $tabBarHeight: 40px; //闈㈠寘灞戦珮搴�
+// $sideBarWidth: 220px;
// base color
-$primary-color: #38BCBF;
+$primary-color:#38BCBF;
$blue:#324157;
$light-blue:#3A71A8;
$red:#C03639;
@@ -8,19 +31,21 @@
$tiffany: #4AB7BD;
$yellow:#FEC171;
$panGreen: #30B08F;
+$Backgroundcolor: #001233;
// sidebar
-$menuText:#333;
+$subMenuActiveText:#14CC8F; // https://github.com/ElemeFE/element/issues/12951
+$menuText:#629FF2;
$menuActiveText: #fff;
-$subMenuActiveText:#38BCBF; // https://github.com/ElemeFE/element/issues/12951
-$menuBg:rgba(255, 255, 255, 1);
-$menuHover:rgba(246, 250, 255, 1);
+$menuBg:#001233;;
+$menuHover:rgba(0, 0, 0, 0); //鐖�
-$subMenuBg:#38BCBF;
-$subMenuHover:rgba(246, 250, 255, 1)s;
+$subMenuBg:#14CC8F;
+$subMenuHover:rgba(0, 0, 0, 0); //瀛�
-$sideBarWidth: 220px;
+$sideBarWidth: 230px;
+$tabBarHeight: 32px; //闈㈠寘灞戦珮搴�
// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
@@ -34,4 +59,5 @@
subMenuHover: $subMenuHover;
sideBarWidth: $sideBarWidth;
primary-color: $primary-color;
+ tabBarHeight: $tabBarHeight;
}
diff --git a/energy_management_ui/src/components/IconSelect/index.vue b/energy_management_ui/src/components/IconSelect/index.vue
index 0611dc5..53d93e6 100644
--- a/energy_management_ui/src/components/IconSelect/index.vue
+++ b/energy_management_ui/src/components/IconSelect/index.vue
@@ -1,11 +1,22 @@
<!-- @author zhengjie -->
<template>
<div class="icon-body">
- <el-input v-model="name" style="position: relative;" clearable placeholder="璇疯緭鍏ュ浘鏍囧悕绉�" @clear="filterIcons" @input.native="filterIcons">
+ <el-input
+ v-model="name"
+ style="position: relative;color: #333;"
+ clearable
+ placeholder="璇疯緭鍏ュ浘鏍囧悕绉�"
+ @clear="filterIcons"
+ @input.native="filterIcons"
+ >
<i slot="suffix" class="el-icon-search el-input__icon" />
</el-input>
<div class="icon-list">
- <div v-for="(item, index) in iconList" :key="index" @click="selectedIcon(item)">
+ <div
+ v-for="(item, index) in iconList"
+ :key="index"
+ @click="selectedIcon(item)"
+ >
<svg-icon :icon-class="item" style="height: 30px;width: 16px;" />
<span>{{ item }}</span>
</div>
@@ -14,56 +25,60 @@
</template>
<script>
-import icons from './requireIcons'
+import icons from "./requireIcons";
export default {
- name: 'IconSelect',
+ name: "IconSelect",
data() {
return {
- name: '',
+ name: "",
iconList: icons
- }
+ };
},
methods: {
filterIcons() {
if (this.name) {
- this.iconList = this.iconList.filter(item => item.includes(this.name))
+ this.iconList = this.iconList.filter(item => item.includes(this.name));
} else {
- this.iconList = icons
+ this.iconList = icons;
}
},
selectedIcon(name) {
- this.$emit('selected', name)
- document.body.click()
+ this.$emit("selected", name);
+ document.body.click();
},
reset() {
- this.name = ''
- this.iconList = icons
+ this.name = "";
+ this.iconList = icons;
}
}
-}
+};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
- .icon-body {
- width: 100%;
- padding: 10px;
- .icon-list {
- height: 200px;
- overflow-y: scroll;
- div {
- height: 30px;
- line-height: 30px;
- margin-bottom: -5px;
- cursor: pointer;
- width: 33%;
- float: left;
- }
- span {
- display: inline-block;
- vertical-align: -0.15em;
- fill: currentColor;
- overflow: hidden;
- }
+.icon-body {
+ width: 100%;
+ padding: 10px;
+ z-index: 999;
+ .icon-list {
+ height: 200px;
+ overflow-y: scroll;
+ div {
+ height: 30px;
+ line-height: 30px;
+ margin-bottom: -5px;
+ cursor: pointer;
+ width: 33%;
+ float: left;
+ }
+ span {
+ display: inline-block;
+ vertical-align: -0.15em;
+ fill: currentColor;
+ overflow: hidden;
}
}
+ .el-input__inner {
+ color: #333;
+ }
+}
</style>
diff --git a/energy_management_ui/src/components/Pagination/index.vue b/energy_management_ui/src/components/Pagination/index.vue
index c815e13..c332383 100644
--- a/energy_management_ui/src/components/Pagination/index.vue
+++ b/energy_management_ui/src/components/Pagination/index.vue
@@ -1,5 +1,5 @@
<template>
- <div :class="{'hidden':hidden}" class="pagination-container">
+ <div :class="{ hidden: hidden }" class="pagination-container">
<el-pagination
:background="background"
:current-page.sync="currentPage"
@@ -15,10 +15,10 @@
</template>
<script>
-import { scrollTo } from '@/utils/scroll-to'
+import { scrollTo } from "@/utils/scroll-to";
export default {
- name: 'Pagination',
+ name: "Pagination",
props: {
total: {
required: true,
@@ -35,12 +35,12 @@
pageSizes: {
type: Array,
default() {
- return [10, 20, 30, 50]
+ return [10, 20, 30, 50];
}
},
layout: {
type: String,
- default: 'total, sizes, prev, pager, next, jumper'
+ default: "total, sizes, prev, pager, next, jumper"
},
background: {
type: Boolean,
@@ -58,44 +58,51 @@
computed: {
currentPage: {
get() {
- return this.page
+ return this.page;
},
set(val) {
- this.$emit('update:page', val)
+ this.$emit("update:page", val);
}
},
pageSize: {
get() {
- return this.limit
+ return this.limit;
},
set(val) {
- this.$emit('update:limit', val)
+ this.$emit("update:limit", val);
}
}
},
methods: {
handleSizeChange(val) {
- this.$emit('pagination', { page: this.currentPage, limit: val })
+ this.$emit("pagination", { page: this.currentPage, limit: val });
if (this.autoScroll) {
- scrollTo(0, 800)
+ scrollTo(0, 800);
}
},
handleCurrentChange(val) {
- this.$emit('pagination', { page: val, limit: this.pageSize })
+ this.$emit("pagination", { page: val, limit: this.pageSize });
if (this.autoScroll) {
- scrollTo(0, 800)
+ scrollTo(0, 800);
}
}
}
-}
+};
</script>
<style scoped>
.pagination-container {
- background: #fff;
- padding: 32px 16px;
+ background: transparent;
+ padding: 12px 20px;
+ position: relative;
}
.pagination-container.hidden {
display: none;
}
+.el-pagination__total {
+ color: #fff !important;
+}
+.el-pagination__jump {
+ color: #fff;
+}
</style>
diff --git a/energy_management_ui/src/components/common/basic-container.vue b/energy_management_ui/src/components/common/basic-container.vue
index 2382728..7f009ef 100644
--- a/energy_management_ui/src/components/common/basic-container.vue
+++ b/energy_management_ui/src/components/common/basic-container.vue
@@ -49,16 +49,15 @@
</script>
<style lang="scss" scoped>
+@import "~@/assets/styles/variables.scss";
.basic-container {
height: 100%;
box-sizing: border-box;
- margin-bottom: 5px;
+ // margin-bottom: 5px;
.card-header {
- font-size: 18px;
font-weight: 500;
- height: 34px;
- color: #272727;
+ color: #a3cbff;
position: relative;
padding-left: 10px;
@@ -67,8 +66,8 @@
position: absolute;
display: block;
width: 4px;
- height: 17px;
- background-color: #38bcbf;
+ height: 16px;
+ background-color: $primary-color;
border-radius: 3px;
top: 2px;
left: 0;
@@ -92,7 +91,7 @@
}
}
-.basic-container:first-child {
- margin-top: 5px;
-}
+// .basic-container:first-child {
+// margin-top: 5px;
+// }
</style>
diff --git a/energy_management_ui/src/components/shrink/index.vue b/energy_management_ui/src/components/shrink/index.vue
index 5bec340..af6c557 100644
--- a/energy_management_ui/src/components/shrink/index.vue
+++ b/energy_management_ui/src/components/shrink/index.vue
@@ -1,9 +1,12 @@
<template>
<el-col class="shrink-col">
<div class="click-img">
- <img src="~@/assets/image/rectangle.png" alt=""
- style="transform:rotate(180deg)"
- @click="toggleCollapse">
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ style="transform:rotate(180deg)"
+ @click="toggleCollapse"
+ />
</div>
</el-col>
</template>
@@ -12,17 +15,17 @@
export default {
methods: {
toggleCollapse() {
- this.$emit('toggleCollapse')
+ this.$emit("toggleCollapse");
}
}
-}
+};
</script>
<style scoped lang="scss">
.shrink-col {
width: 48px;
- background: white;
- margin: 5px 20px 5px 0;
+ background: #09256b;
+ margin: 0 12px 0 0;
box-sizing: border-box;
box-shadow: 0 2px 12px 0 #0000001a;
padding-top: 22px;
diff --git a/energy_management_ui/src/layout/components/AppMain.vue b/energy_management_ui/src/layout/components/AppMain.vue
index 5762924..a4e7854 100644
--- a/energy_management_ui/src/layout/components/AppMain.vue
+++ b/energy_management_ui/src/layout/components/AppMain.vue
@@ -10,40 +10,41 @@
<script>
export default {
- name: 'AppMain',
+ name: "AppMain",
computed: {
cachedViews() {
- return this.$store.state.tagsView.cachedViews
+ return this.$store.state.tagsView.cachedViews;
},
key() {
- return this.$route.path
+ return this.$route.path;
}
}
-}
+};
</script>
<style lang="scss" scoped>
+@import "~@/assets/styles/variables.scss";
.app-main {
/* 50= navbar 50 */
- min-height: calc(100vh - 160px);
+ min-height: calc(100vh - 160px - #{$tabBarHeight});
width: 100%;
position: relative;
overflow: hidden;
- padding: 12px 20px;
+ padding: 12px;
}
-.fixed-header+.app-main {
+.fixed-header + .app-main {
padding-top: 50px;
}
.hasTagsView {
.app-main {
/* 84 = navbar + tags-view = 50 + 34 */
- min-height: calc(100vh - 84px);
+ min-height: calc(100vh - 84px - #{$tabBarHeight});
}
- .fixed-header+.app-main {
- padding-top: 84px;
+ .fixed-header + .app-main {
+ padding-top: 106px;
}
}
</style>
diff --git a/energy_management_ui/src/layout/components/Navbar.vue b/energy_management_ui/src/layout/components/Navbar.vue
index e46e783..9f5b030 100644
--- a/energy_management_ui/src/layout/components/Navbar.vue
+++ b/energy_management_ui/src/layout/components/Navbar.vue
@@ -95,8 +95,9 @@
height: 64px;
overflow: hidden;
position: relative;
- background: #16a5b6;
+ background: #001233;
box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+ border-bottom: 1px solid #061844;
.hamburger-container {
line-height: 64px;
diff --git a/energy_management_ui/src/layout/components/Sidebar/Logo.vue b/energy_management_ui/src/layout/components/Sidebar/Logo.vue
index 9950cd1..30ddeb0 100644
--- a/energy_management_ui/src/layout/components/Sidebar/Logo.vue
+++ b/energy_management_ui/src/layout/components/Sidebar/Logo.vue
@@ -4,22 +4,29 @@
<router-link
v-if="collapse"
key="expand"
- class="sidebar-logo-link"
+ class="sidebar-logo-link-collapse"
to="/"
>
<div class="collapse-logo">
- <img v-if="logoImg2" :src="logoImg2" style="width: 44px" />
+ <img
+ v-if="logoImg2"
+ :src="logoImg2"
+ style="width: 40px;height: 40px;"
+ />
</div>
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
- <img v-if="logo" :src="logo" class="sidebar-logo" />
+ <img v-if="logoImg2" :src="logoImg2" class="sidebar-logo" />
+ {{ title }}
</router-link>
</transition>
</div>
</template>
<script>
-// import logoImg2 from "@/assets/logo/toray_group_icon.png";
+import { title } from "../../../settings";
+
+import logoImg2 from "@/assets/logo/logo.png";
export default {
name: "SidebarLogo",
@@ -31,9 +38,10 @@
},
data() {
return {
- title: "涓滀附鍖荤枟鑳芥簮绠＄悊绯荤粺",
- logo: "https://www.toray.cn/shared/images/toray_logo_ch.svg",
- logoImg2: "https://www.toray.cn/shared/images/toray_logo_ch.svg"
+ title: "缁煎悎鑳芥簮绠＄悊",
+ logoImg2,
+ logo: "https://www.toray.cn/shared/images/toray_logo_ch.svg"
+ // logoImg2: "http://yunlu.com.cn/template/pc/skin/images/index/u21.png"
};
}
};
@@ -54,27 +62,45 @@
width: 100%;
height: 64px;
line-height: 64px;
- background: #16a5b6;
+ background: #001233;
text-align: center;
overflow: hidden;
+ .sidebar-logo-link-collapse {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ width: 100%;
+ .collapse-logo {
+ display: flex;
+ align-items: center;
+ text-align: center;
+ justify-content: center;
+ height: 100%;
+ width: 100%;
+ }
+ }
& .sidebar-logo-link {
height: 100%;
width: 100%;
+ color: #fff;
+ font-weight: 600;
+ font-size: 20px;
.collapse-logo {
display: flex;
align-items: center;
- height: 100%;
text-align: center;
- width: 100%;
justify-content: center;
+ height: 100%;
+ width: 100%;
}
& .sidebar-logo {
- width: 190px;
+ width: 40px;
vertical-align: middle;
- margin-right: 12px;
+ margin-right: 6px;
}
& .sidebar-title {
diff --git a/energy_management_ui/src/layout/components/Sidebar/index.vue b/energy_management_ui/src/layout/components/Sidebar/index.vue
index 1f56632..060f77d 100644
--- a/energy_management_ui/src/layout/components/Sidebar/index.vue
+++ b/energy_management_ui/src/layout/components/Sidebar/index.vue
@@ -53,9 +53,15 @@
}
};
</script>
+
<style lang="scss" scoped>
::v-deep .el-menu-item.is-active {
// background: rgba(246, 250, 255, 1) !important;
- background: linear-gradient(90deg, #4fdac9 0%, #32b5cb 100%) !important;
+ // background: linear-gradient(90deg, #4fdac9 0%, #32b5cb 100%) !important;
+ background: linear-gradient(
+ 90deg,
+ #0559c8 0%,
+ rgba(5, 89, 200, 0) 97%
+ ) !important;
}
</style>
diff --git a/energy_management_ui/src/router/index.js b/energy_management_ui/src/router/index.js
index a7967d6..9442076 100644
--- a/energy_management_ui/src/router/index.js
+++ b/energy_management_ui/src/router/index.js
@@ -1,10 +1,10 @@
-import Vue from 'vue'
-import Router from 'vue-router'
+import Vue from "vue";
+import Router from "vue-router";
-Vue.use(Router)
+Vue.use(Router);
/* Layout */
-import Layout from '@/layout'
+import Layout from "@/layout";
/**
* Note: 璺敱閰嶇疆椤�
@@ -25,150 +25,173 @@
*/
// 鍏叡璺敱
-export const constantRoutes = [{
- path: '/redirect',
+export const constantRoutes = [
+ {
+ path: "/redirect",
component: Layout,
hidden: true,
- children: [{
- path: '/redirect/:path*',
- component: () => import('@/views/redirect')
- }]
+ children: [
+ {
+ path: "/redirect/:path*",
+ component: () => import("@/views/redirect")
+ }
+ ]
},
{
- path: '/login',
- component: () => import('@/views/login'),
+ path: "/login",
+ component: () => import("@/views/login"),
hidden: true
},
{
- path: '/404',
- component: () => import('@/views/error/404'),
+ path: "/404",
+ component: () => import("@/views/error/404"),
hidden: true
},
{
- path: '/401',
- component: () => import('@/views/error/401'),
+ path: "/401",
+ component: () => import("@/views/error/401"),
hidden: true
},
{
- path: '',
+ path: "",
component: Layout,
- redirect: 'index',
- children: [{
- path: 'index',
- component: () => import('@/views/index'),
- name: '棣栭〉',
- meta: {
- title: '棣栭〉',
- icon: 'dashboard',
- noCache: true,
- affix: true
+ redirect: "index",
+ children: [
+ {
+ path: "index",
+ component: () => import("@/views/index"),
+ name: "棣栭〉",
+ meta: {
+ title: "棣栭〉",
+ icon: "dashboard",
+ noCache: true,
+ affix: true
+ }
}
- }]
+ ]
},
{
- path: '/indexdev',
- component: () => import('@/views/index_dev'),
- hidden: 'true'
+ path: "/indexdev",
+ component: () => import("@/views/index"),
+ hidden: "true"
},
{
- path: '/user',
+ path: "/user",
component: Layout,
hidden: true,
- redirect: 'noredirect',
- children: [{
- path: 'profile',
- component: () => import('@/views/system/user/profile/index'),
- name: 'Profile',
- meta: {
- title: '涓汉涓績',
- icon: 'user'
+ redirect: "noredirect",
+ children: [
+ {
+ path: "profile",
+ component: () => import("@/views/system/user/profile/index"),
+ name: "Profile",
+ meta: {
+ title: "涓汉涓績",
+ icon: "user"
+ }
}
- }]
+ ]
},
{
- path: '/dict',
+ path: "/dict",
component: Layout,
hidden: true,
- children: [{
- path: 'type/data/:dictId(\\d+)',
- component: () => import('@/views/system/dict/data'),
- name: 'Data',
- meta: {
- title: '瀛楀吀鏁版嵁',
- icon: ''
+ children: [
+ {
+ path: "type/data/:dictId(\\d+)",
+ component: () => import("@/views/system/dict/data"),
+ name: "Data",
+ meta: {
+ title: "瀛楀吀鏁版嵁",
+ icon: ""
+ }
}
- }]
+ ]
},
{
- path: '/gen',
+ path: "/gen",
component: Layout,
hidden: true,
- children: [{
- path: 'edit',
- component: () => import('@/views/tool/gen/editTable'),
- name: 'GenEdit',
- meta: {
- title: '淇敼鐢熸垚閰嶇疆'
+ children: [
+ {
+ path: "edit",
+ component: () => import("@/views/tool/gen/editTable"),
+ name: "GenEdit",
+ meta: {
+ title: "淇敼鐢熸垚閰嶇疆"
+ }
}
- }]
+ ]
},
{
- path: '/model',
+ path: "/model",
component: Layout,
hidden: true,
- children: [{
- path: '',
- component: () => import('@/views/basicsetting/model/index'),
- name: 'modelManage',
- meta: {
- title: '妯″瀷绠＄悊'
+ children: [
+ {
+ path: "",
+ component: () => import("@/views/basicsetting/model/index"),
+ name: "modelManage",
+ meta: {
+ title: "妯″瀷绠＄悊"
+ }
}
- }]
- }, {
- path: '/electricityPrice',
- component: Layout,
- hidden: true,
- children: [{
- path: 'listHistory',
- component: () => import('@/views/electricityPrice/electricity/history'),
- name: 'electricity',
- meta: {
- title: '宄板钩璋峰巻鍙茶褰�',
- icon: ''
- }
- }]
- }, {
- path: '/energyConsumption',
- component: Layout,
- hidden: true,
- children: [{
- path: 'listEnergyConsumption/:timeType/:beginTime/:endTime/:indexCode/:id/:titleName',
- component: () => import('@/views/energyStatistics/energyConsumption/consumptionCost'),
- name: 'listEnergyConsumption',
- meta: {
- title: '鑳芥簮娑堣垂鎴愭湰鍒嗘椂鍒嗘瀽鎶ヨ〃'
- }
- }]
+ ]
},
{
- path: '/rosteringSchemeitem',
+ path: "/electricityPrice",
component: Layout,
hidden: true,
- children: [{
- path: 'list/:id',
- component: () => import('@/views/workforce/management/schemeItem'),
- name: 'list',
- meta: {
- title: '杞�兼柟妗堢粏鍒�'
+ children: [
+ {
+ path: "listHistory",
+ component: () => import("@/views/electricityPrice/electricity/history"),
+ name: "electricity",
+ meta: {
+ title: "宄板钩璋峰巻鍙茶褰�",
+ icon: ""
+ }
}
- }]
+ ]
+ },
+ {
+ path: "/energyConsumption",
+ component: Layout,
+ hidden: true,
+ children: [
+ {
+ path:
+ "listEnergyConsumption/:timeType/:beginTime/:endTime/:indexCode/:id/:titleName",
+ component: () =>
+ import("@/views/energyStatistics/energyConsumption/consumptionCost"),
+ name: "listEnergyConsumption",
+ meta: {
+ title: "鑳芥簮娑堣垂鎴愭湰鍒嗘椂鍒嗘瀽鎶ヨ〃"
+ }
+ }
+ ]
+ },
+ {
+ path: "/rosteringSchemeitem",
+ component: Layout,
+ hidden: true,
+ children: [
+ {
+ path: "list/:id",
+ component: () => import("@/views/workforce/management/schemeItem"),
+ name: "list",
+ meta: {
+ title: "杞�兼柟妗堢粏鍒�"
+ }
+ }
+ ]
}
-]
+];
export default new Router({
- mode: 'history', // 鍘绘帀url涓殑#
+ mode: "history", // 鍘绘帀url涓殑#
scrollBehavior: () => ({
y: 0
}),
routes: constantRoutes
-})
+});
diff --git a/energy_management_ui/src/settings.js b/energy_management_ui/src/settings.js
index ddeef7c..5083dd1 100644
--- a/energy_management_ui/src/settings.js
+++ b/energy_management_ui/src/settings.js
@@ -1,5 +1,5 @@
module.exports = {
- title: '涓滀附鍖荤枟鑳芥簮绠＄悊绯荤粺',
+ title: "缁煎悎鑳芥簮绠＄悊",
/**
* 鏄惁绯荤粺甯冨眬閰嶇疆
@@ -14,7 +14,7 @@
/**
* 鏄惁鍥哄畾澶撮儴
*/
- fixedHeader: false,
+ fixedHeader: true,
/**
* 鏄惁鏄剧ずlogo
@@ -27,5 +27,5 @@
* The default is only used in the production env
* If you want to also use it in dev, you can pass ['production', 'development']
*/
- errorLog: 'production'
-}
+ errorLog: "production"
+};
diff --git a/energy_management_ui/src/utils/index.js b/energy_management_ui/src/utils/index.js
index 04299a9..ca74f5b 100644
--- a/energy_management_ui/src/utils/index.js
+++ b/energy_management_ui/src/utils/index.js
@@ -3,14 +3,21 @@
*/
export function formatDate(cellValue) {
if (cellValue == null || cellValue == "") return "";
- var date = new Date(cellValue)
- var year = date.getFullYear()
- var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
- var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
- var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
- var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
- var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
- return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds
+ var date = new Date(cellValue);
+ var year = date.getFullYear();
+ var month =
+ date.getMonth() + 1 < 10
+ ? "0" + (date.getMonth() + 1)
+ : date.getMonth() + 1;
+ var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
+ var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
+ var minutes =
+ date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
+ var seconds =
+ date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
+ return (
+ year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds
+ );
}
/**
@@ -19,40 +26,40 @@
* @returns {string}
*/
export function formatTime(time, option) {
- if (('' + time).length === 10) {
- time = parseInt(time) * 1000
+ if (("" + time).length === 10) {
+ time = parseInt(time) * 1000;
} else {
- time = +time
+ time = +time;
}
- const d = new Date(time)
- const now = Date.now()
+ const d = new Date(time);
+ const now = Date.now();
- const diff = (now - d) / 1000
+ const diff = (now - d) / 1000;
if (diff < 30) {
- return '鍒氬垰'
+ return "鍒氬垰";
} else if (diff < 3600) {
// less 1 hour
- return Math.ceil(diff / 60) + '鍒嗛挓鍓�'
+ return Math.ceil(diff / 60) + "鍒嗛挓鍓�";
} else if (diff < 3600 * 24) {
- return Math.ceil(diff / 3600) + '灏忔椂鍓�'
+ return Math.ceil(diff / 3600) + "灏忔椂鍓�";
} else if (diff < 3600 * 24 * 2) {
- return '1澶╁墠'
+ return "1澶╁墠";
}
if (option) {
- return parseTime(time, option)
+ return parseTime(time, option);
} else {
return (
d.getMonth() +
1 +
- '鏈�' +
+ "鏈�" +
d.getDate() +
- '鏃�' +
+ "鏃�" +
d.getHours() +
- '鏃�' +
+ "鏃�" +
d.getMinutes() +
- '鍒�'
- )
+ "鍒�"
+ );
}
}
@@ -61,18 +68,18 @@
* @returns {Object}
*/
export function getQueryObject(url) {
- url = url == null ? window.location.href : url
- const search = url.substring(url.lastIndexOf('?') + 1)
- const obj = {}
- const reg = /([^?&=]+)=([^?&=]*)/g
+ url = url == null ? window.location.href : url;
+ const search = url.substring(url.lastIndexOf("?") + 1);
+ const obj = {};
+ const reg = /([^?&=]+)=([^?&=]*)/g;
search.replace(reg, (rs, $1, $2) => {
- const name = decodeURIComponent($1)
- let val = decodeURIComponent($2)
- val = String(val)
- obj[name] = val
- return rs
- })
- return obj
+ const name = decodeURIComponent($1);
+ let val = decodeURIComponent($2);
+ val = String(val);
+ obj[name] = val;
+ return rs;
+ });
+ return obj;
}
/**
@@ -81,14 +88,14 @@
*/
export function byteLength(str) {
// returns the byte length of an utf8 string
- let s = str.length
+ let s = str.length;
for (var i = str.length - 1; i >= 0; i--) {
- const code = str.charCodeAt(i)
- if (code > 0x7f && code <= 0x7ff) s++
- else if (code > 0x7ff && code <= 0xffff) s += 2
- if (code >= 0xDC00 && code <= 0xDFFF) i--
+ const code = str.charCodeAt(i);
+ if (code > 0x7f && code <= 0x7ff) s++;
+ else if (code > 0x7ff && code <= 0xffff) s += 2;
+ if (code >= 0xdc00 && code <= 0xdfff) i--;
}
- return s
+ return s;
}
/**
@@ -96,13 +103,13 @@
* @returns {Array}
*/
export function cleanArray(actual) {
- const newArray = []
+ const newArray = [];
for (let i = 0; i < actual.length; i++) {
if (actual[i]) {
- newArray.push(actual[i])
+ newArray.push(actual[i]);
}
}
- return newArray
+ return newArray;
}
/**
@@ -110,13 +117,13 @@
* @returns {Array}
*/
export function param(json) {
- if (!json) return ''
+ if (!json) return "";
return cleanArray(
Object.keys(json).map(key => {
- if (json[key] === undefined) return ''
- return encodeURIComponent(key) + '=' + encodeURIComponent(json[key])
+ if (json[key] === undefined) return "";
+ return encodeURIComponent(key) + "=" + encodeURIComponent(json[key]);
})
- ).join('&')
+ ).join("&");
}
/**
@@ -124,9 +131,9 @@
* @returns {Object}
*/
export function param2Obj(url) {
- const search = url.split('?')[1]
+ const search = url.split("?")[1];
if (!search) {
- return {}
+ return {};
}
return JSON.parse(
'{"' +
@@ -134,9 +141,9 @@
.replace(/"/g, '\\"')
.replace(/&/g, '","')
.replace(/=/g, '":"')
- .replace(/\+/g, ' ') +
+ .replace(/\+/g, " ") +
'"}'
- )
+ );
}
/**
@@ -144,9 +151,9 @@
* @returns {string}
*/
export function html2Text(val) {
- const div = document.createElement('div')
- div.innerHTML = val
- return div.textContent || div.innerText
+ const div = document.createElement("div");
+ div.innerHTML = val;
+ return div.textContent || div.innerText;
}
/**
@@ -156,21 +163,21 @@
* @returns {Object}
*/
export function objectMerge(target, source) {
- if (typeof target !== 'object') {
- target = {}
+ if (typeof target !== "object") {
+ target = {};
}
if (Array.isArray(source)) {
- return source.slice()
+ return source.slice();
}
Object.keys(source).forEach(property => {
- const sourceProperty = source[property]
- if (typeof sourceProperty === 'object') {
- target[property] = objectMerge(target[property], sourceProperty)
+ const sourceProperty = source[property];
+ if (typeof sourceProperty === "object") {
+ target[property] = objectMerge(target[property], sourceProperty);
} else {
- target[property] = sourceProperty
+ target[property] = sourceProperty;
}
- })
- return target
+ });
+ return target;
}
/**
@@ -179,18 +186,18 @@
*/
export function toggleClass(element, className) {
if (!element || !className) {
- return
+ return;
}
- let classString = element.className
- const nameIndex = classString.indexOf(className)
+ let classString = element.className;
+ const nameIndex = classString.indexOf(className);
if (nameIndex === -1) {
- classString += '' + className
+ classString += "" + className;
} else {
classString =
classString.substr(0, nameIndex) +
- classString.substr(nameIndex + className.length)
+ classString.substr(nameIndex + className.length);
}
- element.className = classString
+ element.className = classString;
}
/**
@@ -198,10 +205,10 @@
* @returns {Date}
*/
export function getTime(type) {
- if (type === 'start') {
- return new Date().getTime() - 3600 * 1000 * 24 * 90
+ if (type === "start") {
+ return new Date().getTime() - 3600 * 1000 * 24 * 90;
} else {
- return new Date(new Date().toDateString())
+ return new Date(new Date().toDateString());
}
}
@@ -212,38 +219,38 @@
* @return {*}
*/
export function debounce(func, wait, immediate) {
- let timeout, args, context, timestamp, result
+ let timeout, args, context, timestamp, result;
const later = function() {
// 鎹笂涓�娆¤Е鍙戞椂闂撮棿闅�
- const last = +new Date() - timestamp
+ const last = +new Date() - timestamp;
// 涓婃琚寘瑁呭嚱鏁拌璋冪敤鏃堕棿闂撮殧 last 灏忎簬璁惧畾鏃堕棿闂撮殧 wait
if (last < wait && last > 0) {
- timeout = setTimeout(later, wait - last)
+ timeout = setTimeout(later, wait - last);
} else {
- timeout = null
+ timeout = null;
// 濡傛灉璁惧畾涓篿mmediate===true锛屽洜涓哄紑濮嬭竟鐣屽凡缁忚皟鐢ㄨ繃浜嗘澶勬棤闇�璋冪敤
if (!immediate) {
- result = func.apply(context, args)
- if (!timeout) context = args = null
+ result = func.apply(context, args);
+ if (!timeout) context = args = null;
}
}
- }
+ };
return function(...args) {
- context = this
- timestamp = +new Date()
- const callNow = immediate && !timeout
+ context = this;
+ timestamp = +new Date();
+ const callNow = immediate && !timeout;
// 濡傛灉寤舵椂涓嶅瓨鍦紝閲嶆柊璁惧畾寤舵椂
- if (!timeout) timeout = setTimeout(later, wait)
+ if (!timeout) timeout = setTimeout(later, wait);
if (callNow) {
- result = func.apply(context, args)
- context = args = null
+ result = func.apply(context, args);
+ context = args = null;
}
- return result
- }
+ return result;
+ };
}
/**
@@ -254,18 +261,18 @@
* @returns {Object}
*/
export function deepClone(source) {
- if (!source && typeof source !== 'object') {
- throw new Error('error arguments', 'deepClone')
+ if (!source && typeof source !== "object") {
+ throw new Error("error arguments", "deepClone");
}
- const targetObj = source.constructor === Array ? [] : {}
+ const targetObj = source.constructor === Array ? [] : {};
Object.keys(source).forEach(keys => {
- if (source[keys] && typeof source[keys] === 'object') {
- targetObj[keys] = deepClone(source[keys])
+ if (source[keys] && typeof source[keys] === "object") {
+ targetObj[keys] = deepClone(source[keys]);
} else {
- targetObj[keys] = source[keys]
+ targetObj[keys] = source[keys];
}
- })
- return targetObj
+ });
+ return targetObj;
}
/**
@@ -273,16 +280,16 @@
* @returns {Array}
*/
export function uniqueArr(arr) {
- return Array.from(new Set(arr))
+ return Array.from(new Set(arr));
}
/**
* @returns {string}
*/
export function createUniqueString() {
- const timestamp = +new Date() + ''
- const randomNum = parseInt((1 + Math.random()) * 65536) + ''
- return (+(randomNum + timestamp)).toString(32)
+ const timestamp = +new Date() + "";
+ const randomNum = parseInt((1 + Math.random()) * 65536) + "";
+ return (+(randomNum + timestamp)).toString(32);
}
/**
@@ -292,7 +299,7 @@
* @returns {boolean}
*/
export function hasClass(ele, cls) {
- return !!ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'))
+ return !!ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
}
/**
@@ -301,7 +308,7 @@
* @param {string} cls
*/
export function addClass(ele, cls) {
- if (!hasClass(ele, cls)) ele.className += ' ' + cls
+ if (!hasClass(ele, cls)) ele.className += " " + cls;
}
/**
@@ -311,7 +318,27 @@
*/
export function removeClass(ele, cls) {
if (hasClass(ele, cls)) {
- const reg = new RegExp('(\\s|^)' + cls + '(\\s|$)')
- ele.className = ele.className.replace(reg, ' ')
+ const reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
+ ele.className = ele.className.replace(reg, " ");
}
}
+
+export function getTimePeriod(num) {
+ let s1 = "";
+ let s2 = "";
+ let e1 = "";
+ let e2 = "";
+
+ if (num % 2 === 0) {
+ s2 = "30";
+ s1 = ~~(num / 2 - 1) < 10 ? "0" + ~~(num / 2 - 1) : ~~(num / 2 - 1);
+ e1 = ~~(num / 2) < 10 ? "0" + ~~(num / 2) : ~~(num / 2);
+ e2 = "00";
+ } else {
+ s1 = ~~(num / 2) < 10 ? "0" + ~~(num / 2) : ~~(num / 2);
+ s2 = "00";
+ e1 = s1;
+ e2 = "30";
+ }
+ return s1 + ":" + s2 + "-" + e1 + ":" + e2;
+}
diff --git a/energy_management_ui/src/views/alarm/collectionIndex.vue b/energy_management_ui/src/views/alarm/collectionIndex.vue
index 96a478d..d29ad22 100644
--- a/energy_management_ui/src/views/alarm/collectionIndex.vue
+++ b/energy_management_ui/src/views/alarm/collectionIndex.vue
@@ -1,6 +1,12 @@
<template>
<div class="app-container" style="padding:0">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
<el-form-item label="鎸囨爣缂栫爜" prop="code">
<el-input
v-model="queryParams.code"
@@ -35,7 +41,13 @@
></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
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鎼滅储</el-button
+ >
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
@@ -46,270 +58,288 @@
size="mini"
@click=""
v-hasPermi="['']"
- >瀵煎嚭
+ >瀵煎嚭
</el-button>
</el-col>
</el-row>
- <el-table :data="tableData" v-loading="loading" border @selection-change="" @cell-click="openDlg" >
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="name"/>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="number"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="value"/>
- <el-table-column label="涓嬮檺鍊�" align="center" prop="values"/>
- <el-table-column label="涓婇檺鍊�" align="center" prop="code"/>
+ <el-table
+ :data="tableData"
+ v-loading="loading"
+ border
+ @selection-change=""
+ @cell-click="openDlg"
+ >
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="name" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="number" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="value" />
+ <el-table-column label="涓嬮檺鍊�" align="center" prop="values" />
+ <el-table-column label="涓婇檺鍊�" align="center" prop="code" />
<el-table-column label="鎶ヨ娆℃暟" align="center" prop="what">
<template slot-scope="scope">
- <div style="color:blue;text-decoration:underline ;cursor:pointer">{{scope.row.what}}</div>
+ <div style="color:blue;text-decoration:underline ;cursor:pointer">
+ {{ scope.row.what }}
+ </div>
</template>
</el-table-column>
</el-table>
<!--寮规-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false" >
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ >
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
<line-chart :chart-data="lineChartData" />
</el-row>
- <el-table :data="tableData" :show-header="hiddenTableHeader" border="1px" >
- <el-table-column label="鎶ヨ鏃堕棿"prop="one" />
- <el-table-column label="鎶ヨ鍊�" prop="two" />
- <el-table-column label="瀹為檯鍊�" prop="three" />
- <el-table-column label="瀹為檯鍊�" prop="four" />
- <el-table-column label="瀹為檯鍊�" prop="five" />
- <el-table-column label="瀹為檯鍊�" prop="six" />
- <el-table-column label="瀹為檯鍊�" prop="seven" />
- <el-table-column label="瀹為檯鍊�" prop="eieght" />
+ <el-table :data="tableData" :show-header="hiddenTableHeader" border="1px">
+ <el-table-column label="鎶ヨ鏃堕棿" prop="one" />
+ <el-table-column label="鎶ヨ鍊�" prop="two" />
+ <el-table-column label="瀹為檯鍊�" prop="three" />
+ <el-table-column label="瀹為檯鍊�" prop="four" />
+ <el-table-column label="瀹為檯鍊�" prop="five" />
+ <el-table-column label="瀹為檯鍊�" prop="six" />
+ <el-table-column label="瀹為檯鍊�" prop="seven" />
+ <el-table-column label="瀹為檯鍊�" prop="eieght" />
</el-table>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">鍙� 娑�</el-button>
</div>
</el-dialog>
-
</div>
</template>
-
<script>
- const lineChartData = {
- newVisitis: {
- }
- }
- import {
- addEnergyindex,
- delEnergyindex,
- exportEnergyindex,
- getEnergyindex,
- listEnergyindex,
- updateEnergyindex
- } from "@/api/basicsetting/energyindex";
- import LineChart from './LiChart'
+const lineChartData = {
+ newVisitis: {}
+};
+import {
+ addEnergyindex,
+ delEnergyindex,
+ exportEnergyindex,
+ getEnergyindex,
+ listEnergyindex,
+ updateEnergyindex
+} from "@/api/basicsetting/energyindex";
+import LineChart from "./LiChart";
+export default {
+ name: "energyIndex",
+ components: {
+ LineChart
+ },
+ data() {
+ return {
+ hiddenTableHeader: false,
+ lineChartData: lineChartData.newVisitis,
+ // 閬僵灞�
+ loading: false,
+ // 閫変腑鏁扮粍
+ ids: [],
+ dateRange: [],
+ names: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
+ List: [],
+ energyindexList: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 涓婚敭瀛楀吀
+ indexIdOptions: [],
+ // 鎸囨爣鍚嶇О瀛楀吀
+ nameOptions: [],
+ // 鎸囨爣缂栫爜瀛楀吀
+ codeOptions: [],
+ // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀
+ indexCategoryOptions: [],
+ // 澶囨敞瀛楀吀
+ remarkOptions: [],
+ // 鍗曚綅瀛楀吀
+ unitIdOptions: [],
+ // 鏌ヨ鍙傛暟
+ lineChartData: {
+ newVisitis: null
+ },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ nodeId: undefined
+ },
-
- export default {
- name: 'energyIndex',
- components: {
- LineChart
- },
- data() {
- return {
- hiddenTableHeader:false,
- lineChartData: lineChartData.newVisitis,
- // 閬僵灞�
- loading: false,
- // 閫変腑鏁扮粍
- ids: [],
- dateRange: [],
- names: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 0,
- // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
- List: [],
- energyindexList: [],
- // 寮瑰嚭灞傛爣棰�
- title: "",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- // 涓婚敭瀛楀吀
- indexIdOptions: [],
- // 鎸囨爣鍚嶇О瀛楀吀
- nameOptions: [],
- // 鎸囨爣缂栫爜瀛楀吀
- codeOptions: [],
- // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀
- indexCategoryOptions: [],
- // 澶囨敞瀛楀吀
- remarkOptions: [],
- // 鍗曚綅瀛楀吀
- unitIdOptions: [],
- // 鏌ヨ鍙傛暟
- lineChartData:{
- newVisitis:null,
+ tableData: [],
+ datas: [
+ {
+ name: "BUG",
+ number: "98013",
+ value: "500",
+ values: "450",
+ code: "480",
+ what: "5",
+ one: "鎶ヨ鏃堕棿",
+ two: "0鐐�",
+ three: "1鐐�",
+ four: "2鐐�",
+ five: "3鐐�",
+ six: "4鐐�",
+ seven: "5鐐�",
+ eieght: "6鐐�"
},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- nodeId: undefined
+ {
+ name: "BUG",
+ number: "98013",
+ value: "500",
+ values: "450",
+ code: "480",
+ what: "5",
+ one: "鎶ヨ闄愬��",
+ two: "210",
+ three: "172",
+ four: "181",
+ five: "224",
+ six: "280",
+ seven: "310",
+ eieght: "300"
},
-
- tableData: [],
- datas: [{
- name: 'BUG',
- number: '98013',
- value: '500',
- values: '450',
- code: '480',
- what: '5',
- one: '鎶ヨ鏃堕棿',
- two: '0鐐�',
- three: '1鐐�',
- four : '2鐐�',
- five :'3鐐�',
- six : '4鐐�',
- seven :'5鐐�',
- eieght:'6鐐�',
- },
- {
- name: 'BUG',
- number: '98013',
- value : '500',
- values : '450',
- code : '480',
- what: '5',
- one :'鎶ヨ闄愬��',
- two :'210',
- three :'172',
- four : '181',
- five :'224',
- six : '280',
- seven :'310',
- eieght:'300',
- },
- {
- name: 'BUG',
- number: '98013',
- value : '500',
- values : '450',
- code : '480' ,
- what: '5',
- one :'鎶ヨ鏃跺��',
- two :'300',
- three :'182',
- four : '191',
- five :'234',
- six : '290',
- seven :'330',
- eieght:'310',
- }
- ],
-
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- rules: {
- name: [
- {required: true, message: "鎸囨爣鍚嶇О涓嶈兘涓虹┖", trigger: "blur"},
- {min: 2, max: 20, message: '闀垮害鍦� 2 鍒� 20 涓瓧绗�', trigger: 'blur'}
- ], code: [
- {required: true, message: "鎸囨爣缂栫爜涓嶈兘涓虹┖", trigger: "blur"},
- {min: 2, max: 20, message: '闀垮害鍦� 2 鍒� 20 涓瓧绗�', trigger: 'blur'},
- {pattern: /^[a-zA-Z][A-Za-z0-9_-]+$/, message: '蹇呴』涓烘暟瀛椼�佸瓧姣嶃��- 鎴朹 锛屼笖棣栧瓧绗﹀彧鑳戒负瀛楁瘝'}
- ], indexCategory: [
- {required: true, message: "璇烽�夋嫨鎸囨爣鍒嗙被", trigger: "blur"}
- ]
- },
- currentNode: undefined,
- indexCategoryDefaultVal: undefined,
- unitDefaultVal: undefined
- };
- },
-
- created() {
- /* this.getList();*/
- this.getDicts("sys_index_category").then(response => {
- this.indexCategoryOptions = response.data;
- this.indexCategoryDefaultVal = this.indexCategoryOptions.find(f => f.isDefault === 'Y');
- });
- this.getDicts("sys_unit").then(response => {
- this.unitIdOptions = response.data;
- this.unitDefaultVal = this.unitIdOptions.find(f => f.isDefault === 'Y');
- });
- setInterval(this.getList(), 30000);
-
- this.bpy()
-
- },
- methods: {
- /** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
- getList(modelNode) {
- this.currentNode = modelNode;
- if (modelNode) {
- this.loading = true;
- this.queryParams.nodeId = modelNode.id;
- listEnergyindex(this.queryParams).then(response => {
- this.energyindexList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- } else {
- this.energyindexList = [];
+ {
+ name: "BUG",
+ number: "98013",
+ value: "500",
+ values: "450",
+ code: "480",
+ what: "5",
+ one: "鎶ヨ鏃跺��",
+ two: "300",
+ three: "182",
+ four: "191",
+ five: "234",
+ six: "290",
+ seven: "330",
+ eieght: "310"
}
+ ],
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ rules: {
+ name: [
+ { required: true, message: "鎸囨爣鍚嶇О涓嶈兘涓虹┖", trigger: "blur" },
+ { min: 2, max: 20, message: "闀垮害鍦� 2 鍒� 20 涓瓧绗�", trigger: "blur" }
+ ],
+ code: [
+ { required: true, message: "鎸囨爣缂栫爜涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 20,
+ message: "闀垮害鍦� 2 鍒� 20 涓瓧绗�",
+ trigger: "blur"
+ },
+ {
+ pattern: /^[a-zA-Z][A-Za-z0-9_-]+$/,
+ message: "蹇呴』涓烘暟瀛椼�佸瓧姣嶃��- 鎴朹 锛屼笖棣栧瓧绗﹀彧鑳戒负瀛楁瘝"
+ }
+ ],
+ indexCategory: [
+ { required: true, message: "璇烽�夋嫨鎸囨爣鍒嗙被", trigger: "blur" }
+ ]
},
- bpy() {
- this.tableData = this.datas;
- },
- /** 鏌ョ湅鎸夐挳鎿嶄綔 */
- handleUpdate(row) {
- this.reset();
- const indexId = row.indexId || this.ids;
- /* getEnergyindex(indexId).then(response => {
+ currentNode: undefined,
+ indexCategoryDefaultVal: undefined,
+ unitDefaultVal: undefined
+ };
+ },
+
+ created() {
+ /* this.getList();*/
+ this.getDicts("sys_index_category").then(response => {
+ this.indexCategoryOptions = response.data;
+ this.indexCategoryDefaultVal = this.indexCategoryOptions.find(
+ f => f.isDefault === "Y"
+ );
+ });
+ this.getDicts("sys_unit").then(response => {
+ this.unitIdOptions = response.data;
+ this.unitDefaultVal = this.unitIdOptions.find(f => f.isDefault === "Y");
+ });
+ setInterval(this.getList(), 30000);
+
+ this.bpy();
+ },
+ methods: {
+ /** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
+ getList(modelNode) {
+ this.currentNode = modelNode;
+ if (modelNode) {
+ this.loading = true;
+ this.queryParams.nodeId = modelNode.id;
+ listEnergyindex(this.queryParams).then(response => {
+ this.energyindexList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ } else {
+ this.energyindexList = [];
+ }
+ },
+ bpy() {
+ this.tableData = this.datas;
+ },
+ /** 鏌ョ湅鎸夐挳鎿嶄綔 */
+ handleUpdate(row) {
+ this.reset();
+ const indexId = row.indexId || this.ids;
+ /* getEnergyindex(indexId).then(response => {
this.form = response.data;
this.title = "寮傚父淇℃伅"+ response.data.name ;
});*/
- this.open = true;
+ this.open = true;
/* this.title = "鎶ヨ鏄庣粏";*/
- },
- // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀缈昏瘧
- indexCategoryFormat(row, column) {
- return this.selectDictLabel(this.indexCategoryOptions, row.indexCategory);
- },
+ },
+ // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀缈昏瘧
+ indexCategoryFormat(row, column) {
+ return this.selectDictLabel(this.indexCategoryOptions, row.indexCategory);
+ },
- // 鍗曚綅瀛楀吀缈昏瘧
- unitIdFormat(row, column) {
- return this.selectDictLabel(this.unitIdOptions, row.unitId);
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- indexId: undefined,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- remark: undefined,
- unitId: undefined
- };
- this.resetForm("form");
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList(this.currentNode);
- },
- openDlg (){
- this.open=true;
- }
+ // 鍗曚綅瀛楀吀缈昏瘧
+ unitIdFormat(row, column) {
+ return this.selectDictLabel(this.unitIdOptions, row.unitId);
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ indexId: undefined,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ remark: undefined,
+ unitId: undefined
+ };
+ this.resetForm("form");
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList(this.currentNode);
+ },
+ openDlg() {
+ this.open = true;
}
-
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/alarmItem/modelWarnSetting.vue b/energy_management_ui/src/views/alarmItem/modelWarnSetting.vue
index a78dd7e..92ddf5f 100644
--- a/energy_management_ui/src/views/alarmItem/modelWarnSetting.vue
+++ b/energy_management_ui/src/views/alarmItem/modelWarnSetting.vue
@@ -27,16 +27,16 @@
setDevice,
setEnergy,
setProduct
-} from '@/api/basicsetting/modelNode'
+} from "@/api/basicsetting/modelNode";
import zbIndex from "./zbIndex";
import cjdIndex from "./cjdIndex";
export default {
name: "modelWarnSetting",
- components: {zbIndex, cjdIndex},
+ components: { zbIndex, cjdIndex },
data() {
return {
- currentNode: '',
+ currentNode: "",
deviceDialog: false,
energyDialog: false,
productDialog: false,
@@ -50,19 +50,20 @@
settingProductList: [],
settingIndexList: [],
disabledSetting: true
- }
+ };
},
methods: {
modelNodeChange(modelNode) {
this.settingDeviceList = [];
this.settingIndexList = [];
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null;
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
this.$refs.zbIndex.setModelNode(modelNode);
this.$refs.cjdIndex.setModelNode(modelNode);
if (modelNode) {
this.currentNode = modelNode;
this.deviceLoading = true;
- getSettingDevice(modelNode.id).then((response) => {
+ getSettingDevice(modelNode.id).then(response => {
if (response.code === 200) {
this.settingDeviceList = response.data;
} else {
@@ -72,7 +73,7 @@
});
this.energyLoading = true;
- getSettingEnergy(modelNode.id).then((response) => {
+ getSettingEnergy(modelNode.id).then(response => {
if (response.code === 200) {
this.settingEnergyList = response.data;
} else {
@@ -82,7 +83,7 @@
});
this.productLoading = true;
- getSettingProduct(modelNode.id).then((response) => {
+ getSettingProduct(modelNode.id).then(response => {
if (response.code === 200) {
this.settingProductList = response.data;
} else {
@@ -92,7 +93,7 @@
});
this.indexLoading = true;
- getSettingIndex(modelNode.id).then((response) => {
+ getSettingIndex(modelNode.id).then(response => {
if (response.code === 200) {
this.settingIndexList = response.data;
} else {
@@ -107,13 +108,14 @@
},
showCollectIndexDialog() {
this.$nextTick(() => {
- this.$refs.collectIndexSetting.init(this.currentNode, this.settingIndexList);
- })
- },
+ this.$refs.collectIndexSetting.init(
+ this.currentNode,
+ this.settingIndexList
+ );
+ });
+ }
}
-}
+};
</script>
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/energy_management_ui/src/views/basicSetup/equipmentfile/trendLineChart.vue b/energy_management_ui/src/views/basicSetup/equipmentfile/trendLineChart.vue
index 794c3c4..962cab4 100644
--- a/energy_management_ui/src/views/basicSetup/equipmentfile/trendLineChart.vue
+++ b/energy_management_ui/src/views/basicSetup/equipmentfile/trendLineChart.vue
@@ -1,71 +1,122 @@
<template>
<div class="trendLineChart-right">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form"
- style="margin-bottom: 20px">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ style="margin-bottom: 20px"
+ >
<el-select v-model="value" placeholder="璇烽�夋嫨" style="width: 120px">
<el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value">
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
</el-option>
</el-select>
<el-form-item label="" prop="minute" :rules="rules.numRule">
鏈�鏂�
- <el-input v-model="queryParams.minute" :min="1" :max="120" style="width: 120px" type="number"></el-input>
+ <el-input
+ v-model="queryParams.minute"
+ :min="1"
+ :max="120"
+ style="width: 120px"
+ type="number"
+ ></el-input>
鍒嗛挓
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鏌ヨ</el-button>
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鏌ヨ</el-button
+ >
</el-form-item>
</el-form>
- <div class="tableStyle" v-if="value=='tableOpen'">
- <el-table :data="tableData" ref="dataTable" border style="margin-top: 20px"
- :height="height"
- @selection-change="handleSelectionChange">
+ <div class="tableStyle" v-if="value == 'tableOpen'">
+ <el-table
+ :data="tableData"
+ ref="dataTable"
+ border
+ style="margin-top: 20px"
+ :height="height"
+ @selection-change="handleSelectionChange"
+ >
<el-table-column type="selection" align="center"></el-table-column>
<el-table-column prop="statusName" align="center" label="鍧愭爣杞�">
<template slot-scope="scope">
<el-select
- v-model="scope.row.yValue"
- @change="selectNumber(scope.row,scope.$index)"
+ v-model="scope.row.yValue"
+ @change="selectNumber(scope.row, scope.$index)"
>
-
<el-option
- v-for="(item,index) in addTableSelect"
- :key="item.yValue"
- :label="item.yLable"
- :value="item.yValue"
+ v-for="(item, index) in addTableSelect"
+ :key="item.yValue"
+ :label="item.yLable"
+ :value="item.yValue"
></el-option>
</el-select>
</template>
</el-table-column>
- <el-table-column
- prop="meteName"
- align="center"
- label="琛ㄥ叿鍚嶇О">
+ <el-table-column prop="meteName" align="center" label="琛ㄥ叿鍚嶇О">
</el-table-column>
- <el-table-column prop="indexName" align="center" label="鐐逛綅鍚嶇О"/>
- <el-table-column prop="indexUnit" align="center" label="鍗曚綅" :formatter="unitFormat"/>
+ <el-table-column prop="indexName" align="center" label="鐐逛綅鍚嶇О" />
+ <el-table-column
+ prop="indexUnit"
+ align="center"
+ label="鍗曚綅"
+ :formatter="unitFormat"
+ />
<el-table-column prop="value" align="center" label="褰撳墠鍊�">
</el-table-column>
<el-table-column label="鎿嶄綔" align="center" width="200">
<template slot-scope="scope">
- <el-button type="primary" icon="el-icon-search" size="mini" @click="openDialog(scope.row,'line')">瓒嬪娍鍥�
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="openDialog(scope.row, 'line')"
+ >瓒嬪娍鍥�
</el-button>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="openDialog(scope.row,'table')">鏁版嵁
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="openDialog(scope.row, 'table')"
+ >鏁版嵁
</el-button>
</template>
</el-table-column>
</el-table>
</div>
- <component ref="lincharVue" :is="vuename" :chart-data="liveLineChartData" style="margin-top: 20px"></component>
+ <component
+ ref="lincharVue"
+ :is="vuename"
+ :chart-data="liveLineChartData"
+ style="margin-top: 20px"
+ ></component>
<!--鍘嗗彶鏇茬嚎dialog-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false" @close="closeDialog">
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName" v-if="dialogType==='line'"/>
- <TableDialog :code="code" v-else :open="open"/>
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ @close="closeDialog"
+ >
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ v-if="dialogType === 'line'"
+ />
+ <TableDialog :code="code" v-else :open="open" />
</el-row>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelDialog">鍙� 娑�</el-button>
@@ -78,34 +129,35 @@
import {
getTrendSettingIndexLineData,
getSvgTrendSettingIndex
-} from '@/api/dataMonitoring/realTimeTrend/realTimeTrend'
-import historyAlarmView from '../../energyAlarm/realTimeAlarm/historyAlarmView'
-import mixins from '@/layout/mixin/getHeight'
-import TableDialog from './tableDialog'
+} from "@/api/dataMonitoring/realTimeTrend/realTimeTrend";
+import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView";
+import mixins from "@/layout/mixin/getHeight";
+import TableDialog from "./tableDialog";
-let timers
+let timers;
export default {
- name: 'energyIndex',
+ name: "energyIndex",
components: {
- lincharVue: () => import('../../dataMonitoring/realTimeTrend/LineChart.vue'),
+ lincharVue: () =>
+ import("../../dataMonitoring/realTimeTrend/LineChart.vue"),
historyAlarmView,
TableDialog
},
mixins: [mixins],
data() {
const checkNum = (rule, value, callback) => {
- let reg = /(^([-]?)[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^([-]?)(0){1}$)|(^([-]?)[0-9]\.[0-9]([0-9])?$)/
- if ('' === value && !reg.test(value)) {
- callback(new Error('鍒嗛挓闇�鏁板瓧骞朵笖涓嶈兘涓虹┖'))
+ let reg = /(^([-]?)[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^([-]?)(0){1}$)|(^([-]?)[0-9]\.[0-9]([0-9])?$)/;
+ if ("" === value && !reg.test(value)) {
+ callback(new Error("鍒嗛挓闇�鏁板瓧骞朵笖涓嶈兘涓虹┖"));
} else if (0 > value || 120 < value) {
- callback(new Error('鏁板瓧鑼冨洿1~120鐨勬鏁存暟'))
+ callback(new Error("鏁板瓧鑼冨洿1~120鐨勬鏁存暟"));
} else {
- callback()
+ callback();
}
- }
+ };
return {
- value: 'tableOpen',
- yValue: '',
+ value: "tableOpen",
+ yValue: "",
minute: undefined,
count: undefined,
pickerOptions: {
@@ -149,11 +201,13 @@
minute: undefined,
nodeId: undefined,
//鎸囨爣index
- indexType: 'COLLECT',
- params: [{
- 'minute': undefined,
- 'count': undefined
- }]
+ indexType: "COLLECT",
+ params: [
+ {
+ minute: undefined,
+ count: undefined
+ }
+ ]
},
tableData: [],
lineData: [],
@@ -166,17 +220,18 @@
form: {},
// 琛ㄥ崟鏍￠獙
rules: {
- numRule: [
- { type: 'number', validator: checkNum, trigger: 'change' }
- ]
+ numRule: [{ type: "number", validator: checkNum, trigger: "change" }]
},
- options: [{
- value: 'tableOpen',
- label: '鍙傛暟鎵撳紑'
- }, {
- value: 'tableClose',
- label: '鍙傛暟鏀剁缉'
- }],
+ options: [
+ {
+ value: "tableOpen",
+ label: "鍙傛暟鎵撳紑"
+ },
+ {
+ value: "tableClose",
+ label: "鍙傛暟鏀剁缉"
+ }
+ ],
addTableSelect: [],
liveLineChartData: {
datas: [],
@@ -185,7 +240,7 @@
legendNameArr: []
},
selectYaxis: [],
- activeName: 'second',
+ activeName: "second",
code: undefined,
rows: [],
//鍗曚綅
@@ -195,89 +250,96 @@
unitDefaultVal: undefined,
intervalTime: undefined,
timer: undefined,
- vuename: '',
+ vuename: "",
height: null
- }
+ };
},
created() {
- this.getConfigKey('dataMonitoring.realTimeTrend.pastMinute').then(response => {
- this.queryParams.minute = response.msg
- })
- this.getConfigKey('dataMonitoring.realTimeTrend.piontCount').then(response => {
- this.count = response.msg
- })
- this.getDicts('sys_unit').then(response => {
- this.unitOptions = response.data
- })
+ this.getConfigKey("dataMonitoring.realTimeTrend.pastMinute").then(
+ response => {
+ this.queryParams.minute = response.msg;
+ }
+ );
+ this.getConfigKey("dataMonitoring.realTimeTrend.piontCount").then(
+ response => {
+ this.count = response.msg;
+ }
+ );
+ this.getDicts("sys_unit").then(response => {
+ this.unitOptions = response.data;
+ });
},
mounted() {
- clearInterval(this.timer)
- clearInterval(timers)
- timers = setInterval(this.setTimer, 50)
- this.getConfigKey('dataMonitoring.realTimeTrend.intervalTime').then(response => {
- if (response.code === 200) {
- this.intervalTime = response.msg
- this.timer = setInterval(this.getLineDataList, this.intervalTime)
+ clearInterval(this.timer);
+ clearInterval(timers);
+ timers = setInterval(this.setTimer, 50);
+ this.getConfigKey("dataMonitoring.realTimeTrend.intervalTime").then(
+ response => {
+ if (response.code === 200) {
+ this.intervalTime = response.msg;
+ this.timer = setInterval(this.getLineDataList, this.intervalTime);
+ }
}
- })
+ );
},
beforeDestroy() {
// 椤甸潰閿�姣佹椂 瑕佸仠姝㈣鏃跺櫒锛屽惁鍒欓�夐」鍗″垏鎹㈣鏃跺櫒涓嶅仠姝紝浼氳秺鏉ヨ秺蹇紝澶氫釜绾跨▼
- clearInterval(this.timer)
- clearInterval(timers)
+ clearInterval(this.timer);
+ clearInterval(timers);
},
methods: {
setTimer() {
- let that = this
+ let that = this;
this.$nextTick(() => {
- that.$refs.dataTable && that.$refs.dataTable.doLayout()
- })
+ that.$refs.dataTable && that.$refs.dataTable.doLayout();
+ });
},
setCharts() {
- this.height = window.innerHeight - 300 + 'px'
+ this.height = window.innerHeight - 300 + "px";
},
modelNodeChange(modelNode) {
- this.queryParams.nodeId = modelNode
- this.getList()
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null
+ this.queryParams.nodeId = modelNode;
+ this.getList();
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
if (modelNode) {
- this.currentNode = modelNode
+ this.currentNode = modelNode;
}
if (this.$refs.lincharVue != undefined && this.$refs.lincharVue != null) {
- this.$refs.lincharVue.closeLineChar()
+ this.$refs.lincharVue.closeLineChar();
}
},
/** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
getList() {
- this.$refs['queryForm'].validate(valid => {
+ this.$refs["queryForm"].validate(valid => {
if (valid) {
- this.loading = true
- var search = this.queryParams
- search.params[0].minute = this.queryParams.minute
- search.params[0].count = this.count
+ this.loading = true;
+ var search = this.queryParams;
+ search.params[0].minute = this.queryParams.minute;
+ search.params[0].count = this.count;
//琛ㄦ牸鏁版嵁
getSvgTrendSettingIndex(search).then(response => {
- this.tableData = response.data
- this.total = response.total
- this.addTableSelect = []
+ this.tableData = response.data;
+ this.total = response.total;
+ this.addTableSelect = [];
//琛ㄦ牸涓嬫媺閫夋嫨
for (let j = 0; j < 5 && j < this.tableData.length; j++) {
let optionItem = {
- yValue: 'y' + j,
- yLable: 'Y' + j
- }
- this.addTableSelect.push(optionItem)
+ yValue: "y" + j,
+ yLable: "Y" + j
+ };
+ this.addTableSelect.push(optionItem);
}
- this.loading = false
- })
+ this.loading = false;
+ });
}
- })
+ });
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
- this.queryParams.pageNum = 1
- this.getList()
+ this.queryParams.pageNum = 1;
+ this.getList();
},
getTime() {
//鏄剧ず鏃堕棿
@@ -285,88 +347,97 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.drawChars(selection)
+ this.drawChars(selection);
// if(selection.length > 1){ //鍗曢�夋椂涓�1锛岄渶瑕侀�夋嫨n椤规敼鏁板�间负n灏卞彲浠�
// this.$refs.dataTable.toggleRowSelection(selection[0],false);//瓒呭嚭鎸囧畾閫夋嫨涓暟鍚庯紝鎶婄涓�涓�変腑鐨剆election璁句负false
// selection.splice(0,1);//鍚屾椂瑕佹妸閫変腑绗竴椤圭Щ闄�
// }
},
drawChars(selection) {
- this.codes = selection.map(item => item.code)
- this.indexNames = selection.map(item => item.indexName)
- this.selectYaxis = selection.map(item => item.yValue ? item.yValue : '')
+ this.codes = selection.map(item => item.code);
+ this.indexNames = selection.map(item => item.indexName);
+ this.selectYaxis = selection.map(item =>
+ item.yValue ? item.yValue : ""
+ );
if (this.codes.length > 0) {
- this.cleanLineData()
- this.vuename = 'lincharVue'
- this.getLineDataList()
+ this.cleanLineData();
+ this.vuename = "lincharVue";
+ this.getLineDataList();
} else {
- this.cleanLineData()
- if (this.$refs.lincharVue != undefined && this.$refs.lincharVue != null) {
- this.$refs.lincharVue.closeLineChar()
+ this.cleanLineData();
+ if (
+ this.$refs.lincharVue != undefined &&
+ this.$refs.lincharVue != null
+ ) {
+ this.$refs.lincharVue.closeLineChar();
}
}
},
getLineDataList() {
- let that = this
+ let that = this;
this.$nextTick(() => {
- that.$refs.dataTable.doLayout()
- })
+ that.$refs.dataTable.doLayout();
+ });
if (this.codes.length > 0) {
- this.cleanLineData()
+ this.cleanLineData();
//鎶樼嚎鍥炬暟鎹�
- getTrendSettingIndexLineData(this.codes, this.queryParams.minute, this.count).then(response => {
+ getTrendSettingIndexLineData(
+ this.codes,
+ this.queryParams.minute,
+ this.count
+ ).then(response => {
//鏁版嵁娣诲姞
- this.liveLineChartData.datas = response.data
+ this.liveLineChartData.datas = response.data;
this.$nextTick(() => {
- that.$refs.dataTable.doLayout()
- })
+ that.$refs.dataTable.doLayout();
+ });
// x杞存椂闂存坊鍔�
for (let i = 0; i < this.liveLineChartData.datas[0].length; i++) {
- this.liveLineChartData.timeList.push(this.liveLineChartData.datas[0][i].showDataTime)
+ this.liveLineChartData.timeList.push(
+ this.liveLineChartData.datas[0][i].showDataTime
+ );
}
//鏇茬嚎鍚嶇О娣诲姞
- this.liveLineChartData.legendNameArr = this.indexNames
- this.liveLineChartData.legendArr = this.selectYaxis
- })
+ this.liveLineChartData.legendNameArr = this.indexNames;
+ this.liveLineChartData.legendArr = this.selectYaxis;
+ });
}
},
selectNumber(row, index) {
- let selection = this.$refs.dataTable.selection
- this.drawChars(selection)
+ let selection = this.$refs.dataTable.selection;
+ this.drawChars(selection);
},
cleanLineData() {
- this.liveLineChartData.legendArr = []
- this.liveLineChartData.timeList = []
- this.liveLineChartData.datas = []
- this.liveLineChartData.legendNameArr = []
+ this.liveLineChartData.legendArr = [];
+ this.liveLineChartData.timeList = [];
+ this.liveLineChartData.datas = [];
+ this.liveLineChartData.legendNameArr = [];
},
closeDialog() {
- this.activeName = ''
+ this.activeName = "";
},
openDialog(e, type) {
- this.dialogType = type
+ this.dialogType = type;
if (e) {
- this.code = e.code
- this.open = true
- this.activeName = 'second'
- this.title = type === 'line' ? '鍘嗗彶鏇茬嚎鏌ヨ' : '鍘嗗彶鏁版嵁'
+ this.code = e.code;
+ this.open = true;
+ this.activeName = "second";
+ this.title = type === "line" ? "鍘嗗彶鏇茬嚎鏌ヨ" : "鍘嗗彶鏁版嵁";
}
},
cancelDialog() {
- this.open = false
+ this.open = false;
},
// 鍗曚綅瀛楀吀缈昏瘧
unitFormat(row, column) {
- return this.selectDictLabel(this.unitOptions, row.indexUnit)
+ return this.selectDictLabel(this.unitOptions, row.indexUnit);
}
-
}
-}
-
+};
</script>
<style scoped lang="scss">
.tableStyle .el-table__header-wrapper .el-checkbox {
- display: none
+ display: none;
}
.trendLineChart-right {
diff --git a/energy_management_ui/src/views/basicsetting/device/index.vue b/energy_management_ui/src/views/basicsetting/device/index.vue
index 7818eee..ec93763 100644
--- a/energy_management_ui/src/views/basicsetting/device/index.vue
+++ b/energy_management_ui/src/views/basicsetting/device/index.vue
@@ -1,58 +1,81 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'280px'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 璁惧鍚仠绠＄悊
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-containercard title="璁惧鍚仠绠＄悊" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-containercard>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container class="search-wrapper" :style="bodyStyleRight">
<deviceTabSetting ref="deviceTabSetting"></deviceTabSetting>
- </el-main>
- </el-container>
- </el-container>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
import deviceTabSetting from "./deviceTabSetting";
import ModelNode from "../../basicsetting/modelNode/modelNode";
+import ShrinkCol from "@/components/shrink/index.vue";
+import mixins from "@/layout/mixin/getHeight";
export default {
- components: {deviceTabSetting, ModelNode},
+ components: { deviceTabSetting, ModelNode, ShrinkCol },
+ mixins: [mixins],
created() {
- this.modelCode=this.$route.query.modelCode;
+ this.modelCode = this.$route.query.modelCode;
},
data() {
return {
- modelData: '',
+ bodyStyleRight: {},
+ modelData: "",
modelInfoOptions: [],
- modelCode:undefined,
- isCollapse: false,
- }
+ modelCode: undefined,
+ isCollapse: false
+ };
},
methods: {
- changeNode: function (node) {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 105 + "px"
+ };
+ },
+ changeNode: function(node) {
this.$refs.deviceTabSetting.modelNodeChange(node);
},
- manageModel: function () {
- this.$router.push('/model');
+ manageModel: function() {
+ this.$router.push("/model");
},
- changeModel: function (item) {
+ changeModel: function(item) {
this.$refs.modelNode.getList(item);
},
// 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
}
};
diff --git a/energy_management_ui/src/views/basicsetting/energyIndex/energyIndex.vue b/energy_management_ui/src/views/basicsetting/energyIndex/energyIndex.vue
index a4f07e6..fe5ab27 100644
--- a/energy_management_ui/src/views/basicsetting/energyIndex/energyIndex.vue
+++ b/energy_management_ui/src/views/basicsetting/energyIndex/energyIndex.vue
@@ -1,18 +1,27 @@
<template>
- <div class="app-container" style="padding:0">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="0"
- class="query-form">
+ <div class="app-container" style="padding:0 0 30px 0">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="0"
+ class="query-form"
+ >
<el-row :gutter="24">
<el-col :span="5">
<el-form-item>
- <el-select v-model="queryParams.indexCategory" placeholder="璇烽�夋嫨鎸囨爣鍒嗙被" clearable
- size="small"
- @change="handleQuery">
+ <el-select
+ v-model="queryParams.indexCategory"
+ placeholder="璇烽�夋嫨鎸囨爣鍒嗙被"
+ clearable
+ size="small"
+ @change="handleQuery"
+ >
<el-option
- v-for="dict in indexCategoryOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in indexCategoryOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
/>
</el-select>
</el-form-item>
@@ -20,54 +29,56 @@
<el-col :span="5">
<el-form-item>
<el-input
- v-model="queryParams.name"
- placeholder="璇疯緭鍏ユ寚鏍囧悕绉�/缂栫爜"
- clearable
- size="small"
- @input="handleQuery"
- @clear="handleQuery"
+ v-model="queryParams.name"
+ placeholder="璇疯緭鍏ユ寚鏍囧悕绉�/缂栫爜"
+ clearable
+ size="small"
+ @input="handleQuery"
+ @clear="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item class="fr">
<el-button
- type="primary"
- icon="el-icon-plus"
- size="mini"
- @click="handleAdd"
- v-hasPermi="['energyindex:energyindex:add']"
- >鏂板
+ type="primary"
+ icon="el-icon-plus"
+ size="mini"
+ @click="handleAdd"
+ v-hasPermi="['energyindex:energyindex:add']"
+ >鏂板
</el-button>
<el-button
- type="success"
- icon="el-icon-edit"
- size="mini"
- :disabled="single"
- @click="handleUpdate"
- v-hasPermi="['energyindex:energyindex:edit']"
- >淇敼
+ type="success"
+ icon="el-icon-edit"
+ size="mini"
+ :disabled="single"
+ @click="handleUpdate"
+ v-hasPermi="['energyindex:energyindex:edit']"
+ >淇敼
</el-button>
<el-button
- type="danger"
- icon="el-icon-delete"
- size="mini"
- :disabled="multiple"
- @click="handleDelete"
- v-hasPermi="['energyindex:energyindex:remove']"
- >鍒犻櫎
+ type="danger"
+ icon="el-icon-delete"
+ size="mini"
+ :disabled="multiple"
+ @click="handleDelete"
+ v-hasPermi="['energyindex:energyindex:remove']"
+ >鍒犻櫎
</el-button>
<el-button
- type="info"
- icon="el-icon-upload2"
- size="mini"
- @click="handleImport"
- >瀵煎叆
+ type="info"
+ icon="el-icon-upload2"
+ size="mini"
+ @click="handleImport"
+ >瀵煎叆
</el-button>
- <el-button type="text"
- icon="el-icon-setting"
- @click="collectIndexSetting"
- v-if="!statisticIndex">
+ <el-button
+ type="text"
+ icon="el-icon-setting"
+ @click="collectIndexSetting"
+ v-if="!statisticIndex"
+ >
閰嶇疆閲囬泦鐐�
</el-button>
</el-form-item>
@@ -75,102 +86,133 @@
</el-row>
</el-form>
- <el-table v-loading="loading" :data="energyindexList" border
- @selection-change="handleSelectionChange">
- <el-table-column type="selection" width="55" align="center"/>
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code"/>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name"/>
- <el-table-column label="绯荤粺鎸囨爣鍒嗙被" align="center" prop="indexCategory"
- :formatter="indexCategoryFormat"/>
- <el-table-column label="鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat"/>
- <el-table-column label="鎿嶄綔" width="200" align="center" class-name="small-padding fixed-width">
+ <el-table
+ v-loading="loading"
+ :data="energyindexList"
+ border
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
+ <el-table-column
+ label="绯荤粺鎸囨爣鍒嗙被"
+ align="center"
+ prop="indexCategory"
+ :formatter="indexCategoryFormat"
+ />
+ <el-table-column
+ label="鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <el-table-column
+ label="鎿嶄綔"
+ width="200"
+ align="center"
+ class-name="small-padding fixed-width"
+ >
<template slot-scope="scope">
<el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="handleUpdate(scope.row)"
- v-hasPermi="['energyindex:energyindex:edit']"
- >淇敼
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="handleUpdate(scope.row)"
+ v-hasPermi="['energyindex:energyindex:edit']"
+ >淇敼
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="dataStorage(scope.row)"
- v-hasPermi="['energyindex:energyindex:edit']"
- v-if="statisticIndex"
- >瀛樺偍
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="dataStorage(scope.row)"
+ v-hasPermi="['energyindex:energyindex:edit']"
+ v-if="statisticIndex"
+ >瀛樺偍
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-delete"
- @click="handleDelete(scope.row)"
- v-hasPermi="['energyindex:energyindex:remove']"
- >鍒犻櫎
+ size="mini"
+ type="text"
+ icon="el-icon-delete"
+ @click="handleDelete(scope.row)"
+ v-hasPermi="['energyindex:energyindex:remove']"
+ >鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
- v-show="total>0"
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="paginationQuery"
+ v-show="total > 0"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="paginationQuery"
/>
<!-- 娣诲姞鎴栦慨鏀规寚鏍囦俊鎭璇濇 -->
- <el-dialog :title="title" :visible.sync="open" width="500px" :close-on-click-modal="false">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="500px"
+ :close-on-click-modal="false"
+ >
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="鎸囨爣鍚嶇О" prop="name">
- <el-input v-model="form.name" placeholder="璇疯緭鍏ユ寚鏍囧悕绉�"/>
+ <el-input v-model="form.name" placeholder="璇疯緭鍏ユ寚鏍囧悕绉�" />
</el-form-item>
<el-form-item label="鎸囨爣缂栫爜" prop="code">
- <el-input v-model="form.code" placeholder="璇疯緭鍏ユ寚鏍囩紪鐮�"/>
+ <el-input v-model="form.code" placeholder="璇疯緭鍏ユ寚鏍囩紪鐮�" />
</el-form-item>
<el-form-item label="鎸囨爣鍒嗙被">
- <el-select v-model="form.indexCategory" placeholder="璇烽�夋嫨鎸囨爣鍒嗙被" prop="indexCategory">
+ <el-select
+ v-model="form.indexCategory"
+ placeholder="璇烽�夋嫨鎸囨爣鍒嗙被"
+ prop="indexCategory"
+ >
<el-option
- v-for="dict in indexCategoryOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in indexCategoryOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="鍗曚綅">
<el-select v-model="form.unitId" placeholder="璇烽�夋嫨鍗曚綅">
<el-option
- v-for="dict in unitIdOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in unitIdOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="椤哄簭鍙�">
- <el-input-number v-model="form.orderNum" controls-position="right" :min="0"/>
+ <el-input-number
+ v-model="form.orderNum"
+ controls-position="right"
+ :min="0"
+ />
</el-form-item>
<el-form-item label="璁惧">
<el-select v-model="form.equipment" placeholder="璇烽�夋嫨璁惧">
<el-option
- v-for="dict in fcilityArchives"
- :key="dict.id"
- :label="dict.facilityName"
- :value="dict.id"
+ v-for="dict in fcilityArchives"
+ :key="dict.id"
+ :label="dict.facilityName"
+ :value="dict.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="鑳芥簮鍝佺">
<el-select v-model="form.energyId" placeholder="璇烽�夋嫨鑳芥簮鍝佺">
<el-option
- v-for="dict in energyIdList"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in energyIdList"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
@@ -181,35 +223,51 @@
</div>
</el-dialog>
- <el-drawer title="閰嶇疆鎸囨爣瀛樺偍" :visible.sync="indexStorageShow" direction="rtl"
- @open="showIndexStorageDialog"
- size="45%"
- :wrapperClosable="false">
- <IndexStorage ref="indexStorage"
- :nodeId="currentNode===undefined?'':currentNode.id"></IndexStorage>
+ <el-drawer
+ title="閰嶇疆鎸囨爣瀛樺偍"
+ :visible.sync="indexStorageShow"
+ direction="rtl"
+ @open="showIndexStorageDialog"
+ size="45%"
+ :wrapperClosable="false"
+ >
+ <IndexStorage
+ ref="indexStorage"
+ :nodeId="currentNode === undefined ? '' : currentNode.id"
+ ></IndexStorage>
</el-drawer>
<!--閫夋嫨閲囬泦鎸囨爣-->
- <el-drawer title="閫夋嫨閲囬泦鎸囨爣" :visible.sync="collectIndexDialog" direction="rtl"
- @open="showCollectIndexDialog"
- size="45%">
- <CollectIndexSetting ref="collectIndexSetting"
- @collectIndexConfirmSelect="collectIndexConfirmSelect"></CollectIndexSetting>
+ <el-drawer
+ title="閫夋嫨閲囬泦鎸囨爣"
+ :visible.sync="collectIndexDialog"
+ direction="rtl"
+ @open="showCollectIndexDialog"
+ size="45%"
+ >
+ <CollectIndexSetting
+ ref="collectIndexSetting"
+ @collectIndexConfirmSelect="collectIndexConfirmSelect"
+ ></CollectIndexSetting>
</el-drawer>
<!-- 瀵煎叆瀵硅瘽妗� -->
- <el-dialog :title="upload.title" :visible.sync="upload.open" :destroy-on-close="true"
- width="400px">
+ <el-dialog
+ :title="upload.title"
+ :visible.sync="upload.open"
+ :destroy-on-close="true"
+ width="400px"
+ >
<el-upload
- ref="upload"
- :limit="1"
- accept=".xlsx, .xls"
- :headers="upload.headers"
- :action="upload.url + '?updateSupport=' + upload.updateSupport"
- :disabled="upload.isUploading"
- :on-progress="handleFileUploadProgress"
- :on-success="handleFileSuccess"
- :auto-upload="false"
- drag
+ ref="upload"
+ :limit="1"
+ accept=".xlsx, .xls"
+ :headers="upload.headers"
+ :action="upload.url + '?updateSupport=' + upload.updateSupport"
+ :disabled="upload.isUploading"
+ :on-progress="handleFileUploadProgress"
+ :on-success="handleFileSuccess"
+ :auto-upload="false"
+ drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
@@ -217,11 +275,15 @@
<em>鐐瑰嚮涓婁紶</em>
</div>
<div class="el-upload__tip" slot="tip">
- <el-checkbox v-model="upload.updateSupport"/>
+ <el-checkbox v-model="upload.updateSupport" />
鏄惁鏇存柊宸茬粡瀛樺湪鐨勭敤鎴锋暟鎹�
- <el-link type="info" style="font-size:12px" @click="importTemplate">涓嬭浇妯℃澘</el-link>
+ <el-link type="info" style="font-size:12px" @click="importTemplate"
+ >涓嬭浇妯℃澘</el-link
+ >
</div>
- <div class="el-upload__tip" style="color:red" slot="tip">鎻愮ず锛氫粎鍏佽瀵煎叆鈥渪ls鈥濇垨鈥渪lsx鈥濇牸寮忔枃浠讹紒</div>
+ <div class="el-upload__tip" style="color:red" slot="tip">
+ 鎻愮ず锛氫粎鍏佽瀵煎叆鈥渪ls鈥濇垨鈥渪lsx鈥濇牸寮忔枃浠讹紒
+ </div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">纭� 瀹�</el-button>
@@ -241,15 +303,15 @@
listEnergyindex,
updateEnergyindex
} from "../../../api/basicsetting/energyindex";
-import {getToken} from "@/utils/auth";
-import {setNodeToIndex} from '@/api/basicsetting/modelNode'
+import { getToken } from "@/utils/auth";
+import { setNodeToIndex } from "@/api/basicsetting/modelNode";
import IndexStorage from "./indexStorage";
import CollectIndexSetting from "../nodeSetting/collectIndexSetting";
-import {getPointFacility} from "@/api/comprehensiveStatistics/comprehensive";
+import { getPointFacility } from "@/api/comprehensiveStatistics/comprehensive";
export default {
- name: 'EnergyIndex',
- components: {CollectIndexSetting, IndexStorage},
+ name: "EnergyIndex",
+ components: { CollectIndexSetting, IndexStorage },
props: ["indexType"],
data() {
return {
@@ -282,7 +344,7 @@
remarkOptions: [],
// 鍗曚綅瀛楀吀
unitIdOptions: [],
- energyIdList: [],//鑳芥簮鍝佺
+ energyIdList: [], //鑳芥簮鍝佺
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
@@ -297,14 +359,24 @@
// 琛ㄥ崟鏍￠獙
rules: {
name: [
- {required: true, message: "鎸囨爣鍚嶇О涓嶈兘涓虹┖", trigger: "blur"},
- {min: 2, max: 20, message: '闀垮害鍦� 2 鍒� 20 涓瓧绗�', trigger: 'blur'}
- ], code: [
- {required: true, message: "鎸囨爣缂栫爜涓嶈兘涓虹┖", trigger: "blur"},
- {min: 2, max: 20, message: '闀垮害鍦� 2 鍒� 30 涓瓧绗�', trigger: 'blur'},
- {pattern: /^[a-zA-Z][A-Za-z0-9#_-]+$/, message: '蹇呴』涓烘暟瀛椼�佸瓧姣嶃��#銆�- 鎴朹 锛屼笖棣栧瓧绗﹀彧鑳戒负瀛楁瘝'}
- ], indexCategory: [
- {required: true, message: "璇烽�夋嫨鎸囨爣鍒嗙被", trigger: "blur"}
+ { required: true, message: "鎸囨爣鍚嶇О涓嶈兘涓虹┖", trigger: "blur" },
+ { min: 2, max: 20, message: "闀垮害鍦� 2 鍒� 20 涓瓧绗�", trigger: "blur" }
+ ],
+ code: [
+ { required: true, message: "鎸囨爣缂栫爜涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 20,
+ message: "闀垮害鍦� 2 鍒� 30 涓瓧绗�",
+ trigger: "blur"
+ },
+ {
+ pattern: /^[a-zA-Z][A-Za-z0-9#_-]+$/,
+ message: "蹇呴』涓烘暟瀛椼�佸瓧姣嶃��#銆�- 鎴朹 锛屼笖棣栧瓧绗﹀彧鑳戒负瀛楁瘝"
+ }
+ ],
+ indexCategory: [
+ { required: true, message: "璇烽�夋嫨鎸囨爣鍒嗙被", trigger: "blur" }
]
},
currentNode: undefined,
@@ -322,22 +394,25 @@
// 鏄惁鏇存柊宸茬粡瀛樺湪鐨勭敤鎴锋暟鎹�
updateSupport: 0,
// 璁剧疆涓婁紶鐨勮姹傚ご閮�
- headers: {Authorization: "Bearer " + getToken()},
+ headers: { Authorization: "Bearer " + getToken() },
// 涓婁紶鐨勫湴鍧�
- url: process.env.VUE_APP_BASE_API + "/basicsetting/energyindex/importData"
- },
+ url:
+ process.env.VUE_APP_BASE_API + "/basicsetting/energyindex/importData"
+ }
};
},
created() {
this.getDicts("sys_index_category").then(response => {
this.indexCategoryOptions = response.data;
- this.indexCategoryDefaultVal = this.indexCategoryOptions.find(f => f.isDefault === 'Y');
+ this.indexCategoryDefaultVal = this.indexCategoryOptions.find(
+ f => f.isDefault === "Y"
+ );
});
this.getDicts("sys_unit").then(response => {
this.unitIdOptions = response.data;
- this.unitDefaultVal = this.unitIdOptions.find(f => f.isDefault === 'Y');
+ this.unitDefaultVal = this.unitIdOptions.find(f => f.isDefault === "Y");
});
- this.statisticIndex = this.$props.indexType === 'STATISTIC';
+ this.statisticIndex = this.$props.indexType === "STATISTIC";
this.getDicts("energy_type").then(response => {
this.energyIdList = response.data;
});
@@ -399,7 +474,7 @@
this.ids = selection.map(item => item.indexId);
this.names = selection.map(item => item.name);
this.single = selection.length !== 1;
- this.multiple = !selection.length
+ this.multiple = !selection.length;
},
getFacilityArchivesList() {
getPointFacility().then(response => {
@@ -433,7 +508,7 @@
});
},
/** 鎻愪氦鎸夐挳 */
- submitForm: function () {
+ submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.indexId !== undefined) {
@@ -465,62 +540,71 @@
handleDelete(row) {
const indexIds = row.indexId || this.ids;
const indexNames = row.name || this.names;
- this.$confirm('鏄惁纭鍒犻櫎鎸囨爣鍚嶄负"' + indexNames + '"鐨勬暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(() => {
- return delEnergyindex(this.currentNode.id, indexIds);
- }).then(() => {
- this.getList(this.currentNode);
- this.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(function () {
- });
+ this.$confirm(
+ '鏄惁纭鍒犻櫎鎸囨爣鍚嶄负"' + indexNames + '"鐨勬暟鎹」?',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(() => {
+ return delEnergyindex(this.currentNode.id, indexIds);
+ })
+ .then(() => {
+ this.getList(this.currentNode);
+ this.msgSuccess("鍒犻櫎鎴愬姛");
+ })
+ .catch(function() {});
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋寚鏍囦俊鎭暟鎹」?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋寚鏍囦俊鎭暟鎹」?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportEnergyindex(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
+ })
+ .then(function() {
+ return exportEnergyindex(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
dataStorage(row) {
this.indexStorageShow = true;
this.$nextTick(() => {
this.$refs.indexStorage.getIndexStorage(row.indexId);
- })
+ });
},
- showIndexStorageDialog() {
- },
+ showIndexStorageDialog() {},
collectIndexSetting() {
this.collectIndexDialog = true;
},
showCollectIndexDialog() {
this.$nextTick(() => {
this.$refs.collectIndexSetting.init(this.currentNode);
- })
+ });
},
collectIndexConfirmSelect(selectedIndex) {
let indexIds = selectedIndex.map(item => item.indexId);
- setNodeToIndex(this.currentNode.id, indexIds, "COLLECT").then((response) => {
- if (response.code !== 200) {
- this.$message.error(response.msg);
- }
- }).then(() => {
- this.getList(this.currentNode);
- });
+ setNodeToIndex(this.currentNode.id, indexIds, "COLLECT")
+ .then(response => {
+ if (response.code !== 200) {
+ this.$message.error(response.msg);
+ }
+ })
+ .then(() => {
+ this.getList(this.currentNode);
+ });
},
handleImport() {
this.upload.title = "鎸囨爣瀵煎叆";
this.upload.open = true;
- },// 鏂囦欢涓婁紶涓鐞�
+ }, // 鏂囦欢涓婁紶涓鐞�
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
@@ -529,7 +613,7 @@
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
- this.$alert(response.msg, "瀵煎叆缁撴灉", {dangerouslyUseHTMLString: true});
+ this.$alert(response.msg, "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true });
this.getList(this.currentNode);
},
/** 涓嬭浇妯℃澘鎿嶄綔 */
diff --git a/energy_management_ui/src/views/basicsetting/energyIndex/index.vue b/energy_management_ui/src/views/basicsetting/energyIndex/index.vue
index 6d1741f..b5bcebb 100644
--- a/energy_management_ui/src/views/basicsetting/energyIndex/index.vue
+++ b/energy_management_ui/src/views/basicsetting/energyIndex/index.vue
@@ -1,67 +1,82 @@
<template>
<el-row type="flex">
- <el-col :style="{width:isCollapse?'0': '280px',position:'relative'}" v-show="!isCollapse">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
<basic-container title="鎸囨爣搴撶鐞�" :bodyStyle="bodyStyle">
- <ModelNode ref="modelNode" @changeNode="changeNode"
- modelCode="statistic_index_model"
- :showOpt="true"
- :auth="false"/>
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ modelCode="statistic_index_model"
+ :showOpt="true"
+ :auth="false"
+ />
</basic-container>
- <img src="~@/assets/image/rectangle.png" alt=""
- class="shrink-col-block"
- @click="toggleCollapse">
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
</el-col>
- <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse"/>
- <el-col :style="{width:isCollapse? 'calc(100% - 48px)':'calc(100% - 280px)',paddingLeft:isCollapse? 0:'14px'}">
- <basic-container :title="currentNode ? currentNode.label+'--鑺傜偣閰嶇疆' : '鑺傜偣閰嶇疆'" :bodyStyle="bodyStyleRight">
- <IndexNodeSetting ref="modelNodeSetting"/>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container
+ :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鑺傜偣閰嶇疆'"
+ :bodyStyle="bodyStyleRight"
+ >
+ <IndexNodeSetting ref="modelNodeSetting" />
</basic-container>
</el-col>
</el-row>
-
</template>
<script>
import ModelNode from "../modelNode/modelNode";
import IndexNodeSetting from "./indexNodeSetting";
import mixins from "@/layout/mixin/getHeight";
-import ShrinkCol from '@/components/shrink/index.vue'
+import ShrinkCol from "@/components/shrink/index.vue";
export default {
- components: {IndexNodeSetting, ModelNode,ShrinkCol},
+ components: { IndexNodeSetting, ModelNode, ShrinkCol },
mixins: [mixins],
- created() {
- },
+ created() {},
data() {
return {
- modelData: '',
+ modelData: "",
isCollapse: false,
bodyStyleRight: {},
- currentNode: ''
- }
+ currentNode: ""
+ };
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + 'px';
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 155 + 'px'
+ height: window.innerHeight - 185 + "px"
};
},
- changeNode: function (node) {
+ changeNode: function(node) {
if (node) {
- this.currentNode = node
+ this.currentNode = node;
}
this.$refs.modelNodeSetting.modelNodeChange(node);
},
- manageModel: function () {
- this.$router.push('/model');
+ manageModel: function() {
+ this.$router.push("/model");
},
- changeModel: function (item) {
+ changeModel: function(item) {
this.$refs.modelNode.getList(item);
},
// 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
toggleCollapse() {
- this.isCollapse = !this.isCollapse
+ this.isCollapse = !this.isCollapse;
}
}
};
diff --git a/energy_management_ui/src/views/basicsetting/limitType/index.vue b/energy_management_ui/src/views/basicsetting/limitType/index.vue
index 2f48152..e57cb7d 100644
--- a/energy_management_ui/src/views/basicsetting/limitType/index.vue
+++ b/energy_management_ui/src/views/basicsetting/limitType/index.vue
@@ -1,23 +1,36 @@
<template>
<div>
<basic-container>
- <el-form :model="queryParams" ref="queryForm" label-width="120px" class="special-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ label-width="120px"
+ class="special-form"
+ >
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="闄愬�肩被鍨嬪悕绉�" prop="limitName">
<el-input
- v-model="queryParams.limitName"
- placeholder="璇疯緭鍏ラ檺鍊肩被鍨嬪悕绉�"
- clearable
- size="small"
- @keyup.enter.native="handleQuery"
+ v-model="queryParams.limitName"
+ placeholder="璇疯緭鍏ラ檺鍊肩被鍨嬪悕绉�"
+ clearable
+ size="small"
+ @keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="18">
<el-form-item class="operation">
- <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-col>
</el-row>
@@ -27,34 +40,34 @@
<el-row :gutter="10" class="mb8" style="margin-bottom: 19px">
<el-col :span="1.5">
<el-button
- type="primary"
- icon="el-icon-plus"
- size="mini"
- @click="handleAdd"
- v-hasPermi="['basicsetting:limitType:add']"
- >鏂板
+ type="primary"
+ icon="el-icon-plus"
+ size="mini"
+ @click="handleAdd"
+ v-hasPermi="['basicsetting:limitType:add']"
+ >鏂板
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
- type="success"
- icon="el-icon-edit"
- size="mini"
- :disabled="single"
- @click="handleUpdate"
- v-hasPermi="['basicsetting:limitType:edit']"
- >淇敼
+ type="success"
+ icon="el-icon-edit"
+ size="mini"
+ :disabled="single"
+ @click="handleUpdate"
+ v-hasPermi="['basicsetting:limitType:edit']"
+ >淇敼
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
- type="danger"
- icon="el-icon-delete"
- size="mini"
- :disabled="multiple"
- @click="handleDelete"
- v-hasPermi="['basicsetting:limitType:remove']"
- >鍒犻櫎
+ type="danger"
+ icon="el-icon-delete"
+ size="mini"
+ :disabled="multiple"
+ @click="handleDelete"
+ v-hasPermi="['basicsetting:limitType:remove']"
+ >鍒犻櫎
</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
@@ -67,78 +80,107 @@
<!-- >瀵煎嚭</el-button>-->
<!-- </el-col>-->
</el-row>
- <el-table :height="height" v-loading="loading" :data="limitTypeList" @selection-change="handleSelectionChange">
- <el-table-column type="selection" width="55" align="center"/>
- <el-table-column label="闄愬�肩被鍨嬪悕绉�" align="center" prop="limitName"/>
- <el-table-column label="闄愬�肩被鍨嬬紪鍙�" align="center" prop="limitCode"/>
- <el-table-column label="鎶ヨ闄愬埗绫诲瀷" align="center" prop="alarmType" :formatter="typeFormat"/>
+ <el-table
+ v-loading="loading"
+ :data="limitTypeList"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column label="闄愬�肩被鍨嬪悕绉�" align="center" prop="limitName" />
+ <el-table-column label="闄愬�肩被鍨嬬紪鍙�" align="center" prop="limitCode" />
+ <el-table-column
+ label="鎶ヨ闄愬埗绫诲瀷"
+ align="center"
+ prop="alarmType"
+ :formatter="typeFormat"
+ />
<el-table-column label="鑹插彿" align="center" prop="colorNumber">
<template slot-scope="scope">
<el-tag :color="scope.row.colorNumber" disable-transitions></el-tag>
</template>
</el-table-column>
- <el-table-column label="姣旇緝杩愮畻绗�" align="center" prop="comparatorOperator"/>
- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
+ <el-table-column
+ label="姣旇緝杩愮畻绗�"
+ align="center"
+ prop="comparatorOperator"
+ />
+ <el-table-column
+ label="鎿嶄綔"
+ align="center"
+ class-name="small-padding fixed-width"
+ >
<template slot-scope="scope">
<el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="handleUpdate(scope.row)"
- v-hasPermi="['basicsetting:limitType:edit']"
- >淇敼
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="handleUpdate(scope.row)"
+ v-hasPermi="['basicsetting:limitType:edit']"
+ >淇敼
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-delete"
- @click="handleDelete(scope.row)"
- v-hasPermi="['basicsetting:limitType:remove']"
- >鍒犻櫎
+ size="mini"
+ type="text"
+ icon="el-icon-delete"
+ @click="handleDelete(scope.row)"
+ v-hasPermi="['basicsetting:limitType:remove']"
+ >鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getList"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
/>
</basic-container>
<!-- 娣诲姞鎴栦慨鏀规姤璀﹂檺鍊肩被鍨嬬淮鎶ゅ璇濇 -->
<el-dialog :title="title" :visible.sync="open" width="500px">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="闄愬�肩被鍨嬪悕绉�" prop="limitName">
- <el-input v-model="form.limitName" placeholder="璇疯緭鍏ラ檺鍊肩被鍨嬪悕绉�"/>
+ <el-input v-model="form.limitName" placeholder="璇疯緭鍏ラ檺鍊肩被鍨嬪悕绉�" />
</el-form-item>
<el-form-item label="闄愬�肩被鍨嬬紪鍙�" prop="limitCode">
- <el-input v-model="form.limitCode" placeholder="璇疯緭鍏ラ檺鍊肩被鍨嬬紪鐮�"/>
+ <el-input v-model="form.limitCode" placeholder="璇疯緭鍏ラ檺鍊肩被鍨嬬紪鐮�" />
</el-form-item>
<el-form-item label="鎶ヨ闄愬埗绫诲瀷" prop="alarmType">
- <el-select v-model="form.alarmType" placeholder="璇烽�夋嫨鎶ヨ闄愬埗绫诲瀷" clearable size="small">
+ <el-select
+ v-model="form.alarmType"
+ placeholder="璇烽�夋嫨鎶ヨ闄愬埗绫诲瀷"
+ clearable
+ size="small"
+ >
<el-option
- v-for="item in alarmTypeList"
- :key="item.dictValue"
- :label="item.dictLabel"
- :value="item.dictValue">
+ v-for="item in alarmTypeList"
+ :key="item.dictValue"
+ :label="item.dictLabel"
+ :value="item.dictValue"
+ >
</el-option>
</el-select>
</el-form-item>
<el-form-item label="鑹插彿" prop="colorNumber">
<el-color-picker
- v-model="form.colorNumber"
- color-format="hex"
- :predefine="predefineColors">
+ v-model="form.colorNumber"
+ color-format="hex"
+ :predefine="predefineColors"
+ >
</el-color-picker>
</el-form-item>
<el-form-item label="姣旇緝杩愮畻绗�" prop="comparatorOperator">
- <el-select v-model="form.comparatorOperator" placeholder="姣旇緝杩愮畻绗�" clearable size="small">
- <el-option label="澶т簬" value=">"/>
- <el-option label="澶т簬绛変簬" value=">="/>
- <el-option label="灏忎簬" value="<"/>
- <el-option label="灏忎簬绛変簬" value="<="/>
- <el-option label="绛変簬" value="="/>
+ <el-select
+ v-model="form.comparatorOperator"
+ placeholder="姣旇緝杩愮畻绗�"
+ clearable
+ size="small"
+ >
+ <el-option label="澶т簬" value=">" />
+ <el-option label="澶т簬绛変簬" value=">=" />
+ <el-option label="灏忎簬" value="<" />
+ <el-option label="灏忎簬绛変簬" value="<=" />
+ <el-option label="绛変簬" value="=" />
</el-select>
</el-form-item>
</el-form>
@@ -165,7 +207,7 @@
mixins: [mixins],
data() {
return {
- height:null,
+ height: null,
// 閬僵灞�
loading: true,
// 閫変腑鏁扮粍
@@ -189,45 +231,47 @@
queryParams: {
pageNum: 1,
pageSize: 10,
- limitName: undefined,
+ limitName: undefined
},
// 琛ㄥ崟鍙傛暟
form: {},
// 琛ㄥ崟鏍￠獙
rules: {
limitName: [
- {required: true, message: "闄愬�肩被鍨嬪悕绉颁笉鑳戒负绌�", trigger: "blur"}
+ { required: true, message: "闄愬�肩被鍨嬪悕绉颁笉鑳戒负绌�", trigger: "blur" }
],
limitCode: [
- {required: true, message: "闄愬�肩被鍨嬬紪鐮佷笉鑳戒负绌�", trigger: "blur"}
- ],
+ { required: true, message: "闄愬�肩被鍨嬬紪鐮佷笉鑳戒负绌�", trigger: "blur" }
+ ]
},
//鑹插彿閫夋嫨鍣�
predefineColors: [
- '#ff4500',
- '#ff8c00',
- '#ffd700',
- '#90ee90',
- '#00ced1',
- '#1e90ff',
- '#c71585'
+ "#ff4500",
+ "#ff8c00",
+ "#ffd700",
+ "#90ee90",
+ "#00ced1",
+ "#1e90ff",
+ "#c71585"
]
};
},
created() {
this.getDicts("alarm_type").then(response => {
this.alarmTypeList = response.data;
- this.alarmTypeDefaultVal = this.alarmTypeList.find(f => f.isDefault === 'Y');
+ this.alarmTypeDefaultVal = this.alarmTypeList.find(
+ f => f.isDefault === "Y"
+ );
});
this.getList();
},
methods: {
setCharts() {
this.bodyStyle = {
- height: window.innerHeight - 210 + 'px',
- overflow: 'hidden'
- }
- this.height = window.innerHeight - 370;
+ height: window.innerHeight - 220 + "px",
+ overflow: "hidden"
+ };
+ // this.height = window.innerHeight - 370;
},
/** 鏌ヨ鎶ヨ闄愬�肩被鍨嬬淮鎶ゅ垪琛� */
getList() {
@@ -279,10 +323,10 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.limitName = selection.map(item => item.limitName)
- this.single = selection.length != 1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.limitName = selection.map(item => item.limitName);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
console.log(JSON.stringify(selection));
},
/** 鏂板鎸夐挳鎿嶄綔 */
@@ -296,7 +340,7 @@
/** 淇敼鎸夐挳鎿嶄綔 */
handleUpdate(row) {
this.reset();
- const id = row.id || this.ids
+ const id = row.id || this.ids;
getLimitType(id).then(response => {
this.form = response.data;
this.open = true;
@@ -304,7 +348,7 @@
});
},
/** 鎻愪氦鎸夐挳 */
- submitForm: function () {
+ submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
// console.log(JSON.stringify(this.form))
@@ -335,37 +379,45 @@
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
const ids = row.id || this.ids;
- this.$confirm('鏄惁纭鍒犻櫎鎶ヨ闄愬�肩被鍨嬬淮鎶ゅ悕绉颁负"' + ids + '"鐨勬暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
- return delLimitType(ids);
- }).then(() => {
- this.getList();
- this.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(function () {
- });
+ this.$confirm(
+ '鏄惁纭鍒犻櫎鎶ヨ闄愬�肩被鍨嬬淮鎶ゅ悕绉颁负"' + ids + '"鐨勬暟鎹」?',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
+ return delLimitType(ids);
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鍒犻櫎鎴愬姛");
+ })
+ .catch(function() {});
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤璀﹂檺鍊肩被鍨嬬淮鎶ゆ暟鎹」?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤璀﹂檺鍊肩被鍨嬬淮鎶ゆ暟鎹」?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportLimitType(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
+ })
+ .then(function() {
+ return exportLimitType(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
initAlarmType() {
for (let i = 0; i < this.model.energyindexList.length; i++) {
let ndy = "";
getAlarmType(this.model.energyindexList[i].indexId).then(response => {
- if (response.code == '200') {
+ if (response.code == "200") {
if (response.msg == "1") {
this.model.energyindexList[i].indexCategory = "鍚姩";
} else if (response.msg == "2") {
@@ -378,7 +430,7 @@
}
});
}
- },
+ }
}
};
</script>
diff --git a/energy_management_ui/src/views/basicsetting/modelNode/index.vue b/energy_management_ui/src/views/basicsetting/modelNode/index.vue
index 3595d05..8ac5848 100644
--- a/energy_management_ui/src/views/basicsetting/modelNode/index.vue
+++ b/energy_management_ui/src/views/basicsetting/modelNode/index.vue
@@ -1,51 +1,77 @@
<template>
<el-row type="flex">
- <el-col :style="{width:isCollapse?'0': '280px',position:'relative'}" v-show="!isCollapse">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
<basic-container title="鏁版嵁妯″瀷绠＄悊" :bodyStyle="bodyStyle">
<el-row :gutter="24">
<el-col :span="20">
- <el-select v-model="modelData" placeholder="璇烽�夋嫨妯″瀷"
- size="small"
- filterable
- @change="changeModel">
+ <el-select
+ v-model="modelData"
+ placeholder="璇烽�夋嫨妯″瀷"
+ size="small"
+ filterable
+ @change="changeModel"
+ >
<el-option
- v-for="model in modelInfoOptions"
- :key="model.modelCode"
- :label="model.modelName"
- :value="model.modelCode"
+ v-for="model in modelInfoOptions"
+ :key="model.modelCode"
+ :label="model.modelName"
+ :value="model.modelCode"
/>
</el-select>
</el-col>
<el-col :span="4" style="margin-bottom: 16px">
- <el-button icon="el-icon-setting" circle title="绠＄悊妯″瀷" style="float:right;padding:8px"
- @click="manageModel"></el-button>
+ <el-button
+ icon="el-icon-setting"
+ circle
+ title="绠＄悊妯″瀷"
+ style="float:right;padding:8px"
+ @click="manageModel"
+ ></el-button>
</el-col>
</el-row>
- <ModelNode ref="modelNode" @changeNode="changeNode" :auth="false"></ModelNode>
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :auth="false"
+ ></ModelNode>
</basic-container>
- <img src="~@/assets/image/rectangle.png" alt=""
- class="shrink-col-block"
- @click="toggleCollapse">
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
</el-col>
- <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse"/>
- <el-col :style="{width:isCollapse? 'calc(100% - 48px)':'calc(100% - 280px)',paddingLeft:isCollapse? 0:'14px'}">
- <basic-container :title="currentNode ? currentNode.label+'--鑺傜偣閰嶇疆' : '鑺傜偣閰嶇疆'" :bodyStyle="bodyStyleRight">
- <ModelNodeSetting ref="modelNodeSetting"/>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container
+ :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鑺傜偣閰嶇疆'"
+ :bodyStyle="bodyStyleRight"
+ >
+ <ModelNodeSetting ref="modelNodeSetting" />
</basic-container>
</el-col>
</el-row>
</template>
<script>
import ModelNode from "../modelNode/modelNode";
-import {listModel} from "@/api/basicsetting/model";
+import { listModel } from "@/api/basicsetting/model";
import ModelNodeSetting from "./modelNodeSetting";
import mixins from "@/layout/mixin/getHeight";
-import ShrinkCol from '@/components/shrink/index.vue'
+import ShrinkCol from "@/components/shrink/index.vue";
export default {
- components: {ModelNodeSetting, ModelNode,ShrinkCol},
+ components: { ModelNodeSetting, ModelNode, ShrinkCol },
created() {
- listModel({isShow: 1}).then(response => {
+ listModel({ isShow: 1 }).then(response => {
this.modelInfoOptions = response.data;
if (this.modelInfoOptions.length > 0) {
this.modelData = this.modelInfoOptions[0].modelCode;
@@ -56,45 +82,58 @@
mixins: [mixins],
data() {
return {
- modelData: '',
+ modelData: "",
modelInfoOptions: [],
isCollapse: false,
bodyStyleRight: {},
- currentNode: ''
- }
+ currentNode: ""
+ };
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight -155 + 'px'
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 155 + 'px'
+ height: window.innerHeight - 185 + "px"
};
},
- changeNode: function (node) {
+ changeNode: function(node) {
if (node) {
this.currentNode = node;
}
this.$refs.modelNodeSetting.modelNodeChange(node);
},
- manageModel: function () {
- this.$router.push('/model');
+ manageModel: function() {
+ this.$router.push("/model");
},
- changeModel: function (item) {
+ changeModel: function(item) {
this.$refs.modelNode.getList(item);
},
// 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
toggleCollapse() {
- this.isCollapse = !this.isCollapse
+ this.isCollapse = !this.isCollapse;
}
}
};
</script>
<style scoped lang="scss">
+@import "~@/assets/styles/variables.scss";
.shrink-col-block {
position: absolute;
top: 20px;
right: 16px;
cursor: pointer;
}
+::v-deep {
+ .el-tabs__item {
+ color: #fff;
+ }
+ .el-tabs__item.is-active {
+ color: $primary-color;
+ }
+ .el-collapse-item__header {
+ background-color: #061844;
+ color: #fff;
+ }
+}
</style>
diff --git a/energy_management_ui/src/views/basicsetting/modelNode/modelNode.vue b/energy_management_ui/src/views/basicsetting/modelNode/modelNode.vue
index ca08fc3..4331649 100644
--- a/energy_management_ui/src/views/basicsetting/modelNode/modelNode.vue
+++ b/energy_management_ui/src/views/basicsetting/modelNode/modelNode.vue
@@ -424,16 +424,12 @@
margin-top: 10px;
height: 35px;
}
- // .is-current {
- // .el-tree-node__content {
- // border: 1px solid red;
- // }
- // }
+
.el-tree--highlight-current
.el-tree-node.is-current
> .el-tree-node__content {
- background-color: #f7f7f7;
- border: 1px solid #38bcbf;
+ background-color: #213d7a;
+ border: 1px solid #3d5b9b;
}
}
</style>
diff --git a/energy_management_ui/src/views/benchmarking/phaseBenchmarking/LineChart.vue b/energy_management_ui/src/views/benchmarking/phaseBenchmarking/LineChart.vue
index 94a1168..b061d95 100644
--- a/energy_management_ui/src/views/benchmarking/phaseBenchmarking/LineChart.vue
+++ b/energy_management_ui/src/views/benchmarking/phaseBenchmarking/LineChart.vue
@@ -1,130 +1,142 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons')
- import resize from '../../dashboard/mixins/resize'
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
+import echarts from "echarts";
+require("echarts/theme/macarons");
+import resize from "../../dashboard/mixins/resize";
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- data() {
- return {
- chart: null,
- seriesData: [],
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData,actualData,expecteData} = {}) {
- this.chart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- title: {
- x: 'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- legend: {
- data:['鏍囨潌鍊�','瀹為檯鍊�'],
- left: '60%',
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, expecteData } = {}) {
+ this.chart.setOption({
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ title: {
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#333"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ legend: {
+ data: ["鏍囨潌鍊�", "瀹為檯鍊�"],
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisPointer: {
- type: 'shadow'
+ type: "shadow"
}
- }],
- yAxis: [{
+ }
+ ],
+ yAxis: [
+ {
//name: '缁煎悎鑳借��',
- type: 'value',
+ type: "value",
nameTextStyle: {
- color: "#333",
+ color: "#333"
},
axisLabel: {
- formatter: '{value}'
+ formatter: "{value}"
},
axisTick: {
show: false
- },
- }],
- series: [{
- name:"鏍囨潌鍊�",
- type: 'bar',
+ }
+ }
+ ],
+ series: [
+ {
+ name: "鏍囨潌鍊�",
+ type: "bar",
data: expectedData,
//stack: 'vistors',
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- },{
- name:"瀹為檯鍊�",
- type: 'bar',
+ animationEasing: "quadraticOut"
+ },
+ {
+ name: "瀹為檯鍊�",
+ type: "bar",
data: expecteData,
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
- }
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/benchmarking/phaseBenchmarking/phaseBenchmarking.vue b/energy_management_ui/src/views/benchmarking/phaseBenchmarking/phaseBenchmarking.vue
index 3aa1488..b2932a3 100644
--- a/energy_management_ui/src/views/benchmarking/phaseBenchmarking/phaseBenchmarking.vue
+++ b/energy_management_ui/src/views/benchmarking/phaseBenchmarking/phaseBenchmarking.vue
@@ -1,9 +1,20 @@
<template>
<div class="app-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 v-for="dict in dateTypeOptions" :key="dict.dictValue" :label="dict.dictValue" @change="handleTime(dict.dictValue)">{{dict.dictLabel}}</el-radio>
+ <el-radio
+ v-for="dict in dateTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictValue"
+ @change="handleTime(dict.dictValue)"
+ >{{ dict.dictLabel }}</el-radio
+ >
</el-radio-group>
</el-form-item>
<el-form-item label="缁熻鍖洪棿">
@@ -13,26 +24,36 @@
:value-format="valueFormat"
range-separator="鑷�"
start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ end-placeholder="缁撴潫鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
<el-form-item label="鎸囨爣鍚嶇О">
<el-select v-model="queryParams.indexId" placeholder="璇烽�夋嫨鎸囨爣">
- <el-option style="width: 150px"
- v-for="dict in arraylist"
- :key="dict.indexId"
- :label="dict.name"
- :value="dict.indexId"
+ <el-option
+ style="width: 150px"
+ v-for="dict in arraylist"
+ :key="dict.indexId"
+ :label="dict.name"
+ :value="dict.indexId"
></el-option>
</el-select>
</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>
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <line-chart ref="LineChart" :chart-data="lineChartData"/>
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <line-chart ref="LineChart" :chart-data="lineChartData" />
</el-row>
<el-table :data="energyEenchmarkingList">
<el-table-column label="鏃ユ湡" align="center" prop="dateTime">
@@ -40,22 +61,27 @@
<span>{{ parseTime(scope.row.dateTime) }}</span>
</template>
</el-table-column>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName" />
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat" />
- <el-table-column label="鏍囨潌鍊�" align="center" prop="value"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="actualValue"/>
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName" />
+ <el-table-column
+ label="鎸囨爣鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <el-table-column label="鏍囨潌鍊�" align="center" prop="value" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="actualValue" />
</el-table>
</div>
</template>
<script>
- import { listPhaseBenchmarking} from "@/api/benchmarking/phaseBenchmarking";
- import LineChart from './LineChart'
- import {getSettingIndex} from '@/api/basicsetting/modelNode'
- export default {
- components: {LineChart},
- name: 'enchmarking',
- name: 'Index',
+import { listPhaseBenchmarking } from "@/api/benchmarking/phaseBenchmarking";
+import LineChart from "./LineChart";
+import { getSettingIndex } from "@/api/basicsetting/modelNode";
+export default {
+ components: { LineChart },
+ name: "enchmarking",
+ name: "Index",
data() {
return {
// 閬僵灞�
@@ -68,27 +94,27 @@
multiple: true,
// 鎬绘潯鏁�
total: 0,
- dateRange:[],
+ dateRange: [],
// energy_benchmarking琛ㄦ牸鏁版嵁
energyEenchmarkingList: [],
- arraylist:[],
+ arraylist: [],
// 鏈夋晥鏈熷瓧鍏�
- unitIdOptions:[],
- dateTypeOptions:[],
+ unitIdOptions: [],
+ dateTypeOptions: [],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
pageSize: 10,
dateTime: undefined,
indexId: undefined,
- timeType:"DAY"
+ timeType: "DAY"
},
// 琛ㄥ崟鍙傛暟
form: {},
- label:"",
- lineChartData:{},
- dateTypes: 'daterange',
- valueFormat:"yyyy-MM-dd",
+ label: "",
+ lineChartData: {},
+ dateTypes: "daterange",
+ valueFormat: "yyyy-MM-dd"
};
},
created() {
@@ -97,40 +123,44 @@
this.getDicts("sys_unit").then(response => {
this.unitIdOptions = response.data;
});
- this.getDicts("energyPlan").then(response => {
+ this.getDicts("energyPlan").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
},
methods: {
/** 鏌ヨenergy_benchmarking鍒楄〃 */
modelNodeChange(modelNode) {
- this.queryParams.indexId=modelNode.id;
- this.label=modelNode.label;
- this.getList(this.queryParams)
+ this.queryParams.indexId = modelNode.id;
+ this.label = modelNode.label;
+ this.getList(this.queryParams);
//鑾峰彇妯″瀷鑾峰彇鎸囨爣
getSettingIndex(modelNode.id).then(response => {
- if(response.data.length>0){
- this.arraylist=response.data;
- this.queryParams.indexId=this.arraylist[0].indexId;
+ if (response.data.length > 0) {
+ this.arraylist = response.data;
+ this.queryParams.indexId = this.arraylist[0].indexId;
}
- })
+ });
},
getList() {
- listPhaseBenchmarking(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
- this.energyEenchmarkingList=response.data
- let actualData=[];
- let expectedData=[];
- let expecteData=[];
- let title=[];
+ listPhaseBenchmarking(
+ this.addDateRange(this.queryParams, this.dateRange)
+ ).then(response => {
+ this.energyEenchmarkingList = response.data;
+ let actualData = [];
+ let expectedData = [];
+ let expecteData = [];
+ let title = [];
this.energyEenchmarkingList.forEach(item => {
actualData.push(this.parseTime(item.dateTime));
expectedData.push(item.value);
expecteData.push(item.actualValue);
- })
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.expecteData=expecteData;
+ });
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.expecteData = expecteData;
this.$refs.LineChart.initChart(this.lineChartData);
});
},
@@ -154,29 +184,26 @@
this.resetForm("queryForm");
this.handleQuery();
},
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- let startTime = year + '-' + month + '-' + (date-1)
- let endTime = year + '-' + month + '-' + date
- this.dateRange=[startTime,endTime]
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ let startTime = year + "-" + month + "-" + (date - 1);
+ let endTime = year + "-" + month + "-" + date;
+ this.dateRange = [startTime, endTime];
},
- handleTime(date){
- if(date=='YEAR'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='MONTH'){
- this.dateTypes= 'monthrange',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'daterange',
- this.valueFormat='yyyy-MM-dd'
+ handleTime(date) {
+ if (date == "YEAR") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "MONTH") {
+ (this.dateTypes = "monthrange"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "daterange"), (this.valueFormat = "yyyy-MM-dd");
}
- },
+ }
}
};
</script>
diff --git a/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/LineChart.vue b/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/LineChart.vue
index 94a1168..b061d95 100644
--- a/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/LineChart.vue
+++ b/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/LineChart.vue
@@ -1,130 +1,142 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons')
- import resize from '../../dashboard/mixins/resize'
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
+import echarts from "echarts";
+require("echarts/theme/macarons");
+import resize from "../../dashboard/mixins/resize";
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- data() {
- return {
- chart: null,
- seriesData: [],
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData,actualData,expecteData} = {}) {
- this.chart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- title: {
- x: 'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- legend: {
- data:['鏍囨潌鍊�','瀹為檯鍊�'],
- left: '60%',
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, expecteData } = {}) {
+ this.chart.setOption({
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ title: {
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#333"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ legend: {
+ data: ["鏍囨潌鍊�", "瀹為檯鍊�"],
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisPointer: {
- type: 'shadow'
+ type: "shadow"
}
- }],
- yAxis: [{
+ }
+ ],
+ yAxis: [
+ {
//name: '缁煎悎鑳借��',
- type: 'value',
+ type: "value",
nameTextStyle: {
- color: "#333",
+ color: "#333"
},
axisLabel: {
- formatter: '{value}'
+ formatter: "{value}"
},
axisTick: {
show: false
- },
- }],
- series: [{
- name:"鏍囨潌鍊�",
- type: 'bar',
+ }
+ }
+ ],
+ series: [
+ {
+ name: "鏍囨潌鍊�",
+ type: "bar",
data: expectedData,
//stack: 'vistors',
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- },{
- name:"瀹為檯鍊�",
- type: 'bar',
+ animationEasing: "quadraticOut"
+ },
+ {
+ name: "瀹為檯鍊�",
+ type: "bar",
data: expecteData,
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
- }
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/realTimeBenchmarking.vue b/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/realTimeBenchmarking.vue
index c2dff94..70a4e0b 100644
--- a/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/realTimeBenchmarking.vue
+++ b/energy_management_ui/src/views/benchmarking/realTimeBenchmarking/realTimeBenchmarking.vue
@@ -1,25 +1,32 @@
<template>
<div class="app-container">
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <line-chart ref="LineChart" :chart-data="lineChartData"/>
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <line-chart ref="LineChart" :chart-data="lineChartData" />
</el-row>
<el-table :data="energyEenchmarkingList">
- <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="label">{{label}}</el-table-column>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName" />
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat" />
- <el-table-column label="鏍囨潌鍊�" align="center" prop="value"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="actualValue"/>
+ <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="label">{{
+ label
+ }}</el-table-column>
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName" />
+ <el-table-column
+ label="鎸囨爣鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <el-table-column label="鏍囨潌鍊�" align="center" prop="value" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="actualValue" />
</el-table>
</div>
</template>
<script>
- import { listRealTimeListrealTime} from "@/api/benchmarking/phaseBenchmarking";
- import LineChart from './LineChart'
- export default {
- components: {LineChart},
- name: 'enchmarking',
- name: 'Index',
+import { listRealTimeListrealTime } from "@/api/benchmarking/phaseBenchmarking";
+import LineChart from "./LineChart";
+export default {
+ components: { LineChart },
+ name: "enchmarking",
+ name: "Index",
data() {
return {
// 閬僵灞�
@@ -35,20 +42,20 @@
// energy_benchmarking琛ㄦ牸鏁版嵁
energyEenchmarkingList: [],
// 鏈夋晥鏈熷瓧鍏�
- unitIdOptions:[],
- dateTypeOptions:[],
+ unitIdOptions: [],
+ dateTypeOptions: [],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
pageSize: 10,
dateTime: undefined,
indexId: undefined,
- timeType:"DAY"
+ timeType: "DAY"
},
// 琛ㄥ崟鍙傛暟
form: {},
- label:"",
- lineChartData:{},
+ label: "",
+ lineChartData: {}
};
},
created() {
@@ -59,30 +66,32 @@
});
this.getDicts("energyPlan").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
},
methods: {
/** 鏌ヨenergy_benchmarking鍒楄〃 */
modelNodeChange(modelNode) {
- this.queryParams.indexId=modelNode.id;
- this.label=modelNode.label;
- this.getList(this.queryParams)
+ this.queryParams.indexId = modelNode.id;
+ this.label = modelNode.label;
+ this.getList(this.queryParams);
},
getList() {
listRealTimeListrealTime(this.queryParams).then(response => {
- this.energyEenchmarkingList=response.data
- let actualData=[];
- let expectedData=[];
- let expecteData=[];
+ this.energyEenchmarkingList = response.data;
+ let actualData = [];
+ let expectedData = [];
+ let expecteData = [];
this.energyEenchmarkingList.forEach(item => {
actualData.push(item.indexName);
expectedData.push(item.value);
expecteData.push(item.actualValue);
- })
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.expecteData=expecteData;
+ });
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.expecteData = expecteData;
this.$refs.LineChart.initChart(this.lineChartData);
});
},
@@ -90,15 +99,15 @@
unitIdFormat(row, column) {
return this.selectDictLabel(this.unitIdOptions, row.unitId);
},
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dateTime = year + '-' + month + '-' + date
- },
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dateTime = year + "-" + month + "-" + date;
+ }
}
};
</script>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/LineChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/LineChart.vue
index 44964fd..4354cf8 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/LineChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#606266"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -94,27 +94,32 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/comprehensive.vue b/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/comprehensive.vue
index 6245c6c..d31dcaa 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/comprehensive.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/comprehensiveStatistics/comprehensive.vue
@@ -1,8 +1,16 @@
<template>
<div class="app-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-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨鑳芥簮鍝佺">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨鑳芥簮鍝佺"
+ >
<el-option
v-for="dict in indexCategoryOptions"
:key="dict.dictValue"
@@ -17,50 +25,173 @@
</el-radio-group>
</el-form-item>-->
<el-form-item label="缁熻鏃堕棿">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- :type="dateTypes"
- :value-format="valueFormat"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ :type="dateTypes"
+ :value-format="valueFormat"
+ 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-button type="warning" icon="el-icon-download" size="mini" @click="handleExport">瀵煎嚭</el-button>-->
</el-form-item>
</el-form>
- <el-table :data="energyList" border style="width: 100%; margin-top: 20px" class="tableList" >
+ <el-table
+ :data="energyList"
+ border
+ style="width: 100%; margin-top: 20px"
+ class="tableList"
+ >
<el-table-column label="鏇茬嚎閫夋嫨">
<template slot-scope="scope">
- <el-button icon="el-icon-search" circle @click="selectChange(scope.row.indexId)" style="font-size: 10px"></el-button>
+ <el-button
+ icon="el-icon-search"
+ circle
+ @click="selectChange(scope.row.indexId)"
+ style="font-size: 10px"
+ ></el-button>
</template>
</el-table-column>
- <el-table-column prop="indexName" align="center" label="鑳芥簮鍚嶇О" min-width="240px"></el-table-column>
- <el-table-column label="1鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value1)}}</template></el-table-column>
- <el-table-column label="2鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value2)}}</template></el-table-column>
- <el-table-column label="3鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value3)}}</template></el-table-column>
- <el-table-column label="4鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value4)}}</template></el-table-column>
- <el-table-column label="5鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value5)}}</template></el-table-column>
- <el-table-column label="6鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value6)}}</template></el-table-column>
- <el-table-column label="7鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value7)}}</template></el-table-column>
- <el-table-column label="8鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value8)}}</template></el-table-column>
- <el-table-column label="9鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value9)}}</template></el-table-column>
- <el-table-column label="10鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value10)}}</template></el-table-column>
- <el-table-column label="11鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value11)}}</template></el-table-column>
- <el-table-column label="12鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value12)}}</template></el-table-column>
- <el-table-column label="13鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value13)}}</template></el-table-column>
- <el-table-column label="14鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value14)}}</template></el-table-column>
- <el-table-column label="15鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value15)}}</template></el-table-column>
- <el-table-column label="16鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value16)}}</template></el-table-column>
- <el-table-column label="17鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value17)}}</template></el-table-column>
- <el-table-column label="18鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value18)}}</template></el-table-column>
- <el-table-column label="19鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value19)}}</template></el-table-column>
- <el-table-column label="10鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value20)}}</template></el-table-column>
- <el-table-column label="21鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value21)}}</template></el-table-column>
- <el-table-column label="22鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value22)}}</template></el-table-column>
- <el-table-column label="23鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value23)}}</template></el-table-column>
- <el-table-column label="24鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value24)}}</template></el-table-column>
+ <el-table-column
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鍚嶇О"
+ min-width="240px"
+ ></el-table-column>
+ <el-table-column label="1鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value1)
+ }}</template></el-table-column
+ >
+ <el-table-column label="2鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value2)
+ }}</template></el-table-column
+ >
+ <el-table-column label="3鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value3)
+ }}</template></el-table-column
+ >
+ <el-table-column label="4鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value4)
+ }}</template></el-table-column
+ >
+ <el-table-column label="5鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value5)
+ }}</template></el-table-column
+ >
+ <el-table-column label="6鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value6)
+ }}</template></el-table-column
+ >
+ <el-table-column label="7鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value7)
+ }}</template></el-table-column
+ >
+ <el-table-column label="8鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value8)
+ }}</template></el-table-column
+ >
+ <el-table-column label="9鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value9)
+ }}</template></el-table-column
+ >
+ <el-table-column label="10鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value10)
+ }}</template></el-table-column
+ >
+ <el-table-column label="11鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value11)
+ }}</template></el-table-column
+ >
+ <el-table-column label="12鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value12)
+ }}</template></el-table-column
+ >
+ <el-table-column label="13鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value13)
+ }}</template></el-table-column
+ >
+ <el-table-column label="14鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value14)
+ }}</template></el-table-column
+ >
+ <el-table-column label="15鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value15)
+ }}</template></el-table-column
+ >
+ <el-table-column label="16鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value16)
+ }}</template></el-table-column
+ >
+ <el-table-column label="17鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value17)
+ }}</template></el-table-column
+ >
+ <el-table-column label="18鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value18)
+ }}</template></el-table-column
+ >
+ <el-table-column label="19鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value19)
+ }}</template></el-table-column
+ >
+ <el-table-column label="10鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value20)
+ }}</template></el-table-column
+ >
+ <el-table-column label="21鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value21)
+ }}</template></el-table-column
+ >
+ <el-table-column label="22鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value22)
+ }}</template></el-table-column
+ >
+ <el-table-column label="23鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value23)
+ }}</template></el-table-column
+ >
+ <el-table-column label="24鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value24)
+ }}</template></el-table-column
+ >
</el-table>
<!--<div class="el-table el-table--fit el-table--scrollable-x el-table--enable-row-hover el-table--medium" >
<div class="el-table__body-wrapper is-scrolling-left">
@@ -154,14 +285,18 @@
</template>
<script>
- import {getDataList,exportList,getlistChart} from "@/api/comprehensiveStatistics/comprehensive";
- import LineChart from './LineChart'
- import BarChart from "./BarChart";
- export default {
- components: {
- LineChart,
- BarChart
- },
+import {
+ getDataList,
+ exportList,
+ getlistChart
+} from "@/api/comprehensiveStatistics/comprehensive";
+import LineChart from "./LineChart";
+import BarChart from "./BarChart";
+export default {
+ components: {
+ LineChart,
+ BarChart
+ },
data() {
return {
// 閬僵灞�
@@ -175,12 +310,12 @@
// 鎬绘潯鏁�
total: 0,
checked: false,
- dateRange:[],
- dateTypeOptions:[],
+ dateRange: [],
+ dateTypeOptions: [],
energyList: [],
tableData: [],
- tableHead:[],
- indexCategoryOptions:[],
+ tableHead: [],
+ indexCategoryOptions: [],
// 寮瑰嚭灞傛爣棰�
title: "",
// 鏄惁鏄剧ず寮瑰嚭灞�
@@ -191,24 +326,26 @@
pageSize: 10,
indexCode: undefined,
indexId: undefined,
- dataTime:undefined,
- timeType:"HOUR",
- indexType:undefined,
- indexStorageId:undefined,
+ dataTime: undefined,
+ timeType: "HOUR",
+ indexType: undefined,
+ indexStorageId: undefined
},
- skinName:"",
- dateTypes: 'date',
- valueFormat:"yyyy-MM-dd",
- lineChartData:{expectedData: [],actualData: []},
+ skinName: "",
+ dateTypes: "date",
+ valueFormat: "yyyy-MM-dd",
+ lineChartData: { expectedData: [], actualData: [] }
};
},
created() {
this.getDicts("report_form").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
this.getConfigKey("comprehensive").then(response => {
- this.skinName=response.msg;
+ this.skinName = response.msg;
});
this.getDicts("energy_type").then(response => {
this.indexCategoryOptions = response.data;
@@ -224,25 +361,27 @@
/*this.tableData=response.data.tabledata;
this.tableHead=response.data.tablehead;*/
this.energyList = response.data;
- })
+ });
},
- selectChange(data){
- this.queryParams.indexId=data;
+ selectChange(data) {
+ this.queryParams.indexId = data;
getlistChart(this.queryParams).then(response => {
- let actualData=[];
- let expectedData=[];
- let title="";
+ let actualData = [];
+ let expectedData = [];
+ let title = "";
response.data.forEach(item => {
expectedData.push(this.numFilter(item.value));
- actualData.push(item.timeCode.slice(item.timeCode.length-2,item.timeCode.length));
- title=item.indexName;
- })
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.title=title
+ actualData.push(
+ item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length)
+ );
+ title = item.indexName;
+ });
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.title = title;
this.$refs.LineChart.initChart(this.lineChartData);
this.$refs.BarChart.initChart(this.lineChartData);
- })
+ });
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
@@ -257,34 +396,36 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.single = selection.length != 1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭缁煎悎鑳借��?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭缁煎悎鑳借��?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportList(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
+ })
+ .then(function() {
+ return exportList(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
getSummaries(param) {
- const {columns, data} = param;
+ const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
- sums[index] = '';
+ sums[index] = "";
return;
}
if (index === 1) {
- sums[index] = '鍚堣';
+ sums[index] = "鍚堣";
return;
}
const values = data.map(item => Number(item[column.property]));
@@ -298,122 +439,120 @@
}
}, 0);
//sums[index];
- sums[index] = this.numFilter(sums[index])
+ sums[index] = this.numFilter(sums[index]);
} else {
- sums[index] = '0';
+ sums[index] = "0";
}
});
return sums;
},
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '';
- if (!isNaN(value) && value !== '') {
- realVal = parseFloat(value).toFixed(this.skinName)
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "") {
+ realVal = parseFloat(value).toFixed(this.skinName);
} else {
- realVal = '0'
+ realVal = "0";
}
- return realVal
+ return realVal;
},
getTime() {
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime=year + '-' + month + '-' + date
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month + "-" + date;
/*let startTime = year + '-' + month + '-' + date
let endTime = year + '-' + month + '-' + (date + 1)
this.dateRange = [startTime, endTime]*/
},
- handleTime(date){
- if(date=='MONTH'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='DAY'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
+ handleTime(date) {
+ if (date == "MONTH") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "DAY") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
}
- },
+ }
}
};
</script>
<style lang="scss" scoped>
- .el-table__body{
- border: 1px solid #000000 !important;
- }
- .el-table th.is-leaf, .el-table td {
- border-bottom: 1px solid #000000 !important;
- border-right: 1px solid #000000 !important;
- }
-.tableList tr td{
- text-align: center;
- }
+.el-table__body {
+ border: 1px solid #000000 !important;
+}
+.el-table th.is-leaf,
+.el-table td {
+ border-bottom: 1px solid #000000 !important;
+ border-right: 1px solid #000000 !important;
+}
+.tableList tr td {
+ text-align: center;
+}
.dashboard-editor-container {
- padding: 32px;
- background-color: rgb(240, 242, 245);
- position: relative;
+ padding: 32px;
+ // background-color: rgb(240, 242, 245);
+ position: relative;
.chart-wrapper {
- background: #fff;
padding: 16px 16px 0;
margin-bottom: 32px;
}
- }
+}
- @media (max-width:1024px) {
- .chart-wrapper {
- padding: 8px;
- }
+@media (max-width: 1024px) {
+ .chart-wrapper {
+ padding: 8px;
}
- .live{
- position: fixed;
- right: 0px;
- top:70px;
- display: flex;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- width: 100px;
- height: 60px;
- background-color: red;
- animation: fade 600ms infinite;
- -webkit-animation: fade 600ms infinite;
+}
+.live {
+ position: fixed;
+ right: 0px;
+ top: 70px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 100px;
+ height: 60px;
+ background-color: red;
+ animation: fade 600ms infinite;
+ -webkit-animation: fade 600ms infinite;
+}
+.live_content {
+ font-size: 18px;
+ color: white;
+ font-weight: bold;
+}
+.live_number {
+ font-size: 32px;
+ color: white;
+ font-weight: bolder;
+}
+@keyframes fade {
+ from {
+ opacity: 1;
}
- .live_content{
- font-size: 18px;
- color: white;
- font-weight: bold;
+ 50% {
+ opacity: 0.4;
}
- .live_number{
- font-size: 32px;
- color: white;
- font-weight: bolder;
+ to {
+ opacity: 1;
}
- @keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
- }
+}
- @-webkit-keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
+@-webkit-keyframes fade {
+ from {
+ opacity: 1;
}
+ 50% {
+ opacity: 0.4;
+ }
+ to {
+ opacity: 1;
+ }
+}
</style>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/BarChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/BarChart.vue
index e5ca2ca..8fc78de 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/BarChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/BarChart.vue
@@ -67,7 +67,7 @@
text: title,
left: "left",
textStyle: {
- color: "#606266"
+ color: "#fff"
}
},
tooltip: {
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/LineChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/LineChart.vue
index 38d565a..0a7ef18 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/LineChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/LineChart.vue
@@ -67,7 +67,7 @@
text: title,
left: "left",
textStyle: {
- color: "#606266"
+ color: "#fff"
}
},
xAxis: {
@@ -94,7 +94,10 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
series: [
{
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/index.vue b/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/index.vue
index 2591907..397c465 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/index.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/dailyComprehensive/index.vue
@@ -86,7 +86,7 @@
fixed
prop="indexName"
label="鎸囨爣鍚嶇О"
- min-width="180px"
+ min-width="200"
>
<template slot-scope="scope">
<div style="width: 100%; text-align: left">
@@ -102,7 +102,7 @@
icon="el-icon-search"
circle
@click="selectChange(scope.row)"
- style="margin-right: 8px"
+ style="margin-right: 8px;background: #999;"
></el-button>
<el-tooltip
v-if="scope.row.indexName.length > 9"
@@ -124,7 +124,7 @@
:key="index"
:label="index - 1 + '鏃�'"
align="center"
- min-width="50"
+ min-width="100"
>
<template slot-scope="scope">{{
numFilter(scope.row[`value${index - 1}`])
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/BarChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/BarChart.vue
index 7198e0f..a157885 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/BarChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/BarChart.vue
@@ -1,112 +1,119 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- left: 10,
- right: 10,
- bottom: 20,
- top: 40,
- containLabel: true
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 20,
+ top: 40,
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/LineChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/LineChart.vue
index 44964fd..af2321f 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/LineChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -94,27 +94,32 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/index.vue b/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/index.vue
index 5a74d90..a0328e8 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/index.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/monthlyComprehensive/index.vue
@@ -86,7 +86,7 @@
prop="indexName"
align="left"
label="鎸囨爣鍚嶇О"
- width="130px"
+ min-width="200"
>
<template slot-scope="scope">
<div style="width: 100%; text-align: left">
@@ -102,17 +102,17 @@
icon="el-icon-search"
circle
@click="selectChange(scope.row)"
- style="margin-right: 4px"
+ style="margin-right: 4px; background: #999;"
></el-button>
<el-tooltip
- v-if="scope.row.indexName.length > 5"
+ v-if="scope.row.indexName.length > 8"
class="item"
effect="dark"
:content="scope.row.indexName"
placement="top-end"
>
<span>
- {{ scope.row.indexName.substr(0, 5) + "..." }}
+ {{ scope.row.indexName.substr(0, 8) + "..." }}
</span>
</el-tooltip>
<span v-else>{{ scope.row.indexName }}</span>
@@ -124,7 +124,7 @@
:key="index"
:label="`${index}鏃"
align="center"
- min-width="40"
+ min-width="100"
>
<template slot-scope="scope">
<span style="font-size: 12px">
@@ -369,7 +369,6 @@
position: relative;
.chart-wrapper {
- background: #fff;
padding: 16px 16px 0;
margin-bottom: 32px;
}
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/BarChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/BarChart.vue
index ab6a75f..f29af8d 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/BarChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/BarChart.vue
@@ -1,112 +1,132 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- left: 10,
- right: 10,
- bottom: 20,
- top: 40,
- containLabel: true
- },
- xAxis: [{
- type: 'category',
- data: ['1鏈�','2鏈�','3鏈�','4鏈�','5鏈�','6鏈�','7鏈�','8鏈�','9鏈�','10鏈�','11鏈�','12鏈�'],
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 20,
+ top: 40,
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
+ data: [
+ "1鏈�",
+ "2鏈�",
+ "3鏈�",
+ "4鏈�",
+ "5鏈�",
+ "6鏈�",
+ "7鏈�",
+ "8鏈�",
+ "9鏈�",
+ "10鏈�",
+ "11鏈�",
+ "12鏈�"
+ ],
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/LineChart.vue b/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/LineChart.vue
index 655c96d..26e0e0e 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/LineChart.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,58 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
- data: ['1鏈�','2鏈�','3鏈�','4鏈�','5鏈�','6鏈�','7鏈�','8鏈�','9鏈�','10鏈�','11鏈�','12鏈�'],
- type: 'category',
+ data: [
+ "1鏈�",
+ "2鏈�",
+ "3鏈�",
+ "4鏈�",
+ "5鏈�",
+ "6鏈�",
+ "7鏈�",
+ "8鏈�",
+ "9鏈�",
+ "10鏈�",
+ "11鏈�",
+ "12鏈�"
+ ],
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +95,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -94,27 +107,32 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/index.vue b/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/index.vue
index eda0962..cc723bd 100644
--- a/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/index.vue
+++ b/energy_management_ui/src/views/comprehensiveStatistics/yearComprehensive/index.vue
@@ -103,7 +103,7 @@
icon="el-icon-search"
circle
@click="selectChange(scope.row)"
- style="font-size: 10px"
+ style="font-size: 10px;background: #999;"
></el-button>
<span>{{ scope.row.indexName }}</span>
</div>
@@ -417,7 +417,6 @@
position: relative;
.chart-wrapper {
- background: #fff;
padding: 16px 16px 0;
margin-bottom: 32px;
}
diff --git a/energy_management_ui/src/views/dashboard/BarChart.vue b/energy_management_ui/src/views/dashboard/BarChart.vue
index e39c7cb..294d1ce 100644
--- a/energy_management_ui/src/views/dashboard/BarChart.vue
+++ b/energy_management_ui/src/views/dashboard/BarChart.vue
@@ -120,7 +120,10 @@
}
},
legend: {
- right: "1"
+ right: "1",
+ textStyle: {
+ color: "#fff"
+ }
},
grid: {
left: "1",
@@ -134,7 +137,12 @@
},
yAxis: {
type: "value",
- boundaryGap: [0, 0.01]
+ boundaryGap: [0, 0.01],
+ splitLine: {
+ lineStyle: {
+ color: "rgba(32, 121, 160, 0.5)" // y杞村垎鍓茬嚎棰滆壊
+ }
+ }
},
series: [
{
diff --git a/energy_management_ui/src/views/dashboard/LineChart.vue b/energy_management_ui/src/views/dashboard/LineChart.vue
index e654168..9eb7cc2 100644
--- a/energy_management_ui/src/views/dashboard/LineChart.vue
+++ b/energy_management_ui/src/views/dashboard/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from './mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "./mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
autoResize: {
type: Boolean,
@@ -34,37 +34,37 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
setOptions({ expectedData, actualData } = {}) {
this.chart.setOption({
xAxis: {
- data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+ data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
boundaryGap: false,
axisTick: {
show: false
@@ -78,9 +78,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -90,46 +90,52 @@
}
},
legend: {
- data: ['expected', 'actual']
+ data: ["expected", "actual"],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: 'expected', itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: "expected",
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
},
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- },
- {
- name: 'actual',
- smooth: true,
- type: 'line',
- itemStyle: {
- normal: {
- color: '#3888fa',
- lineStyle: {
- color: '#3888fa',
- width: 2
- },
- areaStyle: {
- color: '#f3f8ff'
+ {
+ name: "actual",
+ smooth: true,
+ type: "line",
+ itemStyle: {
+ normal: {
+ color: "#3888fa",
+ lineStyle: {
+ color: "#3888fa",
+ width: 2
+ },
+ areaStyle: {
+ color: "#f3f8ff"
+ }
}
- }
- },
- data: actualData,
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
+ },
+ data: actualData,
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/dashboard/PanelGroup.vue b/energy_management_ui/src/views/dashboard/PanelGroup.vue
index 1a1081f..3724515 100644
--- a/energy_management_ui/src/views/dashboard/PanelGroup.vue
+++ b/energy_management_ui/src/views/dashboard/PanelGroup.vue
@@ -9,7 +9,12 @@
<div class="card-panel-text">
璁垮
</div>
- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" />
+ <count-to
+ :start-val="0"
+ :end-val="102400"
+ :duration="2600"
+ class="card-panel-num"
+ />
</div>
</div>
</el-col>
@@ -22,7 +27,12 @@
<div class="card-panel-text">
娑堟伅
</div>
- <count-to :start-val="0" :end-val="81212" :duration="3000" class="card-panel-num" />
+ <count-to
+ :start-val="0"
+ :end-val="81212"
+ :duration="3000"
+ class="card-panel-num"
+ />
</div>
</div>
</el-col>
@@ -35,7 +45,12 @@
<div class="card-panel-text">
閲戦
</div>
- <count-to :start-val="0" :end-val="9280" :duration="3200" class="card-panel-num" />
+ <count-to
+ :start-val="0"
+ :end-val="9280"
+ :duration="3200"
+ class="card-panel-num"
+ />
</div>
</div>
</el-col>
@@ -48,7 +63,12 @@
<div class="card-panel-text">
璁㈠崟
</div>
- <count-to :start-val="0" :end-val="13600" :duration="3600" class="card-panel-num" />
+ <count-to
+ :start-val="0"
+ :end-val="13600"
+ :duration="3600"
+ class="card-panel-num"
+ />
</div>
</div>
</el-col>
@@ -56,7 +76,7 @@
</template>
<script>
-import CountTo from 'vue-count-to'
+import CountTo from "vue-count-to";
export default {
components: {
@@ -64,10 +84,10 @@
},
methods: {
handleSetLineChartData(type) {
- this.$emit('handleSetLineChartData', type)
+ this.$emit("handleSetLineChartData", type);
}
}
-}
+};
</script>
<style lang="scss" scoped>
@@ -85,9 +105,8 @@
position: relative;
overflow: hidden;
color: #666;
- background: #fff;
- box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
- border-color: rgba(0, 0, 0, .05);
+ box-shadow: 4px 4px 40px rgba(0, 0, 0, 0.05);
+ border-color: rgba(0, 0, 0, 0.05);
&:hover {
.card-panel-icon-wrapper {
@@ -107,7 +126,7 @@
}
.icon-shopping {
- background: #34bfa3
+ background: #34bfa3;
}
}
@@ -124,7 +143,7 @@
}
.icon-shopping {
- color: #34bfa3
+ color: #34bfa3;
}
.card-panel-icon-wrapper {
@@ -160,7 +179,7 @@
}
}
-@media (max-width:550px) {
+@media (max-width: 550px) {
.card-panel-description {
display: none;
}
diff --git a/energy_management_ui/src/views/dashboard/PieChart.vue b/energy_management_ui/src/views/dashboard/PieChart.vue
index 8d3e20a..bb53dfe 100644
--- a/energy_management_ui/src/views/dashboard/PieChart.vue
+++ b/energy_management_ui/src/views/dashboard/PieChart.vue
@@ -6,6 +6,7 @@
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "./mixins/resize";
+import { color } from "echarts/lib/export";
export default {
mixins: [resize],
@@ -24,7 +25,7 @@
},
height: {
type: String,
- default: "363px"
+ default: "300px"
},
chartData: {
type: Array,
@@ -80,7 +81,10 @@
left: this.legend == "right" ? "auto" : "center",
top: "0",
right: this.legend == "right" ? "40" : "auto",
- orient: this.legend == "right" ? "vertical" : "horizontal"
+ orient: this.legend == "right" ? "vertical" : "horizontal",
+ textStyle: {
+ color: "#fff"
+ }
// data: ["Industries", "Technology", "Forex", "Gold", "Forecasts"]
},
label: {
diff --git a/energy_management_ui/src/views/dashboard/RaddarChart.vue b/energy_management_ui/src/views/dashboard/RaddarChart.vue
index 6823af3..a748653 100644
--- a/energy_management_ui/src/views/dashboard/RaddarChart.vue
+++ b/energy_management_ui/src/views/dashboard/RaddarChart.vue
@@ -1,116 +1,122 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from './mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "./mixins/resize";
-const animationDuration = 3000
+const animationDuration = 3000;
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
}
},
data() {
return {
chart: null
- }
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
+ this.chart = echarts.init(this.$el, "macarons");
this.chart.setOption({
tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
}
},
radar: {
- radius: '66%',
- center: ['50%', '42%'],
+ radius: "66%",
+ center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
- color: 'rgba(127,95,132,.3)',
+ color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
- shadowColor: 'rgba(0,0,0,.5)',
+ shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15
}
},
indicator: [
- { name: 'Sales', max: 10000 },
- { name: 'Administration', max: 20000 },
- { name: 'Information Techology', max: 20000 },
- { name: 'Customer Support', max: 20000 },
- { name: 'Development', max: 20000 },
- { name: 'Marketing', max: 20000 }
+ { name: "Sales", max: 10000 },
+ { name: "Administration", max: 20000 },
+ { name: "Information Techology", max: 20000 },
+ { name: "Customer Support", max: 20000 },
+ { name: "Development", max: 20000 },
+ { name: "Marketing", max: 20000 }
]
},
legend: {
- left: 'center',
- bottom: '10',
- data: ['Allocated Budget', 'Expected Spending', 'Actual Spending']
+ left: "center",
+ bottom: "10",
+ data: ["Allocated Budget", "Expected Spending", "Actual Spending"],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- type: 'radar',
- symbolSize: 0,
- areaStyle: {
- normal: {
- shadowBlur: 13,
- shadowColor: 'rgba(0,0,0,.2)',
- shadowOffsetX: 0,
- shadowOffsetY: 10,
- opacity: 1
- }
- },
- data: [
- {
- value: [5000, 7000, 12000, 11000, 15000, 14000],
- name: 'Allocated Budget'
+ series: [
+ {
+ type: "radar",
+ symbolSize: 0,
+ areaStyle: {
+ normal: {
+ shadowBlur: 13,
+ shadowColor: "rgba(0,0,0,.2)",
+ shadowOffsetX: 0,
+ shadowOffsetY: 10,
+ opacity: 1
+ }
},
- {
- value: [4000, 9000, 15000, 15000, 13000, 11000],
- name: 'Expected Spending'
- },
- {
- value: [5500, 11000, 12000, 15000, 12000, 12000],
- name: 'Actual Spending'
- }
- ],
- animationDuration: animationDuration
- }]
- })
+ data: [
+ {
+ value: [5000, 7000, 12000, 11000, 15000, 14000],
+ name: "Allocated Budget"
+ },
+ {
+ value: [4000, 9000, 15000, 15000, 13000, 11000],
+ name: "Expected Spending"
+ },
+ {
+ value: [5500, 11000, 12000, 15000, 12000, 12000],
+ name: "Actual Spending"
+ }
+ ],
+ animationDuration: animationDuration
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/dataMonitoring/energyPercent/energyPercent.vue b/energy_management_ui/src/views/dataMonitoring/energyPercent/energyPercent.vue
index 848d02d..42890e3 100644
--- a/energy_management_ui/src/views/dataMonitoring/energyPercent/energyPercent.vue
+++ b/energy_management_ui/src/views/dataMonitoring/energyPercent/energyPercent.vue
@@ -352,7 +352,7 @@
this.handleQuery();
},
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyle.height = window.innerHeight - 195 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
height: window.innerHeight - 100 + "px"
diff --git a/energy_management_ui/src/views/dataMonitoring/energyPercent/waterPercent.vue b/energy_management_ui/src/views/dataMonitoring/energyPercent/waterPercent.vue
index 2cdab26..6fe3157 100644
--- a/energy_management_ui/src/views/dataMonitoring/energyPercent/waterPercent.vue
+++ b/energy_management_ui/src/views/dataMonitoring/energyPercent/waterPercent.vue
@@ -380,7 +380,7 @@
this.handleQuery();
},
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyle.height = window.innerHeight - 195 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
height: window.innerHeight - 100 + "px"
@@ -391,6 +391,7 @@
</script>
<style lang="scss" scoped>
+@import "~@/assets/styles/variables.scss";
.dashboard-editor-container {
margin-bottom: 16px;
::v-deep {
@@ -404,13 +405,12 @@
}
.table-wrapper {
margin-top: 16px;
- background: #fff;
+ // background: #fff;
}
}
.table-wrapper {
- // margin-top: 16px;
- padding-top: 16px;
- background: #fff;
+ padding-top: 0px;
+ background: #061844;
.demo-tabs {
padding: 0 16px;
}
@@ -418,6 +418,12 @@
.el-card {
border: none;
}
+ .el-tabs__item {
+ color: #fff;
+ }
+ .el-tabs__item.is-active {
+ color: $primary-color;
+ }
}
}
</style>
diff --git a/energy_management_ui/src/views/dataMonitoring/historyDataTrend/historyMonitoringSetting.vue b/energy_management_ui/src/views/dataMonitoring/historyDataTrend/historyMonitoringSetting.vue
index ea7b6b2..749bc4d 100644
--- a/energy_management_ui/src/views/dataMonitoring/historyDataTrend/historyMonitoringSetting.vue
+++ b/energy_management_ui/src/views/dataMonitoring/historyDataTrend/historyMonitoringSetting.vue
@@ -286,7 +286,10 @@
}
},
legend: {
- right: "center"
+ right: "center",
+ textStyle: {
+ color: "#fff"
+ }
},
grid: {
left: "1",
@@ -300,14 +303,19 @@
},
yAxis: {
type: "value",
- boundaryGap: [0, 0.01]
+ boundaryGap: [0, 0.01],
+ splitLine: {
+ lineStyle: {
+ color: "rgba(32, 121, 160, 0.5)" // y杞村垎鍓茬嚎棰滆壊
+ }
+ }
},
series: [
{
name: titleName,
type: "line",
- data: legendArr
- // color: "#919191"
+ data: legendArr,
+ color: "#e6e6e6"
}
]
};
@@ -337,7 +345,7 @@
align-items: center;
height: 100px;
z-index: 1000;
- background: #fff;
+ background: #061844;
border-radius: 4px;
margin-bottom: 12px;
padding: 0 24px;
diff --git a/energy_management_ui/src/views/dataMonitoring/historyDataTrend/index.vue b/energy_management_ui/src/views/dataMonitoring/historyDataTrend/index.vue
index 8c54747..1100e86 100644
--- a/energy_management_ui/src/views/dataMonitoring/historyDataTrend/index.vue
+++ b/energy_management_ui/src/views/dataMonitoring/historyDataTrend/index.vue
@@ -64,10 +64,10 @@
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 212 + "px"
+ height: window.innerHeight - 248 + "px"
};
},
changeNode: function(node) {
diff --git a/energy_management_ui/src/views/dataMonitoring/realTimeTrend/LineChart.vue b/energy_management_ui/src/views/dataMonitoring/realTimeTrend/LineChart.vue
index 0b831d0..b6ea814 100644
--- a/energy_management_ui/src/views/dataMonitoring/realTimeTrend/LineChart.vue
+++ b/energy_management_ui/src/views/dataMonitoring/realTimeTrend/LineChart.vue
@@ -75,7 +75,10 @@
}
},
legend: {
- right: "1"
+ right: "1",
+ textStyle: {
+ color: "#fff"
+ }
},
grid: {
left: "1",
diff --git a/energy_management_ui/src/views/dataMonitoring/realTimeTrend/index.vue b/energy_management_ui/src/views/dataMonitoring/realTimeTrend/index.vue
index 10e428e..c249949 100644
--- a/energy_management_ui/src/views/dataMonitoring/realTimeTrend/index.vue
+++ b/energy_management_ui/src/views/dataMonitoring/realTimeTrend/index.vue
@@ -60,10 +60,10 @@
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 100 + "px"
+ height: window.innerHeight - 130 + "px"
};
},
changeNode: function(node) {
diff --git a/energy_management_ui/src/views/electricityPrice/electricity/index.vue b/energy_management_ui/src/views/electricityPrice/electricity/index.vue
index a318b00..132c2a5 100644
--- a/energy_management_ui/src/views/electricityPrice/electricity/index.vue
+++ b/energy_management_ui/src/views/electricityPrice/electricity/index.vue
@@ -1,30 +1,26 @@
-<style scoped>
- .el-row {
- margin-bottom: 20px;
- }
- .el-col {
- border-radius: 4px;
- }
- .row-bg {
- padding: 10px 0;
- background-color: #f9fafc;
- }
-</style>
<template>
<div class="app-container">
<el-form :model="forms" label-width="100px">
<el-row :gutter="24" class="mb8">
<el-col :span="16">
- <el-form-item prop="effective_date" label="鐢熸晥鏃堕棿锛�" label-width="100px">
+ <el-form-item
+ prop="effective_date"
+ label="鐢熸晥鏃堕棿锛�"
+ label-width="100px"
+ >
<!--{{changeTime(parseTime(effective_date))}}-->
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="forms.effectiveDate"
- type="date"
- value-format="yyyy-MM-dd"
- :picker-options="pickerOptions"
- placeholder="璁剧疆鐢熸晥鏃堕棿">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="forms.effectiveDate"
+ type="date"
+ value-format="yyyy-MM-dd"
+ :picker-options="pickerOptions"
+ placeholder="璁剧疆鐢熸晥鏃堕棿"
+ >
</el-date-picker>
- <!-- <el-input :disabled="isDisabled" v-model="item.effectiveDate"></el-input>-->
+ <!-- <el-input :disabled="isDisabled" v-model="item.effectiveDate"></el-input>-->
<!--<el-button size="mini" @click="addDate">璁剧疆鐢熸晥鏃堕棿</el-button>-->
</el-form-item>
</el-col>
@@ -34,28 +30,54 @@
size="mini"
@click="handleAdd()"
v-hasPermi="['electricityPrice:electricity:add']"
- >鏂板鏃舵</el-button>
+ >鏂板鏃舵</el-button
+ >
</el-col>
<el-col :span="1.5">
- <el-button plain
+ <el-button
+ plain
size="mini"
@click="handlePrice()"
v-hasPermi="['electricityPrice:price:add']"
- >璁剧疆鍗曚环</el-button>
+ >璁剧疆鍗曚环</el-button
+ >
</el-col>
<el-col :span="1.5">
- <router-link :to="'/electricityPrice/listHistory'" class="link-type">
+ <router-link :to="'/electricityPrice/listHistory'" class="link-type">
<el-button plain size="mini">鏌ョ湅鍘嗗彶</el-button>
</router-link>
</el-col>
</el-row>
- <el-table v-loading="loading" :data="electricityList" @selection-change="handleSelectionChange">
+ <el-table
+ v-loading="loading"
+ :data="electricityList"
+ @selection-change="handleSelectionChange"
+ >
<el-table-column type="selection" width="55" align="center" />
- <el-table-column label="鏃舵鍚嶇О" align="center" prop="effectiveName" :formatter="effectiveNameFormat" />
- <el-table-column label="鍗曚环" align="center" prop="price"/>
- <el-table-column label="鏃舵寮�濮嬫椂闂�" align="center" prop="beginDate" width="180"/>
- <el-table-column label="鏃舵缁撴潫鏃堕棿" align="center" prop="endDate" width="180"/>
- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
+ <el-table-column
+ label="鏃舵鍚嶇О"
+ align="center"
+ prop="effectiveName"
+ :formatter="effectiveNameFormat"
+ />
+ <el-table-column label="鍗曚环" align="center" prop="price" />
+ <el-table-column
+ label="鏃舵寮�濮嬫椂闂�"
+ align="center"
+ prop="beginDate"
+ width="180"
+ />
+ <el-table-column
+ label="鏃舵缁撴潫鏃堕棿"
+ align="center"
+ prop="endDate"
+ width="180"
+ />
+ <el-table-column
+ label="鎿嶄綔"
+ align="center"
+ class-name="small-padding fixed-width"
+ >
<template slot-scope="scope">
<el-button
size="mini"
@@ -63,13 +85,14 @@
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['electricityPrice:electricity:remove']"
- >鍒犻櫎</el-button>
+ >鍒犻櫎</el-button
+ >
</template>
</el-table-column>
</el-table>
</el-form>
<pagination
- v-show="total>0"
+ v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@@ -77,14 +100,23 @@
/>
<!-- 娣诲姞鎴栦慨鏀筫lectricityPrice瀵硅瘽妗� -->
<el-dialog :title="title" :visible.sync="time" width="500px">
- <el-form ref="form" :model="form" :rulesTime="rulesTime" label-width="120px">
+ <el-form
+ ref="form"
+ :model="form"
+ :rulesTime="rulesTime"
+ label-width="120px"
+ >
<el-form-item label="鐢熸晥鏃ユ湡" prop="effectiveDate">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="form.effectiveDate"
- type="date"
- value-format="yyyy-MM-dd"
- :picker-options="pickerOptions"
- placeholder="閫夋嫨鐢熸晥鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="form.effectiveDate"
+ type="date"
+ value-format="yyyy-MM-dd"
+ :picker-options="pickerOptions"
+ placeholder="閫夋嫨鐢熸晥鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
</el-form>
@@ -96,7 +128,9 @@
<!-- 娣诲姞鎴栦慨鏀筫lectricityPrice瀵硅瘽妗� -->
<el-dialog :title="title" :visible.sync="open" width="500px">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
- <el-form-item label="鐢熸晥鏃堕棿" prop="effectiveDate">{{changeTime(parseTime(form.effectiveDate))}}</el-form-item>
+ <el-form-item label="鐢熸晥鏃堕棿" prop="effectiveDate">{{
+ changeTime(parseTime(form.effectiveDate))
+ }}</el-form-item>
<el-form-item label="鏃舵鍚嶇О" prop="effectiveName">
<el-select v-model="form.effectiveName" placeholder="璇烽�夋嫨鏃舵鍚嶇О">
<el-option
@@ -111,17 +145,17 @@
<el-time-picker
v-model="form.beginDate"
class="date-box"
- format='HH:mm'
+ format="HH:mm"
value-format="HH:mm"
placeholder="閫夋嫨鏃舵寮�濮嬫椂闂�"
- >
+ >
</el-time-picker>
</el-form-item>
<el-form-item label="鏃舵缁撴潫鏃堕棿" prop="endDate">
<el-time-picker
v-model="form.endDate"
class="date-box"
- format='HH:mm'
+ format="HH:mm"
value-format="HH:mm"
placeholder="閫夋嫨鏃舵寮�濮嬫椂闂�"
></el-time-picker>
@@ -136,11 +170,23 @@
<el-dialog :title="title" :visible.sync="openPrice" width="500px">
<el-form ref="formPrice" :model="formPrice" :rulesPrice="rulesPrice">
<el-input type="hidden" v-model="formPrice.effectiveDate"></el-input>
- <el-table :data="effective_name" ref="multipleTable" tooltip-effect="dark">
- <el-table-column align="center" property="dictLabel" label="鏃舵鍚嶇О" ></el-table-column>
+ <el-table
+ :data="effective_name"
+ ref="multipleTable"
+ tooltip-effect="dark"
+ >
+ <el-table-column
+ align="center"
+ property="dictLabel"
+ label="鏃舵鍚嶇О"
+ ></el-table-column>
<el-table-column align="center" property="price" label="鍗曚环(鍏�)">
- <template scope="scope">
- <el-input step="0.1" v-model="scope.row.price" placeholder="璇疯緭鍏ュ崟浠�(鍏�)"></el-input>
+ <template scope="scope">
+ <el-input
+ step="0.1"
+ v-model="scope.row.price"
+ placeholder="璇疯緭鍏ュ崟浠�(鍏�)"
+ ></el-input>
</template>
</el-table-column>
</el-table>
@@ -154,208 +200,237 @@
</template>
<script>
- import { listElectricity, getElectricity, delElectricity, addElectricity, updateElectricity, exportElectricity,listDate} from "@/api/electricityPrice/electricity";
+import {
+ listElectricity,
+ getElectricity,
+ delElectricity,
+ addElectricity,
+ updateElectricity,
+ exportElectricity,
+ listDate
+} from "@/api/electricityPrice/electricity";
- import { listPrice, getPrice, delPrice, addPrice, updatePrice ,EdictType,dictTypeList } from "@/api/electricityPrice/price";
+import {
+ listPrice,
+ getPrice,
+ delPrice,
+ addPrice,
+ updatePrice,
+ EdictType,
+ dictTypeList
+} from "@/api/electricityPrice/price";
- export default {
- data() {
- return {
- // 閬僵灞�
- loading: true,
- // 閫変腑鏁扮粍
- ids: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 0,
- // electricityPrice琛ㄦ牸鏁版嵁
- electricityList: [],
- list: [],
- // 寮瑰嚭灞傛爣棰�
- title: "",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- time: false,
- openPrice: false,
- // 鏃舵鍚嶇О瀛楀吀
- effectiveNameOptions: [],
- effective_name: [],
- ifeffective: [],
- effective:{
- dictLabel:'',
- dictValue:'',
- price:''
- },
- dictType:"",
- effective_date:"",
- // 鏌ヨ鍙傛暟
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- effectiveDate: undefined,
- priceId: undefined,
- beginDate: undefined,
- endDate: undefined,
- effectiveName: undefined,
- dictType: undefined,
- },
- // 琛ㄥ崟鍙傛暟
- form: {},
- forms:{},
- formPrice:{},
- // 琛ㄥ崟鏍￠獙
- rules: {
- effectiveDate: [
- { required: true, message: "鐢熸晥鏃ユ湡涓嶈兘涓虹┖", trigger: "blur" }
- ],
- beginDate: [
- { required: true, message: "鏃舵寮�濮嬫椂闂翠笉鑳戒负绌�", trigger: "blur" }
- ],
- endDate: [
- { required: true, message: "鏃舵缁撴潫鏃堕棿涓嶈兘涓虹┖", trigger: "blur" }
- ],
- effectiveName: [
- { required: true, message: "鏃舵鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
- ]
- },
- rulesTime: {
- effectiveDate: [
- { required: true, message: "鐢熸晥鏃ユ湡涓嶈兘涓虹┖", trigger: "blur" }
- ]
- },
- rulesPrice: {
- timePeriod: [
- { required: true, message: "鏃舵涓嶈兘涓虹┖", trigger: "blur" }
- ],
- price:[{ required: true, message: "鍗曚环涓嶈兘涓虹┖", trigger: "blur" }]
- },
- pickerOptions: { // 涓嶈閫夋嫨浠婂ぉ浠ュ墠鐨�
- disabledDate(time) {
- return time.getTime() < Date.now() - 24 * 60 * 60 * 1000
- }
+export default {
+ data() {
+ return {
+ // 閬僵灞�
+ loading: true,
+ // 閫変腑鏁扮粍
+ ids: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ // electricityPrice琛ㄦ牸鏁版嵁
+ electricityList: [],
+ list: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ time: false,
+ openPrice: false,
+ // 鏃舵鍚嶇О瀛楀吀
+ effectiveNameOptions: [],
+ effective_name: [],
+ ifeffective: [],
+ effective: {
+ dictLabel: "",
+ dictValue: "",
+ price: ""
+ },
+ dictType: "",
+ effective_date: "",
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ effectiveDate: undefined,
+ priceId: undefined,
+ beginDate: undefined,
+ endDate: undefined,
+ effectiveName: undefined,
+ dictType: undefined
+ },
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ forms: {},
+ formPrice: {},
+ // 琛ㄥ崟鏍￠獙
+ rules: {
+ effectiveDate: [
+ { required: true, message: "鐢熸晥鏃ユ湡涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ beginDate: [
+ { required: true, message: "鏃舵寮�濮嬫椂闂翠笉鑳戒负绌�", trigger: "blur" }
+ ],
+ endDate: [
+ { required: true, message: "鏃舵缁撴潫鏃堕棿涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ effectiveName: [
+ { required: true, message: "鏃舵鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
+ ]
+ },
+ rulesTime: {
+ effectiveDate: [
+ { required: true, message: "鐢熸晥鏃ユ湡涓嶈兘涓虹┖", trigger: "blur" }
+ ]
+ },
+ rulesPrice: {
+ timePeriod: [
+ { required: true, message: "鏃舵涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ price: [{ required: true, message: "鍗曚环涓嶈兘涓虹┖", trigger: "blur" }]
+ },
+ pickerOptions: {
+ // 涓嶈閫夋嫨浠婂ぉ浠ュ墠鐨�
+ disabledDate(time) {
+ return time.getTime() < Date.now() - 24 * 60 * 60 * 1000;
}
- };
- },
+ }
+ };
+ },
- created() {
- this.getList();
- this.getLists();
- this.getDicts("electricity_price").then(response => {
- this.effectiveNameOptions = response.data;
+ created() {
+ this.getList();
+ this.getLists();
+ this.getDicts("electricity_price").then(response => {
+ this.effectiveNameOptions = response.data;
+ });
+ },
+ methods: {
+ /** 鏌ヨelectricityPrice鍒楄〃 */
+ getList() {
+ this.loading = true;
+ listDate(this.queryParams).then(response => {
+ this.list = response.rows;
+ if (this.list.length > 0) {
+ this.forms.effectiveDate = this.list[0].effectiveDate;
+ this.effective_date = this.list[0].effectiveDate;
+ }
+ this.loading = false;
});
},
- methods: {
- /** 鏌ヨelectricityPrice鍒楄〃 */
- getList() {
- this.loading = true;
- listDate(this.queryParams).then(response => {
- this.list= response.rows;
- if(this.list.length>0){
- this.forms.effectiveDate=this.list[0].effectiveDate;
- this.effective_date=this.list[0].effectiveDate;
- }
- this.loading = false;
- });
- },
- getLists(){
- listElectricity(this.queryParams).then(response => {
- this.electricityList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- },
- // 鏃舵鍚嶇О瀛楀吀缈昏瘧
- effectiveNameFormat(row, column) {
- return this.selectDictLabel(this.effectiveNameOptions, row.effectiveName);
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.time = false;
- this.openPrice = false;
+ getLists() {
+ listElectricity(this.queryParams).then(response => {
+ this.electricityList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ },
+ // 鏃舵鍚嶇О瀛楀吀缈昏瘧
+ effectiveNameFormat(row, column) {
+ return this.selectDictLabel(this.effectiveNameOptions, row.effectiveName);
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.time = false;
+ this.openPrice = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ id: undefined,
+ effectiveDate: undefined,
+ priceId: undefined,
+ beginDate: undefined,
+ endDate: undefined,
+ effectiveName: undefined
+ };
+ this.resetForm("form");
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ },
+ // 澶氶�夋閫変腑鏁版嵁
+ handleSelectionChange(selection) {
+ console.log(selection);
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
+ },
+ /** 鏂板鎸夐挳鎿嶄綔 */
+ handleAdd() {
+ this.reset();
+ this.queryParams.effectiveDate = this.forms.effectiveDate;
+ listPrice(this.queryParams).then(response => {
this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- id: undefined,
- effectiveDate: undefined,
- priceId: undefined,
- beginDate: undefined,
- endDate: undefined,
- effectiveName: undefined
- };
- this.resetForm("form");
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
- // 澶氶�夋閫変腑鏁版嵁
- handleSelectionChange(selection) {
- console.log(selection);
- this.ids = selection.map(item => item.id)
- this.single = selection.length!=1
- this.multiple = !selection.length
- },
- /** 鏂板鎸夐挳鎿嶄綔 */
- handleAdd() {
- this.reset();
- this.queryParams.effectiveDate = this.forms.effectiveDate;
- listPrice(this.queryParams).then(response => {
- this.reset();
- this.ifeffective = response.rows;
- if (this.ifeffective.length > 0) {
- this.form.effectiveDate = this.forms.effectiveDate;
- this.open = true;
- this.title = "娣诲姞鏂板鏃舵";
- } else {
- this.msgSuccess("璇峰厛璁剧疆浠锋牸");
- }
- });
- },
- handlePrice(){
- this.queryParams.effectiveDate = this.forms.effectiveDate.substring(0, 10);
- this.queryParams.dictType="electricity_price",
+ this.ifeffective = response.rows;
+ if (this.ifeffective.length > 0) {
+ this.form.effectiveDate = this.forms.effectiveDate;
+ this.open = true;
+ this.title = "娣诲姞鏂板鏃舵";
+ } else {
+ this.msgSuccess("璇峰厛璁剧疆浠锋牸");
+ }
+ });
+ },
+ handlePrice() {
+ this.queryParams.effectiveDate = this.forms.effectiveDate.substring(
+ 0,
+ 10
+ );
+ (this.queryParams.dictType = "electricity_price"),
dictTypeList(this.queryParams).then(response => {
this.reset();
- this.formPrice.effectiveDate=this.forms.effectiveDate;
- this.effective_name=response.data;
+ this.formPrice.effectiveDate = this.forms.effectiveDate;
+ this.effective_name = response.data;
this.openPrice = true;
this.title = "璁剧疆鍗曚环";
});
- },
- /** 鎻愪氦鎸夐挳 */
- submitPrice: function() {
- this.formPrice.effectiveDate;
- this.$nextTick(() => {
- this.formPrice.TimeJson=this.$refs['multipleTable'].data
- let tourId = '';
- let tourLabels = '';
- let tourValue = '';
- let tourPrice = '';
- for (let i = 0; i < this.formPrice.TimeJson.length; i++) {
- tourLabels +=this.formPrice.TimeJson[i].dictLabel+",";
- tourValue +=this.formPrice.TimeJson[i].dictValue+",";
- tourPrice +=this.formPrice.TimeJson[i].price+",";
- tourId +=this.formPrice.TimeJson[i].id+",";
- }
- this.formPrice.dictLabel=tourLabels.substring(0, tourLabels.lastIndexOf(','));
- this.formPrice.dictValue=tourValue.substring(0, tourValue.lastIndexOf(','));
- this.formPrice.price=tourPrice.substring(0, tourPrice.lastIndexOf(','));
- this.formPrice.id=tourId.substring(0, tourId.lastIndexOf(','));
- //console.log(this.formPrice.TimeJson[0].id);
- if (this.formPrice.TimeJson[0].id != undefined) {
- updatePrice(this.formPrice).then(response => {
+ },
+ /** 鎻愪氦鎸夐挳 */
+ submitPrice: function() {
+ this.formPrice.effectiveDate;
+ this.$nextTick(() => {
+ this.formPrice.TimeJson = this.$refs["multipleTable"].data;
+ let tourId = "";
+ let tourLabels = "";
+ let tourValue = "";
+ let tourPrice = "";
+ for (let i = 0; i < this.formPrice.TimeJson.length; i++) {
+ tourLabels += this.formPrice.TimeJson[i].dictLabel + ",";
+ tourValue += this.formPrice.TimeJson[i].dictValue + ",";
+ tourPrice += this.formPrice.TimeJson[i].price + ",";
+ tourId += this.formPrice.TimeJson[i].id + ",";
+ }
+ this.formPrice.dictLabel = tourLabels.substring(
+ 0,
+ tourLabels.lastIndexOf(",")
+ );
+ this.formPrice.dictValue = tourValue.substring(
+ 0,
+ tourValue.lastIndexOf(",")
+ );
+ this.formPrice.price = tourPrice.substring(
+ 0,
+ tourPrice.lastIndexOf(",")
+ );
+ this.formPrice.id = tourId.substring(0, tourId.lastIndexOf(","));
+ //console.log(this.formPrice.TimeJson[0].id);
+ if (this.formPrice.TimeJson[0].id != undefined) {
+ updatePrice(this.formPrice).then(response => {
if (response.code === 200) {
this.msgSuccess("淇敼鎴愬姛");
this.openPrice = false;
@@ -363,7 +438,7 @@
this.msgError(response.msg);
}
});
- }else{
+ } else {
addPrice(this.formPrice).then(response => {
if (response.code === 200) {
this.msgSuccess("鏂板鎴愬姛");
@@ -373,89 +448,99 @@
}
});
}
- })
- this.loading = false;
- },
- addDate() {
- this.reset();
- this.time = true;
- this.title = "娣诲姞鐢熸晥鏃ユ湡";
- },
- /** 淇敼鎸夐挳鎿嶄綔 */
- handleUpdate() {
- this.reset();
- const id =this.ids
- getElectricity(id).then(response => {
- this.form = response.data;
- this.open = true;
- this.title = "淇敼鏂板鏃舵";
- });
- },
- /** 鎻愪氦鎸夐挳 */
- submitForm: function() {
- this.$refs["form"].validate(valid => {
- if (valid) {
- if (this.form.id != undefined) {
- updateElectricity(this.form).then(response => {
- if (response.code === 200) {
- this.msgSuccess("淇敼鎴愬姛");
- this.open = false;
- this.getList();
- this.getLists();
- } else {
- this.msgError(response.msg);
- }
- });
- } else {
- addElectricity(this.form).then(response => {
- if (response.code === 200) {
- this.msgSuccess("鏂板鎴愬姛");
- this.open = false;
- this.getList();
- this.getLists();
- } else {
- this.msgError(response.msg);
- }
- });
- }
+ });
+ this.loading = false;
+ },
+ addDate() {
+ this.reset();
+ this.time = true;
+ this.title = "娣诲姞鐢熸晥鏃ユ湡";
+ },
+ /** 淇敼鎸夐挳鎿嶄綔 */
+ handleUpdate() {
+ this.reset();
+ const id = this.ids;
+ getElectricity(id).then(response => {
+ this.form = response.data;
+ this.open = true;
+ this.title = "淇敼鏂板鏃舵";
+ });
+ },
+ /** 鎻愪氦鎸夐挳 */
+ submitForm: function() {
+ this.$refs["form"].validate(valid => {
+ if (valid) {
+ if (this.form.id != undefined) {
+ updateElectricity(this.form).then(response => {
+ if (response.code === 200) {
+ this.msgSuccess("淇敼鎴愬姛");
+ this.open = false;
+ this.getList();
+ this.getLists();
+ } else {
+ this.msgError(response.msg);
+ }
+ });
+ } else {
+ addElectricity(this.form).then(response => {
+ if (response.code === 200) {
+ this.msgSuccess("鏂板鎴愬姛");
+ this.open = false;
+ this.getList();
+ this.getLists();
+ } else {
+ this.msgError(response.msg);
+ }
+ });
}
- });
- },
- /** 鍒犻櫎鎸夐挳鎿嶄綔 */
- handleDelete(row) {
- const ids = row.id || this.ids;
- this.$confirm('鏄惁纭鍒犻櫎鏂板鏃舵缂栧彿涓�"' + ids + '"鐨勬暟鎹」?', "璀﹀憡", {
+ }
+ });
+ },
+ /** 鍒犻櫎鎸夐挳鎿嶄綔 */
+ handleDelete(row) {
+ const ids = row.id || this.ids;
+ this.$confirm(
+ '鏄惁纭鍒犻櫎鏂板鏃舵缂栧彿涓�"' + ids + '"鐨勬暟鎹」?',
+ "璀﹀憡",
+ {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function() {
+ }
+ )
+ .then(function() {
return delElectricity(ids);
- }).then(() => {
+ })
+ .then(() => {
this.getList();
this.getLists();
this.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(function() {});
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈塭lectricityPrice鏁版嵁椤�?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
+ })
+ .catch(function() {});
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈塭lectricityPrice鏁版嵁椤�?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
return exportElectricity(queryParams);
- }).then(response => {
+ })
+ .then(response => {
this.download(response.msg);
- }).catch(function() {});
- },
- changeTime(time) {
- if (time !== null && time !== undefined && time !== "") {
- return time.substring(0, 10);
- } else {
- return "";
- }
+ })
+ .catch(function() {});
+ },
+ changeTime(time) {
+ if (time !== null && time !== undefined && time !== "") {
+ return time.substring(0, 10);
+ } else {
+ return "";
}
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/electricityPrice/statistics/index.vue b/energy_management_ui/src/views/electricityPrice/statistics/index.vue
index 0bbc68d..f7a9462 100644
--- a/energy_management_ui/src/views/electricityPrice/statistics/index.vue
+++ b/energy_management_ui/src/views/electricityPrice/statistics/index.vue
@@ -1,55 +1,83 @@
-
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 宄板钩璋锋暟鎹粺璁�
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode" :showOpt="false" :modelCode="modelCode"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
- <electricityIndex ref="electricityIndex" style="padding:10px"></electricityIndex>
- </el-main>
- </el-container>
- </el-container>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="宄板钩璋锋暟鎹粺璁�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :modelCode="modelCode"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
+ <electricityIndexNew
+ ref="electricityIndex"
+ style="padding:10px"
+ ></electricityIndexNew>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import ModelNode from "../../basicsetting/modelNode/modelNode";
- import electricityIndex from "./electricityIndex";
- export default {
- components: { ModelNode,electricityIndex},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import electricityIndexNew from "./electricityIndexNew";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+
+export default {
+ components: { ModelNode, electricityIndexNew, ShrinkCol },
+ mixins: [mixins],
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ bodyStyleRight: {},
+ modelCode: undefined,
+ isCollapse: false
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.electricityIndex.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.electricityIndex.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/electricityPrice/statistics/pieChart.vue b/energy_management_ui/src/views/electricityPrice/statistics/pieChart.vue
index 6af9841..92ed64e 100644
--- a/energy_management_ui/src/views/electricityPrice/statistics/pieChart.vue
+++ b/energy_management_ui/src/views/electricityPrice/statistics/pieChart.vue
@@ -1,100 +1,103 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from './mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "./mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
- //required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ //required: true
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- data() {
- return {
- chart: null
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({legend,data} = {}) {
- this.chart.setOption({
- title: {
- text: '鏁版嵁鍒嗘瀽',
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'item',
- formatter: '{a} <br/>{b} : {c} ({d}%)'
- },
- legend: {
- //bottom: 10,
- top:"30",
- orient: 'vertical',
- left: '10',
- data: legend,
- },
- series: [
- {
- type: 'pie',
- radius: '65%',
- center: ['50%', '50%'],
- selectedMode: 'single',
- data:data,
- emphasis: {
- itemStyle: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: 'rgba(0, 0, 0, 0.5)'
- }
+ setOptions({ legend, data } = {}) {
+ this.chart.setOption({
+ title: {
+ text: "鏁版嵁鍒嗘瀽",
+ left: "left",
+ textStyle: {
+ color: "#606266"
+ }
+ },
+ tooltip: {
+ trigger: "item",
+ formatter: "{a} <br/>{b} : {c} ({d}%)"
+ },
+ legend: {
+ //bottom: 10,
+ top: "30",
+ orient: "vertical",
+ left: "10",
+ data: legend,
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ series: [
+ {
+ type: "pie",
+ radius: "65%",
+ center: ["50%", "50%"],
+ selectedMode: "single",
+ data: data,
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
- ]
- })
- },
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/energyAlarm/historicalAlarm/LChart.vue b/energy_management_ui/src/views/energyAlarm/historicalAlarm/LChart.vue
index ff1e935..56b2573 100644
--- a/energy_management_ui/src/views/energyAlarm/historicalAlarm/LChart.vue
+++ b/energy_management_ui/src/views/energyAlarm/historicalAlarm/LChart.vue
@@ -1,11 +1,10 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
-
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
/*import resize from './mixins/resize'*/
export default {
@@ -13,15 +12,15 @@
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
autoResize: {
type: Boolean,
@@ -35,37 +34,58 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
setOptions({ expectedData, actualData } = {}) {
this.chart.setOption({
xAxis: {
- data: ['04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00' , '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00'],
+ data: [
+ "04:00",
+ "05:00",
+ "06:00",
+ "07:00",
+ "08:00",
+ "09:00",
+ "10:00",
+ "11:00",
+ "12:00",
+ "13:00",
+ "14:00",
+ "15:00",
+ "16:00",
+ "17:00",
+ "18:00",
+ "19:00",
+ "20:00",
+ "21:00",
+ "22:00",
+ "23:00"
+ ],
boundaryGap: false,
axisTick: {
show: false
@@ -79,9 +99,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -91,48 +111,100 @@
}
},
legend: {
- data: ['棰勮鍊�','闄愬��']
+ data: ["棰勮鍊�", "闄愬��"],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: '棰勮鍊�', itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2,
-
- },
-
- }
- },
- smooth: true,
- type: 'line',
- data:[200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200, 200],
- animationDuration: 1000,
- animationEasing: 'cubicInOut'
- },
+ series: [
{
- name: '闄愬��',
- smooth: true,
- type: 'line',
+ name: "棰勮鍊�",
itemStyle: {
normal: {
- color: '#3888fa',
+ color: "#FF005A",
lineStyle: {
- color: '#3888fa',
+ color: "#FF005A",
width: 2
- },
- areaStyle: {
- color: '#f3f8ff'
}
}
},
- data:[200, 200, 181, 224,210, 172, 181, 224,210, 172, 181, 224,210, 172, 181, 224,210, 172, 181, 224,210, 172, 181],
+ smooth: true,
+ type: "line",
+ data: [
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200,
+ 200
+ ],
+ animationDuration: 1000,
+ animationEasing: "cubicInOut"
+ },
+ {
+ name: "闄愬��",
+ smooth: true,
+ type: "line",
+ itemStyle: {
+ normal: {
+ color: "#3888fa",
+ lineStyle: {
+ color: "#3888fa",
+ width: 2
+ },
+ areaStyle: {
+ color: "#f3f8ff"
+ }
+ }
+ },
+ data: [
+ 200,
+ 200,
+ 181,
+ 224,
+ 210,
+ 172,
+ 181,
+ 224,
+ 210,
+ 172,
+ 181,
+ 224,
+ 210,
+ 172,
+ 181,
+ 224,
+ 210,
+ 172,
+ 181,
+ 224,
+ 210,
+ 172,
+ 181
+ ],
animationDuration: 800,
- animationEasing: 'quadraticOut'
- }]
- })
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue b/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue
index 9e28403..7eac573 100644
--- a/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue
+++ b/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue
@@ -2,24 +2,40 @@
<template>
<div class="app-container" style="padding:0">
<el-card class="box-card">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
<el-form-item label="闄愬�肩被鍨�" prop="limitType">
- <el-select v-model="queryParams.limitType" placeholder="闄愬�肩被鍨�" clearable>
+ <el-select
+ v-model="queryParams.limitType"
+ placeholder="闄愬�肩被鍨�"
+ clearable
+ >
<el-option
v-for="dict in limitTypeOptions"
:key="dict.limitCode"
:label="dict.limitName"
- :value="dict.limitCode">
+ :value="dict.limitCode"
+ >
</el-option>
</el-select>
</el-form-item>
<el-form-item label="鎶ヨ绾у埆" prop="alarmLevel">
- <el-select v-model="queryParams.alarmLevel" placeholder="鎶ヨ绾у埆" clearable>
+ <el-select
+ v-model="queryParams.alarmLevel"
+ placeholder="鎶ヨ绾у埆"
+ clearable
+ >
<el-option
v-for="dict in alarmLevelOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
- :value="dict.dictValue">
+ :value="dict.dictValue"
+ >
</el-option>
</el-select>
</el-form-item>
@@ -40,61 +56,105 @@
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="鑷�"
start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ end-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
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鏌ヨ</el-button
+ >
</el-form-item>
-
</el-form>
<el-row :gutter="10" class="mb8">
-<!-- <el-col :span="1.5">-->
-<!-- <el-button-->
-<!-- type="warning"-->
-<!-- icon="el-icon-download"-->
-<!-- size="mini"-->
-<!-- @click="handleExport"-->
-<!-- v-hasPermi="['energyAlarm:historicalAlarm:export']"-->
-<!-- >瀵煎嚭-->
-<!-- </el-button>-->
-<!-- </el-col>-->
+ <!-- <el-col :span="1.5">-->
+ <!-- <el-button-->
+ <!-- type="warning"-->
+ <!-- icon="el-icon-download"-->
+ <!-- size="mini"-->
+ <!-- @click="handleExport"-->
+ <!-- v-hasPermi="['energyAlarm:historicalAlarm:export']"-->
+ <!-- >瀵煎嚭-->
+ <!-- </el-button>-->
+ <!-- </el-col>-->
</el-row>
<el-form>
- <el-table :data="JkHistoryAlarmList" v-loading="loading" border @selection-change="" @cell-click="openDialog" >
- <el-table-column label="搴忓彿" type="index" align="center"/>
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code"/>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName">
- <template slot-scope="scope">
- <div style="color:blue;text-decoration:underline ;cursor:pointer">{{scope.row.indexName}}</div>
- </template>
- </el-table-column>
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" />
- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" />
- <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" />
- <el-table-column label="闄愬��" align="center" prop="limitingValue"/>
- <el-table-column label="鎶ヨ鏃堕棿璧�" align="center" prop="alarmBeginTime"/>
- <el-table-column label="鎶ヨ鏃堕棿姝�" align="center" prop="alarmEndTime"/>
- <el-table-column label="鎶ヨ鍊�" align="center" prop="alarmValue" />
- <el-table-column label="鎸佺画鏃堕暱(鍒嗛挓)" align="center" prop="duration" width="96px" />
- </el-table>
+ <el-table
+ :data="JkHistoryAlarmList"
+ v-loading="loading"
+ border
+ @selection-change=""
+ @cell-click="openDialog"
+ >
+ <el-table-column label="搴忓彿" type="index" align="center" />
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName">
+ <template slot-scope="scope">
+ <div style="color:blue;text-decoration:underline ;cursor:pointer">
+ {{ scope.row.indexName }}
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" />
+ <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" />
+ <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" />
+ <el-table-column label="闄愬��" align="center" prop="limitingValue" />
+ <el-table-column
+ label="鎶ヨ鏃堕棿璧�"
+ align="center"
+ prop="alarmBeginTime"
+ />
+ <el-table-column
+ label="鎶ヨ鏃堕棿姝�"
+ align="center"
+ prop="alarmEndTime"
+ />
+ <el-table-column label="鎶ヨ鍊�" align="center" prop="alarmValue" />
+ <el-table-column
+ label="鎸佺画鏃堕暱(鍒嗛挓)"
+ align="center"
+ prop="duration"
+ width="96px"
+ />
+ </el-table>
</el-form>
<pagination
- v-show="total>0"
+ v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!--寮规-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false">
- <el-row style="background:#fff;margin-bottom:32px;">
- <el-tabs v-model="activeName" @tab-click="handleClick" >
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ >
+ <el-row style="margin-bottom:32px;">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="鍘嗗彶鏁版嵁鏇茬嚎鍥�" name="second">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName" :limitVal="limitVal"></history-alarm-view>
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ :limitVal="limitVal"
+ ></history-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏌ヨ" name="third">
- <history-alarm-table ref="historyAlarmTable" :code="code" :indexName="indexName" :activeName="activeName" :indexUnit="indexUnit" :limitVal="limitVal"></history-alarm-table>
+ <history-alarm-table
+ ref="historyAlarmTable"
+ :code="code"
+ :indexName="indexName"
+ :activeName="activeName"
+ :indexUnit="indexUnit"
+ :limitVal="limitVal"
+ ></history-alarm-table>
</el-tab-pane>
</el-tabs>
</el-row>
@@ -107,217 +167,220 @@
</template>
<script>
+import {
+ listHistoryAlarmNote,
+ exportHistoricalAlarm
+} from "@/api/basicsetting/historyAlarm";
+import { listLimitType } from "@/api/basicsetting/limitType";
+import historyAlarmView from "../realTimeAlarm/historyAlarmView";
+import historyAlarmTable from "../realTimeAlarm/historyAlarmTable";
- import {listHistoryAlarmNote,exportHistoricalAlarm } from "@/api/basicsetting/historyAlarm";
- import {listLimitType} from "@/api/basicsetting/limitType"
- import historyAlarmView from "../realTimeAlarm/historyAlarmView"
- import historyAlarmTable from "../realTimeAlarm/historyAlarmTable"
-
- export default {
- components: {historyAlarmView,historyAlarmTable},
- name: 'historyAlarmNote',
- props:['svgId','tagId'],
- data() {
- return {
- num: 20,
- num1:5,
- code:undefined,
- value:'',
- options:undefined,
- radio: 'B',
- activeName: 'second',
- indexId:undefined,
- indexName:undefined,
- indexUnit:undefined,
- limitVal:undefined,
- hiddenTableHeader:false,
- limitTypeOptions:[],
- alarmLevelOptions:[],
- resposeList:[],
- // 閬僵灞�
- loading: false,
- // 閫変腑鏁扮粍
- ids: [],
- dateRange: [],
- names: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 10,
- // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
- List: [],
- energyindexList: [],
- // 寮瑰嚭灞傛爣棰�
- JkHistoryAlarmList:[],
- title: "鍘嗗彶鏁版嵁鏌ヨ",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- // 涓婚敭瀛楀吀
- indexIdOptions: [],
- // 鎸囨爣鍚嶇О瀛楀吀
- nameOptions: [],
- // 鎸囨爣缂栫爜瀛楀吀
- codeOptions: [],
- // 鍗曚綅瀛楀吀
- unitIdOptions: [],
- // 鏌ヨ鍙傛暟
- lineChartData:{
- newVisitis:null,
- },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- indexType:'COLLECT',
- code: undefined,
- indexName:undefined,
- limitType: undefined,
- alarmLevel: undefined,
- nodeId:undefined,
- beginTime: undefined,
- endTime:undefined,
- svgId:undefined,
- nodeId:undefined,
- },
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- indexCategoryDefaultVal: undefined,
- unitDefaultVal: undefined
- };
- },
- created() {
- if (this.$props.tagId) {
- this.queryParams.nodeId = this.$props.tagId;
- }
- //this.queryParams.svgId=this.svgId;
- this.getDicts("alarm_level").then(response => {
- this.alarmLevelOptions = response.data;
- });
- this.getDicts("sys_unit").then(response => {
- this.unitIdOptions = response.data;
- });
- listLimitType(this.queryParams).then(response => {
- this.limitTypeOptions = response.rows;
- });
- },
- methods: {
- show(nodeId)
- {
- this.queryParams.nodeId = nodeId;
- this.getList();
+export default {
+ components: { historyAlarmView, historyAlarmTable },
+ name: "historyAlarmNote",
+ props: ["svgId", "tagId"],
+ data() {
+ return {
+ num: 20,
+ num1: 5,
+ code: undefined,
+ value: "",
+ options: undefined,
+ radio: "B",
+ activeName: "second",
+ indexId: undefined,
+ indexName: undefined,
+ indexUnit: undefined,
+ limitVal: undefined,
+ hiddenTableHeader: false,
+ limitTypeOptions: [],
+ alarmLevelOptions: [],
+ resposeList: [],
+ // 閬僵灞�
+ loading: false,
+ // 閫変腑鏁扮粍
+ ids: [],
+ dateRange: [],
+ names: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 10,
+ // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
+ List: [],
+ energyindexList: [],
+ // 寮瑰嚭灞傛爣棰�
+ JkHistoryAlarmList: [],
+ title: "鍘嗗彶鏁版嵁鏌ヨ",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 涓婚敭瀛楀吀
+ indexIdOptions: [],
+ // 鎸囨爣鍚嶇О瀛楀吀
+ nameOptions: [],
+ // 鎸囨爣缂栫爜瀛楀吀
+ codeOptions: [],
+ // 鍗曚綅瀛楀吀
+ unitIdOptions: [],
+ // 鏌ヨ鍙傛暟
+ lineChartData: {
+ newVisitis: null
},
- getList() {
- this.loading = true;
- listHistoryAlarmNote(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
- this.JkHistoryAlarmList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ indexType: "COLLECT",
+ code: undefined,
+ indexName: undefined,
+ limitType: undefined,
+ alarmLevel: undefined,
+ nodeId: undefined,
+ beginTime: undefined,
+ endTime: undefined,
+ svgId: undefined,
+ nodeId: undefined
},
- /** 鏌ョ湅鎸夐挳鎿嶄綔 */
- handleUpdate(row) {
- this.reset();
- const indexId = row.indexId || this.ids;
- this.open = true;
- },
- // 鍗曚綅瀛楀吀缈昏瘧
- unitIdFormat(row, column) {
- return this.selectDictLabel(this.unitIdOptions, row.unitId);
- },
- // 鎶ヨ绾у埆瀛楀吀缈昏瘧
- alarmLevelFormat(row, column) {
- return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- indexId: undefined,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- remark: undefined,
- unitId: undefined
- };
- this.resetForm("form");
- },
- // modelNodeChange(modelNode) {
- // this.queryParams.nodeId = modelNode.id;
- // this.getList();
- // },
- formatDate: function (value) {
- let date = new Date(value);
- let y = date.getFullYear();
- let MM = date.getMonth() + 1;
- MM = MM < 10 ? ('0' + MM) : MM;
- let d = date.getDate();
- d = d < 10 ? ('0' + d) : d;
- let h = date.getHours();
- h = h < 10 ? ('0' + h) : h;
- let m = date.getMinutes();
- m = m < 10 ? ('0' + m) : m;
- let s = date.getSeconds();
- s = s < 10 ? ('0' + s) : s;
- return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
- },
-
-
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.dateRange = [];
- this.resetForm("queryForm");
- },
-
- handleSelectionChange() {
- },
- openDialog(row,column,event,cell){
- if("indexName"==column.property){
- this.open = true;
- }
- this.code = row.code;
- this.indexName = row.indexName;
- this.indexId = row.indexId;
- this.activeName = "second";
- this.indexUnit = row.unitId;
- this.limitVal = row.limitingValue;
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
- return exportHistoricalAlarm(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function() {});
-
- },
- //闄愬埗绫诲瀷缈昏瘧
- limitTypeFormat(row,column){
- var actions = [];
- Object.keys(this.limitTypeOptions).map((key) => {
- if (this.limitTypeOptions[key].limitCode == ('' + row.limitType)) {
- actions.push(this.limitTypeOptions[key].limitName);
- }
- });
- return actions.join('');
- },
- handleClick(tab, event){
- this.activeName = tab.name;
- },
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ indexCategoryDefaultVal: undefined,
+ unitDefaultVal: undefined
+ };
+ },
+ created() {
+ if (this.$props.tagId) {
+ this.queryParams.nodeId = this.$props.tagId;
}
- };
+ //this.queryParams.svgId=this.svgId;
+ this.getDicts("alarm_level").then(response => {
+ this.alarmLevelOptions = response.data;
+ });
+ this.getDicts("sys_unit").then(response => {
+ this.unitIdOptions = response.data;
+ });
+ listLimitType(this.queryParams).then(response => {
+ this.limitTypeOptions = response.rows;
+ });
+ },
+ methods: {
+ show(nodeId) {
+ this.queryParams.nodeId = nodeId;
+ this.getList();
+ },
+ getList() {
+ this.loading = true;
+ listHistoryAlarmNote(
+ this.addDateRange(this.queryParams, this.dateRange)
+ ).then(response => {
+ this.JkHistoryAlarmList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ },
+ /** 鏌ョ湅鎸夐挳鎿嶄綔 */
+ handleUpdate(row) {
+ this.reset();
+ const indexId = row.indexId || this.ids;
+ this.open = true;
+ },
+ // 鍗曚綅瀛楀吀缈昏瘧
+ unitIdFormat(row, column) {
+ return this.selectDictLabel(this.unitIdOptions, row.unitId);
+ },
+ // 鎶ヨ绾у埆瀛楀吀缈昏瘧
+ alarmLevelFormat(row, column) {
+ return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ indexId: undefined,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ remark: undefined,
+ unitId: undefined
+ };
+ this.resetForm("form");
+ },
+ // modelNodeChange(modelNode) {
+ // this.queryParams.nodeId = modelNode.id;
+ // this.getList();
+ // },
+ formatDate: function(value) {
+ let date = new Date(value);
+ let y = date.getFullYear();
+ let MM = date.getMonth() + 1;
+ MM = MM < 10 ? "0" + MM : MM;
+ let d = date.getDate();
+ d = d < 10 ? "0" + d : d;
+ let h = date.getHours();
+ h = h < 10 ? "0" + h : h;
+ let m = date.getMinutes();
+ m = m < 10 ? "0" + m : m;
+ let s = date.getSeconds();
+ s = s < 10 ? "0" + s : s;
+ return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
+ },
+
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.dateRange = [];
+ this.resetForm("queryForm");
+ },
+
+ handleSelectionChange() {},
+ openDialog(row, column, event, cell) {
+ if ("indexName" == column.property) {
+ this.open = true;
+ }
+ this.code = row.code;
+ this.indexName = row.indexName;
+ this.indexId = row.indexId;
+ this.activeName = "second";
+ this.indexUnit = row.unitId;
+ this.limitVal = row.limitingValue;
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
+ return exportHistoricalAlarm(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
+ },
+ //闄愬埗绫诲瀷缈昏瘧
+ limitTypeFormat(row, column) {
+ var actions = [];
+ Object.keys(this.limitTypeOptions).map(key => {
+ if (this.limitTypeOptions[key].limitCode == "" + row.limitType) {
+ actions.push(this.limitTypeOptions[key].limitName);
+ }
+ });
+ return actions.join("");
+ },
+ handleClick(tab, event) {
+ this.activeName = tab.name;
+ }
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyAlarm/historicalAlarm/realIndex.vue b/energy_management_ui/src/views/energyAlarm/historicalAlarm/realIndex.vue
index 84debe2..a1e0cc3 100644
--- a/energy_management_ui/src/views/energyAlarm/historicalAlarm/realIndex.vue
+++ b/energy_management_ui/src/views/energyAlarm/historicalAlarm/realIndex.vue
@@ -1,104 +1,181 @@
<template>
<div class="historicalAlarm-right">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
<el-form-item>
<el-radio-group v-model="queryParams.eierarchyFlag">
- <el-radio label="B" style="margin-right: 10px!important;" onselect="true">鏈骇</el-radio>
+ <el-radio
+ label="B"
+ style="margin-right: 10px!important;"
+ onselect="true"
+ >鏈骇</el-radio
+ >
<el-radio label="ALL">鍖呭惈涓嬬骇</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="闄愬�肩被鍨�" prop="limitType">
- <el-select v-model="queryParams.limitType" placeholder="闄愬�肩被鍨�" clearable>
+ <el-select
+ v-model="queryParams.limitType"
+ placeholder="闄愬�肩被鍨�"
+ clearable
+ >
<el-option
- v-for="dict in limitTypeOptions"
- :key="dict.limitCode"
- :label="dict.limitName"
- :value="dict.limitCode">
+ v-for="dict in limitTypeOptions"
+ :key="dict.limitCode"
+ :label="dict.limitName"
+ :value="dict.limitCode"
+ >
</el-option>
</el-select>
</el-form-item>
<el-form-item label="鎶ヨ绾у埆" prop="alarmLevel">
- <el-select v-model="queryParams.alarmLevel" placeholder="鎶ヨ绾у埆" clearable>
+ <el-select
+ v-model="queryParams.alarmLevel"
+ placeholder="鎶ヨ绾у埆"
+ clearable
+ >
<el-option
- v-for="dict in alarmLevelOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue">
+ v-for="dict in alarmLevelOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
+ >
</el-option>
</el-select>
</el-form-item>
<el-form-item label="鎸囨爣鍚嶇О" prop="indexName">
<el-input
- v-model="queryParams.indexName"
- placeholder="璇疯緭鍏ユ寚鏍囧悕绉�"
- clearable
- size="small"
- @keyup.enter.native="handleQuery"
- style="width:160px"
+ v-model="queryParams.indexName"
+ placeholder="璇疯緭鍏ユ寚鏍囧悕绉�"
+ clearable
+ size="small"
+ @keyup.enter.native="handleQuery"
+ style="width:160px"
/>
</el-form-item>
<el-form-item label="璧锋鏃堕棿">
<el-date-picker
- v-model="dateRange"
- type="datetimerange"
- value-format="yyyy-MM-dd HH:mm:ss"
- range-separator="鑷�"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ v-model="dateRange"
+ type="datetimerange"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-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
- type="warning"
- icon="el-icon-download"
- size="mini"
- @click="handleExport"
- v-hasPermi="['energyAlarm:historicalAlarm:export']"
- >瀵煎嚭
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鏌ヨ</el-button
+ >
+ <el-button
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ @click="handleExport"
+ v-hasPermi="['energyAlarm:historicalAlarm:export']"
+ >瀵煎嚭
</el-button>
</el-form-item>
-
</el-form>
<el-form>
- <el-table :data="JkHistoryAlarmList" v-loading="loading" border @selection-change="" @cell-click="openDialog"
- :height="height"
+ <el-table
+ :data="JkHistoryAlarmList"
+ v-loading="loading"
+ border
+ @selection-change=""
+ @cell-click="openDialog"
+ :height="height"
>
- <el-table-column label="搴忓彿" type="index" align="center"/>
- <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="modelName"/>
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code"/>
+ <el-table-column label="搴忓彿" type="index" align="center" />
+ <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="modelName" />
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
<el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName">
<template slot-scope="scope">
- <div style="color:blue;text-decoration:underline ;cursor:pointer">{{ scope.row.indexName }}</div>
+ <div style="color:blue;text-decoration:underline ;cursor:pointer">
+ {{ scope.row.indexName }}
+ </div>
</template>
</el-table-column>
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat"/>
- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" :formatter="alarmLevelFormat"/>
- <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" :formatter="limitTypeFormat"/>
- <el-table-column label="闄愬��" align="center" prop="limitingValue"/>
- <el-table-column label="鎶ヨ鏃堕棿璧�" align="center" prop="alarmBeginTime"/>
- <el-table-column label="鎶ヨ鏃堕棿姝�" align="center" prop="alarmEndTime"/>
- <el-table-column label="棰勮鍊�" align="center" prop="alarmValue"/>
- <el-table-column label="鎸佺画鏃堕暱(鍒嗛挓)" align="center" prop="duration" width="96px"/>
+ <el-table-column
+ label="鎸囨爣鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <el-table-column
+ label="鎶ヨ绾у埆"
+ align="center"
+ prop="alarmLevel"
+ :formatter="alarmLevelFormat"
+ />
+ <el-table-column
+ label="闄愬�肩被鍨�"
+ align="center"
+ prop="limitType"
+ :formatter="limitTypeFormat"
+ />
+ <el-table-column label="闄愬��" align="center" prop="limitingValue" />
+ <el-table-column
+ label="鎶ヨ鏃堕棿璧�"
+ align="center"
+ prop="alarmBeginTime"
+ />
+ <el-table-column
+ label="鎶ヨ鏃堕棿姝�"
+ align="center"
+ prop="alarmEndTime"
+ />
+ <el-table-column label="棰勮鍊�" align="center" prop="alarmValue" />
+ <el-table-column
+ label="鎸佺画鏃堕暱(鍒嗛挓)"
+ align="center"
+ prop="duration"
+ width="96px"
+ />
</el-table>
</el-form>
<pagination
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getList"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
/>
<!--寮规-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false">
- <el-row style="background:#fff;margin-bottom:32px;">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ >
+ <el-row style="margin-bottom:32px;">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="鍘嗗彶鏁版嵁鏇茬嚎鍥�" name="second">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName"
- :limitVal="limitVal"></history-alarm-view>
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ :limitVal="limitVal"
+ ></history-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏌ヨ" name="third">
- <history-alarm-table ref="historyAlarmTable" :code="code" :indexName="indexName" :activeName="activeName"
- :indexUnit="indexUnit" :limitVal="limitVal"></history-alarm-table>
+ <history-alarm-table
+ ref="historyAlarmTable"
+ :code="code"
+ :indexName="indexName"
+ :activeName="activeName"
+ :indexUnit="indexUnit"
+ :limitVal="limitVal"
+ ></history-alarm-table>
</el-tab-pane>
</el-tabs>
</el-row>
@@ -110,16 +187,19 @@
</template>
<script>
-
-import {listHistoryAlarm, exportHistoricalAlarm, getHistoricalAlarm} from "@/api/basicsetting/historyAlarm";
-import {listLimitType} from "@/api/basicsetting/limitType"
-import historyAlarmView from "../realTimeAlarm/historyAlarmView"
-import historyAlarmTable from "../realTimeAlarm/historyAlarmTable"
+import {
+ listHistoryAlarm,
+ exportHistoricalAlarm,
+ getHistoricalAlarm
+} from "@/api/basicsetting/historyAlarm";
+import { listLimitType } from "@/api/basicsetting/limitType";
+import historyAlarmView from "../realTimeAlarm/historyAlarmView";
+import historyAlarmTable from "../realTimeAlarm/historyAlarmTable";
import mixins from "@/layout/mixin/getHeight";
export default {
- components: {historyAlarmView, historyAlarmTable},
- name: 'historyAlarm',
+ components: { historyAlarmView, historyAlarmTable },
+ name: "historyAlarm",
mixins: [mixins],
data() {
return {
@@ -129,11 +209,11 @@
/* value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],*/
},
code: undefined,
- value: '',
+ value: "",
options: undefined,
// handleClick:'simple',
- radio: 'B',
- activeName: 'second',
+ radio: "B",
+ activeName: "second",
indexId: undefined,
indexName: undefined,
indexUnit: undefined,
@@ -174,13 +254,13 @@
unitIdOptions: [],
// 鏌ヨ鍙傛暟
lineChartData: {
- newVisitis: null,
+ newVisitis: null
},
queryParams: {
pageNum: 1,
pageSize: 10,
- eierarchyFlag: 'B',
- indexType: 'COLLECT',
+ eierarchyFlag: "B",
+ indexType: "COLLECT",
code: undefined,
indexName: undefined,
/* unitId: undefined,*/
@@ -190,8 +270,7 @@
/* limitingValue:undefined,*/
nodeId: undefined,
beginTime: undefined,
- endTime: undefined,
-
+ endTime: undefined
},
// 琛ㄥ崟鍙傛暟
form: {},
@@ -216,11 +295,13 @@
},
methods: {
setCharts() {
- this.height = window.innerHeight - 370 + 'px'
+ this.height = window.innerHeight - 370 + "px";
},
getList() {
this.loading = true;
- listHistoryAlarm(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+ listHistoryAlarm(
+ this.addDateRange(this.queryParams, this.dateRange)
+ ).then(response => {
this.JkHistoryAlarmList = response.rows;
this.total = response.total;
this.loading = false;
@@ -266,7 +347,8 @@
this.queryParams.nodeId = modelNode.id;
this.settingDeviceList = [];
this.settingIndexList = [];
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null;
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
if (modelNode) {
this.currentNode = modelNode;
this.deviceLoading = true;
@@ -292,7 +374,6 @@
// return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
// },
-
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
this.getList();
@@ -303,8 +384,7 @@
this.resetForm("queryForm");
},
- handleSelectionChange() {
- },
+ handleSelectionChange() {},
openDialog(row, column, event, cell) {
if ("indexName" == column.property) {
this.open = true;
@@ -319,51 +399,56 @@
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportHistoricalAlarm(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
-
+ })
+ .then(function() {
+ return exportHistoricalAlarm(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
//闄愬埗绫诲瀷缈昏瘧
limitTypeFormat(row, column) {
var actions = [];
- Object.keys(this.limitTypeOptions).map((key) => {
- if (this.limitTypeOptions[key].limitCode == ('' + row.limitType)) {
+ Object.keys(this.limitTypeOptions).map(key => {
+ if (this.limitTypeOptions[key].limitCode == "" + row.limitType) {
actions.push(this.limitTypeOptions[key].limitName);
}
});
- return actions.join('');
+ return actions.join("");
},
handleClick(tab, event) {
this.activeName = tab.name;
},
getTime() {
var myDate = new Date();
- var monthFirst = new Date(myDate.getFullYear(), parseInt(myDate.getMonth()), 1);
+ var monthFirst = new Date(
+ myDate.getFullYear(),
+ parseInt(myDate.getMonth()),
+ 1
+ );
this.dateRange = [this.formatDate(monthFirst), this.formatDate(myDate)];
},
- formatDate: function (value) {
+ formatDate: function(value) {
let date = new Date(value);
let y = date.getFullYear();
let MM = date.getMonth() + 1;
- MM = MM < 10 ? ('0' + MM) : MM;
+ MM = MM < 10 ? "0" + MM : MM;
let d = date.getDate();
- d = d < 10 ? ('0' + d) : d;
+ d = d < 10 ? "0" + d : d;
let h = date.getHours();
- h = h < 10 ? ('0' + h) : h;
+ h = h < 10 ? "0" + h : h;
let m = date.getMinutes();
- m = m < 10 ? ('0' + m) : m;
+ m = m < 10 ? "0" + m : m;
let s = date.getSeconds();
- s = s < 10 ? ('0' + s) : s;
- return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
- },
+ s = s < 10 ? "0" + s : s;
+ return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
+ }
}
};
</script>
diff --git a/energy_management_ui/src/views/energyAlarm/realTimeAlarm/LineChart.vue b/energy_management_ui/src/views/energyAlarm/realTimeAlarm/LineChart.vue
index 5299027..4189cc0 100644
--- a/energy_management_ui/src/views/energyAlarm/realTimeAlarm/LineChart.vue
+++ b/energy_management_ui/src/views/energyAlarm/realTimeAlarm/LineChart.vue
@@ -1,10 +1,10 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons'); // echarts theme
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
// import resize from './mixins/resize'
export default {
@@ -12,61 +12,60 @@
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
autoResize: {
type: Boolean,
default: true
},
chartData: {
- type: Object,
+ type: Object
// required: true
- },
-
+ }
},
data() {
return {
chart: null,
- alarmLimitName:undefined
- }
+ alarmLimitName: undefined
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
this.chart.dispose();
- this.chart = null
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons');
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,timeList } = {}) {
- if(expectedData.length>0){
+ setOptions({ expectedData, actualData, timeList } = {}) {
+ if (expectedData.length > 0) {
this.alarmLimitName = "鎶ヨ闄愬��";
- }else {
+ } else {
this.alarmLimitName = " ";
}
this.chart.setOption({
@@ -85,9 +84,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -97,48 +96,53 @@
}
},
legend: {
- data: [this.alarmLimitName, '瀹炴椂鍊�']
+ data: [this.alarmLimitName, "瀹炴椂鍊�"],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- symbol: "none",
- name: '鎶ヨ闄愬��',
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ symbol: "none",
+ name: "鎶ヨ闄愬��",
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
},
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- },
- {
- name: '瀹炴椂鍊�',
- smooth: true,
- type: 'line',
- itemStyle: {
- normal: {
- color: '#3888fa',
- lineStyle: {
- color: '#3888fa',
- width: 2
- },
- areaStyle: {
- color: '#f3f8ff'
+ {
+ name: "瀹炴椂鍊�",
+ smooth: true,
+ type: "line",
+ itemStyle: {
+ normal: {
+ color: "#3888fa",
+ lineStyle: {
+ color: "#3888fa",
+ width: 2
+ },
+ areaStyle: {
+ color: "#f3f8ff"
+ }
}
- }
- },
- data: actualData,
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
+ },
+ data: actualData,
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyAlarm/realTimeAlarm/index.vue b/energy_management_ui/src/views/energyAlarm/realTimeAlarm/index.vue
index cd355b2..276a9b8 100644
--- a/energy_management_ui/src/views/energyAlarm/realTimeAlarm/index.vue
+++ b/energy_management_ui/src/views/energyAlarm/realTimeAlarm/index.vue
@@ -1,17 +1,36 @@
<template>
<el-row type="flex">
- <el-col :style="{width:isCollapse?'0': '280px',position:'relative'}" v-show="!isCollapse">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
<basic-container title="瀹炴椂鎶ヨ" :bodyStyle="bodyStyle">
- <ModelNode ref="modelNode" @changeNode="changeNode" :showOpt="false" :modelCode="modelCode"/>
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :modelCode="modelCode"
+ />
</basic-container>
- <img src="~@/assets/image/rectangle.png" alt=""
- class="shrink-col-block"
- @click="toggleCollapse">
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
</el-col>
- <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse"/>
- <el-col :style="{width:isCollapse? 'calc(100% - 48px)':'calc(100% - 280px)',paddingLeft:isCollapse? 0:'14px'}">
- <basic-container :title="currentNode ? currentNode.label+'--鑺傜偣閰嶇疆' : '鑺傜偣閰嶇疆'" :bodyStyle="bodyStyleRight">
- <realTimeSetting ref="realTimeSetting"/>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container
+ :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鑺傜偣閰嶇疆'"
+ :bodyStyle="bodyStyleRight"
+ >
+ <realTimeSetting ref="realTimeSetting" />
</basic-container>
</el-col>
</el-row>
@@ -21,47 +40,47 @@
import realTimeSetting from "./modelRealTimeAlarmSetting";
import ModelNode from "../../basicsetting/modelNode/modelNode";
import mixins from "@/layout/mixin/getHeight";
-import ShrinkCol from '@/components/shrink/index.vue'
+import ShrinkCol from "@/components/shrink/index.vue";
export default {
- components: {realTimeSetting, ModelNode,ShrinkCol},
+ components: { realTimeSetting, ModelNode, ShrinkCol },
created() {
this.modelCode = this.$route.query.modelCode;
},
mixins: [mixins],
data() {
return {
- modelData: '',
+ modelData: "",
modelInfoOptions: [],
modelCode: undefined,
isCollapse: false,
bodyStyleRight: {},
- currentNode: ''
- }
+ currentNode: ""
+ };
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight -155 + 'px'
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 155 + 'px'
+ height: window.innerHeight - 185 + "px"
};
},
- changeNode: function (node) {
+ changeNode: function(node) {
if (node) {
- this.currentNode = node
+ this.currentNode = node;
}
this.$refs.realTimeSetting.modelNodeChange(node);
},
- manageModel: function () {
- this.$router.push('/model');
+ manageModel: function() {
+ this.$router.push("/model");
},
- changeModel: function (item) {
+ changeModel: function(item) {
// this.$refs.modelNode.getList(item);
},
// 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
toggleCollapse() {
- this.isCollapse = !this.isCollapse
+ this.isCollapse = !this.isCollapse;
}
}
};
diff --git a/energy_management_ui/src/views/energyAlarm/realTimeAlarm/modelRealTimeAlarmSetting.vue b/energy_management_ui/src/views/energyAlarm/realTimeAlarm/modelRealTimeAlarmSetting.vue
index 12e48ef..66ab786 100644
--- a/energy_management_ui/src/views/energyAlarm/realTimeAlarm/modelRealTimeAlarmSetting.vue
+++ b/energy_management_ui/src/views/energyAlarm/realTimeAlarm/modelRealTimeAlarmSetting.vue
@@ -3,98 +3,213 @@
<el-tabs>
<el-tab-pane :disabled="disabledSetting">
<span slot="label"><i class="el-icon-setting"></i>瀹炴椂鎶ヨ</span>
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
<el-form-item>
<el-radio-group v-model="queryParams.eierarchyFlag">
- <el-radio label="B" style="margin-right: 10px!important;" onselect="true">鏈骇</el-radio>
+ <el-radio
+ label="B"
+ style="margin-right: 10px!important;"
+ onselect="true"
+ >鏈骇</el-radio
+ >
<el-radio label="ALL">鍖呭惈涓嬬骇</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="闄愬�煎悕绉�" prop="limitValName">
- <el-select v-model="queryParams.limitType" placeholder="闄愬�煎悕绉�" clearable
- style="width:100px"
- size="mini">
+ <el-select
+ v-model="queryParams.limitType"
+ placeholder="闄愬�煎悕绉�"
+ clearable
+ style="width:100px"
+ size="mini"
+ >
<el-option
- v-for="dict in limitTypeOptions"
- :key="dict.limitCode"
- :label="dict.limitName"
- :value="dict.limitCode"
+ v-for="dict in limitTypeOptions"
+ :key="dict.limitCode"
+ :label="dict.limitName"
+ :value="dict.limitCode"
/>
</el-select>
</el-form-item>
<el-form-item label="鎶ヨ绾у埆" prop="alarmLevel">
- <el-select v-model="queryParams.alarmLevel" placeholder="鎶ヨ绾у埆" clearable
- style="width:100px"
- size="mini">
+ <el-select
+ v-model="queryParams.alarmLevel"
+ placeholder="鎶ヨ绾у埆"
+ clearable
+ style="width:100px"
+ size="mini"
+ >
<el-option
- v-for="dict in alarmLevelOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in alarmLevelOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item label="鎸囨爣鍚嶇О">
- <el-input style="width: 120px"
- v-model="queryParams.indexName"
- placeholder="鎸囨爣鍚嶇О"
- clearable
- size="mini"
- @keyup.enter.native="handleQuery"
+ <el-input
+ style="width: 120px"
+ v-model="queryParams.indexName"
+ placeholder="鎸囨爣鍚嶇О"
+ clearable
+ size="mini"
+ @keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="selectList">鏌ヨ</el-button>
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="selectList"
+ >鏌ヨ</el-button
+ >
<!--<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button>-->
</el-form-item>
</el-form>
<!--琛ㄦ牸-->
<el-form :model="model" ref="form" class="mainTable">
- <el-table v-loading="loading" :data="model.tableOptions" border @selection-change="handleSelectionChange"
- :default-sort="{prop: 'date', order: 'descending'}" @cell-click="openDialog"
- :height="height"
+ <el-table
+ v-loading="loading"
+ :data="model.tableOptions"
+ border
+ @selection-change="handleSelectionChange"
+ :default-sort="{ prop: 'date', order: 'descending' }"
+ @cell-click="openDialog"
+ :height="height"
>
- <el-table-column type="selection" width="55" align="center" show-overflow-tooltip/>
- <el-table-column label="搴忓彿" type="index" align="center" show-overflow-tooltip/>
- <el-table-column label="鍗曚綅鍚嶇О" align="center" width="100" prop="modelName" show-overflow-tooltip/>
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" show-overflow-tooltip/>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" width="100" prop="indexName" show-overflow-tooltip>
+ <el-table-column
+ type="selection"
+ width="55"
+ align="center"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="搴忓彿"
+ type="index"
+ align="center"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鍗曚綅鍚嶇О"
+ align="center"
+ width="100"
+ prop="modelName"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鎸囨爣缂栫爜"
+ align="center"
+ prop="code"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鎸囨爣鍚嶇О"
+ align="center"
+ width="100"
+ prop="indexName"
+ show-overflow-tooltip
+ >
<template slot-scope="scope">
- <div style="color:blue;text-decoration:underline;cursor:pointer">{{ scope.row.indexName }}</div>
+ <div
+ style="color:blue;text-decoration:underline;cursor:pointer"
+ >
+ {{ scope.row.indexName }}
+ </div>
</template>
</el-table-column>
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" :formatter="unitFormat" show-overflow-tooltip/>
- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" width="100" :formatter="alarmLevelFormat" show-overflow-tooltip/>
- <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" width="100" :formatter="limitTypeFormat" show-overflow-tooltip/>
- <el-table-column label="闄愬��" align="center" prop="limitingValue" show-overflow-tooltip/>
- <el-table-column label="鎶ヨ寮�濮嬫椂闂�" align="center" prop="alarmBeginTime" width="180" show-overflow-tooltip/>
- <el-table-column label="鎶ヨ鍊�" align="center" prop="alarmValue" show-overflow-tooltip/>
-
+ <el-table-column
+ label="鎸囨爣鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitFormat"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鎶ヨ绾у埆"
+ align="center"
+ prop="alarmLevel"
+ width="100"
+ :formatter="alarmLevelFormat"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="闄愬�肩被鍨�"
+ align="center"
+ prop="limitType"
+ width="100"
+ :formatter="limitTypeFormat"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="闄愬��"
+ align="center"
+ prop="limitingValue"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鎶ヨ寮�濮嬫椂闂�"
+ align="center"
+ prop="alarmBeginTime"
+ width="180"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鎶ヨ鍊�"
+ align="center"
+ prop="alarmValue"
+ show-overflow-tooltip
+ />
</el-table>
<pagination
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getList"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
/>
</el-form>
</el-tab-pane>
-
</el-tabs>
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false" @close="closeDialog">
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ @close="closeDialog"
+ >
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="瀹炴椂鏁版嵁鏇茬嚎鍥�" name="first">
- <live-alarm-view ref="liveAlarmView" :code="code" :activeName="activeName"
- :limitVal="limitVal"></live-alarm-view>
+ <live-alarm-view
+ ref="liveAlarmView"
+ :code="code"
+ :activeName="activeName"
+ :limitVal="limitVal"
+ ></live-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏇茬嚎鍥�" name="second">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName"
- :limitVal="limitVal"></history-alarm-view>
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ :limitVal="limitVal"
+ ></history-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏌ヨ" name="third">
- <history-alarm-table ref="historyAlarmTable" :code="code" :indexName="indexName" :activeName="activeName"
- :indexUnit="indexUnit"></history-alarm-table>
+ <history-alarm-table
+ ref="historyAlarmTable"
+ :code="code"
+ :indexName="indexName"
+ :activeName="activeName"
+ :indexUnit="indexUnit"
+ ></history-alarm-table>
</el-tab-pane>
</el-tabs>
</el-row>
@@ -106,15 +221,15 @@
</template>
<script>
-import {getRealTimeAlarmList} from "@/api/energyAlarm/realTimeAlarm/realTimeAlarm"
-import {listLimitType} from "@/api/basicsetting/limitType"
-import liveAlarmView from "./liveAlarmView"
-import historyAlarmView from "./historyAlarmView"
-import historyAlarmTable from "./historyAlarmTable"
+import { getRealTimeAlarmList } from "@/api/energyAlarm/realTimeAlarm/realTimeAlarm";
+import { listLimitType } from "@/api/basicsetting/limitType";
+import liveAlarmView from "./liveAlarmView";
+import historyAlarmView from "./historyAlarmView";
+import historyAlarmTable from "./historyAlarmTable";
import mixins from "@/layout/mixin/getHeight";
export default {
- components: {liveAlarmView, historyAlarmView, historyAlarmTable},
+ components: { liveAlarmView, historyAlarmView, historyAlarmTable },
name: "modelMonitorSetting",
mixins: [mixins],
data() {
@@ -131,10 +246,10 @@
indexName: undefined,
indexUnit: undefined,
//璁℃椂鍣ㄥ璞�
- timer: '',
+ timer: "",
//璁℃椂鍣ㄩ棿闅�
intervalTime: 30000,
- currentNode: '',
+ currentNode: "",
deviceDialog: false,
energyDialog: false,
productDialog: false,
@@ -148,11 +263,11 @@
eierarchyFlag: "ALL",
alarmLevel: undefined,
indexName: undefined,
- nodeId: undefined,//
+ nodeId: undefined, //
limitType: undefined,
indexType: "COLLECT",
pageNum: 1,
- pageSize: 10,
+ pageSize: 10
},
height: null,
//鎶ヨ绾у埆
@@ -161,9 +276,9 @@
unitOptions: [],
//琛ㄦ牸妯″瀷
model: {
- tableOptions: [],
- },
- }
+ tableOptions: []
+ }
+ };
},
created() {
this.getDicts("alarm_level").then(response => {
@@ -177,10 +292,12 @@
});
},
mounted() {
- this.getConfigKey("energyAlarm.realTimeAlarm.intervalTime").then(response => {
- this.intervalTime = response.msg;
- this.timer = setInterval(this.getList, this.intervalTime);
- });
+ this.getConfigKey("energyAlarm.realTimeAlarm.intervalTime").then(
+ response => {
+ this.intervalTime = response.msg;
+ this.timer = setInterval(this.getList, this.intervalTime);
+ }
+ );
},
beforeDestroy() {
//椤甸潰閿�姣佹椂 瑕佸仠姝㈣鏃跺櫒锛屽惁鍒欓�夐」鍗″垏鎹㈣鏃跺櫒涓嶅仠姝紝浼氳秺鏉ヨ秺蹇紝澶氫釜绾跨▼
@@ -190,11 +307,12 @@
},
methods: {
setCharts() {
- this.height = window.innerHeight - 380 + 'px'
+ this.height = window.innerHeight - 390 + "px";
},
modelNodeChange(modelNode) {
this.queryParams.nodeId = modelNode.id;
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null;
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
if (modelNode) {
this.currentNode = modelNode;
this.getList();
@@ -205,7 +323,7 @@
this.ids = selection.map(item => item.indexId);
this.names = selection.map(item => item.name);
this.single = selection.length !== 1;
- this.multiple = !selection.length
+ this.multiple = !selection.length;
},
getList() {
@@ -253,20 +371,20 @@
// 闄愬�肩被鍨嬪瓧鍏哥炕璇�
limitTypeFormat(row, column) {
var actions = [];
- Object.keys(this.limitTypeOptions).map((key) => {
- if (this.limitTypeOptions[key].limitCode == ('' + row.limitType)) {
+ Object.keys(this.limitTypeOptions).map(key => {
+ if (this.limitTypeOptions[key].limitCode == "" + row.limitType) {
actions.push(this.limitTypeOptions[key].limitName);
}
});
- return actions.join('');
+ return actions.join("");
},
/** 閲嶇疆鎸夐挳鎿嶄綔 */
resetQuery() {
this.resetForm("queryForm");
this.selectList();
- },
+ }
}
-}
+};
</script>
<style scoped lang="scss">
diff --git a/energy_management_ui/src/views/energyBalance/energyBalance/LineChart.vue b/energy_management_ui/src/views/energyBalance/energyBalance/LineChart.vue
index 9613210..61f0f91 100644
--- a/energy_management_ui/src/views/energyBalance/energyBalance/LineChart.vue
+++ b/energy_management_ui/src/views/energyBalance/energyBalance/LineChart.vue
@@ -1,110 +1,115 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '600px'
- },
- chartData: {
- type:Object,
- //required: true
- }
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
+ width: {
+ type: String,
+ default: "100%"
},
- data() {
- return {
- chart: null
- }
+ height: {
+ type: String,
+ default: "600px"
},
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({actualData,expectedData,title} = {}) {
- this.chart.setOption({
- title: {
- text: '鑳芥簮骞宠 鍒嗘瀽',
- x:'left',
- y: 'top',
- textStyle: {
- color: "#333",
- fontSize:16
- },
- },
- xAxis: {
- data: actualData,
- type: 'category',
- },
- grid: {
- left: 10,
- right: 10,
- bottom: 20,
- top: '15%',
- containLabel: true
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'cross'
- },
- padding: [5, 10]
- },
- yAxis: {
- axisTick: {
- show: false
- }
- },
- legend: {
- data: []
- },
- series: [{
- name: title,
- smooth: true,
- type: 'bar',
- barWidth: '60%',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ chartData: {
+ type: Object
+ //required: true
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
}
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
+ },
+ setOptions({ actualData, expectedData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: "鑳芥簮骞宠 鍒嗘瀽",
+ x: "left",
+ y: "top",
+ textStyle: {
+ color: "#fff",
+ fontSize: 16
+ }
+ },
+ xAxis: {
+ data: actualData,
+ type: "category"
+ },
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 20,
+ top: "15%",
+ containLabel: true
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ type: "cross"
+ },
+ padding: [5, 10]
+ },
+ yAxis: {
+ axisTick: {
+ show: false
+ }
+ },
+ legend: {
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ series: [
+ {
+ name: title,
+ smooth: true,
+ type: "bar",
+ barWidth: "60%",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
+ }
}
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyBalance/PieChart.vue b/energy_management_ui/src/views/energyBalance/energyBalance/PieChart.vue
index 30da0b7..2089877 100644
--- a/energy_management_ui/src/views/energyBalance/energyBalance/PieChart.vue
+++ b/energy_management_ui/src/views/energyBalance/energyBalance/PieChart.vue
@@ -1,29 +1,29 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
chartData: {
- type:Object,
+ type: Object
//required: true
}
},
@@ -31,109 +31,110 @@
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
data() {
return {
chart: null
- }
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({actualData,expectedData,title} = {}) {
+ setOptions({ actualData, expectedData, title } = {}) {
this.chart.setOption({
title: {
- text: '鑳芥簮骞宠 鍒嗘瀽',
- x:'left',
- y: 'top',
+ text: "鑳芥簮骞宠 鍒嗘瀽",
+ x: "left",
+ y: "top",
textStyle: {
color: "#333"
- },
+ }
},
tooltip: {
- trigger: 'item',
+ trigger: "item",
formatter: actualData
},
grid: {
top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
containLabel: true
},
legend: {
// orient 璁剧疆甯冨眬鏂瑰紡锛岄粯璁ゆ按骞冲竷灞�锛屽彲閫夊�硷細'horizontal'锛堟按骞筹級 娄 'vertical'锛堝瀭鐩达級
- orient: 'vertical',
+ orient: "vertical",
// x 璁剧疆姘村钩瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥惧眳涓紝鍙�夊�硷細'center' 娄 'left' 娄 'right' 娄 {number}锛坸鍧愭爣锛屽崟浣峱x锛�
- x: 'left',
+ x: "left",
// y 璁剧疆鍨傜洿瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥鹃《绔紝鍙�夊�硷細'top' 娄 'bottom' 娄 'center' 娄 {number}锛坹鍧愭爣锛屽崟浣峱x锛�
- y: '10%',
+ y: "10%",
//left: 10,
- itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
- itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
+ itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
+ itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
textStyle: {
- color: '#666' // 鍥句緥鏂囧瓧棰滆壊
+ color: "#fff" // 鍥句緥鏂囧瓧棰滆壊
},
// itemGap璁剧疆鍚勪釜item涔嬮棿鐨勯棿闅旓紝鍗曚綅px锛岄粯璁や负10锛屾í鍚戝竷灞�鏃朵负姘村钩闂撮殧锛岀旱鍚戝竷灞�鏃朵负绾靛悜闂撮殧
// itemGap: 30,
- backgroundColor: '#eee', // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
- data: actualData,
+ backgroundColor: "#eee", // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
+ data: actualData
},
- series: [{
- //name: '鑳芥簮',
- type: 'pie',
- radius: ['50%', '80%'], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
- center: ['50%', '50%'], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
- data: expectedData,
- // itemStyle 璁剧疆楗肩姸鍥炬墖褰㈠尯鍩熸牱寮�
- itemStyle: {
- // emphasis锛氳嫳鏂囨剰鎬濇槸 寮鸿皟;鐫�閲�;锛堣疆寤撱�佸浘褰㈢瓑鐨勶級椴滄槑;绐佸嚭锛岄噸璇�
- // emphasis锛氳缃紶鏍囨斁鍒板摢涓�鍧楁墖褰笂闈㈢殑鏃跺�欙紝鎵囧舰鏍峰紡銆侀槾褰�
- emphasis: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: 'rgba(30, 144, 255锛�0.5)'
- }
- },
- // 璁剧疆鍊煎煙鐨勯偅鎸囧悜绾�
- labelLine: {
- normal: {
- show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
- }
- },
- avoidLabelOverlap: false,
+ series: [
+ {
+ //name: '鑳芥簮',
+ type: "pie",
+ radius: ["50%", "80%"], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
+ center: ["50%", "50%"], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
+ data: expectedData,
+ // itemStyle 璁剧疆楗肩姸鍥炬墖褰㈠尯鍩熸牱寮�
+ itemStyle: {
+ // emphasis锛氳嫳鏂囨剰鎬濇槸 寮鸿皟;鐫�閲�;锛堣疆寤撱�佸浘褰㈢瓑鐨勶級椴滄槑;绐佸嚭锛岄噸璇�
+ // emphasis锛氳缃紶鏍囨斁鍒板摢涓�鍧楁墖褰笂闈㈢殑鏃跺�欙紝鎵囧舰鏍峰紡銆侀槾褰�
+ emphasis: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: "rgba(30, 144, 255锛�0.5)"
+ }
+ },
+ // 璁剧疆鍊煎煙鐨勯偅鎸囧悜绾�
+ labelLine: {
+ normal: {
+ show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
+ }
+ },
+ avoidLabelOverlap: false,
- // 璁剧疆鍊煎煙鐨勬爣绛�
- label: {
- normal: {
- position: 'inner', // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
- // formatter: '{a} {b} : {c}涓� ({d}%)' 璁剧疆鏍囩鏄剧ず鍐呭 锛岄粯璁ゆ樉绀簕b}
- // {a}鎸噑eries.name {b}鎸噑eries.data鐨刵ame
- // {c}鎸噑eries.data鐨剉alue {d}%鎸囪繖涓�閮ㄥ垎鍗犳�绘暟鐨勭櫨鍒嗘瘮
- formatter: '{b} : ({d}%)'
+ // 璁剧疆鍊煎煙鐨勬爣绛�
+ label: {
+ normal: {
+ position: "inner", // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
+ // formatter: '{a} {b} : {c}涓� ({d}%)' 璁剧疆鏍囩鏄剧ず鍐呭 锛岄粯璁ゆ樉绀簕b}
+ // {a}鎸噑eries.name {b}鎸噑eries.data鐨刵ame
+ // {c}鎸噑eries.data鐨剉alue {d}%鎸囪繖涓�閮ㄥ垎鍗犳�绘暟鐨勭櫨鍒嗘瘮
+ formatter: "{b} : ({d}%)"
+ }
}
}
- }
- ],
- })
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyBalance/energyBalance.vue b/energy_management_ui/src/views/energyBalance/energyBalance/energyBalance.vue
index 2955bcf..dd0f813 100644
--- a/energy_management_ui/src/views/energyBalance/energyBalance/energyBalance.vue
+++ b/energy_management_ui/src/views/energyBalance/energyBalance/energyBalance.vue
@@ -1,20 +1,43 @@
<template>
<div class="app-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 v-for="dict in dateTypeOptions" :key="dict.dictValue" :label="dict.dictValue" @change="handleTime(dict.dictValue)">{{dict.dictLabel}}</el-radio>
+ <el-radio
+ v-for="dict in dateTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictValue"
+ @change="handleTime(dict.dictValue)"
+ >{{ dict.dictLabel }}</el-radio
+ >
</el-radio-group>
</el-form-item>
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- :type="dateTypes"
- :value-format="valueFormat"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ :type="dateTypes"
+ :value-format="valueFormat"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
</el-date-picker>
<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>
<el-row :gutter="20">
@@ -25,73 +48,94 @@
</el-col>
</el-row>
<el-table :data="list" border>
- <el-table-column label="鍚嶇О" align="center" prop="label">{{label}}</el-table-column>
- <el-table-column label="浜у嚭" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_CC)}}</template></el-table-column>
- <el-table-column label="娑堣��" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_XH)}}</template></el-table-column>
- <el-table-column label="澶栦緵" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_WG)}}</template></el-table-column>
- <el-table-column label="鎹熻��" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_SH)}}</template></el-table-column>
+ <el-table-column label="鍚嶇О" align="center" prop="label">{{
+ label
+ }}</el-table-column>
+ <el-table-column label="浜у嚭" align="center">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value_CC)
+ }}</template></el-table-column
+ >
+ <el-table-column label="娑堣��" align="center">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value_XH)
+ }}</template></el-table-column
+ >
+ <!-- <el-table-column label="澶栦緵" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_WG)}}</template></el-table-column> -->
+ <el-table-column label="鎹熻��" align="center">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value_SH)
+ }}</template></el-table-column
+ >
</el-table>
</div>
</template>
<script>
- import {energyBalanceList,energyBalanceTable} from '@/api/energyBalance/energyBalance'
- import LineChart from './LineChart'
+import {
+ energyBalanceList,
+ energyBalanceTable
+} from "@/api/energyBalance/energyBalance";
+import LineChart from "./LineChart";
export default {
- components: {LineChart},
+ components: { LineChart },
data() {
return {
- dateTypeOptions:[],
- list:[],
+ dateTypeOptions: [],
+ list: [],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
pageSize: 10,
indexCode: undefined,
- timeType:"DAY",
- dataTime: undefined,
+ timeType: "DAY",
+ dataTime: undefined
},
- dateTypes: 'date',
- valueFormat:"yyyy-MM-dd",
- skinName:"",
- label:"",
- lineChartData:{expectedData: [],
- actualData: [],label:""},
+ dateTypes: "date",
+ valueFormat: "yyyy-MM-dd",
+ skinName: "",
+ label: "",
+ lineChartData: { expectedData: [], actualData: [], label: "" }
};
},
created() {
this.getTime();
this.getDicts("energyBalance").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
this.getConfigKey("energyBalance").then(response => {
- this.skinName=response.msg;
+ this.skinName = response.msg;
});
},
methods: {
modelNodeChange(modelNode) {
- this.queryParams.indexCode=modelNode.id;
- this.label=modelNode.label;
- this.getList(this.queryParams)
+ this.queryParams.indexCode = modelNode.id;
+ this.label = modelNode.label;
+ this.getList(this.queryParams);
},
getList() {
energyBalanceList(this.queryParams).then(response => {
//this.plannedOutputList = response.rows;
- let expectedData=[];
- let actualData=[];
- let total="";
+ let expectedData = [];
+ let actualData = [];
+ let total = "";
response.data.forEach(item => {
- actualData.push(item.indexName)
- expectedData.push({"name":item.indexName,"value":this.numFilter(item.value)});
- })
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.title=this.label;
+ actualData.push(item.indexName);
+ expectedData.push({
+ name: item.indexName,
+ value: this.numFilter(item.value)
+ });
+ });
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.title = this.label;
this.$refs.LineChart.initChart(this.lineChartData);
});
energyBalanceTable(this.queryParams).then(response => {
- this.list=response.data;
+ this.list = response.data;
});
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
@@ -104,102 +148,100 @@
this.resetForm("queryForm");
this.handleQuery();
},
- handleTime(date){
- if(date=='YEAR'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='MONTH'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
- }
- },
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime = year + '-' + month + '-' + (date-1)
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
+ handleTime(date) {
+ if (date == "YEAR") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "MONTH") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
} else {
- realVal = '--'
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
}
- return realVal
},
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month + "-" + (date - 1);
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ 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;
+.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-wrapper {
+ background: #fff;
+ padding: 16px 16px 0;
+ margin-bottom: 32px;
}
+}
- @media (max-width:1024px) {
- .chart-wrapper {
- padding: 8px;
- }
+@media (max-width: 1024px) {
+ .chart-wrapper {
+ padding: 8px;
}
- .live{
- position: fixed;
- right: 0px;
- top:70px;
- display: flex;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- width: 100px;
- height: 60px;
- background-color: red;
- animation: fade 600ms infinite;
- -webkit-animation: fade 600ms infinite;
+}
+.live {
+ position: fixed;
+ right: 0px;
+ top: 70px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 100px;
+ height: 60px;
+ background-color: red;
+ animation: fade 600ms infinite;
+ -webkit-animation: fade 600ms infinite;
+}
+.live_content {
+ font-size: 18px;
+ color: white;
+ font-weight: bold;
+}
+.live_number {
+ font-size: 32px;
+ color: white;
+ font-weight: bolder;
+}
+@keyframes fade {
+ from {
+ opacity: 1;
}
- .live_content{
- font-size: 18px;
- color: white;
- font-weight: bold;
+ 50% {
+ opacity: 0.4;
}
- .live_number{
- font-size: 32px;
- color: white;
- font-weight: bolder;
+ to {
+ opacity: 1;
}
- @keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
- }
+}
- @-webkit-keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
+@-webkit-keyframes fade {
+ from {
+ opacity: 1;
}
+ 50% {
+ opacity: 0.4;
+ }
+ to {
+ opacity: 1;
+ }
+}
</style>
diff --git a/energy_management_ui/src/views/energyBalance/energyBalance/index.vue b/energy_management_ui/src/views/energyBalance/energyBalance/index.vue
index 5267f9f..4f0df03 100644
--- a/energy_management_ui/src/views/energyBalance/energyBalance/index.vue
+++ b/energy_management_ui/src/views/energyBalance/energyBalance/index.vue
@@ -1,57 +1,83 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳芥簮骞宠 鍒嗘瀽
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳芥簮骞宠 鍒嗘瀽" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div>
+ <energyBalance
+ ref="energyBalance"
+ style="padding:10px"
+ ></energyBalance>
</div>
- <el-main style="padding:0">
- <energyBalance ref="energyBalance" style="padding:10px"></energyBalance>
- </el-main>
- </el-container>
- </el-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import energyBalance from "./energyBalance";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import energyBalance from "./energyBalance";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
- export default {
- components: { ModelNode,energyBalance},
- created() {
- this.modelCode=this.$route.query.modelCode;
+export default {
+ mixins: [mixins],
+ components: { ModelNode, energyBalance, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.energyBalance.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.energyBalance.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyBalance/pie_chart.vue b/energy_management_ui/src/views/energyBalance/energyBalance/pie_chart.vue
index 2983152..88ec288 100644
--- a/energy_management_ui/src/views/energyBalance/energyBalance/pie_chart.vue
+++ b/energy_management_ui/src/views/energyBalance/energyBalance/pie_chart.vue
@@ -1,103 +1,106 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
}
},
data() {
return {
chart: null
- }
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
+ this.chart = echarts.init(this.$el, "macarons");
this.chart.setOption({
title: {
- text: '杈撳嚭鑳介噺鍒嗘瀽',
- left: '25%',
- textAlign: 'center',
+ text: "杈撳嚭鑳介噺鍒嗘瀽",
+ left: "25%",
+ textAlign: "center",
textStyle: {
- fontStyle: 'normal',
- "color": "#333",
- },
+ fontStyle: "normal",
+ color: "#333"
+ }
},
tooltip: {
- trigger: 'item',
- formatter: '{a} <br/>{b}: {c} ({d}%)'
+ trigger: "item",
+ formatter: "{a} <br/>{b}: {c} ({d}%)"
},
grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
+ left: "3%",
+ right: "4%",
+ bottom: "3%",
containLabel: true
},
legend: {
- orient: 'vertical',
+ orient: "vertical",
left: 10,
- top:'10%',
- data: ['姘磋緭鍏ラ噺', '鐢佃緭鍏ラ噺']
+ top: "10%",
+ data: ["姘磋緭鍏ラ噺", "鐢佃緭鍏ラ噺"],
+ textStyle: {
+ color: "#fff"
+ }
},
series: [
{
- name: '鑳介噺杈撳嚭',
- type: 'pie',
- radius: ['30%', '60%'],
+ name: "鑳介噺杈撳嚭",
+ type: "pie",
+ radius: ["30%", "60%"],
avoidLabelOverlap: false,
label: {
show: false,
- position: 'center'
+ position: "center"
},
emphasis: {
label: {
show: true,
- fontSize: '16',
- fontWeight: 'bold'
+ fontSize: "16",
+ fontWeight: "bold"
}
},
labelLine: {
show: false
},
data: [
- {value: 340, name: '姘磋緭鍏ラ噺'},
- {value: 150, name: '鐢佃緭鍏ラ噺'}
+ { value: 340, name: "姘磋緭鍏ラ噺" },
+ { value: 150, name: "鐢佃緭鍏ラ噺" }
]
}
]
- })
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyLoss/PieChart.vue b/energy_management_ui/src/views/energyBalance/energyLoss/PieChart.vue
index ca0a891..45c9519 100644
--- a/energy_management_ui/src/views/energyBalance/energyLoss/PieChart.vue
+++ b/energy_management_ui/src/views/energyBalance/energyLoss/PieChart.vue
@@ -1,29 +1,29 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '600px'
+ default: "600px"
},
chartData: {
- type:Object,
+ type: Object
//required: true
}
},
@@ -31,120 +31,121 @@
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
data() {
return {
chart: null
- }
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({actualData,expectedData,title,total} = {}) {
+ setOptions({ actualData, expectedData, title, total } = {}) {
this.chart.setOption({
title: {
- text: title+"浜у嚭锛�"+total,
- x:'left',
- y: 'top',
+ text: (title || "") + " " + total,
+ x: "left",
+ y: "top",
textStyle: {
- color: "#333"
- },
+ color: "#fff"
+ }
},
tooltip: {
- trigger: 'item',
+ trigger: "item",
formatter: actualData
},
grid: {
top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
containLabel: true
},
legend: {
// orient 璁剧疆甯冨眬鏂瑰紡锛岄粯璁ゆ按骞冲竷灞�锛屽彲閫夊�硷細'horizontal'锛堟按骞筹級 娄 'vertical'锛堝瀭鐩达級
- orient: 'vertical',
+ orient: "vertical",
// x 璁剧疆姘村钩瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥惧眳涓紝鍙�夊�硷細'center' 娄 'left' 娄 'right' 娄 {number}锛坸鍧愭爣锛屽崟浣峱x锛�
- x: 'left',
+ x: "left",
// y 璁剧疆鍨傜洿瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥鹃《绔紝鍙�夊�硷細'top' 娄 'bottom' 娄 'center' 娄 {number}锛坹鍧愭爣锛屽崟浣峱x锛�
- y: '10%',
+ y: "10%",
//left: 10,
- itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
- itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
+ itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
+ itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
textStyle: {
- color: '#666' // 鍥句緥鏂囧瓧棰滆壊
+ color: "#fff" // 鍥句緥鏂囧瓧棰滆壊
},
// itemGap璁剧疆鍚勪釜item涔嬮棿鐨勯棿闅旓紝鍗曚綅px锛岄粯璁や负10锛屾í鍚戝竷灞�鏃朵负姘村钩闂撮殧锛岀旱鍚戝竷灞�鏃朵负绾靛悜闂撮殧
// itemGap: 30,
- backgroundColor: '#eee', // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
- data: actualData,
+ // backgroundColor: "#eee", // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
+ data: actualData
},
- series: [{
- //name: '鑳芥簮',
- type: 'pie',
- radius: ['50%', '80%'], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
- center: ['50%', '50%'], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
- data: expectedData,
- // itemStyle 璁剧疆楗肩姸鍥炬墖褰㈠尯鍩熸牱寮�
- itemStyle: {
- // emphasis锛氳嫳鏂囨剰鎬濇槸 寮鸿皟;鐫�閲�;锛堣疆寤撱�佸浘褰㈢瓑鐨勶級椴滄槑;绐佸嚭锛岄噸璇�
- // emphasis锛氳缃紶鏍囨斁鍒板摢涓�鍧楁墖褰笂闈㈢殑鏃跺�欙紝鎵囧舰鏍峰紡銆侀槾褰�
- emphasis: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: 'rgba(30, 144, 255锛�0.5)'
+ series: [
+ {
+ //name: '鑳芥簮',
+ type: "pie",
+ radius: ["50%", "80%"], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
+ center: ["50%", "50%"], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
+ data: expectedData,
+ // itemStyle 璁剧疆楗肩姸鍥炬墖褰㈠尯鍩熸牱寮�
+ itemStyle: {
+ // emphasis锛氳嫳鏂囨剰鎬濇槸 寮鸿皟;鐫�閲�;锛堣疆寤撱�佸浘褰㈢瓑鐨勶級椴滄槑;绐佸嚭锛岄噸璇�
+ // emphasis锛氳缃紶鏍囨斁鍒板摢涓�鍧楁墖褰笂闈㈢殑鏃跺�欙紝鎵囧舰鏍峰紡銆侀槾褰�
+ emphasis: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: "rgba(30, 144, 255锛�0.5)"
+ },
+ normal: {
+ label: {
+ fontSize: 25
+ }
+ }
},
- normal: {
- label:{
- fontSize:25,
+ // 璁剧疆鍊煎煙鐨勯偅鎸囧悜绾�
+ labelLine: {
+ normal: {
+ show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
+ }
+ },
+ avoidLabelOverlap: false,
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: "40",
+ fontWeight: "bold"
+ }
+ },
+ // 璁剧疆鍊煎煙鐨勬爣绛�
+ label: {
+ normal: {
+ position: "inner", // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
+ // formatter: '{a} {b} : {c}涓� ({d}%)' 璁剧疆鏍囩鏄剧ず鍐呭 锛岄粯璁ゆ樉绀簕b}
+ // {a}鎸噑eries.name {b}鎸噑eries.data鐨刵ame
+ // {c}鎸噑eries.data鐨剉alue {d}%鎸囪繖涓�閮ㄥ垎鍗犳�绘暟鐨勭櫨鍒嗘瘮
+ formatter: "{b} : ({d}%)"
}
}
- },
- // 璁剧疆鍊煎煙鐨勯偅鎸囧悜绾�
- labelLine: {
- normal: {
- show: false , // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
- }
- },
- avoidLabelOverlap: false,
- emphasis: {
- label: {
- show: true,
- fontSize: '40',
- fontWeight: 'bold'
- }
- },
- // 璁剧疆鍊煎煙鐨勬爣绛�
- label: {
- normal: {
- position: 'inner', // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
- // formatter: '{a} {b} : {c}涓� ({d}%)' 璁剧疆鏍囩鏄剧ず鍐呭 锛岄粯璁ゆ樉绀簕b}
- // {a}鎸噑eries.name {b}鎸噑eries.data鐨刵ame
- // {c}鎸噑eries.data鐨剉alue {d}%鎸囪繖涓�閮ㄥ垎鍗犳�绘暟鐨勭櫨鍒嗘瘮
- formatter: '{b} : ({d}%)'
- },
}
- }
- ],
- })
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyLoss/energyLoss.vue b/energy_management_ui/src/views/energyBalance/energyLoss/energyLoss.vue
index 79654d4..c53b326 100644
--- a/energy_management_ui/src/views/energyBalance/energyLoss/energyLoss.vue
+++ b/energy_management_ui/src/views/energyBalance/energyLoss/energyLoss.vue
@@ -1,103 +1,147 @@
<template>
<div class="app-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 v-for="dict in dateTypeOptions" :key="dict.dictValue" :label="dict.dictValue" @change="handleTime(dict.dictValue)">{{dict.dictLabel}}</el-radio>
+ <el-radio
+ v-for="dict in dateTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictValue"
+ @change="handleTime(dict.dictValue)"
+ >{{ dict.dictLabel }}</el-radio
+ >
</el-radio-group>
</el-form-item>
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- :type="dateTypes"
- :value-format="valueFormat"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ :type="dateTypes"
+ :value-format="valueFormat"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
</el-date-picker>
<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>
<el-row :gutter="20">
<el-col :xs="24" :sm="24" :lg="24">
<div class="chart-wrapper">
- <pie-chart ref="PieChart" :chart-data="lineChartData"/>
+ <pie-chart ref="PieChart" :chart-data="lineChartData" />
</div>
</el-col>
</el-row>
<el-table :data="list" border>
- <el-table-column label="鍚嶇О" align="center" prop="label">{{label}}</el-table-column>
+ <el-table-column label="鍚嶇О" align="center" prop="label">{{
+ label
+ }}</el-table-column>
+ <el-table-column label="鎬婚噺" align="center"
+ ><template slot-scope="scope">{{
+ numFilter(scope.row.value_total)
+ }}</template></el-table-column
+ >
<!--<el-table-column label="浜у嚭" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_CC)}}</template></el-table-column>-->
- <el-table-column label="娑堣��" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_XH)}}</template></el-table-column>
- <el-table-column label="澶栦緵" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_WG)}}</template></el-table-column>
- <el-table-column label="鎹熻��" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_SH)}}</template></el-table-column>
- <el-table-column label="鎬婚噺" align="center"><template slot-scope="scope">{{numFilter(scope.row.value_total)}}</template></el-table-column>
+ <el-table-column label="娑堣��" align="center">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value_XH)
+ }}</template></el-table-column
+ >
+ <!-- <el-table-column label="澶栦緵" align="center"> <template slot-scope="scope">{{numFilter(scope.row.value_WG)}}</template></el-table-column> -->
+ <el-table-column label="鎹熻��" align="center">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value_SH)
+ }}</template></el-table-column
+ >
</el-table>
</div>
</template>
<script>
- import {lossAnalysisList,energyLossTable} from '@/api/energyBalance/energyBalance'
- import PieChart from './PieChart'
+import {
+ lossAnalysisList,
+ energyLossTable
+} from "@/api/energyBalance/energyBalance";
+import PieChart from "./PieChart";
export default {
- components: {PieChart},
+ components: { PieChart },
data() {
return {
- dateTypeOptions:[],
- list:[],
+ dateTypeOptions: [],
+ list: [],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
pageSize: 10,
indexCode: undefined,
- timeType:"DAY",
- dataTime: undefined,
+ timeType: "DAY",
+ dataTime: undefined
},
- dateTypes: 'date',
- valueFormat:"yyyy-MM-dd",
- skinName:"",
- label:"",
- lineChartData:{expectedData: [],
- actualData: [],label:""},
+ dateTypes: "date",
+ valueFormat: "yyyy-MM-dd",
+ skinName: "",
+ label: "",
+ lineChartData: { expectedData: [], actualData: [], label: "" }
};
},
created() {
this.getTime();
this.getDicts("energyBalance").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
this.getConfigKey("energyBalance").then(response => {
- this.skinName=response.msg;
+ this.skinName = response.msg;
});
},
methods: {
modelNodeChange(modelNode) {
- this.queryParams.indexCode=modelNode.id;
- this.label=modelNode.label;
- this.getList(this.queryParams)
+ this.queryParams.indexCode = modelNode.id;
+ this.label = modelNode.label;
+ this.getList(this.queryParams);
},
getList() {
lossAnalysisList(this.queryParams).then(response => {
//this.plannedOutputList = response.rows;
- let expectedData=[];
- let actualData=[];
- let total="";
+ let expectedData = [];
+ let actualData = [];
+ let total = "";
response.data.forEach(item => {
- if(item.indexCode.indexOf("_total")==-1){
- actualData.push(item.indexName)
- expectedData.push({"name":item.indexName,"value":this.numFilter(item.value)});
- }else{
- total=this.numFilter(item.value)
+ if (item.indexCode.indexOf("_total") == -1) {
+ actualData.push(item.indexName);
+ expectedData.push({
+ name: item.indexName,
+ value: this.numFilter(item.value)
+ });
+ } else {
+ total = this.numFilter(item.value);
}
- })
- this.lineChartData.total=total;
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.title=this.label;
+ });
+ this.lineChartData.total = total;
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.title = this.label;
this.$refs.PieChart.initChart(this.lineChartData);
});
energyLossTable(this.queryParams).then(response => {
- this.list=response.data;
+ this.list = response.data;
});
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
@@ -110,102 +154,100 @@
this.resetForm("queryForm");
this.handleQuery();
},
- handleTime(date){
- if(date=='YEAR'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='MONTH'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
- }
- },
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime = year + '-' + month + '-' + (date-1)
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
+ handleTime(date) {
+ if (date == "YEAR") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "MONTH") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
} else {
- realVal = '--'
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
}
- return realVal
},
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month + "-" + (date - 1);
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ 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;
+.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-wrapper {
+ background: #fff;
+ padding: 16px 16px 0;
+ margin-bottom: 32px;
}
+}
- @media (max-width:1024px) {
- .chart-wrapper {
- padding: 8px;
- }
+@media (max-width: 1024px) {
+ .chart-wrapper {
+ padding: 8px;
}
- .live{
- position: fixed;
- right: 0px;
- top:70px;
- display: flex;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- width: 100px;
- height: 60px;
- background-color: red;
- animation: fade 600ms infinite;
- -webkit-animation: fade 600ms infinite;
+}
+.live {
+ position: fixed;
+ right: 0px;
+ top: 70px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 100px;
+ height: 60px;
+ background-color: red;
+ animation: fade 600ms infinite;
+ -webkit-animation: fade 600ms infinite;
+}
+.live_content {
+ font-size: 18px;
+ color: white;
+ font-weight: bold;
+}
+.live_number {
+ font-size: 32px;
+ color: white;
+ font-weight: bolder;
+}
+@keyframes fade {
+ from {
+ opacity: 1;
}
- .live_content{
- font-size: 18px;
- color: white;
- font-weight: bold;
+ 50% {
+ opacity: 0.4;
}
- .live_number{
- font-size: 32px;
- color: white;
- font-weight: bolder;
+ to {
+ opacity: 1;
}
- @keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
- }
+}
- @-webkit-keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
+@-webkit-keyframes fade {
+ from {
+ opacity: 1;
}
+ 50% {
+ opacity: 0.4;
+ }
+ to {
+ opacity: 1;
+ }
+}
</style>
diff --git a/energy_management_ui/src/views/energyBalance/energyLoss/index.vue b/energy_management_ui/src/views/energyBalance/energyLoss/index.vue
index e30637c..c133de6 100644
--- a/energy_management_ui/src/views/energyBalance/energyLoss/index.vue
+++ b/energy_management_ui/src/views/energyBalance/energyLoss/index.vue
@@ -1,57 +1,79 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳芥簮鎹熷け鍒嗘瀽
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳芥簮鎹熷け鍒嗘瀽" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div>
<energyLoss ref="energyLoss" style="padding:10px"></energyLoss>
- </el-main>
- </el-container>
- </el-container>
+ </div>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import energyLoss from "./energyLoss";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
-
- export default {
- components: { ModelNode,energyLoss},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import energyLoss from "./energyLoss";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ components: { ModelNode, energyLoss, ShrinkCol },
+ mixins: [mixins],
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.energyLoss.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.energyLoss.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyPic/energyPic.vue b/energy_management_ui/src/views/energyBalance/energyPic/energyPic.vue
index d961a64..f4906b3 100644
--- a/energy_management_ui/src/views/energyBalance/energyPic/energyPic.vue
+++ b/energy_management_ui/src/views/energyBalance/energyPic/energyPic.vue
@@ -2,40 +2,71 @@
<div class="app-container" style="padding:0">
<el-card class="box-card">
<div slot="header" class="clearfix">
- <span>{{moNode?moNode.label:''}}--鑳芥祦鍒嗘瀽</span>
+ <span>{{ moNode ? moNode.label : "" }}--鑳芥祦鍒嗘瀽</span>
</div>
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- :type="dateTypes"
- :value-format="valueFormat"
- placeholder="閫夋嫨鏃ユ湡">
- </el-date-picker>
- <el-form-item label="灏忔椂" prop="selectHour">
- <el-select v-model="queryParams.selectHour" placeholder="璇烽�夋嫨灏忔椂" clearable size="small">
- <el-option
- v-for="dict in selectHourOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
- />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鏌ヨ</el-button>
- </el-form-item>
- </el-form>
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ :type="dateTypes"
+ :value-format="valueFormat"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
+ </el-date-picker>
+ <el-form-item label="灏忔椂" prop="selectHour">
+ <el-select
+ v-model="queryParams.selectHour"
+ placeholder="璇烽�夋嫨灏忔椂"
+ clearable
+ size="small"
+ >
+ <el-option
+ v-for="dict in selectHourOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鏌ヨ</el-button
+ >
+ </el-form-item>
+ </el-form>
<div>
- <el-table :data="energyPicList" v-loading="loading" border style="width: 100%; margin-top: 20px">
- <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="modename" min-width="200px"/>
- <el-table-column label="浜у嚭" align="center" prop="a1"/>
- <el-table-column label="娑堣��" align="center" prop="a2"/>
- <el-table-column label="澶栦緵" align="center" prop="a3"/>
- <el-table-column label="鎹熻��" align="center" prop="a4"/>
- </el-table>
- </div>
+ <el-table
+ :data="energyPicList"
+ v-loading="loading"
+ border
+ style="width: 100%; margin-top: 20px"
+ >
+ <el-table-column
+ label="鍗曚綅鍚嶇О"
+ align="center"
+ prop="modename"
+ min-width="200px"
+ />
+ <el-table-column label="浜у嚭" align="center" prop="a1" />
+ <el-table-column label="娑堣��" align="center" prop="a2" />
+ <!-- <el-table-column label="澶栦緵" align="center" prop="a3"/> -->
+ <el-table-column label="鎹熻��" align="center" prop="a4" />
+ </el-table>
+ </div>
<pagination
- v-show="total>0"
+ v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@@ -46,145 +77,145 @@
</template>
<script>
- import {selectEnergyPicList} from "@/api/energyBalance/energyPic"
+import { selectEnergyPicList } from "@/api/energyBalance/energyPic";
- export default {
- name: 'energyIndex',
+export default {
+ name: "energyIndex",
- data() {
- return {
- timeArr:[],
- currentNode: '',
- deviceCategory:undefined,
- // 閬僵灞�
- loading: false,
- // 閫変腑鏁扮粍
- ids: [],
- dateRange: [],
- names: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 10,
- // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
- List: [],
- //鑳芥祦鍒嗘瀽鏁版嵁闆嗗悎
- energyPicList: [],
- // 寮瑰嚭灞傛爣棰�
- title: "",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- selectHour:"01",
- selectHourOptions:[{"dictLabel":"01","dictValue":"01","dictType":"selecthour"},
- {"dictLabel":"02","dictValue":"02","dictType":"selecthour"},
- {"dictLabel":"03","dictValue":"03","dictType":"selecthour"},
- {"dictLabel":"04","dictValue":"04","dictType":"selecthour"},
- {"dictLabel":"05","dictValue":"05","dictType":"selecthour"},
- {"dictLabel":"06","dictValue":"06","dictType":"selecthour"},
- {"dictLabel":"07","dictValue":"07","dictType":"selecthour"},
- {"dictLabel":"08","dictValue":"08","dictType":"selecthour"},
- {"dictLabel":"09","dictValue":"09","dictType":"selecthour"},
- {"dictLabel":"10","dictValue":"10","dictType":"selecthour"},
- {"dictLabel":"11","dictValue":"11","dictType":"selecthour"},
- {"dictLabel":"12","dictValue":"12","dictType":"selecthour"},
- {"dictLabel":"13","dictValue":"13","dictType":"selecthour"},
- {"dictLabel":"14","dictValue":"14","dictType":"selecthour"},
- {"dictLabel":"15","dictValue":"15","dictType":"selecthour"},
- {"dictLabel":"16","dictValue":"16","dictType":"selecthour"},
- {"dictLabel":"17","dictValue":"17","dictType":"selecthour"},
- {"dictLabel":"18","dictValue":"18","dictType":"selecthour"},
- {"dictLabel":"19","dictValue":"19","dictType":"selecthour"},
- {"dictLabel":"20","dictValue":"20","dictType":"selecthour"},
- {"dictLabel":"21","dictValue":"21","dictType":"selecthour"},
- {"dictLabel":"22","dictValue":"22","dictType":"selecthour"},
- {"dictLabel":"23","dictValue":"23","dictType":"selecthour"}
- ],
- queryParams: {
- eierarchyFlag:"B",
- pageNum: 1,
- pageSize: 10,
- name: undefined,
- value:undefined,
- code: undefined,
- dataTime: undefined,
- selectHour:"01",
- nodeid:""
- },
- dateTypes: 'date',
- valueFormat:"yyyy-MM-dd",
- tableData: [],
- datas: [],
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- rules: {
- },
- moNode: undefined,
+ data() {
+ return {
+ timeArr: [],
+ currentNode: "",
+ deviceCategory: undefined,
+ // 閬僵灞�
+ loading: false,
+ // 閫変腑鏁扮粍
+ ids: [],
+ dateRange: [],
+ names: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 10,
+ // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
+ List: [],
+ //鑳芥祦鍒嗘瀽鏁版嵁闆嗗悎
+ energyPicList: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ selectHour: "01",
+ selectHourOptions: [
+ { dictLabel: "01", dictValue: "01", dictType: "selecthour" },
+ { dictLabel: "02", dictValue: "02", dictType: "selecthour" },
+ { dictLabel: "03", dictValue: "03", dictType: "selecthour" },
+ { dictLabel: "04", dictValue: "04", dictType: "selecthour" },
+ { dictLabel: "05", dictValue: "05", dictType: "selecthour" },
+ { dictLabel: "06", dictValue: "06", dictType: "selecthour" },
+ { dictLabel: "07", dictValue: "07", dictType: "selecthour" },
+ { dictLabel: "08", dictValue: "08", dictType: "selecthour" },
+ { dictLabel: "09", dictValue: "09", dictType: "selecthour" },
+ { dictLabel: "10", dictValue: "10", dictType: "selecthour" },
+ { dictLabel: "11", dictValue: "11", dictType: "selecthour" },
+ { dictLabel: "12", dictValue: "12", dictType: "selecthour" },
+ { dictLabel: "13", dictValue: "13", dictType: "selecthour" },
+ { dictLabel: "14", dictValue: "14", dictType: "selecthour" },
+ { dictLabel: "15", dictValue: "15", dictType: "selecthour" },
+ { dictLabel: "16", dictValue: "16", dictType: "selecthour" },
+ { dictLabel: "17", dictValue: "17", dictType: "selecthour" },
+ { dictLabel: "18", dictValue: "18", dictType: "selecthour" },
+ { dictLabel: "19", dictValue: "19", dictType: "selecthour" },
+ { dictLabel: "20", dictValue: "20", dictType: "selecthour" },
+ { dictLabel: "21", dictValue: "21", dictType: "selecthour" },
+ { dictLabel: "22", dictValue: "22", dictType: "selecthour" },
+ { dictLabel: "23", dictValue: "23", dictType: "selecthour" }
+ ],
+ queryParams: {
+ eierarchyFlag: "B",
+ pageNum: 1,
+ pageSize: 10,
+ name: undefined,
+ value: undefined,
+ code: undefined,
+ dataTime: undefined,
+ selectHour: "01",
+ nodeid: ""
+ },
+ dateTypes: "date",
+ valueFormat: "yyyy-MM-dd",
+ tableData: [],
+ datas: [],
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ rules: {},
+ moNode: undefined
+ };
+ },
+ created() {
+ this.setNowDate();
+ },
+ methods: {
+ modelNodeChange(modelNode, deviceCategory) {
+ this.moNode = modelNode;
+ this.queryParams.nodeid = modelNode.id;
+ this.deviceCategory = deviceCategory;
+ this.getList();
+ },
+ setNowDate() {
+ let nowDate = new Date();
+ let date = {
+ year: nowDate.getFullYear(),
+ month: nowDate.getMonth() + 1,
+ day: nowDate.getDate()
};
+ this.queryParams.dataTime =
+ date.year + "-" + this.gshRq(date.month) + "-" + this.gshRq(date.day);
},
- created() {
- this.setNowDate();
+ gshRq(rq) {
+ return rq * 1 < 10 ? "0" + rq : rq;
},
- methods: {
- modelNodeChange(modelNode,deviceCategory) {
- this.moNode = modelNode;
- this.queryParams.nodeid = modelNode.id;
- this.deviceCategory = deviceCategory;
- this.getList();
- },
- setNowDate() {
- let nowDate = new Date();
- let date = {
- year: nowDate.getFullYear(),
- month: nowDate.getMonth() + 1,
- day: nowDate.getDate(),
- }
- this.queryParams.dataTime = date.year + '-' + this.gshRq(date.month) + '-' +this.gshRq(date.day);
- },
- gshRq(rq)
- {
- return ((rq*1)<10)?'0'+rq:rq;
- },
- /** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
- getList() {
- this.loading = true;
- //var search = this.queryParams;
- selectEnergyPicList(this.queryParams).then(response => {
- this.energyPicList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- indexId: undefined,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- remark: undefined,
- unitId: undefined
- };
- this.resetForm("form");
- },
+ /** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
+ getList() {
+ this.loading = true;
+ //var search = this.queryParams;
+ selectEnergyPicList(this.queryParams).then(response => {
+ this.energyPicList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ indexId: undefined,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ remark: undefined,
+ unitId: undefined
+ };
+ this.resetForm("form");
+ },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- if("5"===this.deviceCategory){
- this.getList();
- }else {
- this.tableData = [];
- }
- },
- getTime(){
- this.startTime = new Date().setHours(0, 0, 0, 0);
- this.endTime = new Date().setHours(0, 0, 0, 0) + 24 * 60 * 60 * 1000 - 1;
- //鏄剧ず鏃堕棿
- this.timeArr = [this.startTime,this.endTime];
- },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ if ("5" === this.deviceCategory) {
+ this.getList();
+ } else {
+ this.tableData = [];
+ }
+ },
+ getTime() {
+ this.startTime = new Date().setHours(0, 0, 0, 0);
+ this.endTime = new Date().setHours(0, 0, 0, 0) + 24 * 60 * 60 * 1000 - 1;
+ //鏄剧ず鏃堕棿
+ this.timeArr = [this.startTime, this.endTime];
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyBalance/energyPic/index.vue b/energy_management_ui/src/views/energyBalance/energyPic/index.vue
index eebe485..74b5148 100644
--- a/energy_management_ui/src/views/energyBalance/energyPic/index.vue
+++ b/energy_management_ui/src/views/energyBalance/energyPic/index.vue
@@ -1,58 +1,111 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳芥祦鍒嗘瀽" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :auth="false"
+ :modelCode="modelCode"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div :style="bodyStyleRight">
+ <energyPic ref="energyPic"></energyPic>
+ </div>
+ </el-col>
+ </el-row>
+ <!-- <el-container class="split-container">
+ <el-aside class="left-content" :width="isCollapse ? '0px' : '20%'">
<el-card class="box-card">
<div slot="header" class="clearfix" style="height:32px">
鑳芥祦鍒嗘瀽
</div>
- <ModelNode ref="modelNode" @changeNode="changeNode" :showOpt="false" :auth="false" :modelCode="modelCode"></ModelNode>
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :auth="false"
+ :modelCode="modelCode"
+ ></ModelNode>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
</el-card>
</el-aside>
<el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
<el-main style="padding:0">
<energyPic ref="energyPic"></energyPic>
</el-main>
</el-container>
- </el-container>
+ </el-container> -->
</div>
</template>
<script>
- import energyPic from "./energyPic";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
- export default {
- components: {energyPic, ModelNode},
- created() {
- this.modelCode=this.$route.query.modelCode;
- this.deviceCategory = this.$route.query.device_category;
+import energyPic from "./energyPic";
+import ShrinkCol from "@/components/shrink/index.vue";
+import mixins from "@/layout/mixin/getHeight";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+export default {
+ components: { energyPic, ModelNode, ShrinkCol },
+ mixins: [mixins],
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ this.deviceCategory = this.$route.query.device_category;
+ },
+ data() {
+ return {
+ modelData: "",
+ modelInfoOptions: [],
+ modelCode: undefined,
+ deviceCategory: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ changeNode: function(node) {
+ this.$refs.energyPic.modelNodeChange(node, this.deviceCategory);
},
- data() {
- return {
- modelData: '',
- modelInfoOptions: [],
- modelCode:undefined,
- deviceCategory:undefined,
- isCollapse: false,
- }
+ manageModel: function() {
+ this.$router.push("/model");
},
- methods: {
- changeNode: function (node) {
- this.$refs.energyPic.modelNodeChange(node,this.deviceCategory);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
+ },
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyConsumptionAlarm/monitorAlarm/index.vue b/energy_management_ui/src/views/energyConsumptionAlarm/monitorAlarm/index.vue
index f1569e7..8b10e7f 100644
--- a/energy_management_ui/src/views/energyConsumptionAlarm/monitorAlarm/index.vue
+++ b/energy_management_ui/src/views/energyConsumptionAlarm/monitorAlarm/index.vue
@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
<div class="app-container" style="padding: 0">
<el-container class="split-container">
<el-aside class="left-content">
@@ -16,17 +16,54 @@
</el-container>
</el-container>
</div>
+</template> -->
+<template>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳借�楃洃娴嬫姤璀�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div>
+ <MonitorAlarmSetting ref="MonitorAlarmSetting"></MonitorAlarmSetting>
+ </div>
+ </el-col>
+ </el-row>
+ </div>
</template>
<script>
import MonitorAlarmSetting from "./monitorAlarmSetting";
import ModelNode from "../../basicsetting/modelNode/modelNode";
-import {listModel} from "@/api/basicsetting/model";
+import { listModel } from "@/api/basicsetting/model";
+import mixins from "@/layout/mixin/getHeight";
export default {
- components: {MonitorAlarmSetting, ModelNode},
+ mixins: [mixins],
+ components: { MonitorAlarmSetting, ModelNode },
created() {
- listModel({isShow: 1}).then(response => {
+ listModel({ isShow: 1 }).then(response => {
this.modelInfoOptions = response.data;
if (this.modelInfoOptions.length > 0) {
this.modelData = this.modelInfoOptions[0].modelCode;
@@ -36,18 +73,26 @@
},
data() {
return {
- modelData: '',
+ bodyStyleRight: {},
+ modelData: "",
modelInfoOptions: []
- }
+ };
},
methods: {
- changeNode: function (node) {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
+ },
+ changeNode: function(node) {
this.$refs.MonitorAlarmSetting.modelNodeChange(node);
},
- manageModel: function () {
- this.$router.push('/model');
+ manageModel: function() {
+ this.$router.push("/model");
},
- changeModel: function (item) {
+ changeModel: function(item) {
this.$refs.modelNode.getList(item);
}
}
diff --git a/energy_management_ui/src/views/energyExamine/assessmentIndex/addIndexTable.vue b/energy_management_ui/src/views/energyExamine/assessmentIndex/addIndexTable.vue
index 586c3e1..cd873d6 100644
--- a/energy_management_ui/src/views/energyExamine/assessmentIndex/addIndexTable.vue
+++ b/energy_management_ui/src/views/energyExamine/assessmentIndex/addIndexTable.vue
@@ -1,6 +1,13 @@
<template>
<!-- 瀵煎叆琛� -->
- <el-dialog :title="title" :visible.sync="open" :destroy-on-close="true" :append-to-body="true" width="800px" top="5vh">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ :destroy-on-close="true"
+ :append-to-body="true"
+ width="800px"
+ top="5vh"
+ >
<!--
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
<el-form-item>
@@ -8,12 +15,16 @@
</el-form-item>
</el-form>-->
-
<el-row>
- <el-table v-loading="loading" :data="impIndexList" @selection-change="handleSelectionChange" stripe max-height="350">
+ <el-table
+ v-loading="loading"
+ :data="impIndexList"
+ @selection-change="handleSelectionChange"
+ max-height="350"
+ >
<el-table-column type="selection" width="55" align="center" />
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
</el-table>
</el-row>
<div slot="footer" class="dialog-footer">
@@ -24,13 +35,13 @@
</template>
<script>
-import { listIndex,addIndex } from "@/api/energyExamine/addIndex";
+import { listIndex, addIndex } from "@/api/energyExamine/addIndex";
export default {
data() {
return {
//妯″瀷鑺傜偣
- modeNode:'',
+ modeNode: "",
// 閬僵灞�
loading: true,
// 閫変腑鏁扮粍
@@ -41,7 +52,7 @@
multiple: true,
// 鎬绘潯鏁�
total: 0,
- qjcode:"",
+ qjcode: "",
// 鎸囨爣 琛ㄦ牸鏁版嵁
impIndexList: [],
// 寮瑰嚭灞傛爣棰�
@@ -54,20 +65,19 @@
queryParams: {
pageNum: 1,
pageSize: 10,
- implementId:'',
+ implementId: "",
tableName: undefined
- },
+ }
};
},
- created() {
- },
+ created() {},
methods: {
// 鏄剧ず寮规
show(modeNode) {
- this.modeNode=modeNode;
+ this.modeNode = modeNode;
this.reset();
this.getList();
- this.title="娣诲姞"+this.modeNode.label+"鑰冩牳鎸囨爣";
+ this.title = "娣诲姞" + this.modeNode.label + "鑰冩牳鎸囨爣";
this.open = true;
},
// 琛ㄥ崟閲嶇疆
@@ -75,7 +85,7 @@
this.queryParams = {
pageNum: 1,
pageSize: 10,
- implementId:'',
+ implementId: "",
tableName: undefined
};
//娓呯┖涓婁紶缁勪欢鐨勬枃浠跺垪琛�
@@ -83,39 +93,34 @@
},
// 鏌ヨ 鎸囨爣
getList() {
- listIndex("STATISTIC",this.modeNode.id).then(response => {
+ listIndex("STATISTIC", this.modeNode.id).then(response => {
this.impIndexList = response.data;
this.loading = false;
});
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.indexId)
+ this.ids = selection.map(item => item.indexId);
},
/** 淇濆瓨鎸夐挳鎿嶄綔 */
- handsave()
- {
- if(this.ids==null || this.ids.length<=0){
+ handsave() {
+ if (this.ids == null || this.ids.length <= 0) {
this.msgSuccess("璇烽�夋嫨鎸囨爣!");
return;
}
- addIndex(this.ids,this.modeNode.id).then(response => {
- if(response!=null && response.code=="200")
- {
+ addIndex(this.ids, this.modeNode.id).then(response => {
+ if (response != null && response.code == "200") {
this.msgSuccess(response.msg);
- this.open=false;
- }else{
+ this.open = false;
+ } else {
this.msgSuccess(response.msg);
}
});
},
/** 鍏抽棴鎸夐挳鎿嶄綔 */
- handclose()
- {
- this.open=false;
- },
-
+ handclose() {
+ this.open = false;
+ }
}
};
-
</script>
diff --git a/energy_management_ui/src/views/energyExamine/assessmentIndex/index.vue b/energy_management_ui/src/views/energyExamine/assessmentIndex/index.vue
index 0722f06..9129165 100644
--- a/energy_management_ui/src/views/energyExamine/assessmentIndex/index.vue
+++ b/energy_management_ui/src/views/energyExamine/assessmentIndex/index.vue
@@ -1,61 +1,86 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑰冩牳鏍囧噯绠＄悊
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"
- :auth="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
- <assessmentIndex ref="assessmentIndex" style="padding:10px"></assessmentIndex>
- </el-main>
- </el-container>
- </el-container>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑰冩牳鏍囧噯绠＄悊" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ :auth="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
+ <assessmentIndex
+ ref="assessmentIndex"
+ style="padding:10px"
+ ></assessmentIndex>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- // import assessmentIndex from "./assessmentIndex";
- import assessmentIndex from "./create_index";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
-
- export default {
- components: { ModelNode,assessmentIndex},
- created() {
- this.modelCode=this.$route.query.modelCode;
+// import assessmentIndex from "./assessmentIndex";
+import assessmentIndex from "./create_index";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ mixins: [mixins],
+ components: { ModelNode, assessmentIndex, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelData: "",
+ modelInfoOptions: [],
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelData: '',
- modelInfoOptions: [],
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.assessmentIndex.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.assessmentIndex.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyExamine/assessmentResults/assessmentResults.vue b/energy_management_ui/src/views/energyExamine/assessmentResults/assessmentResults.vue
index 7cbfa77..7c8f3cf 100644
--- a/energy_management_ui/src/views/energyExamine/assessmentResults/assessmentResults.vue
+++ b/energy_management_ui/src/views/energyExamine/assessmentResults/assessmentResults.vue
@@ -1,6 +1,11 @@
<template>
<div class="app-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>
<el-radio v-model="radio" label="1">褰撳墠鍗曞厓</el-radio>
<el-radio v-model="radio" label="2">鍖呭惈涓嬩竴绾�</el-radio>
@@ -10,7 +15,8 @@
type="daterange"
range-separator="鑷�"
start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ end-placeholder="缁撴潫鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
<el-form-item label="鑰冩牳渚濇嵁">
@@ -22,40 +28,45 @@
</el-checkbox-group>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini">鎼滅储</el-button>
+ <el-button type="primary" icon="el-icon-search" size="mini"
+ >鎼滅储</el-button
+ >
<el-button icon="el-icon-download" size="mini">瀵煎嚭</el-button>
</el-form-item>
</el-form>
- <div style="margin: 20px;text-align: center;font-weight: 600;">
+ <div style="margin: 20px;text-align: center;font-weight: 600;color:#fff">
<span style="float: left;">缁熻鑼冨洿锛氬叏鍘�</span>
<span>鑳芥晥鑰冩牳缁撴灉</span>
- <span style="float: right;">缁熻鍖洪棿锛歿{times}}</span>
+ <span style="float: right;">缁熻鍖洪棿锛歿{ times }}</span>
</div>
- <el-table :data="energyEenchmarkingList" @selection-change="handleSelectionChange">
- <el-table-column label="鏃ユ湡" align="center" prop="time"/>
+ <el-table
+ :data="energyEenchmarkingList"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column label="鏃ユ湡" align="center" prop="time" />
<el-table-column label="鐢佃�楅噺" align="center">
- <el-table-column label="瀹為檯閲�" align="center" prop="dsjl"/>
- <el-table-column label="鑳借�楄鍒�" align="center" prop="dnhjh"/>
+ <el-table-column label="瀹為檯閲�" align="center" prop="dsjl" />
+ <el-table-column label="鑳借�楄鍒�" align="center" prop="dnhjh" />
</el-table-column>
<el-table-column label="澶╃劧姘旇�楅噺" align="center">
- <el-table-column label="瀹為檯閲�" align="center" prop="tsjl"/>
- <el-table-column label="鑳借�楄鍒�" align="center" prop="tnhjh"/>
+ <el-table-column label="瀹為檯閲�" align="center" prop="tsjl" />
+ <el-table-column label="鑳借�楄鍒�" align="center" prop="tnhjh" />
</el-table-column>
<el-table-column label="姘磋�楅噺" align="center">
- <el-table-column label="瀹為檯閲�" align="center" prop="ssjl"/>
- <el-table-column label="鑳借�楄鍒�" align="center" prop="snhjh"/>
+ <el-table-column label="瀹為檯閲�" align="center" prop="ssjl" />
+ <el-table-column label="鑳借�楄鍒�" align="center" prop="snhjh" />
</el-table-column>
<el-table-column label="鐒︾偔鑰楅噺" align="center">
- <el-table-column label="瀹為檯閲�" align="center" prop="jsjl"/>
- <el-table-column label="鑳借�楄鍒�" align="center" prop="jnhjh"/>
+ <el-table-column label="瀹為檯閲�" align="center" prop="jsjl" />
+ <el-table-column label="鑳借�楄鍒�" align="center" prop="jnhjh" />
</el-table-column>
<el-table-column label="娌硅�楅噺" align="center">
- <el-table-column label="瀹為檯閲�" align="center" prop="ysjl"/>
- <el-table-column label="鑳借�楄鍒�" align="center" prop="ynhjh"/>
+ <el-table-column label="瀹為檯閲�" align="center" prop="ysjl" />
+ <el-table-column label="鑳借�楄鍒�" align="center" prop="ynhjh" />
</el-table-column>
<el-table-column label="缁煎悎鑰楅噺" align="center">
- <el-table-column label="瀹為檯閲�" align="center" prop="zsjl"/>
- <el-table-column label="鑳借�楄鍒�" align="center" prop="znhjh"/>
+ <el-table-column label="瀹為檯閲�" align="center" prop="zsjl" />
+ <el-table-column label="鑳借�楄鍒�" align="center" prop="znhjh" />
</el-table-column>
</el-table>
</div>
@@ -75,89 +86,91 @@
multiple: true,
// 鎬绘潯鏁�
total: 0,
- radio: '1',
- checkList: ['鑳借�楄鍒�'],
+ radio: "1",
+ checkList: ["鑳借�楄鍒�"],
// energy_benchmarking琛ㄦ牸鏁版嵁
- energyEenchmarkingList:[{
- "time": "2019-02-01",
- "dsjl":"-",
- "dnhjh":"-",
- "tsjl":"244.42",
- "tnhjh":"-",
- "ssjl":"343.42",
- "snhjh":"-",
- "jsjl":"196.12",
- "jnhjh":"-",
- "ysjl":"358.44",
- "ynhjh":"-",
- "zsjl":"1716.39",
- "znhjh":"-",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
- },
- {
- "time": "2019-02-02",
- "dsjl":"-",
- "dnhjh":"-",
- "tsjl":"392.13",
- "tnhjh":"-",
- "ssjl":"382.95",
- "snhjh":"-",
- "jsjl":"164.3",
- "jnhjh":"-",
- "ysjl":"278.17",
- "ynhjh":"-",
- "zsjl":"1813.69",
- "znhjh":"-",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
- },
- {
- "time": "2019-02-03",
- "dsjl":"-",
- "dnhjh":"-",
- "tsjl":"213.91",
- "tnhjh":"-",
- "ssjl":"263.23",
- "snhjh":"-",
- "jsjl":"308.81",
- "jnhjh":"-",
- "ysjl":"327.49",
- "ynhjh":"-",
- "zsjl":"1698.82",
- "znhjh":"-",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
- },
- {
- "time": "2019-02-04",
- "dsjl":"-",
- "dnhjh":"-",
- "tsjl":"355.44",
- "tnhjh":"-",
- "ssjl":"260.75",
- "snhjh":"-",
- "jsjl":"232.01",
- "jnhjh":"-",
- "ysjl":"253.9",
- "ynhjh":"-",
- "zsjl":"1486.82",
- "znhjh":"-",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
- }],
+ energyEenchmarkingList: [
+ {
+ time: "2019-02-01",
+ dsjl: "-",
+ dnhjh: "-",
+ tsjl: "244.42",
+ tnhjh: "-",
+ ssjl: "343.42",
+ snhjh: "-",
+ jsjl: "196.12",
+ jnhjh: "-",
+ ysjl: "358.44",
+ ynhjh: "-",
+ zsjl: "1716.39",
+ znhjh: "-",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ },
+ {
+ time: "2019-02-02",
+ dsjl: "-",
+ dnhjh: "-",
+ tsjl: "392.13",
+ tnhjh: "-",
+ ssjl: "382.95",
+ snhjh: "-",
+ jsjl: "164.3",
+ jnhjh: "-",
+ ysjl: "278.17",
+ ynhjh: "-",
+ zsjl: "1813.69",
+ znhjh: "-",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ },
+ {
+ time: "2019-02-03",
+ dsjl: "-",
+ dnhjh: "-",
+ tsjl: "213.91",
+ tnhjh: "-",
+ ssjl: "263.23",
+ snhjh: "-",
+ jsjl: "308.81",
+ jnhjh: "-",
+ ysjl: "327.49",
+ ynhjh: "-",
+ zsjl: "1698.82",
+ znhjh: "-",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ },
+ {
+ time: "2019-02-04",
+ dsjl: "-",
+ dnhjh: "-",
+ tsjl: "355.44",
+ tnhjh: "-",
+ ssjl: "260.75",
+ snhjh: "-",
+ jsjl: "232.01",
+ jnhjh: "-",
+ ysjl: "253.9",
+ ynhjh: "-",
+ zsjl: "1486.82",
+ znhjh: "-",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ }
+ ],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
@@ -169,13 +182,12 @@
type: undefined,
value: undefined,
termValidity: undefined,
- modelNode:"",
+ modelNode: ""
},
- times:"",
+ times: ""
};
},
- created() {
- },
+ created() {},
methods: {
// 鍙栨秷鎸夐挳
cancel() {
@@ -208,19 +220,19 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.single = selection.length!=1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.times = year + '-' + month + '-' + date
- },
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.times = year + "-" + month + "-" + date;
+ }
}
};
</script>
diff --git a/energy_management_ui/src/views/energyExamine/assessmentResults/index.vue b/energy_management_ui/src/views/energyExamine/assessmentResults/index.vue
index 3fe985a..98732ff 100644
--- a/energy_management_ui/src/views/energyExamine/assessmentResults/index.vue
+++ b/energy_management_ui/src/views/energyExamine/assessmentResults/index.vue
@@ -1,58 +1,84 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳芥晥鑰冩牳缁撴灉
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"
- :auth="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
- <assessmentResults ref="assessmentResults" style="padding:10px"></assessmentResults>
- </el-main>
- </el-container>
- </el-container>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳芥晥鑰冩牳缁撴灉" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ :auth="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
+ <assessmentResults
+ ref="assessmentResults"
+ style="padding:10px"
+ ></assessmentResults>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import assessmentResults from "./assessmentResults";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import assessmentResults from "./assessmentResults";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
- export default {
- components: { ModelNode,assessmentResults},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ mixins: [mixins],
+ components: { ModelNode, assessmentResults },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ //this.$refs.EnergyActual.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- //this.$refs.EnergyActual.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyMonitoring/e-gasMonitoring/index.vue b/energy_management_ui/src/views/energyMonitoring/e-gasMonitoring/index.vue
index 1759736..9149d99 100644
--- a/energy_management_ui/src/views/energyMonitoring/e-gasMonitoring/index.vue
+++ b/energy_management_ui/src/views/energyMonitoring/e-gasMonitoring/index.vue
@@ -9,9 +9,7 @@
<div slot="header" class="clearfix" style="height:32px">
瀹炴椂鏁版嵁缁勬�佸浘
</div>
- <el-input
- placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�"
- v-model="filterText">
+ <el-input placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" v-model="filterText">
</el-input>
<el-tree
@@ -20,186 +18,190 @@
:props="defaultProps"
default-expand-all
:filter-node-method="filterNode"
- ref="tree">
+ ref="tree"
+ >
</el-tree>
</el-card>
</el-aside>
<el-container>
<el-main style="padding:0">
-<!-- <el-tabs v-model="activeName" @tab-click="handleClick">-->
-<!-- <el-tab-pane label="妫�娴嬪浘" name="first">鐢ㄦ埛绠＄悊</el-tab-pane>-->
-<!-- <el-tab-pane label="鎶ヨ〃" name="second">閰嶇疆绠＄悊</el-tab-pane>-->
-<!-- <el-tab-pane label="瓒嬪娍鍥�" name="third">瑙掕壊绠＄悊</el-tab-pane>-->
-<!-- <el-tab-pane label="鎶ヨ璁板綍" name="fourth">瀹氭椂浠诲姟琛ュ伩</el-tab-pane>-->
-<!-- </el-tabs>-->
- <svg-icon v-bind:iconClass="imgShow.realName" className='icon'></svg-icon>
+ <!-- <el-tabs v-model="activeName" @tab-click="handleClick">-->
+ <!-- <el-tab-pane label="妫�娴嬪浘" name="first">鐢ㄦ埛绠＄悊</el-tab-pane>-->
+ <!-- <el-tab-pane label="鎶ヨ〃" name="second">閰嶇疆绠＄悊</el-tab-pane>-->
+ <!-- <el-tab-pane label="瓒嬪娍鍥�" name="third">瑙掕壊绠＄悊</el-tab-pane>-->
+ <!-- <el-tab-pane label="鎶ヨ璁板綍" name="fourth">瀹氭椂浠诲姟琛ュ伩</el-tab-pane>-->
+ <!-- </el-tabs>-->
+ <svg-icon
+ v-bind:iconClass="imgShow.realName"
+ className="icon"
+ ></svg-icon>
</el-main>
-<!-- <el-main style="padding:0">-->
-<!-- <realTimeSetting ref="realTimeSetting"></realTimeSetting>-->
-<!-- </el-main>-->
-<!-- <svg-icon v-bind:iconClass="imgShow.realName" className='icon'></svg-icon>-->
+ <!-- <el-main style="padding:0">-->
+ <!-- <realTimeSetting ref="realTimeSetting"></realTimeSetting>-->
+ <!-- </el-main>-->
+ <!-- <svg-icon v-bind:iconClass="imgShow.realName" className='icon'></svg-icon>-->
</el-container>
</el-container>
</div>
</template>
<style scoped>
- .icon {
- width: 970px;
- height: 550px;
- }
+.icon {
+ width: 970px;
+ height: 550px;
+}
</style>
<script>
- import {
- listEquipmentfile,
- } from "@/api/basicSetup/equipmentfile";
- export default {
- watch: {
- filterText(val) {
- this.$refs.tree.filter(val);
+import { listEquipmentfile } from "@/api/basicSetup/equipmentfile";
+export default {
+ watch: {
+ filterText(val) {
+ this.$refs.tree.filter(val);
+ }
+ },
+ data() {
+ var choiceIndex;
+ var Indexid;
+ var realName = "2020-03-12-275a44966506b783f033058f9e0e3472";
+ return {
+ //鍙宠竟鑿滃崟鏍�
+ activeName: "瀹炴椂鐩戞祴",
+ // 閬僵灞�
+ loading: true,
+ // 閫変腑鏁扮粍
+ ids: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ //
+ imgShow: [(realName = "")],
+ // 缁勬�佸浘琛ㄦ牸鏁版嵁
+ equipmentfileList: [],
+ //娴嬬偣琛ㄦ牸鏁版嵁
+ equipmentfilecdList: [(choiceIndex = "")],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ footopen: false,
+ addImgOpen: false,
+ uploadOpen: false,
+ indexLoading: false,
+ //缁勬�佸浘閫夋嫨鎸囨爣
+ statisticIndexDialog: false,
+ //缁勬�佸浘娴嬬偣寮瑰嚭灞�
+ imgcdopen: false,
+ // ID瀛楀吀
+ fileidOptions: [],
+ // 鏂囦欢鍚嶇О瀛楀吀
+ filenameOptions: [],
+ // 鏂囦欢缂栧彿瀛楀吀
+ filenoOptions: [],
+ // 鎿嶄綔浜哄瓧鍏�
+ opomanOptions: [],
+ // 鎿嶄綔鏃堕棿瀛楀吀
+ opotimeOptions: [],
+ // 鏂囦欢璺緞瀛楀吀
+ filepathOptions: [],
+ // 澶囨敞瀛楀吀
+ noteOptions: [],
+ settingStatisticIndexList: [],
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ rules: {
+ filename: [
+ { required: true, message: "鏂囦欢鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ fileno: [
+ { required: true, message: "鏂囦欢缂栧彿涓嶈兘涓虹┖", trigger: "blur" }
+ ]
+ },
+ filterText: "",
+ svgData: [
+ {
+ id: 1,
+ label: "鐢熶骇浼佷笟",
+ children: [
+ {
+ id: 2,
+ label: "姘寸郴缁�"
+ },
+ {
+ id: 3,
+ label: "鐢电郴缁�"
}
- },
- data() {
- var choiceIndex;
- var Indexid;
- var realName = "2020-03-12-275a44966506b783f033058f9e0e3472";
- return {
- //鍙宠竟鑿滃崟鏍�
- activeName: '瀹炴椂鐩戞祴',
- // 閬僵灞�
- loading: true,
- // 閫変腑鏁扮粍
- ids: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 0,
- //
- imgShow:[
- realName=""
- ],
- // 缁勬�佸浘琛ㄦ牸鏁版嵁
- equipmentfileList: [],
- //娴嬬偣琛ㄦ牸鏁版嵁
- equipmentfilecdList: [
- choiceIndex = ""
- ],
- // 寮瑰嚭灞傛爣棰�
- title: "",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- footopen: false,
- addImgOpen: false,
- uploadOpen: false,
- indexLoading: false,
- //缁勬�佸浘閫夋嫨鎸囨爣
- statisticIndexDialog: false,
- //缁勬�佸浘娴嬬偣寮瑰嚭灞�
- imgcdopen: false,
- // ID瀛楀吀
- fileidOptions: [],
- // 鏂囦欢鍚嶇О瀛楀吀
- filenameOptions: [],
- // 鏂囦欢缂栧彿瀛楀吀
- filenoOptions: [],
- // 鎿嶄綔浜哄瓧鍏�
- opomanOptions: [],
- // 鎿嶄綔鏃堕棿瀛楀吀
- opotimeOptions: [],
- // 鏂囦欢璺緞瀛楀吀
- filepathOptions: [],
- // 澶囨敞瀛楀吀
- noteOptions: [],
- settingStatisticIndexList: [],
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- rules: {
- filename: [
- {required: true, message: "鏂囦欢鍚嶇О涓嶈兘涓虹┖", trigger: "blur"}
- ], fileno: [
- {required: true, message: "鏂囦欢缂栧彿涓嶈兘涓虹┖", trigger: "blur"}
- ],
- },
- filterText: '',
- svgData:[{
- id:1,
- label:"鐢熶骇浼佷笟",
- children:[{
- id:2,
- label:"姘寸郴缁�",
- },{
- id:3,
- label: "鐢电郴缁�",
- }],
- }],
- defaultProps: {
- children: 'children',
- label: 'label'
- },
- };
- },
- created() {
- this.getList();
- this.imgShow.realName = "dian";
- },
- methods: {
- //閫氳繃
- handleClick(tab, event) {
- console.log(tab, event);
- },
- //鍒囨崲缁勬�佸浘鏌ョ湅
- updateImg(row){
- var pos = row.filepath.lastIndexOf('/');
- var str = row.filepath.substr(pos+1);
- this.imgShow.realName = str.substring(0,str.length-4);
- console.log(this.imgShow.realName)
- },
- //閫氳繃鍏抽敭瀛楄繘琛岃繃婊ょ粍鎬佸浘
- filterNode(value, data) {
- if (!value) return true;
- return data.label.indexOf(value) !== -1;
- },
- /** 鏌ヨ缁勬�佸浘鍒楄〃 */
- getList() {
- this.loading = true;
- listEquipmentfile(this.queryParams).then(response => {
- this.equipmentfileList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- fileid: undefined,
- filename: undefined,
- fileno: undefined,
- opoman: undefined,
- opotime: undefined,
- filepath: undefined,
- note: undefined,
- img: undefined
- };
- this.resetForm("form");
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
+ ]
}
+ ],
+ defaultProps: {
+ children: "children",
+ label: "label"
+ }
};
+ },
+ created() {
+ this.getList();
+ this.imgShow.realName = "dian";
+ },
+ methods: {
+ //閫氳繃
+ handleClick(tab, event) {
+ console.log(tab, event);
+ },
+ //鍒囨崲缁勬�佸浘鏌ョ湅
+ updateImg(row) {
+ var pos = row.filepath.lastIndexOf("/");
+ var str = row.filepath.substr(pos + 1);
+ this.imgShow.realName = str.substring(0, str.length - 4);
+ console.log(this.imgShow.realName);
+ },
+ //閫氳繃鍏抽敭瀛楄繘琛岃繃婊ょ粍鎬佸浘
+ filterNode(value, data) {
+ if (!value) return true;
+ return data.label.indexOf(value) !== -1;
+ },
+ /** 鏌ヨ缁勬�佸浘鍒楄〃 */
+ getList() {
+ this.loading = true;
+ listEquipmentfile(this.queryParams).then(response => {
+ this.equipmentfileList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ fileid: undefined,
+ filename: undefined,
+ fileno: undefined,
+ opoman: undefined,
+ opotime: undefined,
+ filepath: undefined,
+ note: undefined,
+ img: undefined
+ };
+ this.resetForm("form");
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ }
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/actualOutput/index.vue b/energy_management_ui/src/views/energyPlan/actualOutput/index.vue
index ffe4d46..ae2bdc4 100644
--- a/energy_management_ui/src/views/energyPlan/actualOutput/index.vue
+++ b/energy_management_ui/src/views/energyPlan/actualOutput/index.vue
@@ -1,58 +1,81 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 璁″垝浜ч噺
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="瀹為檯浜ч噺" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
<EnergyActual ref="EnergyActual" style="padding:10px"></EnergyActual>
- </el-main>
- </el-container>
- </el-container>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import EnergyActual from "./EnergyActual";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import EnergyActual from "./EnergyActual";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
- export default {
- components: { ModelNode,EnergyActual},
- created() {
- this.modelCode=this.$route.query.modelCode;
+export default {
+ mixins: [mixins],
+ components: { ModelNode, EnergyActual, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ console.log(node);
+ //this.$refs.EnergyActual.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- console.log(node);
- //this.$refs.EnergyActual.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/energyEstablishment/index.vue b/energy_management_ui/src/views/energyPlan/energyEstablishment/index.vue
index dae0787..6ceaa7f 100644
--- a/energy_management_ui/src/views/energyPlan/energyEstablishment/index.vue
+++ b/energy_management_ui/src/views/energyPlan/energyEstablishment/index.vue
@@ -1,57 +1,82 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳芥簮娑堣�楄鍒�
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
- <energyEstablishment ref="energyEstablishment" style="padding:10px"></energyEstablishment>
- </el-main>
- </el-container>
- </el-container>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳芥簮娑堣�楄鍒�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
+ <energyEstablishment
+ ref="energyEstablishment"
+ style="padding:10px"
+ ></energyEstablishment>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import energyEstablishment from "./energyEstablishment";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
-
- export default {
- components: { ModelNode,energyEstablishment},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import energyEstablishment from "./energyEstablishment";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ components: { ModelNode, energyEstablishment, ShrinkCol },
+ mixins: [mixins],
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.energyEstablishment.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.energyEstablishment.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/energyForecast/LineChart.vue b/energy_management_ui/src/views/energyPlan/energyForecast/LineChart.vue
index cab80f2..17dff6b 100644
--- a/energy_management_ui/src/views/energyPlan/energyForecast/LineChart.vue
+++ b/energy_management_ui/src/views/energyPlan/energyForecast/LineChart.vue
@@ -1,140 +1,162 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
- }
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
+ width: {
+ type: String,
+ default: "100%"
},
- data() {
- return {
- chart: null,
- seriesData: [],
- }
+ height: {
+ type: String,
+ default: "350px"
},
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
-
- this.chart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- title: {
- x:'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- legend: {
- data:['鐒﹀彴','绮夌鏈�'],
- left: '60%',
- },
- xAxis: [{
- type: 'category',
- data: ['12鏃�','13鏃�','14鏃�','15鏃�','16鏃�','17鏃�','18鏃�','19鏃�','20鏃�'],
- axisPointer: {
- type: 'shadow'
- }
- }],
- yAxis: [{
- name: '',
- type: 'value',
- nameTextStyle:{
- color:"#333",
- },
- axisLabel: {
- formatter: '{value}'
- },
- axisTick: {
- show: false
- },
- },{
- name: '',
- type: 'value',
- nameTextStyle:{
- color:"#333",
- },
- axisLabel: {
- formatter: '{value}'
- },
- axisTick: {
- show: false
- },
- }
- ],
- series:[{
- type: 'bar',
- data: [289,430,350,375,374,204,300,194,184],
- smooth: true,//绾挎潯骞虫粦
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- },{
- type: 'line',
- yAxisIndex: 1,
- data: [289,430,350,375,374,204,300,194,184],
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
}
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+
+ this.chart.setOption({
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ title: {
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#333"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ legend: {
+ data: ["鐒﹀彴", "绮夌鏈�"],
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [
+ {
+ type: "category",
+ data: [
+ "12鏃�",
+ "13鏃�",
+ "14鏃�",
+ "15鏃�",
+ "16鏃�",
+ "17鏃�",
+ "18鏃�",
+ "19鏃�",
+ "20鏃�"
+ ],
+ axisPointer: {
+ type: "shadow"
+ }
+ }
+ ],
+ yAxis: [
+ {
+ name: "",
+ type: "value",
+ nameTextStyle: {
+ color: "#333"
+ },
+ axisLabel: {
+ formatter: "{value}"
+ },
+ axisTick: {
+ show: false
+ }
+ },
+ {
+ name: "",
+ type: "value",
+ nameTextStyle: {
+ color: "#333"
+ },
+ axisLabel: {
+ formatter: "{value}"
+ },
+ axisTick: {
+ show: false
+ }
+ }
+ ],
+ series: [
+ {
+ type: "bar",
+ data: [289, 430, 350, 375, 374, 204, 300, 194, 184],
+ smooth: true, //绾挎潯骞虫粦
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ },
+ {
+ type: "line",
+ yAxisIndex: 1,
+ data: [289, 430, 350, 375, 374, 204, 300, 194, 184],
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
+ }
}
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/energyForecast/energyForecast.vue b/energy_management_ui/src/views/energyPlan/energyForecast/energyForecast.vue
index cf4753f..8a9ad47 100644
--- a/energy_management_ui/src/views/energyPlan/energyForecast/energyForecast.vue
+++ b/energy_management_ui/src/views/energyPlan/energyForecast/energyForecast.vue
@@ -1,6 +1,11 @@
<template>
<div class="app-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>
<el-radio v-model="radio" label="1">鎸夋棩</el-radio>
<el-radio v-model="radio" label="2">鎸夋湀</el-radio>
@@ -11,7 +16,8 @@
v-for="item in options"
:key="item.value"
:label="item.label"
- :value="item.value">
+ :value="item.value"
+ >
</el-option>
</el-select>
<el-select v-model="values" placeholder="璇烽�夋嫨">
@@ -19,26 +25,32 @@
v-for="item in optionList"
:key="item.value"
:label="item.label"
- :value="item.value">
+ :value="item.value"
+ >
</el-option>
</el-select>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini">棰勬祴</el-button>
+ <el-button type="primary" icon="el-icon-search" size="mini"
+ >棰勬祴</el-button
+ >
<el-button icon="el-icon-refresh" size="mini">瀵煎嚭</el-button>
</el-form-item>
</el-form>
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <line-chart/>
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <line-chart />
</el-row>
<div>
<span>缁熻鑼冨洿锛氬叏鍘�</span>
- <span style="float: right;">缁熻鍖洪棿锛歿{times}}</span>
+ <span style="float: right;">缁熻鍖洪棿锛歿{ times }}</span>
</div>
- <el-table :data="energyEenchmarkingList" @selection-change="handleSelectionChange">
- <el-table-column prop="date" align="center" label="鏃ユ湡" width="150"/>
+ <el-table
+ :data="energyEenchmarkingList"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column prop="date" align="center" label="鏃ユ湡" width="150" />
<el-table-column label="璁″垝浜ч噺" align="center">
- <el-table-column label="浜у搧绉嶇被" align="center" prop="cpname"/>
+ <el-table-column label="浜у搧绉嶇被" align="center" prop="cpname" />
<el-table-column label="璁￠噺鍗曚綅" align="center" prop="jldw" />
<el-table-column label="璁″垝浜ч噺" align="center" prop="jhcl" />
</el-table-column>
@@ -52,7 +64,7 @@
</template>
<script>
- import LineChart from './LineChart'
+import LineChart from "./LineChart";
export default {
components: {
LineChart
@@ -69,69 +81,78 @@
multiple: true,
// 鎬绘潯鏁�
total: 0,
- radio: '1',
- value: '',
- values: '',
- options: [{
- value: '閫夐」1',
- label: '鏈潵涓夊ぉ'
- }, {
- value: '閫夐」2',
- label: '鏈潵浜斿ぉ'
- }, {
- value: '閫夐」3',
- label: '鏈潵涓冨ぉ'
- }],
- optionList: [{
- value: '閫夐」1',
- label: '鐢佃��'
- }, {
- value: '閫夐」2',
- label: '姘磋��'
- }],
- // energy_benchmarking琛ㄦ牸鏁版嵁
- energyEenchmarkingList: [{
- "date":"2020-11-20",
- "cpname": "鐓ゆ皵",
- "jldw":"绔嬫柟绫�",
- "jhcl":"12212121",
- "dian":"99",
- "shui":"20",
- "zq":"60",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
- },
+ radio: "1",
+ value: "",
+ values: "",
+ options: [
{
- "date":"2020-11-20",
- "cpname": "绮楄嫰",
- "jldw":"鍚�",
- "jhcl":"22212",
- "dian":"79",
- "shui":"26",
- "zq":"50",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
+ value: "閫夐」1",
+ label: "鏈潵涓夊ぉ"
},
{
- "date":"2020-11-20",
- "cpname": "鐒︽补",
- "jldw":"鍚�",
- "jhcl":"1211212",
- "dian":"109",
- "shui":"30",
- "zq":"85",
- "createBy": null,
- "createTime": "",
- "updateBy": null,
- "updateTime": null,
- "remark": "",
- }],
+ value: "閫夐」2",
+ label: "鏈潵浜斿ぉ"
+ },
+ {
+ value: "閫夐」3",
+ label: "鏈潵涓冨ぉ"
+ }
+ ],
+ optionList: [
+ {
+ value: "閫夐」1",
+ label: "鐢佃��"
+ },
+ {
+ value: "閫夐」2",
+ label: "姘磋��"
+ }
+ ],
+ // energy_benchmarking琛ㄦ牸鏁版嵁
+ energyEenchmarkingList: [
+ {
+ date: "2020-11-20",
+ cpname: "鐓ゆ皵",
+ jldw: "绔嬫柟绫�",
+ jhcl: "12212121",
+ dian: "99",
+ shui: "20",
+ zq: "60",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ },
+ {
+ date: "2020-11-20",
+ cpname: "绮楄嫰",
+ jldw: "鍚�",
+ jhcl: "22212",
+ dian: "79",
+ shui: "26",
+ zq: "50",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ },
+ {
+ date: "2020-11-20",
+ cpname: "鐒︽补",
+ jldw: "鍚�",
+ jhcl: "1211212",
+ dian: "109",
+ shui: "30",
+ zq: "85",
+ createBy: null,
+ createTime: "",
+ updateBy: null,
+ updateTime: null,
+ remark: ""
+ }
+ ],
// 寮瑰嚭灞傛爣棰�
// 鏄惁鏄剧ず寮瑰嚭灞�
open: false,
@@ -146,21 +167,23 @@
type: undefined,
value: undefined,
termValidity: undefined,
- modelNode:"",
+ modelNode: ""
},
- times:"",
+ times: ""
};
},
- created() {this.getTime()},
+ created() {
+ this.getTime();
+ },
methods: {
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.times = year + '-' + month + '-' + date
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.times = year + "-" + month + "-" + date;
},
// 鍙栨秷鎸夐挳
cancel() {
@@ -193,76 +216,76 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.single = selection.length!=1
- this.multiple = !selection.length
- },
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
+ }
}
};
</script>
<style lang="scss" scoped>
- .dashboard-editor-container {
- padding: 32px;
- background-color: rgb(240, 242, 245);
- position: relative;
+.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-wrapper {
+ background: #fff;
+ padding: 16px 16px 0;
+ margin-bottom: 32px;
}
+}
- @media (max-width:1024px) {
- .chart-wrapper {
- padding: 8px;
- }
+@media (max-width: 1024px) {
+ .chart-wrapper {
+ padding: 8px;
}
- .live{
- position: fixed;
- right: 0px;
- top:70px;
- display: flex;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- width: 100px;
- height: 60px;
- background-color: red;
- animation: fade 600ms infinite;
- -webkit-animation: fade 600ms infinite;
+}
+.live {
+ position: fixed;
+ right: 0px;
+ top: 70px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 100px;
+ height: 60px;
+ background-color: red;
+ animation: fade 600ms infinite;
+ -webkit-animation: fade 600ms infinite;
+}
+.live_content {
+ font-size: 18px;
+ color: white;
+ font-weight: bold;
+}
+.live_number {
+ font-size: 32px;
+ color: white;
+ font-weight: bolder;
+}
+@keyframes fade {
+ from {
+ opacity: 1;
}
- .live_content{
- font-size: 18px;
- color: white;
- font-weight: bold;
+ 50% {
+ opacity: 0.4;
}
- .live_number{
- font-size: 32px;
- color: white;
- font-weight: bolder;
+ to {
+ opacity: 1;
}
- @keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
- }
+}
- @-webkit-keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
+@-webkit-keyframes fade {
+ from {
+ opacity: 1;
}
+ 50% {
+ opacity: 0.4;
+ }
+ to {
+ opacity: 1;
+ }
+}
</style>
diff --git a/energy_management_ui/src/views/energyPlan/energyForecast/index.vue b/energy_management_ui/src/views/energyPlan/energyForecast/index.vue
index 3b9346c..3d017b2 100644
--- a/energy_management_ui/src/views/energyPlan/energyForecast/index.vue
+++ b/energy_management_ui/src/views/energyPlan/energyForecast/index.vue
@@ -1,58 +1,84 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳芥簮棰勬祴
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"
- :auth="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
- <energyForecast ref="energyForecast" style="padding:10px"></energyForecast>
- </el-main>
- </el-container>
- </el-container>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳芥簮棰勬祴" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ :auth="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
+ <energyForecast
+ ref="energyForecast"
+ style="padding:10px"
+ ></energyForecast>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import energyForecast from "./energyForecast";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import energyForecast from "./energyForecast";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
- export default {
- components: { ModelNode,energyForecast},
- created() {
- this.modelCode=this.$route.query.modelCode;
+export default {
+ components: { ModelNode, energyForecast, ShrinkCol },
+ mixins: [mixins],
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ //this.$refs.EnergyActual.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- //this.$refs.EnergyActual.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/energyMonitoring/LineChart.vue b/energy_management_ui/src/views/energyPlan/energyMonitoring/LineChart.vue
index 588cddb..5290b98 100644
--- a/energy_management_ui/src/views/energyPlan/energyMonitoring/LineChart.vue
+++ b/energy_management_ui/src/views/energyPlan/energyMonitoring/LineChart.vue
@@ -1,130 +1,139 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons')
- import resize from '../../dashboard/mixins/resize'
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
+import echarts from "echarts";
+require("echarts/theme/macarons");
+import resize from "../../dashboard/mixins/resize";
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- data() {
- return {
- chart: null,
- seriesData: [],
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData,actualData,expecteData} = {}) {
- this.chart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- title: {
- x: 'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- /*legend: {
+ setOptions({ expectedData, actualData, expecteData } = {}) {
+ this.chart.setOption({
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ title: {
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ /*legend: {
data:['',''],
left: '60%',
},*/
- xAxis: [{
- type: 'category',
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisPointer: {
- type: 'shadow'
+ type: "shadow"
}
- }],
- yAxis: [{
+ }
+ ],
+ yAxis: [
+ {
//name: '缁煎悎鑳借��',
- type: 'value',
+ type: "value",
nameTextStyle: {
- color: "#333",
+ color: "#333"
},
axisLabel: {
- formatter: '{value}'
+ formatter: "{value}"
},
axisTick: {
show: false
- },
- }],
- series: [{
+ }
+ }
+ ],
+ series: [
+ {
//name:"缁煎悎鑳借��",
- type: 'bar',
+ type: "bar",
data: expectedData,
//stack: 'vistors',
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- },{
+ animationEasing: "quadraticOut"
+ },
+ {
//name:"鑳芥簮鍗犳瘮",
- type: 'bar',
+ type: "bar",
data: expecteData,
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
- }
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/energyMonitoring/energyMonitoring.vue b/energy_management_ui/src/views/energyPlan/energyMonitoring/energyMonitoring.vue
index 82a2766..11f963a 100644
--- a/energy_management_ui/src/views/energyPlan/energyMonitoring/energyMonitoring.vue
+++ b/energy_management_ui/src/views/energyPlan/energyMonitoring/energyMonitoring.vue
@@ -1,66 +1,97 @@
<template>
<div class="app-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 v-for="dict in dateTypeOptions" :key="dict.dictValue" :label="dict.dictValue" @change="handleTime(dict.dictValue)">{{dict.dictLabel}}</el-radio>
+ <el-radio
+ v-for="dict in dateTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictValue"
+ @change="handleTime(dict.dictValue)"
+ >{{ dict.dictLabel }}</el-radio
+ >
</el-radio-group>
</el-form-item>
<el-form-item label="缁熻鍖洪棿">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- :type="dateTypes"
- :value-format="valueFormat"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ :type="dateTypes"
+ :value-format="valueFormat"
+ 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
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鎼滅储</el-button
+ >
</el-form-item>
</el-form>
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <line-chart ref="LineChart" :chart-data="lineChartData"/>
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <line-chart ref="LineChart" :chart-data="lineChartData" />
</el-row>
- <el-table :data="energyEenchmarkingList" @selection-change="handleSelectionChange">
- <el-table-column prop="label" align="center" label="鐢ㄨ兘鍗曞厓">{{label}}</el-table-column>
+ <el-table
+ :data="energyEenchmarkingList"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column prop="label" align="center" label="鐢ㄨ兘鍗曞厓">{{
+ label
+ }}</el-table-column>
<el-table-column label="浜у搧浜ч噺" align="center">
- <el-table-column label="浜у搧绉嶇被" align="center" prop="productname"/>
- <el-table-column label="璁￠噺鍗曚綅" align="center" prop="muid" :formatter="unitIdFormat"/>
+ <el-table-column label="浜у搧绉嶇被" align="center" prop="productname" />
+ <el-table-column
+ label="璁￠噺鍗曚綅"
+ align="center"
+ prop="muid"
+ :formatter="unitIdFormat"
+ />
<el-table-column label="璁″垝鍊�" align="center" prop="planValue" />
<el-table-column label="瀹為檯鍊�" align="center" prop="actualValue" />
</el-table-column>
<el-table-column label="鐢碉紙鍗冪摝鏃讹級" align="center">
- <el-table-column label="璁″垝鍊�" align="center" prop="poValue"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="peValue"/>
+ <el-table-column label="璁″垝鍊�" align="center" prop="poValue" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="peValue" />
</el-table-column>
<el-table-column label="姘达紙绔嬫柟绫筹級" align="center">
- <el-table-column label="璁″垝鍊�" align="center" prop="poWaterValue"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="peWaterValue"/>
+ <el-table-column label="璁″垝鍊�" align="center" prop="poWaterValue" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="peWaterValue" />
</el-table-column>
<el-table-column label="鐓ゆ皵锛堢珛鏂圭背锛�" align="center">
- <el-table-column label="璁″垝鍊�" align="center" prop="poCoalValue"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="peCoalValue"/>
+ <el-table-column label="璁″垝鍊�" align="center" prop="poCoalValue" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="peCoalValue" />
</el-table-column>
<el-table-column label="钂告苯锛堢珛鏂圭背锛�" align="center">
- <el-table-column label="璁″垝鍊�" align="center" prop="poSteamValue"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="peSteamValue"/>
+ <el-table-column label="璁″垝鍊�" align="center" prop="poSteamValue" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="peSteamValue" />
</el-table-column>
</el-table>
</div>
</template>
<script>
- import { listEnergyMonitoring } from "@/api/plannedOutput/energyMonitoring";
- import LineChart from './LineChart'
- export default {
- components: {LineChart},
+import { listEnergyMonitoring } from "@/api/plannedOutput/energyMonitoring";
+import LineChart from "./LineChart";
+export default {
+ components: { LineChart },
data() {
return {
// 閬僵灞�
//loading: true,
// 閫変腑鏁扮粍
ids: [],
- radio: '1',
+ radio: "1",
// 闈炲崟涓鐢�
single: true,
// 闈炲涓鐢�
@@ -69,19 +100,19 @@
total: 0,
// energy_benchmarking琛ㄦ牸鏁版嵁
- energyEenchmarkingList:[],
- dateTypeOptions:[],
+ energyEenchmarkingList: [],
+ dateTypeOptions: [],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
pageSize: 10,
dataTime: undefined,
- timeType:"DAY",
+ timeType: "DAY"
},
- dateTypes: 'date',
- valueFormat:"yyyy-MM-dd",
- label:"",
- lineChartData:{expectedData: [],actualData: [],expecteData:[]},
+ dateTypes: "date",
+ valueFormat: "yyyy-MM-dd",
+ label: "",
+ lineChartData: { expectedData: [], actualData: [], expecteData: [] }
};
},
created() {
@@ -91,30 +122,32 @@
});
this.getDicts("energyPlan").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
},
methods: {
modelNodeChange(modelNode) {
- this.queryParams.indexCode=modelNode.id;
- this.label=modelNode.label
- this.getList(this.queryParams)
+ this.queryParams.indexCode = modelNode.id;
+ this.label = modelNode.label;
+ this.getList(this.queryParams);
},
getList() {
this.loading = true;
listEnergyMonitoring(this.queryParams).then(response => {
- this.energyEenchmarkingList=response.data;
- let actualData=[];
- let expectedData=[];
- let expecteData=[];
+ this.energyEenchmarkingList = response.data;
+ let actualData = [];
+ let expectedData = [];
+ let expecteData = [];
this.energyEenchmarkingList.forEach(item => {
actualData.push(item.productname);
expectedData.push(item.planValue);
expecteData.push(item.actualValue);
- })
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.expecteData=expecteData;
+ });
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.expecteData = expecteData;
this.$refs.LineChart.initChart(this.lineChartData);
});
},
@@ -153,31 +186,28 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.single = selection.length!=1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
- handleTime(date){
- if(date=='YEAR'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='MONTH'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
+ handleTime(date) {
+ if (date == "YEAR") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "MONTH") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
}
},
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime = year + '-' + month + '-' + date
- },
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month + "-" + date;
+ }
}
};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/energyMonitoring/index.vue b/energy_management_ui/src/views/energyPlan/energyMonitoring/index.vue
index 4246118..358aeff 100644
--- a/energy_management_ui/src/views/energyPlan/energyMonitoring/index.vue
+++ b/energy_management_ui/src/views/energyPlan/energyMonitoring/index.vue
@@ -1,57 +1,83 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 璁″垝浜庡疄缁╁姣斿垎鏋�
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
- <energyMonitoring ref="energyMonitoring" style="padding:10px"></energyMonitoring>
- </el-main>
- </el-container>
- </el-container>
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="璁″垝浜庡疄闄呭姣斿垎鏋�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
+ <energyMonitoring
+ ref="energyMonitoring"
+ style="padding:10px"
+ ></energyMonitoring>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import energyMonitoring from "./energyMonitoring";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import energyMonitoring from "./energyMonitoring";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
- export default {
- components: { ModelNode,energyMonitoring},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ mixins: [mixins],
+ components: { ModelNode, energyMonitoring, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.energyMonitoring.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.energyMonitoring.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyPlan/plannedOutput/index.vue b/energy_management_ui/src/views/energyPlan/plannedOutput/index.vue
index 3545d4f..04c29b8 100644
--- a/energy_management_ui/src/views/energyPlan/plannedOutput/index.vue
+++ b/energy_management_ui/src/views/energyPlan/plannedOutput/index.vue
@@ -1,57 +1,79 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 璁″垝浜ч噺
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode"
- :modelCode="modelCode"
- :showOpt="false"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="璁″垝浜ч噺" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :modelCode="modelCode"
+ :showOpt="false"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <basic-container :bodyStyle="bodyStyleRight">
<EnergyPlan ref="EnergyPlan" style="padding:10px"></EnergyPlan>
- </el-main>
- </el-container>
- </el-container>
+ </basic-container>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import EnergyPlan from "./EnergyPlan";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
-
- export default {
- components: { ModelNode,EnergyPlan},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import EnergyPlan from "./EnergyPlan";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ mixins: [mixins],
+ components: { ModelNode, EnergyPlan, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.EnergyPlan.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.EnergyPlan.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyPrice/index.vue b/energy_management_ui/src/views/energyPrice/index.vue
index 150bbfa..2d1662c 100644
--- a/energy_management_ui/src/views/energyPrice/index.vue
+++ b/energy_management_ui/src/views/energyPrice/index.vue
@@ -240,6 +240,7 @@
import ruleApi from "@/api/energyPrice/price";
import { getTimePeriod } from "@/utils/index";
import mixins from "@/layout/mixin/getHeight";
+import moment from "moment";
export default {
name: "energyPrice",
mixins: [mixins],
@@ -460,7 +461,7 @@
name: this.form.name,
id: this.form.id,
remark: this.form.remark,
- effectiveDate: this.form.effectiveDate,
+ effectiveDate: moment(this.form.effectiveDate).format("yyyy-MM-DD"),
sharpFee: this.priceTypeList[0].price, //灏栨椂娈�
peakFee: this.priceTypeList[1].price, //宄版椂娈�
flatFee: this.priceTypeList[2].price, //骞虫椂娈�
diff --git a/energy_management_ui/src/views/energyStatistics/energyConsumption/BarChart.vue b/energy_management_ui/src/views/energyStatistics/energyConsumption/BarChart.vue
index 8632876..3596cd6 100644
--- a/energy_management_ui/src/views/energyStatistics/energyConsumption/BarChart.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyConsumption/BarChart.vue
@@ -1,29 +1,29 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../mixins/resize'
-const animationDuration = 6000
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../mixins/resize";
+const animationDuration = 6000;
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
chartData: {
- type:Object,
+ type: Object
//required: true
}
},
@@ -31,49 +31,48 @@
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
data() {
return {
chart: null,
- seriesData: [],
- }
+ seriesData: []
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({newVisitis,xAxis,actualData} = {}) {
- var series=[];
- if(newVisitis !=null ||newVisitis != undefined){
- newVisitis.forEach(rowData => {
- series.push({
- name: actualData,
- type: 'bar',
- data: newVisitis,
- smooth: true,//绾挎潯骞虫粦
- stack: 'vistors',
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- },
- );
- });
- /*for(var i=0;i<newVisitis.length;i++){
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
+ },
+ setOptions({ newVisitis, xAxis, actualData } = {}) {
+ var series = [];
+ if (newVisitis != null || newVisitis != undefined) {
+ newVisitis.forEach(rowData => {
+ series.push({
+ name: actualData,
+ type: "bar",
+ data: newVisitis,
+ smooth: true, //绾挎潯骞虫粦
+ stack: "vistors",
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ });
+ });
+ /*for(var i=0;i<newVisitis.length;i++){
series.push({
name: actualData[i],
type: 'bar',
@@ -85,40 +84,48 @@
},
);
}*/
- }
+ }
this.chart.setOption({
tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
}
},
grid: {
top: 40,
- left: '1%',
- right: '2%',
- bottom: '3%',
+ left: "1%",
+ right: "2%",
+ bottom: "3%",
containLabel: true
},
legend: {
- data:actualData,
- left: '60%',
+ data: actualData,
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
},
- xAxis: [{
- type: 'category',
- data: xAxis,
- axisTick: {
- alignWithLabel: true
- },
- }],
- yAxis: [{
- name: '鍚ㄦ爣鐓�',
- type: 'value',
- axisTick: {
- show: false
- },
- }],
- series:series,/*[{
+ xAxis: [
+ {
+ type: "category",
+ data: xAxis,
+ axisTick: {
+ alignWithLabel: true
+ }
+ }
+ ],
+ yAxis: [
+ {
+ name: "鍚ㄦ爣鐓�",
+ type: "value",
+ axisTick: {
+ show: false
+ }
+ }
+ ],
+ series: series /*[{
name: '鏈湡',
type: 'bar',
data: [
@@ -138,8 +145,8 @@
animationDuration: 2800,
animationEasing: 'quadraticOut'
}]*/
- })
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyConsumption/BarCharts.vue b/energy_management_ui/src/views/energyStatistics/energyConsumption/BarCharts.vue
index 6592587..8dd82fc 100644
--- a/energy_management_ui/src/views/energyStatistics/energyConsumption/BarCharts.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyConsumption/BarCharts.vue
@@ -1,29 +1,29 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../mixins/resize'
-const animationDuration = 6000
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../mixins/resize";
+const animationDuration = 6000;
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
chartData: {
- type:Object,
+ type: Object
//required: true
}
},
@@ -31,87 +31,94 @@
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
data() {
return {
chart: null,
- seriesData: [],
- }
+ seriesData: []
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({newVisitis,xAxis,actualData} = {}) {
- var series=[];
- if(newVisitis !=null ||newVisitis != undefined){
- for(var i=0;i<newVisitis.length;i++){
- let aa=newVisitis[i];
- for(var j=0;j<aa.length;j++) {
- series.push({
- name: actualData[i],
- type: 'bar',
- data: aa[j],
- smooth: true,//绾挎潯骞虫粦
- //stack: 'vistors',
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }
- );
- }
- }
- }
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
+ },
+ setOptions({ newVisitis, xAxis, actualData } = {}) {
+ var series = [];
+ if (newVisitis != null || newVisitis != undefined) {
+ for (var i = 0; i < newVisitis.length; i++) {
+ let aa = newVisitis[i];
+ for (var j = 0; j < aa.length; j++) {
+ series.push({
+ name: actualData[i],
+ type: "bar",
+ data: aa[j],
+ smooth: true, //绾挎潯骞虫粦
+ //stack: 'vistors',
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ });
+ }
+ }
+ }
this.chart.setOption({
tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
}
},
grid: {
top: 40,
- left: '1%',
- right: '2%',
- bottom: '3%',
+ left: "1%",
+ right: "2%",
+ bottom: "3%",
containLabel: true
},
legend: {
- data:actualData,
- left: '40%',
+ data: actualData,
+ left: "40%",
+ textStyle: {
+ color: "#fff"
+ }
},
- xAxis: [{
- type: 'category',
- data: xAxis,
- axisTick: {
- alignWithLabel: true
- },
- }],
- yAxis: [{
- name: '涓囧厓',
- type: 'value',
- axisTick: {
- show: false
- },
- }],
+ xAxis: [
+ {
+ type: "category",
+ data: xAxis,
+ axisTick: {
+ alignWithLabel: true
+ }
+ }
+ ],
+ yAxis: [
+ {
+ name: "涓囧厓",
+ type: "value",
+ axisTick: {
+ show: false
+ }
+ }
+ ],
series: series
- })
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyConsumption/PieChart.vue b/energy_management_ui/src/views/energyStatistics/energyConsumption/PieChart.vue
index 44559d9..1d1d5ad 100644
--- a/energy_management_ui/src/views/energyStatistics/energyConsumption/PieChart.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyConsumption/PieChart.vue
@@ -1,29 +1,29 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
chartData: {
- type:Object,
+ type: Object
//required: true
}
},
@@ -31,90 +31,93 @@
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
data() {
return {
chart: null
- }
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({newVisitis,title,datas } = {}) {
+ setOptions({ newVisitis, title, datas } = {}) {
this.chart.setOption({
title: {
- text: '鑳芥簮娑堣垂缁撴瀯鏋勬垚',
- x:'left',
- y: 'top',
+ text: "鑳芥簮娑堣垂缁撴瀯鏋勬垚",
+ x: "left",
+ y: "top",
textStyle: {
- color: "#333"
- },
+ color: "#fff"
+ }
},
tooltip: {
- trigger: 'item',
+ trigger: "item",
formatter: title
},
grid: {
top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
containLabel: true
},
legend: {
// orient 璁剧疆甯冨眬鏂瑰紡锛岄粯璁ゆ按骞冲竷灞�锛屽彲閫夊�硷細'horizontal'锛堟按骞筹級 娄 'vertical'锛堝瀭鐩达級
- orient: 'vertical',
+ orient: "vertical",
// x 璁剧疆姘村钩瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥惧眳涓紝鍙�夊�硷細'center' 娄 'left' 娄 'right' 娄 {number}锛坸鍧愭爣锛屽崟浣峱x锛�
- x: 'left',
+ x: "left",
// y 璁剧疆鍨傜洿瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥鹃《绔紝鍙�夊�硷細'top' 娄 'bottom' 娄 'center' 娄 {number}锛坹鍧愭爣锛屽崟浣峱x锛�
- y: '10%',
+ y: "10%",
//left: 10,
- itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
- itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
+ itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
+ itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
textStyle: {
- color: '#666' // 鍥句緥鏂囧瓧棰滆壊
+ color: "#fff" // 鍥句緥鏂囧瓧棰滆壊
},
// itemGap璁剧疆鍚勪釜item涔嬮棿鐨勯棿闅旓紝鍗曚綅px锛岄粯璁や负10锛屾í鍚戝竷灞�鏃朵负姘村钩闂撮殧锛岀旱鍚戝竷灞�鏃朵负绾靛悜闂撮殧
- // itemGap: 30,
- backgroundColor: '#eee', // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
+ // itemGap: 30,
+ backgroundColor: "#eee", // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
data: title,
- formatter:function(item){
+ formatter: function(item) {
let target;
let unitId;
- for(let i=0;i<newVisitis.length;i++){
- if(datas[i].name===item){
- target=datas[i].value;
- unitId=datas[i].unitId
+ for (let i = 0; i < newVisitis.length; i++) {
+ if (datas[i].name === item) {
+ target = datas[i].value;
+ unitId = datas[i].unitId;
}
}
- let arr=[item+ +target+ unitId]/*["{a|"+target+"}","{b|"+item+"}"]*/
- return arr/*.join("\n")*/
- },
+ let arr = [
+ item + +target + unitId
+ ]; /*["{a|"+target+"}","{b|"+item+"}"]*/
+ return arr; /*.join("\n")*/
+ }
},
- series: [{
+ series: [
+ {
//name: '鑳芥簮',
- type: 'pie',
- radius: '60%', // 璁剧疆楗肩姸鍥惧ぇ灏忥紝100%鏃讹紝鏈�澶х洿寰�=鏁翠釜鍥惧舰鐨刴in(瀹斤紝楂�)
+ type: "pie",
+ radius: "60%", // 璁剧疆楗肩姸鍥惧ぇ灏忥紝100%鏃讹紝鏈�澶х洿寰�=鏁翠釜鍥惧舰鐨刴in(瀹斤紝楂�)
//radius: ['30%', '60%'], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
- center: ['65%', '50%'], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
- data: newVisitis,//[{value:335, name:'娲楃簿鐓�' },{value:310, name:'宸ヤ笟鐢ㄧ數'}],/*selected: true*/
+ center: ["65%", "50%"], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
+ data: newVisitis, //[{value:335, name:'娲楃簿鐓�' },{value:310, name:'宸ヤ笟鐢ㄧ數'}],/*selected: true*/
// itemStyle 璁剧疆楗肩姸鍥炬墖褰㈠尯鍩熸牱寮�
itemStyle: {
// emphasis锛氳嫳鏂囨剰鎬濇槸 寮鸿皟;鐫�閲�;锛堣疆寤撱�佸浘褰㈢瓑鐨勶級椴滄槑;绐佸嚭锛岄噸璇�
@@ -122,29 +125,29 @@
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
- shadowColor: 'rgba(30, 144, 255锛�0.5)'
+ shadowColor: "rgba(30, 144, 255锛�0.5)"
}
},
// 璁剧疆鍊煎煙鐨勯偅鎸囧悜绾�
labelLine: {
normal: {
- show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
+ show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
}
},
// 璁剧疆鍊煎煙鐨勬爣绛�
label: {
normal: {
- position: 'inner', // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
+ position: "inner", // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
// formatter: '{a} {b} : {c}涓� ({d}%)' 璁剧疆鏍囩鏄剧ず鍐呭 锛岄粯璁ゆ樉绀簕b}
// {a}鎸噑eries.name {b}鎸噑eries.data鐨刵ame
// {c}鎸噑eries.data鐨剉alue {d}%鎸囪繖涓�閮ㄥ垎鍗犳�绘暟鐨勭櫨鍒嗘瘮
- formatter: '{c}'
+ formatter: "{c}"
}
}
}
- ],
- })
+ ]
+ });
}
}
-}
+};
</script>
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>
diff --git a/energy_management_ui/src/views/energyStatistics/energyConsumption/index.vue b/energy_management_ui/src/views/energyStatistics/energyConsumption/index.vue
index 66026c8..e11ec61 100644
--- a/energy_management_ui/src/views/energyStatistics/energyConsumption/index.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyConsumption/index.vue
@@ -1,55 +1,79 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳借�楁秷璐规垚鏈垎鏋�
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode" :showOpt="false" :modelCode="modelCode"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳借�楁秷璐规垚鏈垎鏋�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :modelCode="modelCode"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div>
<consumption ref="consumption" style="padding:10px"></consumption>
- </el-main>
- </el-container>
- </el-container>
+ </div>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import consumption from "./consumption";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
-
- export default {
- components: { ModelNode,consumption},
- created() {
- this.modelCode=this.$route.query.modelCode;
+import consumption from "./consumption";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
+export default {
+ mixins: [mixins],
+ components: { ModelNode, consumption, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.consumption.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.consumption.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyConsumption/pieChartCost.vue b/energy_management_ui/src/views/energyStatistics/energyConsumption/pieChartCost.vue
index bc7882a..330d40a 100644
--- a/energy_management_ui/src/views/energyStatistics/energyConsumption/pieChartCost.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyConsumption/pieChartCost.vue
@@ -1,29 +1,29 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
chartData: {
- type:Object,
+ type: Object
//required: true
}
},
@@ -31,91 +31,94 @@
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
data() {
return {
chart: null
- }
+ };
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({newVisitis,datas,title } = {}) {
+ setOptions({ newVisitis, datas, title } = {}) {
let scale = 1;
this.chart.setOption({
title: {
- text: '鑳芥簮娑堣垂鎴愭湰鍒嗘瀽',
- x:'left',
- y: 'top',
+ text: "鑳芥簮娑堣垂鎴愭湰鍒嗘瀽",
+ x: "left",
+ y: "top",
textStyle: {
- color: "#333",
- },
+ color: "#fff"
+ }
},
tooltip: {
- trigger: 'item',
+ trigger: "item",
formatter: datas
},
grid: {
top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
containLabel: true
},
legend: {
// orient 璁剧疆甯冨眬鏂瑰紡锛岄粯璁ゆ按骞冲竷灞�锛屽彲閫夊�硷細'horizontal'锛堟按骞筹級 娄 'vertical'锛堝瀭鐩达級
- orient: 'vertical',
+ orient: "vertical",
// x 璁剧疆姘村钩瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥惧眳涓紝鍙�夊�硷細'center' 娄 'left' 娄 'right' 娄 {number}锛坸鍧愭爣锛屽崟浣峱x锛�
- x: 'left',
+ x: "left",
// y 璁剧疆鍨傜洿瀹夋斁浣嶇疆锛岄粯璁ゅ叏鍥鹃《绔紝鍙�夊�硷細'top' 娄 'bottom' 娄 'center' 娄 {number}锛坹鍧愭爣锛屽崟浣峱x锛�
- y: '10%',
+ y: "10%",
//left: 10,
- itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
- itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
+ itemWidth: 24, // 璁剧疆鍥句緥鍥惧舰鐨勫
+ itemHeight: 18, // 璁剧疆鍥句緥鍥惧舰鐨勯珮
textStyle: {
- color: '#666' // 鍥句緥鏂囧瓧棰滆壊
+ color: "#fff" // 鍥句緥鏂囧瓧棰滆壊
},
// itemGap璁剧疆鍚勪釜item涔嬮棿鐨勯棿闅旓紝鍗曚綅px锛岄粯璁や负10锛屾í鍚戝竷灞�鏃朵负姘村钩闂撮殧锛岀旱鍚戝竷灞�鏃朵负绾靛悜闂撮殧
- // itemGap: 30,
- backgroundColor: '#eee', // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
+ // itemGap: 30,
+ backgroundColor: "#eee", // 璁剧疆鏁翠釜鍥句緥鍖哄煙鑳屾櫙棰滆壊
data: datas,
- formatter:function(item){
+ formatter: function(item) {
let target;
let unitId;
- for(let i=0;i<newVisitis.length;i++){
- if(datas[i].name===item){
- target=datas[i].value;
- unitId=datas[i].unitId
+ for (let i = 0; i < newVisitis.length; i++) {
+ if (datas[i].name === item) {
+ target = datas[i].value;
+ unitId = datas[i].unitId;
}
}
- let arr=[item+ +target+ unitId]/*["{a|"+target+"}","{b|"+item+"}"]*/
- return arr/*.join("\n")*/
- },
+ let arr = [
+ item + +target + unitId
+ ]; /*["{a|"+target+"}","{b|"+item+"}"]*/
+ return arr; /*.join("\n")*/
+ }
},
- series: [{
+ series: [
+ {
//name: '鐢ㄦ按',
- type: 'pie',
+ type: "pie",
avoidLabelOverlap: false,
- radius: ['40%', '60%'], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
- center: ['65%', '50%'], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
- data: newVisitis,//[{value:335, name:'鐢ㄦ按' },{value:310, name:'鐢ㄧ數'},{value:234, name:'鐢ㄧ叅'}],/*selected: true*/
+ radius: ["40%", "60%"], // 璁剧疆鐜舰楗肩姸鍥撅紝 绗竴涓櫨鍒嗘暟璁剧疆鍐呭湀澶у皬锛岀浜屼釜鐧惧垎鏁拌缃鍦堝ぇ灏�
+ center: ["65%", "50%"], // 璁剧疆楗肩姸鍥句綅缃紝绗竴涓櫨鍒嗘暟璋冩按骞充綅缃紝绗簩涓櫨鍒嗘暟璋冨瀭鐩翠綅缃�
+ data: newVisitis, //[{value:335, name:'鐢ㄦ按' },{value:310, name:'鐢ㄧ數'},{value:234, name:'鐢ㄧ叅'}],/*selected: true*/
// itemStyle 璁剧疆楗肩姸鍥炬墖褰㈠尯鍩熸牱寮�
itemStyle: {
// emphasis锛氳嫳鏂囨剰鎬濇槸 寮鸿皟;鐫�閲�;锛堣疆寤撱�佸浘褰㈢瓑鐨勶級椴滄槑;绐佸嚭锛岄噸璇�
@@ -123,26 +126,26 @@
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
- shadowColor: 'rgba(30, 144, 255锛�0.5)'
+ shadowColor: "rgba(30, 144, 255锛�0.5)"
}
},
// 璁剧疆鍊煎煙鐨勯偅鎸囧悜绾�
labelLine: {
normal: {
- show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
+ show: false // show璁剧疆绾挎槸鍚︽樉绀猴紝榛樿涓簍rue锛屽彲閫夊�硷細true 娄 false
}
},
// 璁剧疆鍊煎煙鐨勬爣绛�
- label: {
- normal: {
- show: true,
- position: 'center',
- formatter: ['绱鎴愭湰',title].join('\n'),
- },
- emphasis: {
- show: true,
- },
- },
+ label: {
+ normal: {
+ show: true,
+ position: "center",
+ formatter: ["绱鎴愭湰", title].join("\n")
+ },
+ emphasis: {
+ show: true
+ }
+ }
/*label: {
normal: {
position: 'inner', // 璁剧疆鏍囩浣嶇疆锛岄粯璁ゅ湪楗肩姸鍥惧 鍙�夊�硷細'outer' 娄 'inner锛堥ゼ鐘跺浘涓婏級'
@@ -153,9 +156,9 @@
}
}*/
}
- ],
- })
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/EnergyIndex.vue b/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/EnergyIndex.vue
index 9bec9d0..a4e2464 100644
--- a/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/EnergyIndex.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/EnergyIndex.vue
@@ -1,9 +1,19 @@
<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-select v-model="queryParams.procedure" placeholder="璇烽�夋嫨鎸囨爣" @change="currentSel">
- <el-option style="width: 150px"
+ <el-select
+ v-model="queryParams.procedure"
+ placeholder="璇烽�夋嫨鎸囨爣"
+ @change="currentSel"
+ >
+ <el-option
+ style="width: 150px"
v-for="dict in list"
:key="dict.indexId"
:label="dict.name"
@@ -13,22 +23,31 @@
</el-form-item>
<el-form-item label="鏃ユ湡" label-width="40px">
<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"
- style="width: 150px"
- :value-format="valueFormat"
- placeholder="寮�濮嬫棩鏈�">
- </el-date-picker>
- 鍒�
+ <el-date-picker
+ v-model="queryParams.beginTime"
+ :type="dateTypes"
+ style="width: 150px"
+ :value-format="valueFormat"
+ placeholder="寮�濮嬫棩鏈�"
+ >
+ </el-date-picker>
+ 鍒�
<el-date-picker
v-model="queryParams.endTime"
:type="dateTypes"
style="width: 150px"
:value-format="valueFormat"
- placeholder="缁撴潫鏃ユ湡">
+ placeholder="缁撴潫鏃ユ湡"
+ >
</el-date-picker>
<!--<el-date-picker
v-model="dateRange"
@@ -43,51 +62,81 @@
></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>
<el-row :gutter="32">
- <el-col :xs="24" :sm="24" :lg="24" >
+ <el-col :xs="24" :sm="24" :lg="24">
<div class="chart-wrapper">
<line-chart ref="lineChart" :chart-data="lineChartData" />
</div>
</el-col>
</el-row>
<el-row :gutter="32">
- <el-col :xs="24" :sm="24" :lg="24" >
- <div class="chart-wrapper" >
- <h4 style="float: left; text-align:center;padding: 0;margin: 0;width: 90%;">{{title}}1</h4>
- <el-button type="warning" icon="el-icon-download" size="mini" style="float: right" @click="handleExport" >瀵煎嚭</el-button><!--v-hasPermi="['system:post:export']"-->
+ <el-col :xs="24" :sm="24" :lg="24">
+ <div class="chart-wrapper">
+ <h4
+ style="float: left; text-align:center;padding: 0;margin: 0;width: 90%;"
+ >
+ {{ title }}1
+ </h4>
+ <el-button
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ style="float: right"
+ @click="handleExport"
+ >瀵煎嚭</el-button
+ ><!--v-hasPermi="['system:post:export']"-->
<el-table v-loading="loading" :data="arraylist">
- <el-table-column prop="dataTime" label="鏃ユ湡" align="center" width="150" show-overflow-tooltip>
+ <el-table-column
+ prop="dataTime"
+ label="鏃ユ湡"
+ align="center"
+ width="150"
+ show-overflow-tooltip
+ >
<template slot-scope="scope">
<span>{{ changeTime(parseTime(scope.row.dataTime)) }}</span>
</template>
</el-table-column>
- <el-table-column prop="currentValue" label="鏈湡鍊�" align="center">
+ <el-table-column prop="currentValue" label="鏈湡鍊�" align="center">
<template slot-scope="scope">
- <span>{{numFilter(scope.row.currentValue)}}</span>
+ <span>{{ numFilter(scope.row.currentValue) }}</span>
</template>
</el-table-column>
- <el-table-column prop="lastYearValue" label="鍚屾湡鍊�" align="center">
+ <el-table-column prop="lastYearValue" label="鍚屾湡鍊�" align="center">
<template slot-scope="scope">
- <span>{{numFilter(scope.row.lastYearValue)}}</span>
+ <span>{{ numFilter(scope.row.lastYearValue) }}</span>
</template>
</el-table-column>
- <el-table-column prop="yoy" label="鍚屾瘮" align="center">
+ <el-table-column prop="yoy" label="鍚屾瘮" align="center">
<template slot-scope="scope">
- <span>{{numFilter(scope.row.yoy)}}</span>
+ <span>{{ numFilter(scope.row.yoy) }}</span>
</template>
</el-table-column>
- <el-table-column v-if="queryParams.timeType ==='MONTH'" prop="qoq" label="鐜瘮" align="center">
+ <el-table-column
+ v-if="queryParams.timeType === 'MONTH'"
+ prop="qoq"
+ label="鐜瘮"
+ align="center"
+ >
<template slot-scope="scope">
- <span>{{numFilter(scope.row.qoq)}}</span>
+ <span>{{ numFilter(scope.row.qoq) }}</span>
</template>
</el-table-column>
- <el-table-column prop="minValue" label="鍘嗗彶鏈�浼�" align="center">
+ <el-table-column prop="minValue" label="鍘嗗彶鏈�浼�" align="center">
<template slot-scope="scope">
- <span>{{numFilter(scope.row.minValue)}}</span>
+ <span>{{ numFilter(scope.row.minValue) }}</span>
</template>
</el-table-column>
</el-table>
@@ -98,210 +147,234 @@
</template>
<script>
- import LineChart from './lineChart'
- import {getSettingIndex,getSettingEnergy,exportEnergyindex,getEnergyStatisticsTrend} from "@/api/energyStatistics/statistics";
+import LineChart from "./lineChart";
+import {
+ getSettingIndex,
+ getSettingEnergy,
+ exportEnergyindex,
+ getEnergyStatisticsTrend
+} from "@/api/energyStatistics/statistics";
- export default {
- name: 'EnergyIndex',
- name: 'Index',
- components: {LineChart},
- props: ["modelCode"],
- data() {
- return {
- // 閬僵灞�
- loading: true,
- total: 0,
- dateTypeOptions:[],
- // 鏌ヨ鍙傛暟
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- beginTime: undefined,
- endTime: undefined,
- dataTime: undefined,
- timeType:undefined,
- indexId: undefined,
- procedure: undefined,
- },
- list:[],
- arraylist:[],
- lineChartData:{
- newVisitis:null,
- },
- //dateTypes: 'monthrange',//鏃堕棿鑼冨洿
- dateTypes: 'month',
- valueFormat:'yyyy-MM',
- title:"",
- skinName:"",
+export default {
+ name: "EnergyIndex",
+ name: "Index",
+ components: { LineChart },
+ props: ["modelCode"],
+ data() {
+ return {
+ // 閬僵灞�
+ loading: true,
+ total: 0,
+ dateTypeOptions: [],
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ beginTime: undefined,
+ endTime: undefined,
+ dataTime: undefined,
+ timeType: undefined,
+ indexId: undefined,
+ procedure: undefined
+ },
+ list: [],
+ arraylist: [],
+ lineChartData: {
+ newVisitis: null
+ },
+ //dateTypes: 'monthrange',//鏃堕棿鑼冨洿
+ dateTypes: "month",
+ valueFormat: "yyyy-MM",
+ title: "",
+ skinName: ""
+ };
+ },
+ 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.energyStatisticsTrend").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) {
+ this.queryParams.id = modelNode.id;
+ this.loading = true;
+ getSettingIndex(this.queryParams.id).then(response => {
+ let result = response.data;
+ this.list = result.filter(f => f.indexType === "STATISTIC");
+ this.loading = false;
+ if (this.list.length > 0) {
+ this.queryParams.procedure = this.list[0].indexId;
+ } else {
+ this.queryParams.procedure = "";
+ this.title = "";
+ }
+ if (this.queryParams.timeType == "YEAR") {
+ this.queryParams.beginTime =
+ this.queryParams.beginTime.substring(0, 4) + "-01-01";
+ this.queryParams.endTime =
+ this.queryParams.endTime.substring(0, 4) + "-01-01";
+ } else if (this.queryParams.timeType == "MONTH") {
+ this.queryParams.beginTime =
+ this.queryParams.beginTime.substring(0, 7) + "-01";
+ this.queryParams.endTime =
+ this.queryParams.endTime.substring(0, 7) + "-01";
+ }
+ this.getList();
+ });
+ },
+ getList() {
+ let source = [];
+ let xAxis = [];
+ this.queryParams.indexId = this.queryParams.procedure;
+ getEnergyStatisticsTrend(this.queryParams).then(response => {
+ this.arraylist = response.rows;
+ this.total = response.total;
+ let currentValue = [];
+ let lastYearValue = [];
+ let minValue = [];
+ for (let i = 0; i < this.arraylist.length; i++) {
+ currentValue.push(this.arraylist[i].currentValue);
+ lastYearValue.push(this.arraylist[i].lastYearValue);
+ minValue.push(this.arraylist[i].minValue);
+ if (this.queryParams.timeType == "MONTH") {
+ xAxis.push(this.arraylist[i].dataTime.substring(0, 7));
+ } else if (this.queryParams.timeType == "YEAR") {
+ xAxis.push(this.arraylist[i].dataTime.substring(0, 4));
+ }
+ }
+ source.push(currentValue);
+ source.push(lastYearValue);
+ let yAxis = "";
+ if (this.arraylist.length > 0) {
+ this.title =
+ this.arraylist[0].indexName + "(" + this.arraylist[0].unitId + ")";
+ yAxis = this.arraylist[0].unitId;
+ }
+ this.lineChartData.newVisitis = source;
+ this.lineChartData.actualData = ["鏈湡鍊�", "鍚屾湡鍊�"];
+ this.lineChartData.actual = minValue;
+ this.lineChartData.xAxis = xAxis;
+ this.lineChartData.title = this.title;
+ this.lineChartData.yAxis = yAxis;
+ this.$refs.lineChart.initChart(this.lineChartData);
+ });
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "") {
+ realVal = parseFloat(value).toFixed(this.skinName);
+ } else {
+ realVal = "--";
+ }
+ return realVal;
+ },
+ currentSel(selVal) {
+ //鑾峰彇涓嬫媺妗嗙殑text
+ let obj = {};
+ obj = this.list.find(item => {
+ return item.indexId === selVal;
+ });
+ this.title = obj.name;
+ this.queryParams.procedure = obj.indexId;
+ },
+ handleTime(date) {
+ if (date == "YEAR") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "MONTH") {
+ //this.dateTypes='monthrange'
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
}
},
- watch: {
- modelCode: {
- deep: true,
- handler(val) {
- this.getList(val)
- }
- },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.queryParams.title = this.title;
+ this.getList();
+ //this.modelNodeChange(this.queryParams);
},
- 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.energyStatisticsTrend").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;
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
},
- methods: {
- modelNodeChange(modelNode) {
- this.queryParams.id=modelNode.id;
- this.loading = true;
- getSettingIndex(this.queryParams.id).then(response => {
- let result=response.data;
- this.list = result.filter(f => f.indexType === 'STATISTIC');
- this.loading = false;
- if (this.list.length > 0) {
- this.queryParams.procedure = this.list[0].indexId;
- }else{
- this.queryParams.procedure = "";
- this.title="";
- }
- if(this.queryParams.timeType=='YEAR'){
- this.queryParams.beginTime=this.queryParams.beginTime.substring(0, 4)+'-01-01';
- this.queryParams.endTime=this.queryParams.endTime.substring(0, 4)+'-01-01';
- }else if(this.queryParams.timeType=='MONTH'){
- this.queryParams.beginTime=this.queryParams.beginTime.substring(0, 7)+'-01';
- this.queryParams.endTime=this.queryParams.endTime.substring(0, 7)+'-01';
- }
- this.getList();
- });
- },
- getList(){
- let source=[];
- let xAxis=[];
- this.queryParams.indexId=this.queryParams.procedure;
- getEnergyStatisticsTrend(this.queryParams).then(response => {
- this.arraylist=response.rows;
- this.total = response.total;
- let currentValue=[];
- let lastYearValue=[];
- let minValue=[];
- for(let i=0; i<this.arraylist.length; i++){
- currentValue.push(this.arraylist[i].currentValue);
- lastYearValue.push(this.arraylist[i].lastYearValue);
- minValue.push(this.arraylist[i].minValue);
- if(this.queryParams.timeType=='MONTH') {
- xAxis.push(this.arraylist[i].dataTime.substring(0, 7))
- }else if(this.queryParams.timeType=='YEAR'){
- xAxis.push(this.arraylist[i].dataTime.substring(0, 4))
- }
- }
- source.push(currentValue);
- source.push(lastYearValue);
- let yAxis="";
- if(this.arraylist.length>0){
- this.title=this.arraylist[0].indexName+"("+this.arraylist[0].unitId+")";
- yAxis=this.arraylist[0].unitId
- }
- this.lineChartData.newVisitis=source;
- this.lineChartData.actualData=['鏈湡鍊�','鍚屾湡鍊�'];
- this.lineChartData.actual=minValue;
- this.lineChartData.xAxis=xAxis;
- this.lineChartData.title=this.title;
- this.lineChartData.yAxis=yAxis;
- this.$refs.lineChart.initChart(this.lineChartData);
- });
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '') {
- realVal = parseFloat(value).toFixed(this.skinName)
- } else {
- realVal = '--'
- }
- return realVal
- },
- currentSel(selVal) {//鑾峰彇涓嬫媺妗嗙殑text
- let obj = {};
- obj = this.list.find((item) => {
- return item.indexId === selVal
- });
- this.title=obj.name;
- this.queryParams.procedure=obj.indexId;
- },
- handleTime(date){
- if(date=='YEAR'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='MONTH'){
- //this.dateTypes='monthrange'
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.queryParams.title=this.title;
- this.getList();
- //this.modelNodeChange(this.queryParams);
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夎兘鑰楁寚鏍囪秼鍔垮垎鏋愭暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ 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 () {
- });
- },
- changeTime(time) {
- if (time !== null && time !== undefined && time !== "") {
- return time.substring(0, 10);
- } else {
- return "";
- }
+ })
+ .catch(function() {});
+ },
+ changeTime(time) {
+ if (time !== null && time !== undefined && time !== "") {
+ return time.substring(0, 10);
+ } else {
+ return "";
}
}
}
+};
</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;
+ position: relative;
+ .chart-wrapper {
+ 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;
+ 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>
diff --git a/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/index.vue b/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/index.vue
index c9e6130..498227a 100644
--- a/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/index.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/index.vue
@@ -1,55 +1,80 @@
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鑳借�楁寚鏍囪秼鍔垮垎鏋�
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode" :showOpt="false" :modelCode="modelCode"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鑳借�楁寚鏍囪秼鍔垮垎鏋�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :modelCode="modelCode"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div>
<EnergyIndex ref="EnergyIndex" style="padding:10px"></EnergyIndex>
- </el-main>
- </el-container>
- </el-container>
+ </div>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import EnergyIndex from "./EnergyIndex";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import EnergyIndex from "./EnergyIndex";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
- export default {
- components: { ModelNode,EnergyIndex},
- created() {
- this.modelCode=this.$route.query.modelCode;
+export default {
+ mixins: [mixins],
+ components: { ModelNode, EnergyIndex, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.EnergyIndex.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.EnergyIndex.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/lineChart.vue b/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/lineChart.vue
index d78140a..baef153 100644
--- a/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/lineChart.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyStatisticsTrend/lineChart.vue
@@ -1,136 +1,142 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from './mixins/resize'
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "./mixins/resize";
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- data() {
- return {
- chart: null,
- seriesData: [],
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({newVisitis,xAxis,actualData,actual,title,yAxis} = {}) {
- var series=[];
- if(newVisitis !=null ||newVisitis != undefined){
- for(var i=0;i<newVisitis.length;i++){
- series.push({
- name: actualData[i],
- type: 'bar',
- data: newVisitis[i],
- smooth: true,//绾挎潯骞虫粦
- //stack: 'vistors',
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }
- );
- }
+ setOptions({ newVisitis, xAxis, actualData, actual, title, yAxis } = {}) {
+ var series = [];
+ if (newVisitis != null || newVisitis != undefined) {
+ for (var i = 0; i < newVisitis.length; i++) {
series.push({
- name:'鍘嗗彶鏈�浼�' ,
- type: 'line',
- data: actual,
- smooth: true,//绾挎潯骞虫粦
+ name: actualData[i],
+ type: "bar",
+ data: newVisitis[i],
+ smooth: true, //绾挎潯骞虫粦
+ //stack: 'vistors',
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- })
+ animationEasing: "quadraticOut"
+ });
}
- this.chart.setOption({
- title: {
- text: title,
- x:'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- legend: {
- data:['鏈湡鍊�', '鍚屾湡鍊�','鍘嗗彶鏈�浼�'],
- left: '60%',
- },
- xAxis: [{
- type: 'category',
+ series.push({
+ name: "鍘嗗彶鏈�浼�",
+ type: "line",
+ data: actual,
+ smooth: true, //绾挎潯骞虫粦
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ });
+ }
+ this.chart.setOption({
+ title: {
+ text: title,
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#333"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ legend: {
+ data: ["鏈湡鍊�", "鍚屾湡鍊�", "鍘嗗彶鏈�浼�"],
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [
+ {
+ type: "category",
data: xAxis,
axisTick: {
alignWithLabel: true
- },
- }],
- yAxis: [{
- name: yAxis,
- type: 'value',
- nameTextStyle:{
- color:"#333",
- },
- axisLabel: {
- formatter: '{value}'
- },
- axisTick: {
- show: false
- },
}
- ],
- series:series
- })
- }
+ }
+ ],
+ yAxis: [
+ {
+ name: yAxis,
+ type: "value",
+ nameTextStyle: {
+ color: "#333"
+ },
+ axisLabel: {
+ formatter: "{value}"
+ },
+ axisTick: {
+ show: false
+ }
+ }
+ ],
+ series: series
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyStructure/EnergyIndex.vue b/energy_management_ui/src/views/energyStatistics/energyStructure/EnergyIndex.vue
index a008ff3..88d0e08 100644
--- a/energy_management_ui/src/views/energyStatistics/energyStructure/EnergyIndex.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyStructure/EnergyIndex.vue
@@ -324,20 +324,18 @@
<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;
}
}
.chart-title {
display: block;
- background: #f2f6fc;
height: 30px;
line-height: 30px;
padding: 0 10px;
+ color: #fff;
}
@media (max-width: 1024px) {
.chart-wrapper {
diff --git a/energy_management_ui/src/views/energyStatistics/energyStructure/index.vue b/energy_management_ui/src/views/energyStatistics/energyStructure/index.vue
index 5bb4410..292557e 100644
--- a/energy_management_ui/src/views/energyStatistics/energyStructure/index.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyStructure/index.vue
@@ -1,56 +1,80 @@
-
<template>
- <div class="app-container" style="padding: 0">
- <el-container class="split-container">
- <el-aside class="left-content" :width="isCollapse?'0px':'20%'">
- <el-card class="box-card">
- <div slot="header" class="clearfix" style="height:32px">
- 鐢ㄨ兘鍗曞厓鑳借�楀垎鏋�
- </div>
- <ModelNode ref="modelNode" @changeNode="changeNode" :showOpt="false" :modelCode="modelCode"></ModelNode>
- </el-card>
- </el-aside>
- <el-container>
- <div style="cursor:pointer;" @click="toggleCollapse">
- <img src="@/assets/image/configureChart.png" style="width: 100%;height: 100%">
- </div>
- <el-main style="padding:0">
+ <div>
+ <el-row type="flex">
+ <el-col
+ :style="{ width: isCollapse ? '0' : '280px', position: 'relative' }"
+ v-show="!isCollapse"
+ >
+ <basic-container title="鐢ㄨ兘鍗曞厓鑳借�楀垎鏋�" :bodyStyle="bodyStyle">
+ <ModelNode
+ ref="modelNode"
+ @changeNode="changeNode"
+ :showOpt="false"
+ :modelCode="modelCode"
+ ></ModelNode>
+ </basic-container>
+ <img
+ src="~@/assets/image/rectangle.png"
+ alt=""
+ class="shrink-col-block"
+ @click="toggleCollapse"
+ />
+ </el-col>
+ <ShrinkCol @toggleCollapse="toggleCollapse" v-show="isCollapse" />
+ <el-col
+ :style="{
+ width: isCollapse ? 'calc(100% - 48px)' : 'calc(100% - 280px)',
+ paddingLeft: isCollapse ? 0 : '14px'
+ }"
+ >
+ <div>
<EnergyIndex ref="EnergyIndex" style="padding:10px"></EnergyIndex>
- </el-main>
- </el-container>
- </el-container>
+ </div>
+ </el-col>
+ </el-row>
</div>
</template>
<script>
- import EnergyIndex from "./EnergyIndex";
- import ModelNode from "../../basicsetting/modelNode/modelNode";
+import EnergyIndex from "./EnergyIndex";
+import ModelNode from "../../basicsetting/modelNode/modelNode";
+import mixins from "@/layout/mixin/getHeight";
+import ShrinkCol from "@/components/shrink/index.vue";
- export default {
- components: { ModelNode,EnergyIndex},
- created() {
- this.modelCode=this.$route.query.modelCode;
+export default {
+ mixins: [mixins],
+ components: { ModelNode, EnergyIndex, ShrinkCol },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ },
+ data() {
+ return {
+ modelCode: undefined,
+ isCollapse: false,
+ bodyStyleRight: {}
+ };
+ },
+ methods: {
+ setCharts() {
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
+ this.bodyStyleRight = {
+ ...this.bodyStyle,
+ height: window.innerHeight - 130 + "px"
+ };
},
- data() {
- return {
- modelCode:undefined,
- isCollapse: false,
- }
+ changeNode: function(node) {
+ this.$refs.EnergyIndex.modelNodeChange(node);
},
- methods: {
- changeNode: function (node) {
- this.$refs.EnergyIndex.modelNodeChange(node);
- },
- manageModel: function () {
- this.$router.push('/model');
- },
- changeModel: function (item) {
- this.$refs.modelNode.getList(item);
- },
- // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
- toggleCollapse () {
- this.isCollapse = !this.isCollapse
- }
+ manageModel: function() {
+ this.$router.push("/model");
+ },
+ changeModel: function(item) {
+ this.$refs.modelNode.getList(item);
+ },
+ // 鐐瑰嚮鎸夐挳锛屽垏鎹㈡姌鍙犱笌灞曞紑
+ toggleCollapse() {
+ this.isCollapse = !this.isCollapse;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/energyStatistics/energyStructure/lineChart.vue b/energy_management_ui/src/views/energyStatistics/energyStructure/lineChart.vue
index e370f7d..e197022 100644
--- a/energy_management_ui/src/views/energyStatistics/energyStructure/lineChart.vue
+++ b/energy_management_ui/src/views/energyStatistics/energyStructure/lineChart.vue
@@ -1,146 +1,158 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../mixins/resize'
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../mixins/resize";
+import { color } from "echarts/lib/export";
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- data() {
- return {
- chart: null,
- seriesData: [],
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({currentValue,xAxis,lastYearValue,title} = {}) {
- var series=[];
-/* if(newVisitis !=null ||newVisitis != undefined){
+ setOptions({ currentValue, xAxis, lastYearValue, title } = {}) {
+ var series = [];
+ /* if(newVisitis !=null ||newVisitis != undefined){
series.push()
}
console.log("newVisitis:"+newVisitis+"actual"+actual);*/
- this.chart.setOption({
- title: {
- text: title,
- x:'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- legend: {
- data:['娑堣垂閲�', '浜ч噺'],
- left: '60%',
- },
- xAxis: [{
- type: 'category',
+ this.chart.setOption({
+ title: {
+ text: title,
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ legend: {
+ data: ["娑堣垂閲�", "浜ч噺"],
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [
+ {
+ type: "category",
data: xAxis,
axisPointer: {
- type: 'shadow'
+ type: "shadow"
}
- }],
- yAxis: [{
- name: '娑堣垂閲�',
- type: 'value',
- nameTextStyle:{
- color:"#333",
- },
- axisLabel: {
- formatter: '{value}'
- },
- axisTick: {
- show: false
- },
- },{
- name: '浜ч噺',
- type: 'value',
- nameTextStyle:{
- color:"#333",
+ }
+ ],
+ yAxis: [
+ {
+ name: "娑堣垂閲�",
+ type: "value",
+ nameTextStyle: {
+ color: "#fff"
},
axisLabel: {
- formatter: '{value}'
+ formatter: "{value}"
},
axisTick: {
show: false
+ }
+ },
+ {
+ name: "浜ч噺",
+ type: "value",
+ nameTextStyle: {
+ color: "#fff"
},
+ axisLabel: {
+ formatter: "{value}"
+ },
+ axisTick: {
+ show: false
+ }
}
- ],
- series:[{
+ ],
+ series: [
+ {
name: "娑堣垂閲�",
- type: 'bar',
+ type: "bar",
data: currentValue,
- smooth: true,//绾挎潯骞虫粦
+ smooth: true, //绾挎潯骞虫粦
//stack: 'vistors',
- barMaxWidth:30,//鏈�澶у搴�
+ barMaxWidth: 30, //鏈�澶у搴�
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- },{
- name: '浜ч噺',
- type: 'line',
+ animationEasing: "quadraticOut"
+ },
+ {
+ name: "浜ч噺",
+ type: "line",
yAxisIndex: 1,
data: lastYearValue,
animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }]
- })
- }
+ animationEasing: "quadraticOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/equipmentMonitor/energyConsumption/lineChart.vue b/energy_management_ui/src/views/equipmentMonitor/energyConsumption/lineChart.vue
index 959968e..e11dff0 100644
--- a/energy_management_ui/src/views/equipmentMonitor/energyConsumption/lineChart.vue
+++ b/energy_management_ui/src/views/equipmentMonitor/energyConsumption/lineChart.vue
@@ -1,128 +1,134 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- import resize from "../../energyStatistics/mixins/resize";
- require('echarts/theme/macarons') // echarts theme
- const animationDuration = 6000
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '350px'
- },
- chartData: {
- type:Object,
- }
+import echarts from "echarts";
+import resize from "../../energyStatistics/mixins/resize";
+require("echarts/theme/macarons"); // echarts theme
+const animationDuration = 6000;
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
},
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "350px"
+ },
+ chartData: {
+ type: Object
+ }
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
+ }
+ }
+ },
+ data() {
+ return {
+ chart: null,
+ seriesData: []
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
+ },
+ setOptions({ newVisitis, xAxis, actualData, title, yAxis } = {}) {
+ var series = [];
+ if (newVisitis != null || newVisitis != undefined) {
+ for (var i = 0; i < newVisitis.length; i++) {
+ series.push({
+ name: actualData[i],
+ type: "bar",
+ data: newVisitis[i],
+ smooth: true, //绾挎潯骞虫粦
+ //stack: 'vistors',
+ animationDuration: 2800,
+ animationEasing: "quadraticOut"
+ });
}
}
- },
- data() {
- return {
- chart: null,
- seriesData: [],
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({newVisitis,xAxis,actualData,title,yAxis} = {}) {
- var series=[];
- if(newVisitis !=null ||newVisitis != undefined){
- for(var i=0;i<newVisitis.length;i++){
- series.push({
- name: actualData[i],
- type: 'bar',
- data: newVisitis[i],
- smooth: true,//绾挎潯骞虫粦
- //stack: 'vistors',
- animationDuration: 2800,
- animationEasing: 'quadraticOut'
- }
- );
+ this.chart.setOption({
+ title: {
+ text: title,
+ x: "center",
+ y: "top",
+ textStyle: {
+ color: "#333"
}
- }
- this.chart.setOption({
- title: {
- text: title,
- x:'center',
- y: 'top',
- textStyle: {
- color: "#333"
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow' line涓虹洿绾� shadow涓烘煴鐘堕槾褰�
- }
- },
- grid: {
- top: 40,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- legend: {
- data:['璁惧1','璁惧2'],
- left: '60%',
- },
- xAxis: [{
- type: 'category',
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow' line涓虹洿绾� shadow涓烘煴鐘堕槾褰�
+ }
+ },
+ grid: {
+ top: 40,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ legend: {
+ data: ["璁惧1", "璁惧2"],
+ left: "60%",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [
+ {
+ type: "category",
data: xAxis,
axisTick: {
alignWithLabel: true
- },
- }],
- yAxis: [{
+ }
+ }
+ ],
+ yAxis: [
+ {
name: yAxis,
- type: 'value',
- nameTextStyle:{
- color:"#333",
+ type: "value",
+ nameTextStyle: {
+ color: "#333"
},
axisLabel: {
- formatter: '{value}'
+ formatter: "{value}"
},
axisTick: {
show: false
- },
+ }
}
- ],
- series:series
- })
- }
+ ],
+ series: series
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/equipmentMonitor/keyEquipment/LineChart.vue b/energy_management_ui/src/views/equipmentMonitor/keyEquipment/LineChart.vue
index ae8345e..fa24e95 100644
--- a/energy_management_ui/src/views/equipmentMonitor/keyEquipment/LineChart.vue
+++ b/energy_management_ui/src/views/equipmentMonitor/keyEquipment/LineChart.vue
@@ -1,10 +1,10 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons'); // echarts theme
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
// import resize from './mixins/resize'
export default {
@@ -12,103 +12,102 @@
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
autoResize: {
type: Boolean,
default: true
},
chartData: {
- type: Object,
+ type: Object
// required: true
- },
-
+ }
},
data() {
return {
chart: null,
- alarmLimitName:undefined
- }
+ alarmLimitName: undefined
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
this.chart.dispose();
- this.chart = null
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons');
+ this.chart = echarts.init(this.$el, "macarons");
this.setOptions(this.chartData);
},
- setOptions({ datas,legendArr,timeList,legendNameArr } = {}) {
+ setOptions({ datas, legendArr, timeList, legendNameArr } = {}) {
// this.chart.clear();
- if(datas.length>0){
+ if (datas.length > 0) {
var yAxisDataArr = [];
var seriesArr = [];
var yAxisNumArr = [];
var yAxisIndexArr = [];
- for(let i = 0;i<datas.length;i++){
+ for (let i = 0; i < datas.length; i++) {
//y杞�
let yAxisItem = {
- type: 'value',
+ type: "value",
// name:legendNameArr[i],
- minInterval : 1,
- boundaryGap : [ 0, 0.2 ],
+ minInterval: 1,
+ boundaryGap: [0, 0.2]
};
- if(i>1){
+ if (i > 1) {
let positionKey = "position";
let positionValue = "right";
let offsetKey = "offset";
- let offsetValue = 50*(i-1);
+ let offsetValue = 50 * (i - 1);
yAxisItem[positionKey] = positionValue;
yAxisItem[offsetKey] = offsetValue;
}
yAxisDataArr.push(yAxisItem);
}
- for(let i = 0;i<legendArr.length;i++){
- if(""!=legendArr[i]){
+ for (let i = 0; i < legendArr.length; i++) {
+ if ("" != legendArr[i]) {
let item = parseInt(legendArr[i].substr(1, legendArr[i].length));
yAxisNumArr.push(item);
- if(!yAxisIndexArr.indexOf(yAxisNumArr[i])>-1){
+ if (!yAxisIndexArr.indexOf(yAxisNumArr[i]) > -1) {
yAxisIndexArr.push(yAxisNumArr[i]);
}
let seriesItem = {
- name:legendNameArr[i],
- type: 'line',
+ name: legendNameArr[i],
+ type: "line",
data: datas[i],
- yAxisIndex:yAxisIndexArr.indexOf(yAxisNumArr[i]),
+ yAxisIndex: yAxisIndexArr.indexOf(yAxisNumArr[i])
};
seriesArr.push(seriesItem);
- }else {
+ } else {
let seriesItem = {
- name:legendNameArr[i],
- type: 'line',
- data: datas[i],
+ name: legendNameArr[i],
+ type: "line",
+ data: datas[i]
};
- if(i>0){
+ if (i > 0) {
let key = "yAxisIndex";
let value = i;
seriesItem[key] = value;
@@ -125,30 +124,33 @@
}
},
grid: {
- left: '2%',
- right: '18%',
+ left: "2%",
+ right: "18%",
bottom: 20,
top: 30,
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
yAxis: yAxisDataArr,
legend: {
data: legendNameArr,
+ textStyle: {
+ color: "#fff"
+ }
},
series: seriesArr
- })
+ });
}
},
- closeLineChar(){
+ closeLineChar() {
this.chart.clear();
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/equipmentMonitor/keyEquipment/pieChart.vue b/energy_management_ui/src/views/equipmentMonitor/keyEquipment/pieChart.vue
index 60f17c9..dfbf266 100644
--- a/energy_management_ui/src/views/equipmentMonitor/keyEquipment/pieChart.vue
+++ b/energy_management_ui/src/views/equipmentMonitor/keyEquipment/pieChart.vue
@@ -1,86 +1,89 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons'); // echarts theme
- // import resize from './mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+// import resize from './mixins/resize'
- export default {
- // mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '130px'
- }
+export default {
+ // mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
},
- data() {
- return {
- chart: null
- }
+ width: {
+ type: String,
+ default: "100%"
},
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose();
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons');
+ height: {
+ type: String,
+ default: "130px"
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
- this.chart.setOption({
- tooltip: {
- trigger: 'item',
- formatter: '{a} <br/>{b} : {c} ({d}%)'
- },
- // legend: {
- // left: 'center',
- // bottom: '10',
- // data: ['Industries', 'Technology', 'Forex', 'Gold', 'Forecasts']
- // },
- legend: {
- type: 'scroll',
- orient: 'vertical',
- right: 10,
- top: 20,
- bottom: 20,
- data: ['Industries', 'Technology', 'Forex', 'Gold', 'Forecasts'],
- },
- series: [
- {
- name: 'WEEKLY WRITE ARTICLES',
- type: 'pie',
- radius: '55%',
- center: ['40%', '50%'],
- data: [
- { value: 320, name: 'Industries' },
- { value: 240, name: 'Technology' },
- { value: 149, name: 'Forex' },
- { value: 100, name: 'Gold' },
- { value: 59, name: 'Forecasts' }
- ],
- // animationEasing: 'cubicInOut',
- animationDuration: 2600
- }
- ]
- })
- }
+ this.chart.setOption({
+ tooltip: {
+ trigger: "item",
+ formatter: "{a} <br/>{b} : {c} ({d}%)"
+ },
+ // legend: {
+ // left: 'center',
+ // bottom: '10',
+ // data: ['Industries', 'Technology', 'Forex', 'Gold', 'Forecasts']
+ // },
+ legend: {
+ type: "scroll",
+ orient: "vertical",
+ right: 10,
+ top: 20,
+ bottom: 20,
+ data: ["Industries", "Technology", "Forex", "Gold", "Forecasts"],
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ series: [
+ {
+ name: "WEEKLY WRITE ARTICLES",
+ type: "pie",
+ radius: "55%",
+ center: ["40%", "50%"],
+ data: [
+ { value: 320, name: "Industries" },
+ { value: 240, name: "Technology" },
+ { value: 149, name: "Forex" },
+ { value: 100, name: "Gold" },
+ { value: 59, name: "Forecasts" }
+ ],
+ // animationEasing: 'cubicInOut',
+ animationDuration: 2600
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/equipmentMonitor/parameters/modelMonitorSetting.vue b/energy_management_ui/src/views/equipmentMonitor/parameters/modelMonitorSetting.vue
index fc8cd58..171a65c 100644
--- a/energy_management_ui/src/views/equipmentMonitor/parameters/modelMonitorSetting.vue
+++ b/energy_management_ui/src/views/equipmentMonitor/parameters/modelMonitorSetting.vue
@@ -2,168 +2,181 @@
<div class="app-container" style="padding:0">
<el-card class="box-card">
<div slot="header" class="clearfix">
- <span>{{currentNode?currentNode.label+'--鑺傜偣閰嶇疆':'鑺傜偣閰嶇疆'</span>
+ <span>{{
+ currentNode ? currentNode.label + "--鑺傜偣閰嶇疆" : "鑺傜偣閰嶇疆"
+ }}</span>
</div>
<el-tabs>
<el-tab-pane :disabled="disabledSetting">
<span slot="label"><i class="el-icon-setting"></i>瀹炴椂鑳借��</span>
<!--琛ㄦ牸-->
- <el-form :model="model" ref="form">
- <el-table v-loading="loading" :data="model.tableOptions" border @selection-change="handleSelectionChange"
- :default-sort = "{prop: 'date', order: 'descending'}">
- <el-table-column type="selection" width="55" align="center"/>
- <el-table-column label="搴忓彿" align="center" prop="index"/>
- <el-table-column label="鍚嶇О" align="center" prop="name"/>
- <el-table-column label="鏁版嵁" align="center" prop="data" class-name="small-padding fixed-width"/>
- <el-table-column label="鍗曚綅" align="center" prop="unit"/>
+ <el-form :model="model" ref="form">
+ <el-table
+ v-loading="loading"
+ :data="model.tableOptions"
+ border
+ @selection-change="handleSelectionChange"
+ :default-sort="{ prop: 'date', order: 'descending' }"
+ >
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column label="搴忓彿" align="center" prop="index" />
+ <el-table-column label="鍚嶇О" align="center" prop="name" />
+ <el-table-column
+ label="鏁版嵁"
+ align="center"
+ prop="data"
+ class-name="small-padding fixed-width"
+ />
+ <el-table-column label="鍗曚綅" align="center" prop="unit" />
</el-table>
</el-form>
</el-tab-pane>
-
</el-tabs>
</el-card>
</div>
</template>
<script>
- import {
- delDevice,
- delEnergy,
- delIndex,
- delProduct,
- getSettingDevice,
- getSettingEnergy,
- getSettingIndex,
- getSettingProduct,
- setCollectIndex,
- setDevice,
- setEnergy,
- setProduct
- } from '@/api/basicsetting/modelNode'
+import {
+ delDevice,
+ delEnergy,
+ delIndex,
+ delProduct,
+ getSettingDevice,
+ getSettingEnergy,
+ getSettingIndex,
+ getSettingProduct,
+ setCollectIndex,
+ setDevice,
+ setEnergy,
+ setProduct
+} from "@/api/basicsetting/modelNode";
- export default {
- name: "modelMonitorSetting",
- data() {
- return {
- currentNode: '',
- deviceDialog: false,
- energyDialog: false,
- productDialog: false,
- collectIndexDialog: false,
- indexLoading: false,
- deviceLoading: false,
- energyLoading: false,
- productLoading: false,
- settingEnergyList: [],
- settingDeviceList: [],
- settingProductList: [],
- settingIndexList: [],
- disabledSetting: true,
- // 閬僵灞�
- loading: false,
- //琛ㄦ牸妯″瀷
- model:{
- tableOptions:[
- // {
- // index:undefined,
- // name:undefined,
- // data:undefined,
- // unit:undefined
- // }
- {
- index:"id001",
- name:"鐜嬪皬铏�",
- data:"30000",
- unit:"WH"
- }
- ],
- }
+export default {
+ name: "modelMonitorSetting",
+ data() {
+ return {
+ currentNode: "",
+ deviceDialog: false,
+ energyDialog: false,
+ productDialog: false,
+ collectIndexDialog: false,
+ indexLoading: false,
+ deviceLoading: false,
+ energyLoading: false,
+ productLoading: false,
+ settingEnergyList: [],
+ settingDeviceList: [],
+ settingProductList: [],
+ settingIndexList: [],
+ disabledSetting: true,
+ // 閬僵灞�
+ loading: false,
+ //琛ㄦ牸妯″瀷
+ model: {
+ tableOptions: [
+ // {
+ // index:undefined,
+ // name:undefined,
+ // data:undefined,
+ // unit:undefined
+ // }
+ {
+ index: "id001",
+ name: "鐜嬪皬铏�",
+ data: "30000",
+ unit: "WH"
+ }
+ ]
+ }
+ };
+ },
+ created() {
+ // setInterval(alert("鍝堝搱鍝堬紒锛�"),5000);
+ },
+ methods: {
+ modelNodeChange(modelNode) {
+ this.settingDeviceList = [];
+ this.settingIndexList = [];
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
+ if (modelNode) {
+ this.currentNode = modelNode;
+ this.deviceLoading = true;
+ getSettingDevice(modelNode.id).then(response => {
+ if (response.code === 200) {
+ this.settingDeviceList = response.data;
+ } else {
+ this.$message.error(response.msg);
+ }
+ this.deviceLoading = false;
+ });
+ this.energyLoading = true;
+ getSettingEnergy(modelNode.id).then(response => {
+ if (response.code === 200) {
+ this.settingEnergyList = response.data;
+ } else {
+ this.$message.error(response.msg);
+ }
+ this.energyLoading = false;
+ });
+ this.productLoading = true;
+ getSettingProduct(modelNode.id).then(response => {
+ if (response.code === 200) {
+ this.settingProductList = response.data;
+ } else {
+ this.$message.error(response.msg);
+ }
+ this.productLoading = false;
+ });
+ this.indexLoading = true;
+ getSettingIndex(modelNode.id).then(response => {
+ if (response.code === 200) {
+ this.settingIndexList = response.data;
+ } else {
+ this.$message.error(response.msg);
+ }
+ this.indexLoading = false;
+ });
}
},
- created() {
- // setInterval(alert("鍝堝搱鍝堬紒锛�"),5000);
+ collectIndexSetting() {
+ this.collectIndexDialog = true;
},
- methods: {
- modelNodeChange(modelNode) {
- this.settingDeviceList = [];
- this.settingIndexList = [];
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null;
- if (modelNode) {
- this.currentNode = modelNode;
- this.deviceLoading = true;
- getSettingDevice(modelNode.id).then((response) => {
- if (response.code === 200) {
- this.settingDeviceList = response.data;
- } else {
- this.$message.error(response.msg);
- }
- this.deviceLoading = false;
- });
- this.energyLoading = true;
- getSettingEnergy(modelNode.id).then((response) => {
- if (response.code === 200) {
- this.settingEnergyList = response.data;
- } else {
- this.$message.error(response.msg);
- }
- this.energyLoading = false;
- });
- this.productLoading = true;
- getSettingProduct(modelNode.id).then((response) => {
- if (response.code === 200) {
- this.settingProductList = response.data;
- } else {
- this.$message.error(response.msg);
- }
- this.productLoading = false;
- });
- this.indexLoading = true;
- getSettingIndex(modelNode.id).then((response) => {
- if (response.code === 200) {
- this.settingIndexList = response.data;
- } else {
- this.$message.error(response.msg);
- }
- this.indexLoading = false;
- });
- }
- },
- collectIndexSetting() {
- this.collectIndexDialog = true;
- },
- showCollectIndexDialog() {
- this.$nextTick(() => {
- this.$refs.collectIndexSetting.init(this.currentNode, this.settingIndexList);
- })
- },
- // 澶氶�夋閫変腑鏁版嵁
- handleSelectionChange(selection) {
- this.ids = selection.map(item => item.indexId);
- this.names = selection.map(item => item.name);
- this.single = selection.length !== 1;
- this.multiple = !selection.length
- },
- getList() {
- // console.log(this.myModelNode)
- // if (this.myModelNode) {
- // this.loading = true;
- // this.queryParams.nodeId = this.myModelNode.id;
- //鎺ュ彛
- // getSettingIndex(this.queryParams).then(response => {
- // this.model.energyindexList = response.data;
- // this.initstartstop();
- // this.loading = false;
- // });
+ showCollectIndexDialog() {
+ this.$nextTick(() => {
+ this.$refs.collectIndexSetting.init(
+ this.currentNode,
+ this.settingIndexList
+ );
+ });
+ },
+ // 澶氶�夋閫変腑鏁版嵁
+ handleSelectionChange(selection) {
+ this.ids = selection.map(item => item.indexId);
+ this.names = selection.map(item => item.name);
+ this.single = selection.length !== 1;
+ this.multiple = !selection.length;
+ },
+ getList() {
+ // console.log(this.myModelNode)
+ // if (this.myModelNode) {
+ // this.loading = true;
+ // this.queryParams.nodeId = this.myModelNode.id;
+ //鎺ュ彛
+ // getSettingIndex(this.queryParams).then(response => {
+ // this.model.energyindexList = response.data;
+ // this.initstartstop();
+ // this.loading = false;
+ // });
- // } else {
- this.model.tableOptions = [];
- // }
- },
+ // } else {
+ this.model.tableOptions = [];
+ // }
}
}
+};
</script>
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/energy_management_ui/src/views/equipmentMonitor/realTimeMonitoring/parametersTable.vue b/energy_management_ui/src/views/equipmentMonitor/realTimeMonitoring/parametersTable.vue
index 8255d1d..4482382 100644
--- a/energy_management_ui/src/views/equipmentMonitor/realTimeMonitoring/parametersTable.vue
+++ b/energy_management_ui/src/views/equipmentMonitor/realTimeMonitoring/parametersTable.vue
@@ -1,52 +1,66 @@
<template>
<div class="app-container" style="padding: 0">
<div style="margin-bottom:10px;">
- <span>{{currentNode?currentNode.label:''}}娴嬬偣鍙傛暟鍒楄〃</span>
+ <span>{{ currentNode ? currentNode.label : "" }}娴嬬偣鍙傛暟鍒楄〃</span>
</div>
<el-table
:data="parameterTableData"
border
style="width: 100%"
- @cell-click="openDialog">
- <el-table-column
- prop="code"
- label="鎸囨爣缂栫爜"
- width="180"
- align="center">
+ @cell-click="openDialog"
+ >
+ <el-table-column prop="code" label="鎸囨爣缂栫爜" width="180" align="center">
</el-table-column>
- <el-table-column
- prop="indexName"
- label="鎸囨爣鍚嶇О"
- align="center">
+ <el-table-column prop="indexName" label="鎸囨爣鍚嶇О" align="center">
<template slot-scope="scope">
- <div style="color:blue;text-decoration:underline;cursor:pointer">{{scope.row.indexName}}</div>
+ <div style="color:blue;text-decoration:underline;cursor:pointer">
+ {{ scope.row.indexName }}
+ </div>
</template>
</el-table-column>
<el-table-column
prop="indexUnit"
label="鎸囨爣鍗曚綅"
align="center"
- :formatter="unitFormat">
+ :formatter="unitFormat"
+ >
</el-table-column>
- <el-table-column
- prop="value"
- label="鎸囨爣鍊�(瀹炴椂鍊�)"
- align="center">
+ <el-table-column prop="value" label="鎸囨爣鍊�(瀹炴椂鍊�)" align="center">
</el-table-column>
</el-table>
<!--鏇茬嚎鍥句笌琛ㄦ牸-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false" @close="closeDialog">
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <el-tabs v-model="activeName" @tab-click="handleClick" >
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ @close="closeDialog"
+ >
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="瀹炴椂鏁版嵁鏇茬嚎鍥�" name="first">
- <live-alarm-view ref="liveAlarmView" :code="code" :activeName="activeName"></live-alarm-view>
+ <live-alarm-view
+ ref="liveAlarmView"
+ :code="code"
+ :activeName="activeName"
+ ></live-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏇茬嚎鍥�" name="second">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName"></history-alarm-view>
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ ></history-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏌ヨ" name="third">
- <history-alarm-table ref="historyAlarmTable" :code="code" :indexName="indexName" :activeName="activeName" :indexUnit="indexUnit"></history-alarm-table>
+ <history-alarm-table
+ ref="historyAlarmTable"
+ :code="code"
+ :indexName="indexName"
+ :activeName="activeName"
+ :indexUnit="indexUnit"
+ ></history-alarm-table>
</el-tab-pane>
</el-tabs>
</el-row>
@@ -58,103 +72,102 @@
</template>
<script>
- import {getSettingIndex} from "@/api/equipmentMonitor/realTimeMonitoring/realTimeMonitoring";
- import liveAlarmView from "../../energyAlarm/realTimeAlarm/liveAlarmView";
- import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView";
- import historyAlarmTable from "../../energyAlarm/realTimeAlarm/historyAlarmTable";
- export default {
- name: "parametersTable",
- components: {liveAlarmView,historyAlarmView,historyAlarmTable},
- data(){
- return{
- parameterTableData:[],
- currentNode:undefined,
- unitOptions:undefined,
- intervalTime:undefined,
- timer:undefined,
- //寮瑰嚭灞�
- activeName:undefined,
- title:"瀹炴椂鏁版嵁",
- open:false,
- code:undefined,
- indexName:undefined,
- indexUnit:undefined,
- deviceCategory:undefined,
- queryParams:{
- nodeId:undefined,
- //鎸囨爣index
- indexType:"COLLECT",
- }
- }
- },
- created() {
- this.getDicts("sys_unit").then(response => {
- this.unitOptions = response.data;
- });
- },
- mounted()
- {
- this.getConfigKey("equipmentMonitor.realTimeMonitoring.intervalTime").then(response => {
- this.intervalTime = response.msg;
- this.timer = setInterval(this.getList, this.intervalTime);
- });
- },
- beforeDestroy() {
- //椤甸潰閿�姣佹椂 瑕佸仠姝㈣鏃跺櫒锛屽惁鍒欓�夐」鍗″垏鎹㈣鏃跺櫒涓嶅仠姝紝浼氳秺鏉ヨ秺蹇紝澶氫釜绾跨▼
- if(this.timer) {
- clearInterval(this.timer);
- }
- },
- methods:{
- modelNodeChange(modelNode,deviceCategory) {
- if (modelNode) {
- this.queryParams.nodeId = modelNode.id;
- this.deviceCategory = deviceCategory;
- if("5"===this.deviceCategory){
- this.getList();
- }else {
- this.parameterTableData = [];
- }
- }
- },
- getList(){
- getSettingIndex(this.queryParams).then(response => {
- this.parameterTableData = [];
- this.parameterTableData = response.data;
- });
- },
- // 鍗曚綅瀛楀吀缈昏瘧
- unitFormat(row, column) {
- return this.selectDictLabel(this.unitOptions, row.indexUnit);
- },
- //鏇茬嚎寮瑰嚭
- openDialog(row,column,event,cell){
- if("indexName"===column.property){
- this.open = true;
- this.code = row.code;
- this.indexName = row.indexName;
- this.indexId = row.indexId;
- this.activeName = "first";
- this.indexUnit = this.selectDictLabel(this.unitOptions, row.indexUnit);
- }
- },
- //鍏抽棴
- closeDialog(){
- this.activeName = "";
- this.$refs.historyAlarmTable.cleanTable();
- },
- //鍙栨秷
- cancelDialog(){
- this.open = false;
- this.$refs.historyAlarmTable.cleanTable();
- },
- handleClick(tab, event){
- this.activeName = tab.name;
- },
+import { getSettingIndex } from "@/api/equipmentMonitor/realTimeMonitoring/realTimeMonitoring";
+import liveAlarmView from "../../energyAlarm/realTimeAlarm/liveAlarmView";
+import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView";
+import historyAlarmTable from "../../energyAlarm/realTimeAlarm/historyAlarmTable";
+export default {
+ name: "parametersTable",
+ components: { liveAlarmView, historyAlarmView, historyAlarmTable },
+ data() {
+ return {
+ parameterTableData: [],
+ currentNode: undefined,
+ unitOptions: undefined,
+ intervalTime: undefined,
+ timer: undefined,
+ //寮瑰嚭灞�
+ activeName: undefined,
+ title: "瀹炴椂鏁版嵁",
+ open: false,
+ code: undefined,
+ indexName: undefined,
+ indexUnit: undefined,
+ deviceCategory: undefined,
+ queryParams: {
+ nodeId: undefined,
+ //鎸囨爣index
+ indexType: "COLLECT"
}
+ };
+ },
+ created() {
+ this.getDicts("sys_unit").then(response => {
+ this.unitOptions = response.data;
+ });
+ },
+ mounted() {
+ this.getConfigKey("equipmentMonitor.realTimeMonitoring.intervalTime").then(
+ response => {
+ this.intervalTime = response.msg;
+ this.timer = setInterval(this.getList, this.intervalTime);
+ }
+ );
+ },
+ beforeDestroy() {
+ //椤甸潰閿�姣佹椂 瑕佸仠姝㈣鏃跺櫒锛屽惁鍒欓�夐」鍗″垏鎹㈣鏃跺櫒涓嶅仠姝紝浼氳秺鏉ヨ秺蹇紝澶氫釜绾跨▼
+ if (this.timer) {
+ clearInterval(this.timer);
}
+ },
+ methods: {
+ modelNodeChange(modelNode, deviceCategory) {
+ if (modelNode) {
+ this.queryParams.nodeId = modelNode.id;
+ this.deviceCategory = deviceCategory;
+ if ("5" === this.deviceCategory) {
+ this.getList();
+ } else {
+ this.parameterTableData = [];
+ }
+ }
+ },
+ getList() {
+ getSettingIndex(this.queryParams).then(response => {
+ this.parameterTableData = [];
+ this.parameterTableData = response.data;
+ });
+ },
+ // 鍗曚綅瀛楀吀缈昏瘧
+ unitFormat(row, column) {
+ return this.selectDictLabel(this.unitOptions, row.indexUnit);
+ },
+ //鏇茬嚎寮瑰嚭
+ openDialog(row, column, event, cell) {
+ if ("indexName" === column.property) {
+ this.open = true;
+ this.code = row.code;
+ this.indexName = row.indexName;
+ this.indexId = row.indexId;
+ this.activeName = "first";
+ this.indexUnit = this.selectDictLabel(this.unitOptions, row.indexUnit);
+ }
+ },
+ //鍏抽棴
+ closeDialog() {
+ this.activeName = "";
+ this.$refs.historyAlarmTable.cleanTable();
+ },
+ //鍙栨秷
+ cancelDialog() {
+ this.open = false;
+ this.$refs.historyAlarmTable.cleanTable();
+ },
+ handleClick(tab, event) {
+ this.activeName = tab.name;
+ }
+ }
+};
</script>
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/energy_management_ui/src/views/history/query/historyIndex.vue b/energy_management_ui/src/views/history/query/historyIndex.vue
index e734aa3..e0226ee 100644
--- a/energy_management_ui/src/views/history/query/historyIndex.vue
+++ b/energy_management_ui/src/views/history/query/historyIndex.vue
@@ -1,11 +1,16 @@
-
<template>
<div class="app-container" style="padding:0">
<el-card class="box-card">
<div slot="header" class="clearfix">
- <span>{{currentNode?currentNode.label:''}}--鑺傜偣璁剧疆</span>
+ <span>{{ currentNode ? currentNode.label : "" }}--鑺傜偣璁剧疆</span>
</div>
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
<el-form-item label="璧锋鏃堕棿">
<el-date-picker
v-model="dateRange"
@@ -13,14 +18,20 @@
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="鑷�"
start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ end-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
+ 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>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -30,22 +41,35 @@
size="mini"
@click="handleExport"
v-hasPermi="['energyAlarm:historicalAlarm:export']"
- >瀵煎嚭
+ >瀵煎嚭
</el-button>
</el-col>
</el-row>
<el-form>
- <el-table :data="JkHistoryAlarmList" v-loading="loading" border @selection-change="" @cell-click="openDialog" >
- <el-table-column label="搴忓彿" type="index" align="center"/>
- <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="modelName"/>
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code"/>
+ <el-table
+ :data="JkHistoryAlarmList"
+ v-loading="loading"
+ border
+ @selection-change=""
+ @cell-click="openDialog"
+ >
+ <el-table-column label="搴忓彿" type="index" align="center" />
+ <el-table-column label="鍗曚綅鍚嶇О" align="center" prop="modelName" />
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
<el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName">
<template slot-scope="scope">
- <div style="color:blue;text-decoration:underline ;cursor:pointer">{{scope.row.indexName}}</div>
+ <div style="color:blue;text-decoration:underline ;cursor:pointer">
+ {{ scope.row.indexName }}
+ </div>
</template>
</el-table-column>
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat" />
- <!-- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" :formatter="alarmLevelFormat"/>
+ <el-table-column
+ label="鎸囨爣鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <!-- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" :formatter="alarmLevelFormat"/>
<el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" :formatter="limitTypeFormat"/>
<el-table-column label="闄愬��" align="center" prop="limitingValue"/>
<el-table-column label="鏃堕棿璧�" align="center" prop="alarmBeginTime"/>
@@ -55,21 +79,38 @@
</el-table>
</el-form>
<pagination
- v-show="total>0"
+ v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!--寮规-->
- <el-dialog :title="title" :visible.sync="open" width="1500px" :close-on-click-modal="false">
- <el-row style="background:#fff;margin-bottom:32px;">
- <el-tabs v-model="activeName" @tab-click="handleClick" >
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1500px"
+ :close-on-click-modal="false"
+ >
+ <el-row style="margin-bottom:32px;">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="鍘嗗彶鏁版嵁鏇茬嚎鍥�" name="second">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName" :limitVal="limitVal"></history-alarm-view>
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ :limitVal="limitVal"
+ ></history-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏌ヨ" name="third">
- <history-alarm-table ref="historyAlarmTable" :code="code" :indexName="indexName" :activeName="activeName" :indexUnit="indexUnit" :limitVal="limitVal"></history-alarm-table>
+ <history-alarm-table
+ ref="historyAlarmTable"
+ :code="code"
+ :indexName="indexName"
+ :activeName="activeName"
+ :indexUnit="indexUnit"
+ :limitVal="limitVal"
+ ></history-alarm-table>
</el-tab-pane>
</el-tabs>
</el-row>
@@ -82,236 +123,239 @@
</template>
<script>
+import {
+ listHistoryAlarm,
+ exportHistoricalAlarm,
+ getHistoricalAlarm
+} from "@/api/basicsetting/historyAlarm";
+import { listLimitType } from "@/api/basicsetting/limitType";
+import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView";
+import historyAlarmTable from "../../energyAlarm/realTimeAlarm/historyAlarmTable";
- import {listHistoryAlarm,exportHistoricalAlarm , getHistoricalAlarm} from "@/api/basicsetting/historyAlarm";
- import {listLimitType} from "@/api/basicsetting/limitType"
- import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView"
- import historyAlarmTable from "../../energyAlarm/realTimeAlarm/historyAlarmTable"
+export default {
+ components: { historyAlarmView, historyAlarmTable },
+ name: "historyAlarm",
- export default {
- components: {historyAlarmView,historyAlarmTable},
- name: 'historyAlarm',
-
- data() {
- return {
- num: 20,
- num1:5,
- pickerOptions: {
- /* value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],*/
- },
- code:undefined,
- value:'',
- options:undefined,
- // handleClick:'simple',
- radio: 'B',
- activeName: 'second',
- indexId:undefined,
- indexName:undefined,
- indexUnit:undefined,
- currentNode: '',
- limitVal:undefined,
- hiddenTableHeader:false,
- /* lineChartData: lineChartData.newVisitis,*/
- limitTypeOptions:[],
- alarmLevelOptions:[],
- resposeList:[],
- /* formatDate:undefined,*/
- // 閬僵灞�
- loading: false,
- // 閫変腑鏁扮粍
- ids: [],
- dateRange: [],
- names: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 10,
- // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
- List: [],
- energyindexList: [],
- // 寮瑰嚭灞傛爣棰�
- JkHistoryAlarmList:[],
- title: "鍘嗗彶鏁版嵁鏌ヨ",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- // 涓婚敭瀛楀吀
- indexIdOptions: [],
- // 鎸囨爣鍚嶇О瀛楀吀
- nameOptions: [],
- // 鎸囨爣缂栫爜瀛楀吀
- codeOptions: [],
- // 鍗曚綅瀛楀吀
- unitIdOptions: [],
- // 鏌ヨ鍙傛暟
- lineChartData:{
- newVisitis:null,
- },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- eierarchyFlag:'B',
- indexType:'COLLECT',
- code: undefined,
- indexName:undefined,
- /* unitId: undefined,*/
- limitType: undefined,
- alarmLevel: undefined,
- /*alarmValue:undefined,*/
- /* limitingValue:undefined,*/
- nodeId:undefined,
- beginTime: undefined,
- endTime:undefined,
-
- },
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- currentNode: undefined,
- indexCategoryDefaultVal: undefined,
- unitDefaultVal: undefined
- };
+ data() {
+ return {
+ num: 20,
+ num1: 5,
+ pickerOptions: {
+ /* value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],*/
+ },
+ code: undefined,
+ value: "",
+ options: undefined,
+ // handleClick:'simple',
+ radio: "B",
+ activeName: "second",
+ indexId: undefined,
+ indexName: undefined,
+ indexUnit: undefined,
+ currentNode: "",
+ limitVal: undefined,
+ hiddenTableHeader: false,
+ /* lineChartData: lineChartData.newVisitis,*/
+ limitTypeOptions: [],
+ alarmLevelOptions: [],
+ resposeList: [],
+ /* formatDate:undefined,*/
+ // 閬僵灞�
+ loading: false,
+ // 閫変腑鏁扮粍
+ ids: [],
+ dateRange: [],
+ names: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 10,
+ // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
+ List: [],
+ energyindexList: [],
+ // 寮瑰嚭灞傛爣棰�
+ JkHistoryAlarmList: [],
+ title: "鍘嗗彶鏁版嵁鏌ヨ",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 涓婚敭瀛楀吀
+ indexIdOptions: [],
+ // 鎸囨爣鍚嶇О瀛楀吀
+ nameOptions: [],
+ // 鎸囨爣缂栫爜瀛楀吀
+ codeOptions: [],
+ // 鍗曚綅瀛楀吀
+ unitIdOptions: [],
+ // 鏌ヨ鍙傛暟
+ lineChartData: {
+ newVisitis: null
+ },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ eierarchyFlag: "B",
+ indexType: "COLLECT",
+ code: undefined,
+ indexName: undefined,
+ /* unitId: undefined,*/
+ limitType: undefined,
+ alarmLevel: undefined,
+ /*alarmValue:undefined,*/
+ /* limitingValue:undefined,*/
+ nodeId: undefined,
+ beginTime: undefined,
+ endTime: undefined
+ },
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ currentNode: undefined,
+ indexCategoryDefaultVal: undefined,
+ unitDefaultVal: undefined
+ };
+ },
+ created() {
+ this.getDicts("alarm_level").then(response => {
+ this.alarmLevelOptions = response.data;
+ });
+ this.getDicts("sys_unit").then(response => {
+ this.unitIdOptions = response.data;
+ });
+ listLimitType(this.queryParams).then(response => {
+ this.limitTypeOptions = response.rows;
+ });
+ },
+ methods: {
+ getList() {
+ this.loading = true;
+ listHistoryAlarm(
+ this.addDateRange(this.queryParams, this.dateRange)
+ ).then(response => {
+ this.JkHistoryAlarmList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
},
- created() {
- this.getDicts("alarm_level").then(response => {
- this.alarmLevelOptions = response.data;
- });
- this.getDicts("sys_unit").then(response => {
- this.unitIdOptions = response.data;
- });
- listLimitType(this.queryParams).then(response => {
- this.limitTypeOptions = response.rows;
- });
-
+ /** 鏌ョ湅鎸夐挳鎿嶄綔 */
+ handleUpdate(row) {
+ this.reset();
+ const indexId = row.indexId || this.ids;
+ this.open = true;
+ /*this.title = "鍘嗗彶鏁版嵁鏌ヨ";*/
},
- methods: {
-
- getList() {
- this.loading = true;
- listHistoryAlarm(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
- this.JkHistoryAlarmList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- },
- /** 鏌ョ湅鎸夐挳鎿嶄綔 */
- handleUpdate(row) {
- this.reset();
- const indexId = row.indexId || this.ids;
- this.open = true;
- /*this.title = "鍘嗗彶鏁版嵁鏌ヨ";*/
- },
- // 鍗曚綅瀛楀吀缈昏瘧
- unitIdFormat(row, column) {
- return this.selectDictLabel(this.unitIdOptions, row.unitId);
- },
-/* // 闄愬�肩被鍨嬪瓧鍏哥炕璇�
+ // 鍗曚綅瀛楀吀缈昏瘧
+ unitIdFormat(row, column) {
+ return this.selectDictLabel(this.unitIdOptions, row.unitId);
+ },
+ /* // 闄愬�肩被鍨嬪瓧鍏哥炕璇�
limitTypeFormat(row, column) {
return this.selectDictLabel(this.limitTypeOptions, row.limitType);
},*/
- // 鎶ヨ绾у埆瀛楀吀缈昏瘧
- alarmLevelFormat(row, column) {
- return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- indexId: undefined,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- remark: undefined,
- unitId: undefined
- };
- this.resetForm("form");
- },
- modelNodeChange(modelNode) {
- this.queryParams.nodeId = modelNode.id;
- this.settingDeviceList = [];
- this.settingIndexList = [];
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null;
- if (modelNode) {
- this.currentNode = modelNode;
- this.deviceLoading = true;
- this.energyLoading = true;
- this.productLoading = true;
- this.indexLoading = true;
- }
- this.getList();
- },
- formatDate: function (value) {
- let date = new Date(value);
- let y = date.getFullYear();
- let MM = date.getMonth() + 1;
- MM = MM < 10 ? ('0' + MM) : MM;
- let d = date.getDate();
- d = d < 10 ? ('0' + d) : d;
- let h = date.getHours();
- h = h < 10 ? ('0' + h) : h;
- let m = date.getMinutes();
- m = m < 10 ? ('0' + m) : m;
- let s = date.getSeconds();
- s = s < 10 ? ('0' + s) : s;
- return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
- },
+ // 鎶ヨ绾у埆瀛楀吀缈昏瘧
+ alarmLevelFormat(row, column) {
+ return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ indexId: undefined,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ remark: undefined,
+ unitId: undefined
+ };
+ this.resetForm("form");
+ },
+ modelNodeChange(modelNode) {
+ this.queryParams.nodeId = modelNode.id;
+ this.settingDeviceList = [];
+ this.settingIndexList = [];
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
+ if (modelNode) {
+ this.currentNode = modelNode;
+ this.deviceLoading = true;
+ this.energyLoading = true;
+ this.productLoading = true;
+ this.indexLoading = true;
+ }
+ this.getList();
+ },
+ formatDate: function(value) {
+ let date = new Date(value);
+ let y = date.getFullYear();
+ let MM = date.getMonth() + 1;
+ MM = MM < 10 ? "0" + MM : MM;
+ let d = date.getDate();
+ d = d < 10 ? "0" + d : d;
+ let h = date.getHours();
+ h = h < 10 ? "0" + h : h;
+ let m = date.getMinutes();
+ m = m < 10 ? "0" + m : m;
+ let s = date.getSeconds();
+ s = s < 10 ? "0" + s : s;
+ return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.dateRange = [];
+ this.resetForm("queryForm");
+ },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.dateRange = [];
- this.resetForm("queryForm");
- },
-
- handleSelectionChange() {
- },
- openDialog(row,column,event,cell){
- if("indexName"==column.property){
- this.open = true;
- this.code = row.code;
- this.indexName = row.indexName;
- this.indexId = row.indexId;
- this.activeName = "second";
- this.indexUnit = this.selectDictLabel(this.unitIdOptions, row.unitId);
- this.limitVal = row.limitingValue;
- }
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
+ handleSelectionChange() {},
+ openDialog(row, column, event, cell) {
+ if ("indexName" == column.property) {
+ this.open = true;
+ this.code = row.code;
+ this.indexName = row.indexName;
+ this.indexId = row.indexId;
+ this.activeName = "second";
+ this.indexUnit = this.selectDictLabel(this.unitIdOptions, row.unitId);
+ this.limitVal = row.limitingValue;
+ }
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
return exportHistoricalAlarm(queryParams);
- }).then(response => {
+ })
+ .then(response => {
this.download(response.msg);
- }).catch(function() {});
-
- },
- //闄愬埗绫诲瀷缈昏瘧
- limitTypeFormat(row,column){
- var actions = [];
- Object.keys(this.limitTypeOptions).map((key) => {
- if (this.limitTypeOptions[key].limitCode == ('' + row.limitType)) {
- actions.push(this.limitTypeOptions[key].limitName);
- }
- });
- return actions.join('');
- },
- handleClick(tab, event){
- this.activeName = tab.name;
- },
+ })
+ .catch(function() {});
+ },
+ //闄愬埗绫诲瀷缈昏瘧
+ limitTypeFormat(row, column) {
+ var actions = [];
+ Object.keys(this.limitTypeOptions).map(key => {
+ if (this.limitTypeOptions[key].limitCode == "" + row.limitType) {
+ actions.push(this.limitTypeOptions[key].limitName);
+ }
+ });
+ return actions.join("");
+ },
+ handleClick(tab, event) {
+ this.activeName = tab.name;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/index copy.vue b/energy_management_ui/src/views/index copy.vue
deleted file mode 100644
index 3d1dcb7..0000000
--- a/energy_management_ui/src/views/index copy.vue
+++ /dev/null
@@ -1,687 +0,0 @@
-<template>
- <div class="home-show">
- <!-- <el-card :bordered="false">
- <div class="home-head">
- <div class="home-select-label">鏃ユ湡鍒囨崲</div>
- <div>
- <el-button
- :type="dateType === 'DAY' ? 'primary' : ''"
- @click="dateClickHandle('DAY')"
- >鏃�</el-button
- >
- <el-button
- :type="dateType === 'MONTH' ? 'primary' : ''"
- @click="dateClickHandle('MONTH')"
- class="select-month"
- >鏈�
- </el-button>
- <el-button
- :type="dateType === 'YEAR' ? 'primary' : ''"
- @click="dateClickHandle('YEAR')"
- >骞�</el-button
- >
- </div>
- </div>
- </el-card> -->
- <el-row type="flex" class="data-indicator-overview">
- <el-col class="home-body-left">
- <el-card class="body-left-title" :bordered="false">
- <div slot="header" class="clearfix">
- <span>鍙屾帶鏁版嵁鎸囨爣鎬昏</span>
- </div>
- <el-row class="double-data-show-content">
- <el-col :span="12" class="total">
- <img alt="" src="~@/assets/home/zonghe.svg" />
- <div class="left-title-style">
- <div>
- <div>鍏ㄥ巶缁煎悎鑳借��</div>
- <div class="unit">{{ summation }} tce</div>
- </div>
- </div>
- </el-col>
- <!-- <el-col :span="12" class="co2">
- <img alt="" src="~@/assets/home/tan.svg" />
- <div class="left-title-style">
- <div>
- <div>CO鈧傛帓鏀炬�婚噺</div>
- <div class="unit">{{ totalCo2Emissions }} t</div>
- </div>
- </div>
- </el-col> -->
- </el-row>
- </el-card>
- <div class="left-line-style">
- <div>鑳芥簮瀹炴椂鐩戞祴</div>
- <el-row type="flex" justify="space-between">
- <!-- <el-col class="radio-list">
- <div class="radio-list-content">
- <el-radio-group
- v-model="energyType"
- @change="onPowerTypeChange"
- >
- <el-radio
- :style="radioStyle"
- :label="item.value"
- v-for="item in powerTypeOptions"
- :key="item.value"
- >
- {{ item.label }}
- </el-radio>
- </el-radio-group>
- </div>
- </el-col> -->
- <el-col class="right-line">
- <span class="chart-left-unit">{{
- `鍗曚綅锛�${monitoringUnit}锛塦
- }}</span>
- <BarChart class="line-content" :chartData="chartDataObj" />
- </el-col>
- </el-row>
- </div>
- </el-card>
- <el-card
- :bordered="false"
- class="left-bottom-type"
- :body-style="{ height: '140px' }"
- >
- <div slot="header" class="clearfix">
- <span>鍒嗙被鑳芥簮缁熻</span>
- </div>
- <div class="card-list">
- <div
- class="classify-energy"
- style=""
- v-for="(item, index) in energyStatistic"
- :key="index"
- >
- <div class="img-list">
- <img
- v-if="item.item.includes('鐢�')"
- src="~@/assets/home/haodian.svg"
- alt=""
- />
- <img
- v-if="item.item.includes('姘�')"
- src="~@/assets/home/haoshui.svg"
- alt=""
- />
- <img
- v-if="item.item.includes('姘�')"
- src="~@/assets/home/haoqi.svg"
- alt=""
- />
- <img
- v-if="item.item.includes('钂告苯')"
- src="~@/assets/home/haozhengqi.svg"
- alt=""
- />
- <div class="text-describe">
- <div>
- <div>
- 鑰梴{
- item.item.indexOf("澶╃劧") !== -1
- ? item.item.replace("澶╃劧", "")
- : item.item
- }}閲�
- {{ item.unit ? `锛�${item.unit}锛塦 : "" }}
- </div>
- <div class="number">
- {{ item.count || 0 }}
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </el-card>
- </el-col>
- <el-col class="home-body-right">
- <el-card :bordered="false" class="right-first-card-title">
- <div slot="header" class="clearfix">
- <span>缁煎悎鑳借�楀崰姣斿垎鏋�</span>
- </div>
- <PieChart
- class="first-chat"
- :chartData="firstPieData"
- pieTitle="缁煎悎鑳借�楀崰姣斿垎鏋�"
- />
- </el-card>
- <el-card :bordered="false" class="second-card-title">
- <div slot="header" class="clearfix">
- <span>鑳借�楄澶囧崰姣�</span>
- </div>
- <PieChart
- class="second-chat"
- :chartData="secondPieData"
- pieTitle="鑳借�楄澶囧崰姣�"
- />
- </el-card>
- </el-col>
- </el-row>
- </div>
-</template>
-
-<script>
-import {
- getEnergyConsumptionRatio,
- getEnergyConsumptionSummation,
- getEnergyStatistic,
- getHomeEnergyMonitoring,
- listEnergyType,
- getHomeEnergyUnitConsumptionRatio
-} from "@/api/home/home";
-import mixins from "@/layout/mixin/getHeight";
-import moment from "moment";
-import PieChart from "./dashboard/PieChart";
-import LineChart from "./dashboard/LineChart";
-import BarChart from "./dashboard/BarChart";
-
-export default {
- components: {
- LineChart,
- BarChart,
- PieChart
- },
- mixins: [mixins],
-
- data() {
- return {
- firstPieData: [],
- secondPieData: [],
- chartDataObj: {},
- energyType: "electric",
- energyTypeName: "鐢�",
- dateType: "DAY",
- powerTypeOptions: [
- {
- label: "鐢�",
- value: "electric",
- energyUnit: "kWh"
- },
- { label: "姘�", value: "Water", energyUnit: "m鲁" },
- { label: "钂告苯", value: "Steam", energyUnit: "鍚�" },
- { label: "澶╃劧姘�", value: "Gas", energyUnit: "Nm鲁" }
- ],
- isClick: true,
- radioStyle: {
- display: "block",
- height: "30px",
- lineHeight: "30px"
- },
- chart1: null,
- chart2: null,
- monitoringUnit: "kWh",
- data: [],
- pieDta: [],
- pieDtatwo: [],
- energyCostSum: 0,
- energyStatistic: [],
- summation: 10776,
- totalCo2Emissions: 0
- };
- },
- mounted() {
- this.getEnergyType();
- this.getSummationData();
- this.getEnergyConsumptionRatioData();
- this.getEnergyStatisticData();
- this.getHomeEnergyUnitConsumptionRatioData();
-
- const ele = document.createEvent("Event");
- ele.initEvent("resize", true, true);
- window.dispatchEvent(ele);
- },
- methods: {
- getEnergyType() {
- listEnergyType()
- .then(res => {
- if (res.code === 200) {
- this.powerTypeOptions =
- res.data.map(item => ({
- ...item,
- value: item.energy,
- label: item.energyName
- })) || [];
- this.energyType =
- this.powerTypeOptions.length > 0
- ? this.powerTypeOptions[0].value
- : "";
- this.energyTypeName =
- this.powerTypeOptions.length > 0
- ? this.powerTypeOptions[0].label
- : "";
- this.getEnergyMonitoring();
- }
- })
- .catch(e => {
- console.log("鑾峰彇鑳芥簮绫诲瀷鍒楄〃", e);
- });
- },
- // 纰虫帓閲忔牳绠楁煡璇�
- getCarbonEmission() {
- getHomeCarbonEmission(this.dateType).then(res => {
- this.totalCo2Emissions = res.result.totalCo2Emissions;
- });
- },
- // 鑾峰彇鍏ㄥ巶缁煎悎鑳借��
- getSummationData() {
- getEnergyConsumptionSummation(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.summation = res.data;
- }
- })
- .catch(e => {
- console.log("鑾峰彇鍏ㄥ巶缁煎悎鑳借��", e);
- });
- },
- // 鑾峰彇缁煎悎鑳借�楀崰姣旂幆褰㈠浘鍒嗘瀽鏁版嵁
- getEnergyConsumptionRatioData() {
- getEnergyConsumptionRatio(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.firstPieData = res.data.map(item => {
- return {
- ...item,
- name: item.item,
- value: item.count || 0
- // unit: filterUint
- };
- });
- }
- })
- .catch(e => {
- console.log("鑾峰彇缁煎悎鑳借�楀崰姣旂幆褰㈠浘鍒嗘瀽鏁版嵁", e);
- });
- },
-
- // 鑳芥簮璁惧鐜舰鍥炬暟鎹暟鎹�
- getHomeEnergyUnitConsumptionRatioData() {
- getHomeEnergyUnitConsumptionRatio(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.secondPieData = res.data.map(item => {
- return {
- ...item,
- name: item.name,
- value: item.value || 0
- // unit: filterUint
- };
- });
- }
- })
- .catch(e => {
- console.log("鑳芥簮璁惧鍒嗘瀽鐜舰鍥炬暟鎹暟鎹�", e);
- });
- },
-
- // 鍒嗙被鑳芥簮缁熻鏁版嵁
- getEnergyStatisticData() {
- getEnergyStatistic(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.energyStatistic = res.data;
- }
- })
- .catch(e => {
- console.log("鍒嗙被鑳芥簮缁熻鏁版嵁", e);
- });
- },
-
- // 鑳芥簮鐩戞祴鏌辩姸鍥炬暟鎹�
- getEnergyMonitoring() {
- getHomeEnergyMonitoring(this.dateType, this.energyType)
- .then(res => {
- if (res.code === 200) {
- this.monitoringUnit = res.data.unit;
- let chartData = res.data.chartData.sort((a, b) => {
- return a.date - b.date;
- });
- let nameList = Array.from(
- new Set(
- chartData.map(item => {
- return item.name;
- })
- )
- ).sort((a, b) => {
- return new Date(b.date).getTime() - new Date(a.date).getTime();
- });
- // 琛ュ叏鏁版嵁
- let oneArr = chartData.filter(item => {
- return item.name === nameList[0];
- });
- let twoArr = chartData.filter(item => {
- return item.name === nameList[1];
- });
-
- let maxDate =
- this.dateType === "DAY"
- ? 23
- : Math.max(
- ...chartData.map(item => {
- return item.date;
- })
- );
- oneArr.forEach(element => {
- if (this.dateType === "DAY") {
- let hour = new Date("2022 " + element.date).getHours() + "鏃�";
- element.date = hour;
- } else {
- element.date =
- this.dateType === "MONTH"
- ? element.date + "鏃�"
- : element.date + "鏈�";
- }
- });
- twoArr.forEach(element => {
- if (this.dateType === "DAY") {
- let hour = new Date("2022 " + element.date).getHours() + "鏃�";
- element.date = hour;
- } else {
- element.date =
- this.dateType === "MONTH"
- ? element.date + "鏃�"
- : element.date + "鏈�";
- }
- });
- if (oneArr.length < maxDate) {
- if (this.dateType === "DAY") {
- for (let d = oneArr.length; d < maxDate + 1; d++) {
- oneArr.push({
- date: d + "鏃�",
- name: nameList[0],
- count: 0,
- value: null
- });
- }
- } else {
- console.log("one111111111");
- for (let d = oneArr.length + 1; d < maxDate + 1; d++) {
- oneArr.push({
- date: this.dateType === "MONTH" ? d + "鏃�" : d + "鏈�",
- name: nameList[0],
- count: 0,
- value: null
- });
- }
- }
- }
- if (twoArr.length < maxDate) {
- if (this.dateType === "DAY") {
- for (let d = twoArr.length; d < maxDate + 1; d++) {
- twoArr.push({
- date: d + "鏃�",
- name: nameList[1],
- count: 0,
- value: 0
- });
- }
- } else {
- for (let d = twoArr.length + 1; d < maxDate + 1; d++) {
- twoArr.push({
- date: this.dateType === "MONTH" ? d + "鏃�" : d + "鏈�",
- name: nameList[1],
- count: 0,
- value: 0
- });
- }
- }
- }
-
- let chartData2 = oneArr
- .concat(twoArr)
- .map(item => {
- return {
- ...item,
- len: item.date,
- count: item.value === "--" ? null : +item.value
- };
- })
- .sort((a, b) => {
- return new Date(a.name).getTime() - new Date(b.name).getTime();
- });
- this.data = chartData2;
- this.chartDataObj = {
- expectedData: twoArr.map(one => {
- return one.value;
- }),
- actualData: oneArr.map(e => {
- return e.value;
- }),
- xData: oneArr.map(one => {
- return one.date;
- })
- };
- }
- })
- .catch(e => {
- console.log("鑳芥簮鐩戞祴鏌辩姸鍥炬暟鎹�", e);
- });
- },
-
- dateClickHandle(type) {
- this.dateType = type;
- this.isClick = !this.isClick;
- this.getSummationData();
- this.getEnergyConsumptionRatioData();
- this.getEnergyCostRatioData();
- this.getEnergyStatisticData();
- this.getEnergyMonitoring();
- this.getCarbonEmission();
- },
-
- onPowerTypeChange(e) {
- this.energyType = e;
- for (let i = 0; i < this.powerTypeOptions.length; i++) {
- if (this.energyType === this.powerTypeOptions[i].value) {
- this.energyTypeName = this.powerTypeOptions[i].label;
- this.monitoringUnit = this.powerTypeOptions[i].energyUnit || "";
- }
- }
- this.getEnergyMonitoring();
- }
- }
-};
-</script>
-
-<style lang="scss" scoped>
-.home-show {
- overflow: hidden;
- overflow-y: scroll;
- height: calc(100vh - 90px);
- .home-head {
- display: flex;
- align-items: center;
-
- .home-select-label {
- margin-right: 10px;
- color: #000;
- font-weight: 600;
- }
-
- .select-month {
- margin: 0 8px;
- }
- }
-
- .data-indicator-overview {
- ::v-deep .el-card__body {
- padding: 0 !important;
- }
-
- .home-body-left {
- width: 66.3%;
- height: 100%;
-
- .body-left-title {
- margin: 0 16px 0px 0;
- }
-
- .double-data-show-content {
- display: flex;
- align-items: center;
- border-bottom: 1px solid #e9e9e9;
- padding: 23px 0 23px 47px;
-
- & > div {
- display: flex;
- align-items: center;
- }
-
- img {
- width: 20px;
- height: 20px;
- }
-
- .left-title-style {
- display: flex;
- align-items: center;
- margin-left: 18px;
-
- .unit {
- font-size: 30px;
- color: #000000;
- }
- }
- }
-
- .left-line-style {
- padding: 24px;
- color: #000000;
-
- .radio-list {
- width: 122px;
-
- .radio-list-content {
- margin: 16px 12px 0 0;
- background: #f3f7f7;
- padding: 21px 9px;
- border-radius: 2px;
- overflow: auto;
- height: 360px;
- }
- }
-
- .right-line {
- width: calc(100% - 122px);
- position: relative;
-
- .chart-left-unit {
- position: absolute;
- top: 16px;
- left: 0;
- color: #333;
- }
-
- .line-content {
- margin: 12px 0 0 0;
- height: 300px;
- }
- }
- }
-
- .left-bottom-type {
- margin: 16px 16px 16px 0;
-
- .card-list {
- display: flex;
- flex-wrap: wrap;
- height: 100%;
-
- .classify-energy {
- border-left: 1px solid #e9e9e9;
- flex: 1;
- display: flex;
- align-items: center;
- padding: 0 0 0 24px;
-
- &:first-child {
- border-left: none;
- }
-
- .img-list {
- display: flex;
- align-items: center;
- img {
- width: 20px;
- height: 20px;
- }
-
- .text-describe {
- display: flex;
- align-items: center;
- margin-left: 18px;
-
- .number {
- font-size: 24px;
- color: #000000;
- }
- }
- }
- }
- }
- }
- }
-
- .home-body-right {
- width: 33.7%;
- height: 100%;
-
- .right-first-card-title {
- margin: 0 0 16px 0;
-
- .first-chat {
- margin: 10px 0 0 0;
- height: 340px;
- }
- }
-
- .second-card-title {
- // padding-top: 16px;
-
- .second-chat {
- margin: 10px 0 0 0;
- height: 340px;
- }
-
- .bottom-description-list {
- display: flex;
- padding: 0 23px 16px 10px;
- height: 106px;
- align-items: center;
-
- .total {
- border-right: 1px solid #e9e9e9;
- padding-left: 10px;
- min-width: 180px;
- max-width: 180px;
-
- .energy-cost-sum {
- font-size: 24px;
- color: #000000;
- }
- }
-
- .legend {
- padding: 6px 0 0 20px;
-
- .legend-list {
- display: flex;
- // width: 280px;
- flex-wrap: wrap;
- }
- }
- }
- }
- }
- }
-
- .power-cost {
- width: 8px;
- height: 8px;
- border-radius: 50%;
- display: inline-block;
- margin-right: 4px;
- }
-}
-</style>
diff --git a/energy_management_ui/src/views/index.vue b/energy_management_ui/src/views/index.vue
index d8d3914..dbda76e 100644
--- a/energy_management_ui/src/views/index.vue
+++ b/energy_management_ui/src/views/index.vue
@@ -1,767 +1,25 @@
<template>
- <div class="home-show">
- <!-- <el-card :bordered="false">
- <div class="home-head">
- <div class="home-select-label">鏃ユ湡鍒囨崲</div>
- <div>
- <el-button
- :type="dateType === 'DAY' ? 'primary' : ''"
- @click="dateClickHandle('DAY')"
- >鏃�</el-button
- >
- <el-button
- :type="dateType === 'MONTH' ? 'primary' : ''"
- @click="dateClickHandle('MONTH')"
- class="select-month"
- >鏈�
- </el-button>
- <el-button
- :type="dateType === 'YEAR' ? 'primary' : ''"
- @click="dateClickHandle('YEAR')"
- >骞�</el-button
- >
- </div>
- </div>
- </el-card> -->
- <el-card
- class="body-left-title"
- :bordered="false"
- style="margin-bottom: 12px;"
+ <div class="app-container" style="padding: 0;margin: 10px;">
+ <div
+ class="dashboard-editor-container"
+ style="width: 100%;height: 100%;display: block;margin: 0 auto;"
>
- <div slot="header" class="clearfix">
- <span>褰撴棩鍙屾帶鏁版嵁鎸囨爣鎬昏</span>
- </div>
- <el-row class="double-data-show-content">
- <el-col :span="5" class="total">
- <img alt="" src="~@/assets/home/zonghe.svg" />
- <div class="left-title-style">
- <div>
- <div>鍏ㄥ巶缁煎悎鑳借��</div>
- <div class="unit">{{ summation }} tce</div>
- </div>
- </div>
- </el-col>
- <el-col
- :span="5"
- class="co2"
- v-for="(item, index) in energyStatistic"
- :key="index"
- style="border-left: 1px solid #999;"
- >
- <img
- v-if="item.item.includes('鐢�')"
- src="~@/assets/home/haodian.svg"
- alt=""
- />
- <img
- v-if="item.item.includes('姘�')"
- src="~@/assets/home/haoshui.svg"
- alt=""
- />
- <img
- v-if="item.item.includes('姘�')"
- src="~@/assets/home/haoqi.svg"
- alt=""
- />
- <img
- v-if="item.item.includes('钂告苯')"
- src="~@/assets/home/haozhengqi.svg"
- alt=""
- />
- <div class="left-title-style">
- <div>
- <div>
- 鑰梴{
- item.item.indexOf("澶╃劧") !== -1
- ? item.item.replace("澶╃劧", "")
- : item.item
- }}閲�
- {{ item.unit ? `锛�${item.unit}锛塦 : "" }}
- </div>
- <div class="unit">
- {{ item.count || 0 }}
- </div>
- </div>
- </div>
- </el-col>
- <el-col :span="5" class="total" style="border-left: 1px solid #999;">
- <img alt="" src="~@/assets/home/wen.png" />
- <div class="left-title-style">
- <div>
- <div>瀹ゅ娓╁害</div>
- <div class="unit">{{ temperature }}</div>
- </div>
- </div>
- </el-col>
- <el-col :span="5" class="total" style="border-left: 1px solid #999;">
- <img alt="" src="~@/assets/home/shi.png" />
- <div class="left-title-style">
- <div>
- <div>瀹ゅ婀垮害</div>
- <div class="unit">{{ humidity }}</div>
- </div>
- </div>
- </el-col>
- </el-row>
- </el-card>
- <el-row type="flex" class="data-indicator-overview">
- <el-col class="home-body-left">
- <el-card :bordered="false" class="body-left-title">
- <div slot="header" class="clearfix">
- <span>鑳芥簮瀹炴椂鐩戞祴</span>
- </div>
- <div class="chart-wrapper">
- <span class="chart-left-unit">{{
- `鐢�/鍗曚綅${monitoringUnit}`
- }}</span>
- <BarChart class="line-content" :chartData="chartDataObj" />
- </div>
- <div class="chart-wrapper" style="border-top: 1px solid #999">
- <span class="chart-left-unit">{{
- `姘�/鍗曚綅${monitoringWaterUnit}`
- }}</span>
- <BarChart class="line-content" :chartData="chartDataWaterObj" />
- </div>
- </el-card>
- <!-- <div class="left-line-style">
- <div>鑳芥簮瀹炴椂鐩戞祴</div>
- <el-row type="flex" justify="space-between">
- <el-col class="radio-list">
- <div class="radio-list-content">
- <el-radio-group
- v-model="energyType"
- @change="onPowerTypeChange"
- >
- <el-radio
- :style="radioStyle"
- :label="item.value"
- v-for="item in powerTypeOptions"
- :key="item.value"
- >
- {{ item.label }}
- </el-radio>
- </el-radio-group>
- </div>
- </el-col>
- </el-row>
- </div> -->
- </el-col>
- <el-col class="home-body-right">
- <el-card :bordered="false" class="right-first-card-title">
- <div slot="header" class="clearfix">
- <span>缁煎悎鑳借�楀崰姣斿垎鏋�</span>
- </div>
- <PieChart
- class="first-chat"
- :chartData="firstPieData"
- pieTitle="缁煎悎鑳借�楀崰姣斿垎鏋�"
- />
- </el-card>
- <el-card :bordered="false" class="second-card-title">
- <div slot="header" class="clearfix">
- <span>鑳借�楄澶囧崰姣�</span>
- </div>
- <PieChart
- class="second-chat"
- :chartData="secondPieData"
- pieTitle="鑳借�楄澶囧崰姣�"
- height="280px"
- />
- </el-card>
- </el-col>
- </el-row>
+ <div class="title">娆㈣繋浣跨敤浜戣矾缁煎悎鑳芥簮绠＄悊骞冲彴</div>
+ <!-- <img src="@/assets/image/index3.png" style="width: 55%;" /> -->
+ <img src="@/assets/image/image.png" style="height: 80vh;" />
+ </div>
</div>
</template>
-<script>
-import {
- getEnergyConsumptionRatio,
- getEnergyConsumptionSummation,
- getEnergyStatistic,
- getHomeEnergyMonitoring,
- listEnergyType,
- getHomeEnergyUnitConsumptionRatio,
- getHomeOutdoorTemperature
-} from "@/api/home/home";
-import mixins from "@/layout/mixin/getHeight";
-import PieChart from "./dashboard/PieChart";
-import LineChart from "./dashboard/LineChart";
-import BarChart from "./dashboard/BarChart";
-
-export default {
- components: {
- LineChart,
- BarChart,
- PieChart
- },
- mixins: [mixins],
-
- data() {
- return {
- firstPieData: [],
- secondPieData: [],
- monitoringUnit: "kWh",
- chartDataObj: {},
- monitoringWaterUnit: "m鲁",
- chartDataWaterObj: {},
- energyType: "electric",
- energyTypeName: "鐢�",
- dateType: "DAY",
- powerTypeOptions: [
- {
- label: "鐢�",
- value: "electric",
- energyUnit: "kWh"
- },
- { label: "姘�", value: "Water", energyUnit: "m鲁" },
- { label: "钂告苯", value: "Steam", energyUnit: "鍚�" },
- { label: "澶╃劧姘�", value: "Gas", energyUnit: "Nm鲁" }
- ],
- isClick: true,
- radioStyle: {
- display: "block",
- height: "30px",
- lineHeight: "30px"
- },
- chart1: null,
- chart2: null,
- data: [],
- pieDta: [],
- pieDtatwo: [],
- energyCostSum: 0,
- energyStatistic: [],
- summation: 10776,
- totalCo2Emissions: 0,
- humidity: "",
- temperature: "",
- timer: null,
- timer30: null
- };
- },
- mounted() {
- this.getEnergyType();
- this.getSummationData();
- this.getEnergyConsumptionRatioData();
- this.getEnergyStatisticData();
- this.getHomeEnergyUnitConsumptionRatioData();
-
- const ele = document.createEvent("Event");
- ele.initEvent("resize", true, true);
- window.dispatchEvent(ele);
-
- clearInterval(this.timer);
- clearInterval(this.timer30);
- this.getHomeOutdoorTemperatureData();
- // this.timer = setInterval(() => {
- // this.getHomeOutdoorTemperatureData();
- // }, 12000);
- this.timer30 = setInterval(() => {
- // this.getEnergyType();
- this.getSummationData();
- this.getEnergyConsumptionRatioData();
- this.getEnergyStatisticData();
- this.getHomeEnergyUnitConsumptionRatioData();
- }, 180000);
- },
- beforeDestroy() {
- clearInterval(this.timer);
- clearInterval(this.timer30);
- },
- methods: {
- getHomeOutdoorTemperatureData() {
- getHomeOutdoorTemperature().then(res => {
- this.temperature = res.data.temperature;
- this.humidity = res.data.humidity;
- });
- },
- getEnergyType() {
- listEnergyType()
- .then(res => {
- if (res.code === 200) {
- this.powerTypeOptions =
- res.data.map(item => ({
- ...item,
- value: item.energy,
- label: item.energyName
- })) || [];
- this.energyType =
- this.powerTypeOptions.length > 0
- ? this.powerTypeOptions[0].value
- : "";
- this.energyTypeName =
- this.powerTypeOptions.length > 0
- ? this.powerTypeOptions[0].label
- : "";
- for (let i = 0; i < this.powerTypeOptions.length; i++) {
- this.getEnergyMonitoring(this.powerTypeOptions[i].value);
- }
- }
- })
- .catch(e => {
- console.log("鑾峰彇鑳芥簮绫诲瀷鍒楄〃", e);
- });
- },
- // 纰虫帓閲忔牳绠楁煡璇�
- getCarbonEmission() {
- getHomeCarbonEmission(this.dateType).then(res => {
- this.totalCo2Emissions = res.result.totalCo2Emissions;
- });
- },
- // 鑾峰彇鍏ㄥ巶缁煎悎鑳借��
- getSummationData() {
- getEnergyConsumptionSummation(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.summation = res.data;
- }
- })
- .catch(e => {
- console.log("鑾峰彇鍏ㄥ巶缁煎悎鑳借��", e);
- });
- },
- // 鑾峰彇缁煎悎鑳借�楀崰姣旂幆褰㈠浘鍒嗘瀽鏁版嵁
- getEnergyConsumptionRatioData() {
- getEnergyConsumptionRatio(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.firstPieData = res.data.map(item => {
- return {
- ...item,
- name: item.item,
- value: item.count || 0
- // unit: filterUint
- };
- });
- }
- })
- .catch(e => {
- console.log("鑾峰彇缁煎悎鑳借�楀崰姣旂幆褰㈠浘鍒嗘瀽鏁版嵁", e);
- });
- },
-
- // 鑳芥簮璁惧鐜舰鍥炬暟鎹暟鎹�
- getHomeEnergyUnitConsumptionRatioData() {
- getHomeEnergyUnitConsumptionRatio(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.secondPieData = res.data.map(item => {
- return {
- ...item,
- name: item.name,
- value: item.value || 0
- // unit: filterUint
- };
- });
- }
- })
- .catch(e => {
- console.log("鑳芥簮璁惧鍒嗘瀽鐜舰鍥炬暟鎹暟鎹�", e);
- });
- },
-
- // 鍒嗙被鑳芥簮缁熻鏁版嵁
- getEnergyStatisticData() {
- getEnergyStatistic(this.dateType)
- .then(res => {
- if (res.code === 200) {
- this.energyStatistic = res.data;
- }
- })
- .catch(e => {
- console.log("鍒嗙被鑳芥簮缁熻鏁版嵁", e);
- });
- },
-
- // 鑳芥簮鐩戞祴鏌辩姸鍥炬暟鎹�
- getEnergyMonitoring(energyType) {
- getHomeEnergyMonitoring(this.dateType, energyType)
- .then(res => {
- if (res.code === 200) {
- let chartData = res.data.chartData.sort((a, b) => {
- return a.date - b.date;
- });
- let nameList = Array.from(
- new Set(
- chartData.map(item => {
- return item.name;
- })
- )
- ).sort((a, b) => {
- return new Date(b.date).getTime() - new Date(a.date).getTime();
- });
- // 琛ュ叏鏁版嵁
- let oneArr = chartData.filter(item => {
- return item.name === nameList[0];
- });
- let twoArr = chartData.filter(item => {
- return item.name === nameList[1];
- });
-
- let maxDate =
- this.dateType === "DAY"
- ? 23
- : Math.max(
- ...chartData.map(item => {
- return item.date;
- })
- );
- oneArr.forEach(element => {
- if (this.dateType === "DAY") {
- let hour = new Date("2022 " + element.date).getHours() + "鏃�";
- element.date = hour;
- } else {
- element.date =
- this.dateType === "MONTH"
- ? element.date + "鏃�"
- : element.date + "鏈�";
- }
- });
- twoArr.forEach(element => {
- if (this.dateType === "DAY") {
- let hour = new Date("2022 " + element.date).getHours() + "鏃�";
- element.date = hour;
- } else {
- element.date =
- this.dateType === "MONTH"
- ? element.date + "鏃�"
- : element.date + "鏈�";
- }
- });
- if (oneArr.length < maxDate) {
- if (this.dateType === "DAY") {
- for (let d = oneArr.length; d < maxDate + 1; d++) {
- oneArr.push({
- date: d + "鏃�",
- name: nameList[0],
- count: 0,
- value: null
- });
- }
- } else {
- console.log("one111111111");
- for (let d = oneArr.length + 1; d < maxDate + 1; d++) {
- oneArr.push({
- date: this.dateType === "MONTH" ? d + "鏃�" : d + "鏈�",
- name: nameList[0],
- count: 0,
- value: null
- });
- }
- }
- }
- if (twoArr.length < maxDate) {
- if (this.dateType === "DAY") {
- for (let d = twoArr.length; d < maxDate + 1; d++) {
- twoArr.push({
- date: d + "鏃�",
- name: nameList[1],
- count: 0,
- value: 0
- });
- }
- } else {
- for (let d = twoArr.length + 1; d < maxDate + 1; d++) {
- twoArr.push({
- date: this.dateType === "MONTH" ? d + "鏃�" : d + "鏈�",
- name: nameList[1],
- count: 0,
- value: 0
- });
- }
- }
- }
-
- let chartData2 = oneArr
- .concat(twoArr)
- .map(item => {
- return {
- ...item,
- len: item.date,
- count: item.value === "--" ? null : +item.value
- };
- })
- .sort((a, b) => {
- return new Date(a.name).getTime() - new Date(b.name).getTime();
- });
- this.data = chartData2;
- if (energyType == "water") {
- this.monitoringWaterUnit = res.data.unit;
- this.chartDataWaterObj = {
- expectedData: twoArr.map(one => {
- return one.value;
- }),
- actualData: oneArr.map(e => {
- return e.value;
- }),
- xData: oneArr.map(one => {
- return one.date;
- })
- };
- } else if (energyType == "electric") {
- this.monitoringUnit = res.data.unit;
- this.chartDataObj = {
- expectedData: twoArr.map(one => {
- return one.value;
- }),
- actualData: oneArr.map(e => {
- return e.value;
- }),
- xData: oneArr.map(one => {
- return one.date;
- })
- };
- }
- }
- })
- .catch(e => {
- console.log("鑳芥簮鐩戞祴鏌辩姸鍥炬暟鎹�", e);
- });
- },
-
- dateClickHandle(type) {
- this.dateType = type;
- this.isClick = !this.isClick;
- this.getSummationData();
- this.getEnergyConsumptionRatioData();
- this.getEnergyCostRatioData();
- this.getEnergyStatisticData();
- this.getEnergyMonitoring();
- this.getCarbonEmission();
- },
-
- onPowerTypeChange(e) {
- this.energyType = e;
- for (let i = 0; i < this.powerTypeOptions.length; i++) {
- if (this.energyType === this.powerTypeOptions[i].value) {
- this.energyTypeName = this.powerTypeOptions[i].label;
- this.monitoringUnit = this.powerTypeOptions[i].energyUnit || "";
- }
- }
- this.getEnergyMonitoring();
- }
- }
-};
-</script>
-
<style lang="scss" scoped>
-.home-show {
- overflow: hidden;
- overflow-y: scroll;
- // height: calc(100vh - 88px);
- .home-head {
- display: flex;
- align-items: center;
-
- .home-select-label {
- margin-right: 10px;
- color: #fff;
- font-weight: 600;
- }
-
- .select-month {
- margin: 0 8px;
- }
- }
- .double-data-show-content {
- display: flex;
- align-items: center;
- // border-bottom: 1px solid #e9e9e9;
- // padding: 23px 0 24px 40px;
- .el-col {
- padding: 23px 0 24px 10px;
- }
-
- & > div {
- display: flex;
- align-items: center;
- }
-
- img {
- width: 20px;
- height: 20px;
- }
-
- .left-title-style {
- display: flex;
- align-items: center;
- margin-left: 10px;
- // border-right: 1px solid #e9e9e9;
-
- .unit {
- font-size: 22px;
- color: #fff;
- margin-top: 4px;
- }
- }
- }
-
- .chart-wrapper {
- padding: 10px 24px;
- position: relative;
- .chart-left-unit {
- position: absolute;
- top: 16px;
- left: 24px;
- color: #fff;
- font-size: 18px;
- }
-
- .line-content {
- margin: 4px 0 0 0;
- height: 300px;
- }
- }
-
- .data-indicator-overview {
- ::v-deep .el-card__body {
- padding: 0 !important;
- }
-
- .home-body-left {
- width: 66.3%;
- height: 100%;
-
- .body-left-title {
- margin: 0 16px 0px 0;
- }
-
- .left-line-style {
- padding: 24px;
- color: #fff;
-
- .radio-list {
- width: 122px;
-
- .radio-list-content {
- margin: 16px 12px 0 0;
- background: #f3f7f7;
- padding: 21px 9px;
- border-radius: 2px;
- overflow: auto;
- height: 360px;
- }
- }
-
- .right-line {
- width: calc(100% - 122px);
- position: relative;
-
- .chart-left-unit {
- position: absolute;
- top: 16px;
- left: 0;
- color: #fff;
- }
-
- .line-content {
- margin: 12px 0 0 0;
- height: 300px;
- }
- }
- }
-
- .left-bottom-type {
- margin: 16px 16px 16px 0;
-
- .card-list {
- display: flex;
- flex-wrap: wrap;
- height: 100%;
-
- .classify-energy {
- border-left: 1px solid #e9e9e9;
- flex: 1;
- display: flex;
- align-items: center;
- padding: 0 0 0 24px;
-
- &:first-child {
- border-left: none;
- }
-
- .img-list {
- display: flex;
- align-items: center;
- img {
- width: 20px;
- height: 20px;
- }
-
- .text-describe {
- display: flex;
- align-items: center;
- margin-left: 18px;
-
- .number {
- font-size: 24px;
- color: #fff;
- }
- }
- }
- }
- }
- }
- }
-
- .home-body-right {
- width: 33.7%;
- height: 100%;
-
- .right-first-card-title {
- margin: 0 0 16px 0;
-
- .first-chat {
- margin: 10px 0 0 0;
- height: 300px;
- }
- }
-
- .second-card-title {
- // padding-top: 16px;
-
- .second-chat {
- margin: 10px 0 0 0;
- height: 290px;
- }
-
- .bottom-description-list {
- display: flex;
- padding: 0 23px 16px 10px;
- height: 106px;
- align-items: center;
-
- .total {
- border-right: 1px solid #e9e9e9;
- padding-left: 10px;
- min-width: 180px;
- max-width: 180px;
-
- .energy-cost-sum {
- font-size: 24px;
- color: #fff;
- }
- }
-
- .legend {
- padding: 6px 0 0 20px;
-
- .legend-list {
- display: flex;
- // width: 280px;
- flex-wrap: wrap;
- }
- }
- }
- }
- }
- }
-
- .power-cost {
- width: 8px;
- height: 8px;
- border-radius: 50%;
- display: inline-block;
- margin-right: 4px;
+// http://yunlu.com.cn/template/pc/skin/images/index/u21.png
+.dashboard-editor-container {
+ text-align: center;
+ .title {
+ color: #999;
+ font-size: 30px;
+ font-weight: 600;
+ margin: 40px auto 50px;
}
}
</style>
diff --git a/energy_management_ui/src/views/index_bak.vue b/energy_management_ui/src/views/index_bak.vue
index 9a292dd..d8d3914 100644
--- a/energy_management_ui/src/views/index_bak.vue
+++ b/energy_management_ui/src/views/index_bak.vue
@@ -1,146 +1,767 @@
<template>
- <div class="dashboard-editor-container">
- <panel-group @handleSetLineChartData="handleSetLineChartData" />
-
- <el-row style="padding:16px 16px 0;margin-bottom:32px;">
- <line-chart :chart-data="lineChartData" />
- </el-row>
-
- <el-row :gutter="32">
- <el-col :xs="24" :sm="24" :lg="8">
- <div class="chart-wrapper">
- <raddar-chart />
+ <div class="home-show">
+ <!-- <el-card :bordered="false">
+ <div class="home-head">
+ <div class="home-select-label">鏃ユ湡鍒囨崲</div>
+ <div>
+ <el-button
+ :type="dateType === 'DAY' ? 'primary' : ''"
+ @click="dateClickHandle('DAY')"
+ >鏃�</el-button
+ >
+ <el-button
+ :type="dateType === 'MONTH' ? 'primary' : ''"
+ @click="dateClickHandle('MONTH')"
+ class="select-month"
+ >鏈�
+ </el-button>
+ <el-button
+ :type="dateType === 'YEAR' ? 'primary' : ''"
+ @click="dateClickHandle('YEAR')"
+ >骞�</el-button
+ >
</div>
+ </div>
+ </el-card> -->
+ <el-card
+ class="body-left-title"
+ :bordered="false"
+ style="margin-bottom: 12px;"
+ >
+ <div slot="header" class="clearfix">
+ <span>褰撴棩鍙屾帶鏁版嵁鎸囨爣鎬昏</span>
+ </div>
+ <el-row class="double-data-show-content">
+ <el-col :span="5" class="total">
+ <img alt="" src="~@/assets/home/zonghe.svg" />
+ <div class="left-title-style">
+ <div>
+ <div>鍏ㄥ巶缁煎悎鑳借��</div>
+ <div class="unit">{{ summation }} tce</div>
+ </div>
+ </div>
+ </el-col>
+ <el-col
+ :span="5"
+ class="co2"
+ v-for="(item, index) in energyStatistic"
+ :key="index"
+ style="border-left: 1px solid #999;"
+ >
+ <img
+ v-if="item.item.includes('鐢�')"
+ src="~@/assets/home/haodian.svg"
+ alt=""
+ />
+ <img
+ v-if="item.item.includes('姘�')"
+ src="~@/assets/home/haoshui.svg"
+ alt=""
+ />
+ <img
+ v-if="item.item.includes('姘�')"
+ src="~@/assets/home/haoqi.svg"
+ alt=""
+ />
+ <img
+ v-if="item.item.includes('钂告苯')"
+ src="~@/assets/home/haozhengqi.svg"
+ alt=""
+ />
+ <div class="left-title-style">
+ <div>
+ <div>
+ 鑰梴{
+ item.item.indexOf("澶╃劧") !== -1
+ ? item.item.replace("澶╃劧", "")
+ : item.item
+ }}閲�
+ {{ item.unit ? `锛�${item.unit}锛塦 : "" }}
+ </div>
+ <div class="unit">
+ {{ item.count || 0 }}
+ </div>
+ </div>
+ </div>
+ </el-col>
+ <el-col :span="5" class="total" style="border-left: 1px solid #999;">
+ <img alt="" src="~@/assets/home/wen.png" />
+ <div class="left-title-style">
+ <div>
+ <div>瀹ゅ娓╁害</div>
+ <div class="unit">{{ temperature }}</div>
+ </div>
+ </div>
+ </el-col>
+ <el-col :span="5" class="total" style="border-left: 1px solid #999;">
+ <img alt="" src="~@/assets/home/shi.png" />
+ <div class="left-title-style">
+ <div>
+ <div>瀹ゅ婀垮害</div>
+ <div class="unit">{{ humidity }}</div>
+ </div>
+ </div>
+ </el-col>
+ </el-row>
+ </el-card>
+ <el-row type="flex" class="data-indicator-overview">
+ <el-col class="home-body-left">
+ <el-card :bordered="false" class="body-left-title">
+ <div slot="header" class="clearfix">
+ <span>鑳芥簮瀹炴椂鐩戞祴</span>
+ </div>
+ <div class="chart-wrapper">
+ <span class="chart-left-unit">{{
+ `鐢�/鍗曚綅${monitoringUnit}`
+ }}</span>
+ <BarChart class="line-content" :chartData="chartDataObj" />
+ </div>
+ <div class="chart-wrapper" style="border-top: 1px solid #999">
+ <span class="chart-left-unit">{{
+ `姘�/鍗曚綅${monitoringWaterUnit}`
+ }}</span>
+ <BarChart class="line-content" :chartData="chartDataWaterObj" />
+ </div>
+ </el-card>
+ <!-- <div class="left-line-style">
+ <div>鑳芥簮瀹炴椂鐩戞祴</div>
+ <el-row type="flex" justify="space-between">
+ <el-col class="radio-list">
+ <div class="radio-list-content">
+ <el-radio-group
+ v-model="energyType"
+ @change="onPowerTypeChange"
+ >
+ <el-radio
+ :style="radioStyle"
+ :label="item.value"
+ v-for="item in powerTypeOptions"
+ :key="item.value"
+ >
+ {{ item.label }}
+ </el-radio>
+ </el-radio-group>
+ </div>
+ </el-col>
+ </el-row>
+ </div> -->
</el-col>
- <el-col :xs="24" :sm="24" :lg="8">
- <div class="chart-wrapper">
- <pie-chart />
- </div>
- </el-col>
- <el-col :xs="24" :sm="24" :lg="8">
- <div class="chart-wrapper">
- <bar-chart />
- </div>
+ <el-col class="home-body-right">
+ <el-card :bordered="false" class="right-first-card-title">
+ <div slot="header" class="clearfix">
+ <span>缁煎悎鑳借�楀崰姣斿垎鏋�</span>
+ </div>
+ <PieChart
+ class="first-chat"
+ :chartData="firstPieData"
+ pieTitle="缁煎悎鑳借�楀崰姣斿垎鏋�"
+ />
+ </el-card>
+ <el-card :bordered="false" class="second-card-title">
+ <div slot="header" class="clearfix">
+ <span>鑳借�楄澶囧崰姣�</span>
+ </div>
+ <PieChart
+ class="second-chat"
+ :chartData="secondPieData"
+ pieTitle="鑳借�楄澶囧崰姣�"
+ height="280px"
+ />
+ </el-card>
</el-col>
</el-row>
-
- <!--<!–瀹炴椂–>-->
- <!--<div class="live">-->
- <!--<div class="live_content">瀹炴椂鎶ヨ</div>-->
- <!--<div class="live_number">35</div>-->
- <!--</div>-->
</div>
</template>
<script>
-import PanelGroup from "./dashboard/PanelGroup";
-import LineChart from "./dashboard/LineChart";
-import RaddarChart from "./dashboard/RaddarChart";
+import {
+ getEnergyConsumptionRatio,
+ getEnergyConsumptionSummation,
+ getEnergyStatistic,
+ getHomeEnergyMonitoring,
+ listEnergyType,
+ getHomeEnergyUnitConsumptionRatio,
+ getHomeOutdoorTemperature
+} from "@/api/home/home";
+import mixins from "@/layout/mixin/getHeight";
import PieChart from "./dashboard/PieChart";
+import LineChart from "./dashboard/LineChart";
import BarChart from "./dashboard/BarChart";
-const lineChartData = {
- newVisitis: {
- expectedData: [100, 120, 161, 134, 105, 160, 165],
- actualData: [120, 82, 91, 154, 162, 140, 145]
- },
- messages: {
- expectedData: [200, 192, 120, 144, 160, 130, 140],
- actualData: [180, 160, 151, 106, 145, 150, 130]
- },
- purchases: {
- expectedData: [80, 100, 121, 104, 105, 90, 100],
- actualData: [120, 90, 100, 138, 142, 130, 130]
- },
- shoppings: {
- expectedData: [130, 140, 141, 142, 145, 150, 160],
- actualData: [120, 82, 91, 154, 162, 140, 130]
- }
-};
-
export default {
- name: "Index",
components: {
- PanelGroup,
LineChart,
- RaddarChart,
- PieChart,
- BarChart
+ BarChart,
+ PieChart
},
+ mixins: [mixins],
+
data() {
return {
- lineChartData: lineChartData.newVisitis
+ firstPieData: [],
+ secondPieData: [],
+ monitoringUnit: "kWh",
+ chartDataObj: {},
+ monitoringWaterUnit: "m鲁",
+ chartDataWaterObj: {},
+ energyType: "electric",
+ energyTypeName: "鐢�",
+ dateType: "DAY",
+ powerTypeOptions: [
+ {
+ label: "鐢�",
+ value: "electric",
+ energyUnit: "kWh"
+ },
+ { label: "姘�", value: "Water", energyUnit: "m鲁" },
+ { label: "钂告苯", value: "Steam", energyUnit: "鍚�" },
+ { label: "澶╃劧姘�", value: "Gas", energyUnit: "Nm鲁" }
+ ],
+ isClick: true,
+ radioStyle: {
+ display: "block",
+ height: "30px",
+ lineHeight: "30px"
+ },
+ chart1: null,
+ chart2: null,
+ data: [],
+ pieDta: [],
+ pieDtatwo: [],
+ energyCostSum: 0,
+ energyStatistic: [],
+ summation: 10776,
+ totalCo2Emissions: 0,
+ humidity: "",
+ temperature: "",
+ timer: null,
+ timer30: null
};
},
+ mounted() {
+ this.getEnergyType();
+ this.getSummationData();
+ this.getEnergyConsumptionRatioData();
+ this.getEnergyStatisticData();
+ this.getHomeEnergyUnitConsumptionRatioData();
+
+ const ele = document.createEvent("Event");
+ ele.initEvent("resize", true, true);
+ window.dispatchEvent(ele);
+
+ clearInterval(this.timer);
+ clearInterval(this.timer30);
+ this.getHomeOutdoorTemperatureData();
+ // this.timer = setInterval(() => {
+ // this.getHomeOutdoorTemperatureData();
+ // }, 12000);
+ this.timer30 = setInterval(() => {
+ // this.getEnergyType();
+ this.getSummationData();
+ this.getEnergyConsumptionRatioData();
+ this.getEnergyStatisticData();
+ this.getHomeEnergyUnitConsumptionRatioData();
+ }, 180000);
+ },
+ beforeDestroy() {
+ clearInterval(this.timer);
+ clearInterval(this.timer30);
+ },
methods: {
- handleSetLineChartData(type) {
- this.lineChartData = lineChartData[type];
+ getHomeOutdoorTemperatureData() {
+ getHomeOutdoorTemperature().then(res => {
+ this.temperature = res.data.temperature;
+ this.humidity = res.data.humidity;
+ });
+ },
+ getEnergyType() {
+ listEnergyType()
+ .then(res => {
+ if (res.code === 200) {
+ this.powerTypeOptions =
+ res.data.map(item => ({
+ ...item,
+ value: item.energy,
+ label: item.energyName
+ })) || [];
+ this.energyType =
+ this.powerTypeOptions.length > 0
+ ? this.powerTypeOptions[0].value
+ : "";
+ this.energyTypeName =
+ this.powerTypeOptions.length > 0
+ ? this.powerTypeOptions[0].label
+ : "";
+ for (let i = 0; i < this.powerTypeOptions.length; i++) {
+ this.getEnergyMonitoring(this.powerTypeOptions[i].value);
+ }
+ }
+ })
+ .catch(e => {
+ console.log("鑾峰彇鑳芥簮绫诲瀷鍒楄〃", e);
+ });
+ },
+ // 纰虫帓閲忔牳绠楁煡璇�
+ getCarbonEmission() {
+ getHomeCarbonEmission(this.dateType).then(res => {
+ this.totalCo2Emissions = res.result.totalCo2Emissions;
+ });
+ },
+ // 鑾峰彇鍏ㄥ巶缁煎悎鑳借��
+ getSummationData() {
+ getEnergyConsumptionSummation(this.dateType)
+ .then(res => {
+ if (res.code === 200) {
+ this.summation = res.data;
+ }
+ })
+ .catch(e => {
+ console.log("鑾峰彇鍏ㄥ巶缁煎悎鑳借��", e);
+ });
+ },
+ // 鑾峰彇缁煎悎鑳借�楀崰姣旂幆褰㈠浘鍒嗘瀽鏁版嵁
+ getEnergyConsumptionRatioData() {
+ getEnergyConsumptionRatio(this.dateType)
+ .then(res => {
+ if (res.code === 200) {
+ this.firstPieData = res.data.map(item => {
+ return {
+ ...item,
+ name: item.item,
+ value: item.count || 0
+ // unit: filterUint
+ };
+ });
+ }
+ })
+ .catch(e => {
+ console.log("鑾峰彇缁煎悎鑳借�楀崰姣旂幆褰㈠浘鍒嗘瀽鏁版嵁", e);
+ });
+ },
+
+ // 鑳芥簮璁惧鐜舰鍥炬暟鎹暟鎹�
+ getHomeEnergyUnitConsumptionRatioData() {
+ getHomeEnergyUnitConsumptionRatio(this.dateType)
+ .then(res => {
+ if (res.code === 200) {
+ this.secondPieData = res.data.map(item => {
+ return {
+ ...item,
+ name: item.name,
+ value: item.value || 0
+ // unit: filterUint
+ };
+ });
+ }
+ })
+ .catch(e => {
+ console.log("鑳芥簮璁惧鍒嗘瀽鐜舰鍥炬暟鎹暟鎹�", e);
+ });
+ },
+
+ // 鍒嗙被鑳芥簮缁熻鏁版嵁
+ getEnergyStatisticData() {
+ getEnergyStatistic(this.dateType)
+ .then(res => {
+ if (res.code === 200) {
+ this.energyStatistic = res.data;
+ }
+ })
+ .catch(e => {
+ console.log("鍒嗙被鑳芥簮缁熻鏁版嵁", e);
+ });
+ },
+
+ // 鑳芥簮鐩戞祴鏌辩姸鍥炬暟鎹�
+ getEnergyMonitoring(energyType) {
+ getHomeEnergyMonitoring(this.dateType, energyType)
+ .then(res => {
+ if (res.code === 200) {
+ let chartData = res.data.chartData.sort((a, b) => {
+ return a.date - b.date;
+ });
+ let nameList = Array.from(
+ new Set(
+ chartData.map(item => {
+ return item.name;
+ })
+ )
+ ).sort((a, b) => {
+ return new Date(b.date).getTime() - new Date(a.date).getTime();
+ });
+ // 琛ュ叏鏁版嵁
+ let oneArr = chartData.filter(item => {
+ return item.name === nameList[0];
+ });
+ let twoArr = chartData.filter(item => {
+ return item.name === nameList[1];
+ });
+
+ let maxDate =
+ this.dateType === "DAY"
+ ? 23
+ : Math.max(
+ ...chartData.map(item => {
+ return item.date;
+ })
+ );
+ oneArr.forEach(element => {
+ if (this.dateType === "DAY") {
+ let hour = new Date("2022 " + element.date).getHours() + "鏃�";
+ element.date = hour;
+ } else {
+ element.date =
+ this.dateType === "MONTH"
+ ? element.date + "鏃�"
+ : element.date + "鏈�";
+ }
+ });
+ twoArr.forEach(element => {
+ if (this.dateType === "DAY") {
+ let hour = new Date("2022 " + element.date).getHours() + "鏃�";
+ element.date = hour;
+ } else {
+ element.date =
+ this.dateType === "MONTH"
+ ? element.date + "鏃�"
+ : element.date + "鏈�";
+ }
+ });
+ if (oneArr.length < maxDate) {
+ if (this.dateType === "DAY") {
+ for (let d = oneArr.length; d < maxDate + 1; d++) {
+ oneArr.push({
+ date: d + "鏃�",
+ name: nameList[0],
+ count: 0,
+ value: null
+ });
+ }
+ } else {
+ console.log("one111111111");
+ for (let d = oneArr.length + 1; d < maxDate + 1; d++) {
+ oneArr.push({
+ date: this.dateType === "MONTH" ? d + "鏃�" : d + "鏈�",
+ name: nameList[0],
+ count: 0,
+ value: null
+ });
+ }
+ }
+ }
+ if (twoArr.length < maxDate) {
+ if (this.dateType === "DAY") {
+ for (let d = twoArr.length; d < maxDate + 1; d++) {
+ twoArr.push({
+ date: d + "鏃�",
+ name: nameList[1],
+ count: 0,
+ value: 0
+ });
+ }
+ } else {
+ for (let d = twoArr.length + 1; d < maxDate + 1; d++) {
+ twoArr.push({
+ date: this.dateType === "MONTH" ? d + "鏃�" : d + "鏈�",
+ name: nameList[1],
+ count: 0,
+ value: 0
+ });
+ }
+ }
+ }
+
+ let chartData2 = oneArr
+ .concat(twoArr)
+ .map(item => {
+ return {
+ ...item,
+ len: item.date,
+ count: item.value === "--" ? null : +item.value
+ };
+ })
+ .sort((a, b) => {
+ return new Date(a.name).getTime() - new Date(b.name).getTime();
+ });
+ this.data = chartData2;
+ if (energyType == "water") {
+ this.monitoringWaterUnit = res.data.unit;
+ this.chartDataWaterObj = {
+ expectedData: twoArr.map(one => {
+ return one.value;
+ }),
+ actualData: oneArr.map(e => {
+ return e.value;
+ }),
+ xData: oneArr.map(one => {
+ return one.date;
+ })
+ };
+ } else if (energyType == "electric") {
+ this.monitoringUnit = res.data.unit;
+ this.chartDataObj = {
+ expectedData: twoArr.map(one => {
+ return one.value;
+ }),
+ actualData: oneArr.map(e => {
+ return e.value;
+ }),
+ xData: oneArr.map(one => {
+ return one.date;
+ })
+ };
+ }
+ }
+ })
+ .catch(e => {
+ console.log("鑳芥簮鐩戞祴鏌辩姸鍥炬暟鎹�", e);
+ });
+ },
+
+ dateClickHandle(type) {
+ this.dateType = type;
+ this.isClick = !this.isClick;
+ this.getSummationData();
+ this.getEnergyConsumptionRatioData();
+ this.getEnergyCostRatioData();
+ this.getEnergyStatisticData();
+ this.getEnergyMonitoring();
+ this.getCarbonEmission();
+ },
+
+ onPowerTypeChange(e) {
+ this.energyType = e;
+ for (let i = 0; i < this.powerTypeOptions.length; i++) {
+ if (this.energyType === this.powerTypeOptions[i].value) {
+ this.energyTypeName = this.powerTypeOptions[i].label;
+ this.monitoringUnit = this.powerTypeOptions[i].energyUnit || "";
+ }
+ }
+ this.getEnergyMonitoring();
}
}
};
</script>
<style lang="scss" scoped>
-.dashboard-editor-container {
- padding: 32px;
- position: relative;
+.home-show {
+ overflow: hidden;
+ overflow-y: scroll;
+ // height: calc(100vh - 88px);
+ .home-head {
+ display: flex;
+ align-items: center;
+
+ .home-select-label {
+ margin-right: 10px;
+ color: #fff;
+ font-weight: 600;
+ }
+
+ .select-month {
+ margin: 0 8px;
+ }
+ }
+ .double-data-show-content {
+ display: flex;
+ align-items: center;
+ // border-bottom: 1px solid #e9e9e9;
+ // padding: 23px 0 24px 40px;
+ .el-col {
+ padding: 23px 0 24px 10px;
+ }
+
+ & > div {
+ display: flex;
+ align-items: center;
+ }
+
+ img {
+ width: 20px;
+ height: 20px;
+ }
+
+ .left-title-style {
+ display: flex;
+ align-items: center;
+ margin-left: 10px;
+ // border-right: 1px solid #e9e9e9;
+
+ .unit {
+ font-size: 22px;
+ color: #fff;
+ margin-top: 4px;
+ }
+ }
+ }
.chart-wrapper {
- padding: 16px 16px 0;
- margin-bottom: 32px;
- }
-}
+ padding: 10px 24px;
+ position: relative;
+ .chart-left-unit {
+ position: absolute;
+ top: 16px;
+ left: 24px;
+ color: #fff;
+ font-size: 18px;
+ }
-@media (max-width: 1024px) {
- .chart-wrapper {
- padding: 8px;
+ .line-content {
+ margin: 4px 0 0 0;
+ height: 300px;
+ }
}
-}
-.live {
- position: fixed;
- right: 0px;
- top: 70px;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- width: 100px;
- height: 60px;
- background-color: red;
- animation: fade 600ms infinite;
- -webkit-animation: fade 600ms infinite;
-}
-.live_content {
- font-size: 18px;
- color: white;
- font-weight: bold;
-}
-.live_number {
- font-size: 32px;
- color: white;
- font-weight: bolder;
-}
-@keyframes fade {
- from {
- opacity: 1;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1;
- }
-}
-@-webkit-keyframes fade {
- from {
- opacity: 1;
+ .data-indicator-overview {
+ ::v-deep .el-card__body {
+ padding: 0 !important;
+ }
+
+ .home-body-left {
+ width: 66.3%;
+ height: 100%;
+
+ .body-left-title {
+ margin: 0 16px 0px 0;
+ }
+
+ .left-line-style {
+ padding: 24px;
+ color: #fff;
+
+ .radio-list {
+ width: 122px;
+
+ .radio-list-content {
+ margin: 16px 12px 0 0;
+ background: #f3f7f7;
+ padding: 21px 9px;
+ border-radius: 2px;
+ overflow: auto;
+ height: 360px;
+ }
+ }
+
+ .right-line {
+ width: calc(100% - 122px);
+ position: relative;
+
+ .chart-left-unit {
+ position: absolute;
+ top: 16px;
+ left: 0;
+ color: #fff;
+ }
+
+ .line-content {
+ margin: 12px 0 0 0;
+ height: 300px;
+ }
+ }
+ }
+
+ .left-bottom-type {
+ margin: 16px 16px 16px 0;
+
+ .card-list {
+ display: flex;
+ flex-wrap: wrap;
+ height: 100%;
+
+ .classify-energy {
+ border-left: 1px solid #e9e9e9;
+ flex: 1;
+ display: flex;
+ align-items: center;
+ padding: 0 0 0 24px;
+
+ &:first-child {
+ border-left: none;
+ }
+
+ .img-list {
+ display: flex;
+ align-items: center;
+ img {
+ width: 20px;
+ height: 20px;
+ }
+
+ .text-describe {
+ display: flex;
+ align-items: center;
+ margin-left: 18px;
+
+ .number {
+ font-size: 24px;
+ color: #fff;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .home-body-right {
+ width: 33.7%;
+ height: 100%;
+
+ .right-first-card-title {
+ margin: 0 0 16px 0;
+
+ .first-chat {
+ margin: 10px 0 0 0;
+ height: 300px;
+ }
+ }
+
+ .second-card-title {
+ // padding-top: 16px;
+
+ .second-chat {
+ margin: 10px 0 0 0;
+ height: 290px;
+ }
+
+ .bottom-description-list {
+ display: flex;
+ padding: 0 23px 16px 10px;
+ height: 106px;
+ align-items: center;
+
+ .total {
+ border-right: 1px solid #e9e9e9;
+ padding-left: 10px;
+ min-width: 180px;
+ max-width: 180px;
+
+ .energy-cost-sum {
+ font-size: 24px;
+ color: #fff;
+ }
+ }
+
+ .legend {
+ padding: 6px 0 0 20px;
+
+ .legend-list {
+ display: flex;
+ // width: 280px;
+ flex-wrap: wrap;
+ }
+ }
+ }
+ }
+ }
}
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1;
+
+ .power-cost {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ display: inline-block;
+ margin-right: 4px;
}
}
</style>
diff --git a/energy_management_ui/src/views/index_dev.vue b/energy_management_ui/src/views/index_dev.vue
deleted file mode 100644
index 949ae94..0000000
--- a/energy_management_ui/src/views/index_dev.vue
+++ /dev/null
@@ -1,10 +0,0 @@
-<template>
- <div class="app-container" style="padding: 0;margin: 10px;">
- <div
- class="dashboard-editor-container"
- style="width: auto;height: auto;max-width: 100%;max-height: 100%;display: block;"
- >
- <!-- <img src="@/assets/image/index.jpg" style="width: 100%;height: 100%"> -->
- </div>
- </div>
-</template>
diff --git a/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/BarChart.vue b/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/BarChart.vue
index 7198e0f..a157885 100644
--- a/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/BarChart.vue
+++ b/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/BarChart.vue
@@ -1,112 +1,119 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- left: 10,
- right: 10,
- bottom: 20,
- top: 40,
- containLabel: true
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 20,
+ top: 40,
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/LineChart.vue b/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/LineChart.vue
index 44964fd..be1b83d 100644
--- a/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/LineChart.vue
+++ b/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -96,25 +96,27 @@
legend: {
data: []
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/index.vue b/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/index.vue
index c433837..397c0f1 100644
--- a/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/index.vue
+++ b/energy_management_ui/src/views/keyEquipment/dailykeyEquipment/index.vue
@@ -1,11 +1,21 @@
<template>
<div>
<basic-container>
- <el-form :model="queryParams" ref="queryForm" label-width="68px" class="special-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ label-width="68px"
+ class="special-form"
+ >
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="閲嶇偣璁惧">
- <el-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨閲嶇偣璁惧" size="small" style="width: 100%">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨閲嶇偣璁惧"
+ size="small"
+ style="width: 100%"
+ >
<el-option
v-for="dict in indexCategoryOptions"
:key="dict.id"
@@ -17,108 +27,183 @@
</el-col>
<el-col :span="6">
<el-form-item label="缁熻鍖洪棿" prop="dataTime">
- <el-date-picker clearable size="small" style="width: 100%"
- v-model="queryParams.dataTime"
- :type="dateTypes"
- :clearable="false"
- :value-format="valueFormat"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 100%"
+ v-model="queryParams.dataTime"
+ :type="dateTypes"
+ :clearable="false"
+ :value-format="valueFormat"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item class="operation">
- <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-col>
</el-row>
</el-form>
</basic-container>
<basic-container :bodyStyle="bodyStyle" style="margin-top: 16px">
- <el-table :data="energyList" border style="width: 100%;" class="tableList">
+ <el-table
+ :data="energyList"
+ border
+ style="width: 100%;"
+ class="tableList"
+ >
<el-table-column fixed label="鏇茬嚎閫夋嫨">
<template slot-scope="scope">
- <el-button icon="el-icon-search" circle @click="selectChange(scope.row)"
- style="font-size: 10px"></el-button>
+ <el-button
+ icon="el-icon-search"
+ circle
+ @click="selectChange(scope.row)"
+ style="font-size: 10px"
+ ></el-button>
</template>
</el-table-column>
- <el-table-column fixed prop="indexName" align="center" label="鑳芥簮鍚嶇О" min-width="240px"></el-table-column>
+ <el-table-column
+ fixed
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鎸囨爣鍚嶇О"
+ min-width="240px"
+ ></el-table-column>
<el-table-column label="0鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value0) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value0)
+ }}</template>
</el-table-column>
<el-table-column label="1鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value1) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value1)
+ }}</template>
</el-table-column>
<el-table-column label="2鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value2) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value2)
+ }}</template>
</el-table-column>
<el-table-column label="3鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value3) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value3)
+ }}</template>
</el-table-column>
<el-table-column label="4鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value4) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value4)
+ }}</template>
</el-table-column>
<el-table-column label="5鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value5) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value5)
+ }}</template>
</el-table-column>
<el-table-column label="6鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value6) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value6)
+ }}</template>
</el-table-column>
<el-table-column label="7鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value7) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value7)
+ }}</template>
</el-table-column>
<el-table-column label="8鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value8) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value8)
+ }}</template>
</el-table-column>
<el-table-column label="9鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value9) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value9)
+ }}</template>
</el-table-column>
<el-table-column label="20鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value20) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value20)
+ }}</template>
</el-table-column>
<el-table-column label="11鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value11) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value11)
+ }}</template>
</el-table-column>
<el-table-column label="12鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value12) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value12)
+ }}</template>
</el-table-column>
<el-table-column label="13鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value13) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value13)
+ }}</template>
</el-table-column>
<el-table-column label="14鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value14) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value14)
+ }}</template>
</el-table-column>
<el-table-column label="15鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value15) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value15)
+ }}</template>
</el-table-column>
<el-table-column label="16鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value16) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value16)
+ }}</template>
</el-table-column>
<el-table-column label="17鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value17) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value17)
+ }}</template>
</el-table-column>
<el-table-column label="18鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value18) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value18)
+ }}</template>
</el-table-column>
<el-table-column label="19鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value19) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value19)
+ }}</template>
</el-table-column>
<el-table-column label="20鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value20) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value20)
+ }}</template>
</el-table-column>
<el-table-column label="21鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value21) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value21)
+ }}</template>
</el-table-column>
<el-table-column label="22鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value22) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value22)
+ }}</template>
</el-table-column>
<el-table-column label="23鏃�" align="center" min-width="140px">
- <template slot-scope="scope">{{ numFilter(scope.row.value23) }}</template>
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value23)
+ }}</template>
</el-table-column>
</el-table>
<pagination
- v-show="total>0"
+ v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@@ -127,12 +212,12 @@
<el-row :gutter="32" style="margin:30px 0">
<el-col :xs="24" :sm="24" :lg="12">
<div class="chart-wrapper">
- <line-chart ref="LineChart" :chart-data="lineChartData"/>
+ <line-chart ref="LineChart" :chart-data="lineChartData" />
</div>
</el-col>
<el-col :xs="24" :sm="24" :lg="12">
<div class="chart-wrapper">
- <bar-chart ref="BarChart" :chart-data="lineChartData"/>
+ <bar-chart ref="BarChart" :chart-data="lineChartData" />
</div>
</el-col>
</el-row>
@@ -141,8 +226,12 @@
</template>
<script>
-import {getDataList, getlistChart, getPointFacility} from "@/api/keyEquipment/dailykeyEquipment/dailykeyEquipment";
-import LineChart from './LineChart'
+import {
+ getDataList,
+ getlistChart,
+ getPointFacility
+} from "@/api/keyEquipment/dailykeyEquipment/dailykeyEquipment";
+import LineChart from "./LineChart";
import BarChart from "./BarChart";
import mixins from "@/layout/mixin/getHeight";
@@ -178,12 +267,12 @@
dataTime: undefined,
timeType: "HOUR",
indexType: undefined,
- indexStorageId: undefined,
+ indexStorageId: undefined
},
skinName: "",
- dateTypes: 'date',
+ dateTypes: "date",
valueFormat: "yyyy-MM-dd",
- lineChartData: {expectedData: [], actualData: []},
+ lineChartData: { expectedData: [], actualData: [] }
};
},
created() {
@@ -191,7 +280,9 @@
this.getTime();
this.getDicts("report_form").then(response => {
this.dateTypeOptions = response.data;
- this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
+ this.queryParams.timeType = this.dateTypeOptions.find(
+ f => f.isDefault === "Y"
+ ).dictValue;
});
this.getConfigKey("processEnergy").then(response => {
this.skinName = response.msg;
@@ -199,14 +290,14 @@
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight - 210+ 'px'
+ this.bodyStyle.height = window.innerHeight - 210 + "px";
},
getList() {
this.queryParams.indexCode = this.$route.query.modelCode;
getDataList(this.queryParams).then(response => {
this.energyList = response.rows;
this.total = response.total;
- })
+ });
getPointFacility().then(response => {
this.indexCategoryOptions = response.data;
});
@@ -219,15 +310,20 @@
let title = "";
response.data.forEach(item => {
expectedData.push(this.numFilter(item.value));
- actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�");
+ actualData.push(
+ item.timeCode.slice(
+ item.timeCode.length - 2,
+ item.timeCode.length
+ ) + "鏃�"
+ );
title = item.indexName + "(" + item.unitId + ")";
- })
+ });
this.lineChartData.actualData = actualData;
this.lineChartData.expectedData = expectedData;
- this.lineChartData.title = title
+ this.lineChartData.title = title;
this.$refs.LineChart.initChart(this.lineChartData);
this.$refs.BarChart.initChart(this.lineChartData);
- })
+ });
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
@@ -238,27 +334,28 @@
/** 閲嶇疆鎸夐挳鎿嶄綔 */
resetQuery() {
this.resetForm("queryForm");
- this.queryParams.indexStorageId = '';
+ this.queryParams.indexStorageId = "";
this.handleQuery();
},
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '';
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(this.skinName);
} else {
- realVal = '0'
+ realVal = "0";
}
- return realVal
+ return realVal;
},
getTime() {
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime = year + '-' + month + '-' + date
- },
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month + "-" + date;
+ }
}
};
</script>
@@ -314,25 +411,25 @@
@keyframes fade {
from {
- opacity: 1.0;
+ opacity: 1;
}
50% {
opacity: 0.4;
}
to {
- opacity: 1.0;
+ opacity: 1;
}
}
@-webkit-keyframes fade {
from {
- opacity: 1.0;
+ opacity: 1;
}
50% {
opacity: 0.4;
}
to {
- opacity: 1.0;
+ opacity: 1;
}
}
diff --git a/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/BarChart.vue b/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/BarChart.vue
index 7198e0f..a157885 100644
--- a/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/BarChart.vue
+++ b/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/BarChart.vue
@@ -1,112 +1,119 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- left: 10,
- right: 10,
- bottom: 20,
- top: 40,
- containLabel: true
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 20,
+ top: 40,
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/LineChart.vue b/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/LineChart.vue
index 44964fd..be1b83d 100644
--- a/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/LineChart.vue
+++ b/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -96,25 +96,27 @@
legend: {
data: []
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/index.vue b/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/index.vue
index 85345db..8555b46 100644
--- a/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/index.vue
+++ b/energy_management_ui/src/views/keyEquipment/monthlykeyEquipment/index.vue
@@ -1,35 +1,57 @@
<template>
<div>
<basic-container>
- <el-form :model="queryParams" ref="queryForm" label-width="68px" class="special-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ label-width="68px"
+ class="special-form"
+ >
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="閲嶇偣璁惧">
- <el-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨閲嶇偣璁惧" size="small" style="width: 100%">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨閲嶇偣璁惧"
+ size="small"
+ style="width: 100%"
+ >
<el-option
- v-for="dict in indexCategoryOptions"
- :key="dict.id"
- :label="dict.facilityName"
- :value="dict.id"
+ v-for="dict in indexCategoryOptions"
+ :key="dict.id"
+ :label="dict.facilityName"
+ :value="dict.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="缁熻鏃堕棿">
- <el-date-picker clearable size="small" style="width: 100%"
- v-model="queryParams.dataTime"
- type="month"
- :clearable="false"
- value-format="yyyy-MM"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 100%"
+ v-model="queryParams.dataTime"
+ type="month"
+ :clearable="false"
+ value-format="yyyy-MM"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item class="operation">
- <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-button type="warning" icon="el-icon-download" size="mini" @click="handleExport">瀵煎嚭</el-button>-->
</el-form-item>
</el-col>
@@ -42,101 +64,60 @@
</el-form-item>-->
</basic-container>
<basic-container :bodyStyle="bodyStyle" style="margin-top: 16px">
- <div class="el-table el-table--fit el-table--scrollable-x el-table--enable-row-hover el-table--medium">
- <div class="el-table__body-wrapper is-scrolling-left">
- <table class="el-table__body tableList" cellspacing="0" cellpadding="0" style="width: 2600px">
- <tr v-for="item in tableHead">
- <td style="background: #D5D5D5;width: 80px">鏇茬嚎閫夋嫨</td>
- <td style="background: #D5D5D5;width: 240px">鑳芥簮鎸囨爣鍚嶇О</td>
- <td style="background: #D5D5D5;">{{ item.value1 }}</td>
- <td style="background: #D5D5D5;">{{ item.value2 }}</td>
- <td style="background: #D5D5D5;">{{ item.value3 }}</td>
- <td style="background: #D5D5D5;">{{ item.value4 }}</td>
- <td style="background: #D5D5D5">{{ item.value5 }}</td>
- <td style="background: #D5D5D5">{{ item.value6 }}</td>
- <td style="background: #D5D5D5;">{{ item.value7 }}</td>
- <td style="background: #D5D5D5;">{{ item.value8 }}</td>
- <td style="background: #D5D5D5;">{{ item.value9 }}</td>
- <td style="background: #D5D5D5;">{{ item.value10 }}</td>
- <td style="background: #D5D5D5;">{{ item.value11 }}</td>
- <td style="background: #D5D5D5;">{{ item.value12 }}</td>
- <td style="background: #D5D5D5;">{{ item.value13 }}</td>
- <td style="background: #D5D5D5;">{{ item.value14 }}</td>
- <td style="background: #D5D5D5;">{{ item.value15 }}</td>
- <td style="background: #D5D5D5;">{{ item.value16 }}</td>
- <td style="background: #D5D5D5;">{{ item.value17 }}</td>
- <td style="background: #D5D5D5;">{{ item.value18 }}</td>
- <td style="background: #D5D5D5;">{{ item.value19 }}</td>
- <td style="background: #D5D5D5;">{{ item.value20 }}</td>
- <td style="background: #D5D5D5;">{{ item.value21 }}</td>
- <td style="background: #D5D5D5;">{{ item.value22 }}</td>
- <td style="background: #D5D5D5;">{{ item.value23 }}</td>
- <td style="background: #D5D5D5">{{ item.value24 }}</td>
- <td style="background: #D5D5D5;">{{ item.value25 }}</td>
- <td style="background: #D5D5D5;">{{ item.value26 }}</td>
- <td style="background: #D5D5D5;">{{ item.value27 }}</td>
- <td style="background: #D5D5D5;" v-if="item.value29 !=null">{{ item.value28 }}</td>
- <td style="background: #D5D5D5;" v-if="item.value29 !=null">{{ item.value29 }}</td>
- <td style="background: #D5D5D5;" v-if="item.value30 !=null">{{ item.value30 }}</td>
- <td style="background: #D5D5D5;" v-if="item.value31 !=null">{{ item.value31 }}</td>
- </tr>
- <tr v-for="data in tableData">
- <td style="width: 80px">
- <el-button icon="el-icon-search" circle @click="selectChange(data.indexId)"
- style="font-size: 10px"></el-button>
- </td>
- <td style="width: 240px">{{ data.indexName }}</td>
- <td>{{ numFilter(data.value1) }}</td>
- <td>{{ numFilter(data.value2) }}</td>
- <td>{{ numFilter(data.value3) }}</td>
- <td>{{ numFilter(data.value4) }}</td>
- <td>{{ numFilter(data.value5) }}</td>
- <td>{{ numFilter(data.value6) }}</td>
- <td>{{ numFilter(data.value7) }}</td>
- <td>{{ numFilter(data.value8) }}</td>
- <td>{{ numFilter(data.value9) }}</td>
- <td>{{ numFilter(data.value10) }}</td>
- <td>{{ numFilter(data.value11) }}</td>
- <td>{{ numFilter(data.value12) }}</td>
- <td>{{ numFilter(data.value13) }}</td>
- <td>{{ numFilter(data.value14) }}</td>
- <td>{{ numFilter(data.value15) }}</td>
- <td>{{ numFilter(data.value16) }}</td>
- <td>{{ numFilter(data.value17) }}</td>
- <td>{{ numFilter(data.value18) }}</td>
- <td>{{ numFilter(data.value19) }}</td>
- <td>{{ numFilter(data.value20) }}</td>
- <td>{{ numFilter(data.value21) }}</td>
- <td>{{ numFilter(data.value22) }}</td>
- <td>{{ numFilter(data.value23) }}</td>
- <td>{{ numFilter(data.value24) }}</td>
- <td>{{ numFilter(data.value25) }}</td>
- <td>{{ numFilter(data.value26) }}</td>
- <td>{{ numFilter(data.value27) }}</td>
- <td v-if="data.count>=28">{{ numFilter(data.value28) }}</td>
- <td v-if="data.count>=29">{{ numFilter(data.value29) }}</td>
- <td v-if="data.count>=30">{{ numFilter(data.value30) }}</td>
- <td v-if="data.count==31">{{ numFilter(data.value31) }}</td>
- </tr>
- </table>
- </div>
- </div>
+ <el-table
+ :data="energyList"
+ border
+ style="width: 100%;"
+ class="tableList"
+ >
+ <el-table-column fixed label="鏇茬嚎閫夋嫨">
+ <template slot-scope="scope">
+ <el-button
+ icon="el-icon-search"
+ circle
+ @click="selectChange(scope.row.indexId)"
+ style="font-size: 10px"
+ ></el-button>
+ </template>
+ </el-table-column>
+ <el-table-column
+ fixed
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鎸囨爣鍚嶇О"
+ min-width="240px"
+ ></el-table-column>
+ <el-table-column
+ v-for="index in 31"
+ :key="index"
+ :label="`${index}鏃"
+ align="center"
+ min-width="100"
+ >
+ <template slot-scope="scope">
+ <span style="font-size: 12px">
+ {{ numFilter(scope.row[`value${index}`]) || "--" }}
+ </span>
+ </template>
+ </el-table-column>
+ </el-table>
+
<pagination
- v-show="total>0"
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getList"
+ v-show="total > 0"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
/>
<el-row :gutter="32" style="margin:30px 0">
<el-col :xs="24" :sm="24" :lg="12">
<div class="chart-wrapper">
- <line-chart ref="LineChart" :chart-data="lineChartData"/>
+ <line-chart ref="LineChart" :chart-data="lineChartData" />
</div>
</el-col>
<el-col :xs="24" :sm="24" :lg="12">
<div class="chart-wrapper">
- <bar-chart ref="BarChart" :chart-data="lineChartData"/>
+ <bar-chart ref="BarChart" :chart-data="lineChartData" />
</div>
</el-col>
</el-row>
@@ -145,9 +126,13 @@
</template>
<script>
-import {getDataList, exportList, getlistChart} from "@/api/keyEquipment/monthlykeyEquipment/monthlykeyEquipment";
-import {getPointFacility} from "@/api/keyEquipment/dailykeyEquipment/dailykeyEquipment";
-import LineChart from './LineChart'
+import {
+ getDataList,
+ exportList,
+ getlistChart
+} from "@/api/keyEquipment/monthlykeyEquipment/monthlykeyEquipment";
+import { getPointFacility } from "@/api/keyEquipment/dailykeyEquipment/dailykeyEquipment";
+import LineChart from "./LineChart";
import BarChart from "./BarChart";
import mixins from "@/layout/mixin/getHeight";
@@ -189,10 +174,10 @@
dataTime: undefined,
timeType: "DAY",
indexType: undefined,
- indexStorageId: undefined,
+ indexStorageId: undefined
},
skinName: "",
- lineChartData: {expectedData: [], actualData: []},
+ lineChartData: { expectedData: [], actualData: [] }
};
},
created() {
@@ -208,15 +193,15 @@
},
methods: {
setCharts() {
- this.bodyStyle.height = window.innerHeight - 210+ 'px'
+ this.bodyStyle.height = window.innerHeight - 210 + "px";
},
getList() {
this.queryParams.indexCode = this.$route.query.modelCode;
getDataList(this.queryParams).then(response => {
this.tableData = response.data.tabledata;
this.tableHead = response.data.tablehead;
- this.total = response.data.total
- })
+ this.total = response.data.total;
+ });
getPointFacility().then(response => {
this.indexCategoryOptions = response.data;
});
@@ -229,15 +214,20 @@
let title = "";
response.data.forEach(item => {
expectedData.push(this.numFilter(item.value));
- actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�");
+ actualData.push(
+ item.timeCode.slice(
+ item.timeCode.length - 2,
+ item.timeCode.length
+ ) + "鏃�"
+ );
title = item.indexName + "(" + item.unitId + ")";
- })
+ });
this.lineChartData.actualData = actualData;
this.lineChartData.expectedData = expectedData;
- this.lineChartData.title = title
+ this.lineChartData.title = title;
this.$refs.LineChart.initChart(this.lineChartData);
this.$refs.BarChart.initChart(this.lineChartData);
- })
+ });
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
@@ -248,63 +238,63 @@
/** 閲嶇疆鎸夐挳鎿嶄綔 */
resetQuery() {
this.resetForm("queryForm");
- this.queryParams.indexStorageId = '';
+ this.queryParams.indexStorageId = "";
this.handleQuery();
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.single = selection.length != 1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭缁煎悎鑳借��?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭缁煎悎鑳借��?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportList(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
+ })
+ .then(function() {
+ return exportList(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '';
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(this.skinName);
} else {
- realVal = '0'
+ realVal = "0";
}
- return realVal
+ return realVal;
},
getTime() {
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime = year + '-' + month
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month;
/*let startTime = year + '-' + month + '-' + date
let endTime = year + '-' + month + '-' + (date + 1)
this.dateRange = [startTime, endTime]*/
},
handleTime(date) {
- if (date == 'MONTH') {
- this.dateTypes = 'year',
- this.valueFormat = 'yyyy'
- } else if (date == 'DAY') {
- this.dateTypes = 'month',
- this.valueFormat = 'yyyy-MM'
+ if (date == "MONTH") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "DAY") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
} else {
- this.dateTypes = 'date',
- this.valueFormat = 'yyyy-MM-dd'
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
}
- },
+ }
}
};
</script>
@@ -374,29 +364,29 @@
@keyframes fade {
from {
- opacity: 1.0;
+ opacity: 1;
}
50% {
opacity: 0.4;
}
to {
- opacity: 1.0;
+ opacity: 1;
}
}
@-webkit-keyframes fade {
from {
- opacity: 1.0;
+ opacity: 1;
}
50% {
opacity: 0.4;
}
to {
- opacity: 1.0;
+ opacity: 1;
}
}
.el-table--enable-row-hover .el-table__body tr:hover > td {
- background: #CFDCF5;
+ background: #cfdcf5;
}
.special-form {
@import "~@/assets/styles/common-table-form.scss";
diff --git a/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/BarChart.vue b/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/BarChart.vue
index 7198e0f..a157885 100644
--- a/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/BarChart.vue
+++ b/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/BarChart.vue
@@ -1,112 +1,119 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- left: 10,
- right: 10,
- bottom: 20,
- top: 40,
- containLabel: true
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 20,
+ top: 40,
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/LineChart.vue b/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/LineChart.vue
index 44964fd..be1b83d 100644
--- a/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/LineChart.vue
+++ b/energy_management_ui/src/views/keyEquipment/yearkeyEquipment/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -96,25 +96,27 @@
legend: {
data: []
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/login.vue b/energy_management_ui/src/views/login.vue
index 7b32691..c157d74 100644
--- a/energy_management_ui/src/views/login.vue
+++ b/energy_management_ui/src/views/login.vue
@@ -2,27 +2,27 @@
<div class="logo-page">
<div class="logo-png">
<img
- style="width: 208px;margin-right: 30px "
- :src="'https://www.toray.cn/shared/images/toray_logo_ch.svg'"
+ style="width: 80px;margin-right: 30px "
+ src="@/assets/logo/logo.png"
alt=""
/>
- <div>缁煎悎鑳芥簮绠＄悊绯荤粺</div>
+ <div>浜戣矾缁煎悎鑳芥簮绠＄悊绯荤粺</div>
</div>
<div class="login">
- <!-- <div class="demo-image">
- <el-image style="width: 75%;" :src="logo"></el-image>
- </div> -->
+ <div class="demo-image">
+ <el-image style="width: 80%;" :src="logo"></el-image>
+ </div>
<div class="login-form">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules">
- <!-- <div class="title">鐢ㄦ埛鐧诲綍</div> -->
- <div class="logo-view title">
+ <div class="title">鐢ㄦ埛鐧诲綍</div>
+ <!-- <div class="logo-view title">
<img
style="width: 100px;margin-right: 30px "
:src="'https://www.toray.cn/shared/images/toray_logo_ch.svg'"
alt=""
/>
<div>缁煎悎鑳芥簮绠＄悊绯荤粺</div>
- </div>
+ </div> -->
<el-form-item prop="username" style="margin-bottom: 21px">
<el-input
v-model="loginForm.username"
@@ -178,8 +178,8 @@
<style rel="stylesheet/scss" lang="scss" scoped>
.logo-page {
height: 100%;
- background-image: url("../assets/image/bg.jpg");
- // background-image: url("../assets/image/login-background.png");
+ // background-image: url("../assets/image/bg.jpg");
+ background-image: url("../assets/image/login-background.png");
background-size: cover;
overflow: hidden;
// background: ;
@@ -187,11 +187,11 @@
// background: linear-gradient(90deg, #101d32 0%, rgba(0, 0, 0, 0.5) 100%);
.logo-png {
- font-size: 24px;
+ font-size: 28px;
display: flex;
align-items: center;
font-weight: bold;
- color: #fff;
+ color: #333;
padding: 3.4% 0 0 74px;
position: absolute;
}
@@ -221,8 +221,8 @@
border-radius: 4px;
// box-shadow: 0 7px 14px 6px #2f4b9a;
margin-top: 6px;
- border: 1px solid #061844;
- background: rgba($color: #ffffff, $alpha: 0.06);
+ // border: 1px solid #061844;
+ background: rgba($color: #437ed0, $alpha: 0.06);
.logo-view {
display: flex;
@@ -232,6 +232,13 @@
font-weight: 600;
}
+ ::v-deep .el-input__inner {
+ background: rgb(255, 255, 255, 0.6) !important;
+ background-color: rgb(255, 255, 255, 0.6) !important;
+ border: 1px solid #dcdfe6 !important;
+ color: #606266 !important;
+ }
+
.el-input {
height: 38px;
diff --git a/energy_management_ui/src/views/meter/implement/importIndexTable.vue b/energy_management_ui/src/views/meter/implement/importIndexTable.vue
index 40837f1..fdc13cd 100644
--- a/energy_management_ui/src/views/meter/implement/importIndexTable.vue
+++ b/energy_management_ui/src/views/meter/implement/importIndexTable.vue
@@ -1,20 +1,47 @@
<template>
<!-- 瀵煎叆琛� -->
- <el-dialog :title="title" :visible.sync="open" :destroy-on-close="true" :append-to-body="true" width="800px" top="5vh">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ :destroy-on-close="true"
+ :append-to-body="true"
+ width="800px"
+ top="5vh"
+ >
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ >
<el-form-item>
- <el-button icon="el-icon-refresh" size="mini" @click="createIndex">鐢熸垚鎸囨爣</el-button>
+ <el-button icon="el-icon-refresh" size="mini" @click="createIndex"
+ >鐢熸垚鎸囨爣</el-button
+ >
</el-form-item>
</el-form>
-
<el-row>
- <el-table v-loading="loading" :data="impIndexList" stripe max-height="350">
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
- <el-table-column label="鎸囨爣绫诲瀷" align="center" prop="indexType" :formatter="indexTypeFormat" />
- <el-table-column label="鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat" />
- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
+ <el-table v-loading="loading" :data="impIndexList" max-height="350">
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
+ <el-table-column
+ label="鎸囨爣绫诲瀷"
+ align="center"
+ prop="indexType"
+ :formatter="indexTypeFormat"
+ />
+ <el-table-column
+ label="鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <el-table-column
+ label="鎿嶄綔"
+ align="center"
+ class-name="small-padding fixed-width"
+ >
<template slot-scope="scope">
<el-button
size="mini"
@@ -22,17 +49,18 @@
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['meter:annex:remove']"
- >鍒犻櫎</el-button>
+ >鍒犻櫎</el-button
+ >
</template>
</el-table-column>
</el-table>
-<!-- <pagination-->
-<!-- v-show="total>0"-->
-<!-- :total="total"-->
-<!-- :page.sync="queryParams.pageNum"-->
-<!-- :limit.sync="queryParams.pageSize"-->
-<!-- @pagination="getList"-->
-<!-- />-->
+ <!-- <pagination-->
+ <!-- v-show="total>0"-->
+ <!-- :total="total"-->
+ <!-- :page.sync="queryParams.pageNum"-->
+ <!-- :limit.sync="queryParams.pageSize"-->
+ <!-- @pagination="getList"-->
+ <!-- />-->
</el-row>
<div slot="footer" class="dialog-footer">
<el-button @click="handclose">鍙� 娑�</el-button>
@@ -41,8 +69,8 @@
</template>
<script>
-import { listIndex,addIndex,delIndex } from "@/api/meter/index";
-let meterid="";
+import { listIndex, addIndex, delIndex } from "@/api/meter/index";
+let meterid = "";
// 閫氱敤涓嬭浇鏂规硶
export default {
@@ -58,7 +86,7 @@
multiple: true,
// 鎬绘潯鏁�
total: 0,
- qjcode:"",
+ qjcode: "",
// 璁￠噺鍣ㄥ叿妗ｆ 鎸囨爣 琛ㄦ牸鏁版嵁
impIndexList: [],
// 璁￠噺鍣ㄥ叿妗ｆ 鎸囨爣鐨� 鍗曚綅闆嗗悎
@@ -79,9 +107,9 @@
queryParams: {
pageNum: 1,
pageSize: 10,
- implementId:'',
+ implementId: "",
tableName: undefined
- },
+ }
};
},
created() {
@@ -94,13 +122,13 @@
},
methods: {
// 鏄剧ず寮规
- show(impid,code) {
+ show(impid, code) {
this.reset();
this.qjcode = code;
this.queryParams.implementId = impid;
this.meterid = impid;
this.getList();
- this.title='缂栧彿 '+code+' 鎸囨爣';
+ this.title = "缂栧彿 " + code + " 鎸囨爣";
this.open = true;
},
// 鎸囨爣绫诲瀷瀛楀吀缈昏瘧
@@ -116,7 +144,7 @@
this.queryParams = {
pageNum: 1,
pageSize: 10,
- implementId:'',
+ implementId: "",
tableName: undefined
};
//娓呯┖涓婁紶缁勪欢鐨勬枃浠跺垪琛�
@@ -132,37 +160,51 @@
// 鐢熸垚璁￠噺鍣ㄥ叿鎸囨爣
createIndex() {
let aa = this.meterid;
- console.log("aa==="+aa);
- this.$confirm('鏄惁纭閲嶆柊鐢熸垚鍣ㄥ叿缂栫爜涓�"' + this.qjcode + '"鐨勬寚鏍囧悧?閲嶆柊鐢熸垚鍚庢墍鏈夋寚鏍囦細杩樺師鍒版ā鏉跨姸鎬�', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
+ console.log("aa===" + aa);
+ this.$confirm(
+ '鏄惁纭閲嶆柊鐢熸垚鍣ㄥ叿缂栫爜涓�"' +
+ this.qjcode +
+ '"鐨勬寚鏍囧悧?閲嶆柊鐢熸垚鍚庢墍鏈夋寚鏍囦細杩樺師鍒版ā鏉跨姸鎬�',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
return addIndex(aa);
- }).then(() => {
- this.getList();
- this.msgSuccess("鎸囨爣鐢熸垚鎴愬姛");
- }).catch(function() {});
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鎸囨爣鐢熸垚鎴愬姛");
+ })
+ .catch(function() {});
},
/** 鍏抽棴鎸夐挳鎿嶄綔 */
- handclose()
- {
- this.open=false;
+ handclose() {
+ this.open = false;
},
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
- this.$confirm('鏄惁纭鍒犻櫎鎸囨爣缂栫爜涓�"' + row.code + '"鐨勬寚鏍囧悧?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
- return delIndex(row.indexId);
- }).then(() => {
- this.getList();
- this.msgSuccess("鎸囨爣鍒犻櫎鎴愬姛");
- }).catch(function() {});
- },
+ this.$confirm(
+ '鏄惁纭鍒犻櫎鎸囨爣缂栫爜涓�"' + row.code + '"鐨勬寚鏍囧悧?',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
+ return delIndex(row.indexId);
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鎸囨爣鍒犻櫎鎴愬姛");
+ })
+ .catch(function() {});
+ }
}
};
-
</script>
diff --git a/energy_management_ui/src/views/meter/implement/index.vue b/energy_management_ui/src/views/meter/implement/index.vue
index b53624f..ca724a5 100644
--- a/energy_management_ui/src/views/meter/implement/index.vue
+++ b/energy_management_ui/src/views/meter/implement/index.vue
@@ -1,79 +1,98 @@
<template>
<div>
<basic-container>
- <el-form :model="queryParams" ref="queryForm" label-width="72px" class="special-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ label-width="72px"
+ class="special-form"
+ >
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="缂栫爜" prop="code">
<el-input
- v-model="queryParams.code"
- placeholder="璇疯緭鍏ョ紪鐮�"
- clearable
- size="small"
- @keyup.enter.native="handleQuery"
+ v-model="queryParams.code"
+ placeholder="璇疯緭鍏ョ紪鐮�"
+ clearable
+ size="small"
+ @keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="鍣ㄥ叿鍚嶇О" prop="meterName">
<el-input
- v-model="queryParams.meterName"
- placeholder="璇疯緭鍏ュ櫒鍏峰悕绉�"
- clearable
- size="small"
- @keyup.enter.native="handleQuery"
+ v-model="queryParams.meterName"
+ placeholder="璇疯緭鍏ュ櫒鍏峰悕绉�"
+ clearable
+ size="small"
+ @keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="绉嶇被" prop="meterType">
- <el-select v-model="queryParams.meterType" placeholder="璇烽�夋嫨绉嶇被" clearable size="small" style="width: 100%">
+ <el-select
+ v-model="queryParams.meterType"
+ placeholder="璇烽�夋嫨绉嶇被"
+ clearable
+ size="small"
+ style="width: 100%"
+ >
<el-option
- v-for="dict in meterTypeOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in meterTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
-<!-- <el-col :span="6">-->
-<!-- <el-form-item label="娴嬮噺鑼冨洿" prop="measureRange">-->
-<!-- <el-input-->
-<!-- v-model="queryParams.measureRange"-->
-<!-- placeholder="璇疯緭鍏ユ祴閲忚寖鍥�"-->
-<!-- clearable-->
-<!-- size="small"-->
-<!-- @keyup.enter.native="handleQuery"-->
-<!-- />-->
-<!-- </el-form-item>-->
-<!-- </el-col>-->
-<!-- <el-col :span="6">-->
-<!-- <el-form-item label="鐢熶骇鍘傚晢" prop="manufacturer">-->
-<!-- <el-input-->
-<!-- v-model="queryParams.manufacturer"-->
-<!-- placeholder="璇疯緭鍏ョ敓浜у巶鍟�"-->
-<!-- clearable-->
-<!-- size="small"-->
-<!-- @keyup.enter.native="handleQuery"-->
-<!-- />-->
-<!-- </el-form-item>-->
-<!-- </el-col>-->
-<!-- <el-col :span="6">-->
-<!-- <el-form-item label="瀹夎浣嶇疆" prop="installactionLocation">-->
-<!-- <el-input-->
-<!-- v-model="queryParams.installactionLocation"-->
-<!-- placeholder="璇疯緭鍏ュ畨瑁呬綅缃�"-->
-<!-- clearable-->
-<!-- size="small"-->
-<!-- @keyup.enter.native="handleQuery"-->
-<!-- />-->
-<!-- </el-form-item>-->
-<!-- </el-col>-->
+ <!-- <el-col :span="6">-->
+ <!-- <el-form-item label="娴嬮噺鑼冨洿" prop="measureRange">-->
+ <!-- <el-input-->
+ <!-- v-model="queryParams.measureRange"-->
+ <!-- placeholder="璇疯緭鍏ユ祴閲忚寖鍥�"-->
+ <!-- clearable-->
+ <!-- size="small"-->
+ <!-- @keyup.enter.native="handleQuery"-->
+ <!-- />-->
+ <!-- </el-form-item>-->
+ <!-- </el-col>-->
+ <!-- <el-col :span="6">-->
+ <!-- <el-form-item label="鐢熶骇鍘傚晢" prop="manufacturer">-->
+ <!-- <el-input-->
+ <!-- v-model="queryParams.manufacturer"-->
+ <!-- placeholder="璇疯緭鍏ョ敓浜у巶鍟�"-->
+ <!-- clearable-->
+ <!-- size="small"-->
+ <!-- @keyup.enter.native="handleQuery"-->
+ <!-- />-->
+ <!-- </el-form-item>-->
+ <!-- </el-col>-->
+ <!-- <el-col :span="6">-->
+ <!-- <el-form-item label="瀹夎浣嶇疆" prop="installactionLocation">-->
+ <!-- <el-input-->
+ <!-- v-model="queryParams.installactionLocation"-->
+ <!-- placeholder="璇疯緭鍏ュ畨瑁呬綅缃�"-->
+ <!-- clearable-->
+ <!-- size="small"-->
+ <!-- @keyup.enter.native="handleQuery"-->
+ <!-- />-->
+ <!-- </el-form-item>-->
+ <!-- </el-col>-->
<el-col :span="6">
<el-form-item class="operation">
- <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-col>
</el-row>
@@ -83,217 +102,323 @@
<el-row :gutter="10" class="mb8" style="margin-bottom: 19px">
<el-col :span="1.5">
<el-button
- type="primary"
- icon="el-icon-plus"
- size="mini"
- @click="handleAdd"
- v-hasPermi="['meter:implement:add']"
- >鏂板
+ type="primary"
+ icon="el-icon-plus"
+ size="mini"
+ @click="handleAdd"
+ v-hasPermi="['meter:implement:add']"
+ >鏂板
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
- type="success"
- icon="el-icon-edit"
- size="mini"
- :disabled="single"
- @click="handleUpdate"
- v-hasPermi="['meter:implement:edit']"
- >淇敼
+ type="success"
+ icon="el-icon-edit"
+ size="mini"
+ :disabled="single"
+ @click="handleUpdate"
+ v-hasPermi="['meter:implement:edit']"
+ >淇敼
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
- type="danger"
- icon="el-icon-delete"
- size="mini"
- :disabled="multiple"
- @click="handleDelete"
- v-hasPermi="['meter:implement:remove']"
- >鍒犻櫎
+ type="danger"
+ icon="el-icon-delete"
+ size="mini"
+ :disabled="multiple"
+ @click="handleDelete"
+ v-hasPermi="['meter:implement:remove']"
+ >鍒犻櫎
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
- type="warning"
- icon="el-icon-download"
- size="mini"
- @click="handleExport"
- v-hasPermi="['meter:implement:export']"
- >瀵煎嚭
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ @click="handleExport"
+ v-hasPermi="['meter:implement:export']"
+ >瀵煎嚭
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
- type="info"
- icon="el-icon-upload2"
- size="mini"
- @click="handleImport"
- v-hasPermi="['meter:implement:import']"
- >瀵煎叆
+ type="info"
+ icon="el-icon-upload2"
+ size="mini"
+ @click="handleImport"
+ v-hasPermi="['meter:implement:import']"
+ >瀵煎叆
</el-button>
</el-col>
</el-row>
- <el-table v-loading="loading" :data="implementList" :height="height" @selection-change="handleSelectionChange">
- <el-table-column type="selection" width="55" align="center"/>
- <el-table-column label="缂栫爜" align="center" prop="code" show-overflow-tooltip/>
- <el-table-column label="鍣ㄥ叿鍚嶇О" align="center" prop="meterName" show-overflow-tooltip/>
- <el-table-column label="绉嶇被" align="center" prop="meterType" :formatter="meterTypeFormat" show-overflow-tooltip/>
- <el-table-column label="瑙勬牸鍨嬪彿" align="center" prop="modelNumber" show-overflow-tooltip/>
- <el-table-column label="娴嬮噺鑼冨洿" align="center" prop="measureRange" show-overflow-tooltip/>
- <el-table-column label="鐢熶骇鍘傚晢" align="center" prop="manufacturer" show-overflow-tooltip/>
- <el-table-column label="瀹夎浣嶇疆" align="center" prop="installactionLocation" show-overflow-tooltip/>
- <el-table-column label="鐘舵��" align="center" prop="meterStatus" :formatter="meterStatusFormat" show-overflow-tooltip/>
- <el-table-column label="鎿嶄綔" align="center" width="240" class-name="small-padding fixed-width">
+ <el-table
+ v-loading="loading"
+ :data="implementList"
+ :height="height"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column
+ label="缂栫爜"
+ align="center"
+ prop="code"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鍣ㄥ叿鍚嶇О"
+ align="center"
+ prop="meterName"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="绉嶇被"
+ align="center"
+ prop="meterType"
+ :formatter="meterTypeFormat"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="瑙勬牸鍨嬪彿"
+ align="center"
+ prop="modelNumber"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="娴嬮噺鑼冨洿"
+ align="center"
+ prop="measureRange"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鐢熶骇鍘傚晢"
+ align="center"
+ prop="manufacturer"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="瀹夎浣嶇疆"
+ align="center"
+ prop="installactionLocation"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鐘舵��"
+ align="center"
+ prop="meterStatus"
+ :formatter="meterStatusFormat"
+ show-overflow-tooltip
+ />
+ <el-table-column
+ label="鎿嶄綔"
+ align="center"
+ width="240"
+ class-name="small-padding fixed-width"
+ >
<template slot-scope="scope">
<el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="openImportFileTable(scope.row)"
- v-hasPermi="['tool:gen:import']"
- >闄勪欢
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="openImportFileTable(scope.row)"
+ v-hasPermi="['tool:gen:import']"
+ >闄勪欢
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="openImportIndexTable(scope.row)"
- v-hasPermi="['']"
- >鎸囨爣
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="openImportIndexTable(scope.row)"
+ v-hasPermi="['']"
+ >鎸囨爣
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="handleUpdate(scope.row)"
- v-hasPermi="['meter:implement:edit']"
- >淇敼
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="handleUpdate(scope.row)"
+ v-hasPermi="['meter:implement:edit']"
+ >淇敼
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-delete"
- @click="handleDelete(scope.row)"
- v-hasPermi="['meter:implement:remove']"
- >鍒犻櫎
+ size="mini"
+ type="text"
+ icon="el-icon-delete"
+ @click="handleDelete(scope.row)"
+ v-hasPermi="['meter:implement:remove']"
+ >鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getList"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
/>
</basic-container>
<!-- 娣诲姞鎴栦慨鏀硅閲忓櫒鍏锋。妗堢淮鎶ゅ璇濇 -->
- <el-dialog :title="title" :visible.sync="open" width="820px" class="dialog-form-row">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="820px"
+ class="dialog-form-row"
+ >
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="缂栫爜" prop="code" label-width="110px">
- <el-input v-model="form.code" placeholder="璇疯緭鍏ョ紪鐮�"/>
+ <el-input v-model="form.code" placeholder="璇疯緭鍏ョ紪鐮�" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鍣ㄥ叿鍚嶇О" prop="meterName" label-width="80px">
- <el-input v-model="form.meterName" placeholder="璇疯緭鍏ュ櫒鍏峰悕绉�"/>
+ <el-input v-model="form.meterName" placeholder="璇疯緭鍏ュ櫒鍏峰悕绉�" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="绉嶇被" prop="meterType">
<el-select v-model="form.meterType" placeholder="璇烽�夋嫨绉嶇被">
<el-option
- v-for="dict in meterTypeOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in meterTypeOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
- <el-form-item label="瑙勬牸鍨嬪彿" prop="modelNumber" label-width="110px">
- <el-input v-model="form.modelNumber" placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�"/>
+ <el-form-item
+ label="瑙勬牸鍨嬪彿"
+ prop="modelNumber"
+ label-width="110px"
+ >
+ <el-input
+ v-model="form.modelNumber"
+ placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�"
+ />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="娴嬮噺鑼冨洿" prop="measureRange">
- <el-input v-model="form.measureRange" placeholder="璇疯緭鍏ユ祴閲忚寖鍥�"/>
+ <el-input
+ v-model="form.measureRange"
+ placeholder="璇疯緭鍏ユ祴閲忚寖鍥�"
+ />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鐢熶骇鍘傚晢" prop="manufacturer">
- <el-input v-model="form.manufacturer" placeholder="璇疯緭鍏ョ敓浜у巶鍟�"/>
+ <el-input
+ v-model="form.manufacturer"
+ placeholder="璇疯緭鍏ョ敓浜у巶鍟�"
+ />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
- <el-form-item label="璐熻矗浜�" prop="personCharge" label-width="110px">
- <el-input v-model="form.personCharge" placeholder="璇疯緭鍏ヨ礋璐ｄ汉"/>
+ <el-form-item
+ label="璐熻矗浜�"
+ prop="personCharge"
+ label-width="110px"
+ >
+ <el-input
+ v-model="form.personCharge"
+ placeholder="璇疯緭鍏ヨ礋璐ｄ汉"
+ />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="瀹夎浣嶇疆" prop="installactionLocation">
- <el-input v-model="form.installactionLocation" placeholder="璇疯緭鍏ュ畨瑁呬綅缃�"/>
+ <el-input
+ v-model="form.installactionLocation"
+ placeholder="璇疯緭鍏ュ畨瑁呬綅缃�"
+ />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="璧峰鏃堕棿" prop="startTime">
- <el-date-picker clearable size="small" style="width: 100%"
- v-model="form.startTime"
- type="date"
- value-format="yyyy-MM-dd"
- placeholder="閫夋嫨璧峰鏃堕棿">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 100%"
+ v-model="form.startTime"
+ type="date"
+ value-format="yyyy-MM-dd"
+ placeholder="閫夋嫨璧峰鏃堕棿"
+ >
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
- <el-form-item label="妫�瀹氬懆鏈�(澶�)" prop="checkCycle" label-width="110px">
- <el-input v-model="form.checkCycle" placeholder="璇疯緭鍏ユ瀹氬懆鏈�"
- oninput="if(value.length>4)value=value.slice(0,4)"/>
+ <el-form-item
+ label="妫�瀹氬懆鏈�(澶�)"
+ prop="checkCycle"
+ label-width="110px"
+ >
+ <el-input
+ v-model="form.checkCycle"
+ placeholder="璇疯緭鍏ユ瀹氬懆鏈�"
+ oninput="if(value.length>4)value=value.slice(0,4)"
+ />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鐘舵��" prop="meterStatus">
<el-select v-model="form.meterStatus" placeholder="璇烽�夋嫨鐘舵��">
<el-option
- v-for="dict in meterStatusOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in meterStatusOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鎶曡繍鏃堕棿" prop="putrunTime">
- <el-date-picker clearable size="small" style="width: 100%"
- v-model="form.putrunTime"
- type="date"
- value-format="yyyy-MM-dd"
- placeholder="閫夋嫨鎶曡繍鏃堕棿">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 100%"
+ v-model="form.putrunTime"
+ type="date"
+ value-format="yyyy-MM-dd"
+ placeholder="閫夋嫨鎶曡繍鏃堕棿"
+ >
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
- <el-form-item label="鎻愰啋鍛ㄦ湡(澶�)" prop="reminderCycle" label-width="110px">
- <el-input v-model="form.reminderCycle" placeholder="璇疯緭鍏ユ彁閱掑懆鏈�"
- oninput="if(value.length>4)value=value.slice(0,4)"/>
+ <el-form-item
+ label="鎻愰啋鍛ㄦ湡(澶�)"
+ prop="reminderCycle"
+ label-width="110px"
+ >
+ <el-input
+ v-model="form.reminderCycle"
+ placeholder="璇疯緭鍏ユ彁閱掑懆鏈�"
+ oninput="if(value.length>4)value=value.slice(0,4)"
+ />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="24">
<el-form-item label="澶囨敞" prop="remark" label-width="110px">
- <el-input v-model="form.remark" type="textarea" placeholder="璇疯緭鍏ュ唴瀹�"></el-input>
+ <el-input
+ v-model="form.remark"
+ type="textarea"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ ></el-input>
</el-form-item>
</el-col>
</el-row>
@@ -305,18 +430,23 @@
</el-dialog>
<!-- 璁￠噺鍣ㄥ叿妗ｆ 瀵煎叆瀵硅瘽妗� -->
- <el-dialog :title="upload.title" :visible.sync="upload.open" :destroy-on-close="true" width="400px">
+ <el-dialog
+ :title="upload.title"
+ :visible.sync="upload.open"
+ :destroy-on-close="true"
+ width="400px"
+ >
<el-upload
- ref="upload"
- :limit="1"
- :accept="upload.accept"
- :headers="upload.headers"
- :action="upload.url"
- :disabled="upload.isUploading"
- :on-progress="handleFileUploadProgress"
- :on-success="handleFileSuccess"
- :auto-upload="false"
- drag
+ ref="upload"
+ :limit="1"
+ :accept="upload.accept"
+ :headers="upload.headers"
+ :action="upload.url"
+ :disabled="upload.isUploading"
+ :on-progress="handleFileUploadProgress"
+ :on-success="handleFileSuccess"
+ :auto-upload="false"
+ drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
@@ -324,16 +454,20 @@
<em>鐐瑰嚮涓婁紶</em>
</div>
<div class="el-upload__tip" slot="tip">
- <el-link type="info" style="font-size:12px;color:blue;" @click="importTemplate">涓嬭浇妯℃澘</el-link>
+ <el-link
+ type="info"
+ style="font-size:12px;color:blue;"
+ @click="importTemplate"
+ >涓嬭浇妯℃澘</el-link
+ >
</div>
<div class="el-upload__tip" style="color:red" slot="tip">
- 瀵煎叆鎻愮ず锛�<br>1銆佹柊澧炲鍏�,浠呭厑璁稿鍏モ�渪ls鈥濇垨鈥渪lsx鈥濇牸寮忔枃浠讹紒
- <br>2銆佺紪鐮佸繀椤诲敮涓�,閲嶅鏁版嵁鏃犳硶瀵煎叆
- <br>3銆佺绫诲拰鐘舵�佸～鍐欓敊璇殑鏁版嵁鏃犳硶瀵煎叆
- <br>4銆佹瀹氬懆鏈熴�佹彁閱掑懆鏈熷ぇ浜�0姝ｆ暣鏁�,濉啓閿欒鍒欓粯璁や负1
- <br>5銆佽捣濮嬫椂闂村～鍐欓敊璇垨涓嶅～鍒欓粯璁や负绌�
+ 瀵煎叆鎻愮ず锛�<br />1銆佹柊澧炲鍏�,浠呭厑璁稿鍏モ�渪ls鈥濇垨鈥渪lsx鈥濇牸寮忔枃浠讹紒
+ <br />2銆佺紪鐮佸繀椤诲敮涓�,閲嶅鏁版嵁鏃犳硶瀵煎叆
+ <br />3銆佺绫诲拰鐘舵�佸～鍐欓敊璇殑鏁版嵁鏃犳硶瀵煎叆
+ <br />4銆佹瀹氬懆鏈熴�佹彁閱掑懆鏈熷ぇ浜�0姝ｆ暣鏁�,濉啓閿欒鍒欓粯璁や负1
+ <br />5銆佽捣濮嬫椂闂村～鍐欓敊璇垨涓嶅～鍒欓粯璁や负绌�
</div>
-
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">纭� 瀹�</el-button>
@@ -341,10 +475,9 @@
</div>
</el-dialog>
- <importFileTable ref="importFile" @ok="handleFjQuery"/>
+ <importFileTable ref="importFile" @ok="handleFjQuery" />
- <importIndexTable ref="importIndex" @ok="handleFjQuery"/>
-
+ <importIndexTable ref="importIndex" @ok="handleFjQuery" />
</div>
</template>
@@ -358,7 +491,7 @@
exportImplement,
importTemplate
} from "@/api/meter/implement";
-import {getToken} from "@/utils/auth";
+import { getToken } from "@/utils/auth";
import importFileTable from "./importFileTable";
import importIndexTable from "./importIndexTable";
import mixins from "@/layout/mixin/getHeight";
@@ -367,7 +500,7 @@
const myType = "0";
export default {
name: "implement",
- components: {importFileTable, importIndexTable},
+ components: { importFileTable, importIndexTable },
mixins: [mixins],
data() {
return {
@@ -441,7 +574,7 @@
// 鏄惁鏇存柊宸茬粡瀛樺湪鐨勮閲忓櫒鍏锋。妗�
updateSupport: 0,
// 璁剧疆涓婁紶鐨勮姹傚ご閮�
- headers: {Authorization: "Bearer " + getToken()},
+ headers: { Authorization: "Bearer " + getToken() },
// 涓婁紶鐨勫湴鍧�
url: ""
},
@@ -454,46 +587,53 @@
meterType: undefined,
measureRange: undefined,
manufacturer: undefined,
- installactionLocation: undefined,
+ installactionLocation: undefined
},
// 琛ㄥ崟鍙傛暟
form: {},
// 琛ㄥ崟鏍￠獙
rules: {
- code: [
- {required: true, message: "缂栫爜涓嶈兘涓虹┖", trigger: "blur"}
- ],
+ code: [{ required: true, message: "缂栫爜涓嶈兘涓虹┖", trigger: "blur" }],
meterName: [
- {required: true, message: "鍣ㄥ叿鍚嶇О涓嶈兘涓虹┖", trigger: "blur"}
+ { required: true, message: "鍣ㄥ叿鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
],
// meterType: [
// { required: true, message: "绉嶇被涓嶈兘涓虹┖", trigger: "blur" }
// ],
installactionLocation: [
- {required: true, message: "瀹夎浣嶇疆涓嶈兘涓虹┖", trigger: "blur"}
+ { required: true, message: "瀹夎浣嶇疆涓嶈兘涓虹┖", trigger: "blur" }
],
// meterStatus: [
// { required: true, message: "鐘舵�佷笉鑳戒负绌�", trigger: "blur" }
// ],
startTime: [
- {required: true, message: "璧峰鏃堕棿涓嶈兘涓虹┖", trigger: "blur"}
+ { required: true, message: "璧峰鏃堕棿涓嶈兘涓虹┖", trigger: "blur" }
],
putrunTime: [
- {required: true, message: "鎶曡繍鏃堕棿涓嶈兘涓虹┖", trigger: "blur"}
+ { required: true, message: "鎶曡繍鏃堕棿涓嶈兘涓虹┖", trigger: "blur" }
],
checkCycle: [
- {required: true, pattern: /^\+?[1-9]\d*$/, message: "妫�瀹氬懆鏈熷繀椤绘槸澶т簬0鐨勬鏁存暟", trigger: "blur"}
+ {
+ required: true,
+ pattern: /^\+?[1-9]\d*$/,
+ message: "妫�瀹氬懆鏈熷繀椤绘槸澶т簬0鐨勬鏁存暟",
+ trigger: "blur"
+ }
],
reminderCycle: [
- {required: true, pattern: /^\+?[1-9]\d*$/, message: "鎻愰啋鍛ㄦ湡蹇呴』鏄ぇ浜�0鐨勬鏁存暟", trigger: "blur"}
- ],
+ {
+ required: true,
+ pattern: /^\+?[1-9]\d*$/,
+ message: "鎻愰啋鍛ㄦ湡蹇呴』鏄ぇ浜�0鐨勬鏁存暟",
+ trigger: "blur"
+ }
+ ]
}
};
},
created() {
this.getList();
this.getDicts("sys_device_type").then(response => {
-
for (let i = 0; i < response.data.length; i++) {
if (response.data[i].isDefault == "Y") {
this.myType = response.data[i].dictValue;
@@ -505,7 +645,6 @@
for (let i = 0; i < response.data.length; i++) {
if (response.data[i].isDefault == "Y") {
this.mystatus = response.data[i].dictValue;
-
}
}
this.meterStatusOptions = response.data;
@@ -515,10 +654,10 @@
methods: {
setCharts() {
this.bodyStyle = {
- height: window.innerHeight - 210 + 'px',
- overflow: 'hidden'
- }
- this.height = window.innerHeight - 370;
+ height: window.innerHeight - 224 + "px",
+ overflow: "hidden"
+ };
+ this.height = window.innerHeight - 360;
},
/** 鏌ヨ璁￠噺鍣ㄥ叿妗ｆ缁存姢鍒楄〃 */
getList() {
@@ -579,10 +718,10 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.codes = selection.map(item => item.code)
- this.single = selection.length != 1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.codes = selection.map(item => item.code);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
/** 鏂板鎸夐挳鎿嶄綔 */
handleAdd() {
@@ -595,7 +734,7 @@
/** 淇敼鎸夐挳鎿嶄綔 */
handleUpdate(row) {
this.reset();
- const id = row.id || this.ids
+ const id = row.id || this.ids;
getImplement(id).then(response => {
this.form = response.data;
this.open = true;
@@ -603,7 +742,7 @@
});
},
/** 鎻愪氦鎸夐挳 */
- submitForm: function () {
+ submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != undefined) {
@@ -634,38 +773,48 @@
handleDelete(row) {
const ids = row.id || this.ids;
const codes = row.code || this.codes;
- this.$confirm('鏄惁纭鍒犻櫎璁￠噺鍣ㄥ叿妗ｆ缁存姢缂栧彿涓�"' + codes + '"鐨勮閲忓櫒鍏锋。妗�?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
- return delImplement(ids);
- }).then(() => {
- this.getList();
- this.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(function () {
- });
+ this.$confirm(
+ '鏄惁纭鍒犻櫎璁￠噺鍣ㄥ叿妗ｆ缁存姢缂栧彿涓�"' + codes + '"鐨勮閲忓櫒鍏锋。妗�?',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
+ return delImplement(ids);
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鍒犻櫎鎴愬姛");
+ })
+ .catch(function() {});
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夎閲忓櫒鍏锋。妗堢淮鎶ゆ暟鎹」?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夎閲忓櫒鍏锋。妗堢淮鎶ゆ暟鎹」?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportImplement(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
+ })
+ .then(function() {
+ return exportImplement(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
/** 瀵煎叆鎸夐挳鎿嶄綔 */
handleImport() {
//this.$refs.upload.clearFiles();
this.upload.title = "璁￠噺鍣ㄥ叿妗ｆ瀵煎叆";
this.upload.accept = ".xlsx, .xls";
- this.upload.url = process.env.VUE_APP_BASE_API + "/meter/implement/importData?updateSupport=0";
+ this.upload.url =
+ process.env.VUE_APP_BASE_API +
+ "/meter/implement/importData?updateSupport=0";
this.upload.open = true;
},
/** 涓嬭浇妯℃澘鎿嶄綔 */
@@ -683,7 +832,7 @@
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
- this.$alert(response.msg, "瀵煎叆缁撴灉", {dangerouslyUseHTMLString: true});
+ this.$alert(response.msg, "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true });
this.getList();
},
// 鎻愪氦涓婁紶鏂囦欢
diff --git a/energy_management_ui/src/views/meter/implementCount/importIndexTable.vue b/energy_management_ui/src/views/meter/implementCount/importIndexTable.vue
index ccd2d9e..7b1c66d 100644
--- a/energy_management_ui/src/views/meter/implementCount/importIndexTable.vue
+++ b/energy_management_ui/src/views/meter/implementCount/importIndexTable.vue
@@ -1,20 +1,41 @@
<template>
<!-- 瀵煎叆琛� -->
- <el-dialog :title="title" :visible.sync="open" :destroy-on-close="true" :append-to-body="true" width="800px" top="5vh">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ :destroy-on-close="true"
+ :append-to-body="true"
+ width="800px"
+ top="5vh"
+ >
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ >
<el-form-item>
- <!-- <el-button icon="el-icon-refresh" size="mini" @click="createIndex">鐢熸垚鎸囨爣</el-button>-->
+ <!-- <el-button icon="el-icon-refresh" size="mini" @click="createIndex">鐢熸垚鎸囨爣</el-button>-->
</el-form-item>
</el-form>
-
<el-row>
- <el-table v-loading="loading" :data="impIndexList" stripe max-height="350">
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
- <el-table-column label="鎸囨爣绫诲瀷" align="center" prop="indexType" :formatter="indexTypeFormat" />
- <el-table-column label="鍗曚綅" align="center" prop="unitId" :formatter="unitIdFormat" />
- <!-- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
+ <el-table v-loading="loading" :data="impIndexList" max-height="350">
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="name" />
+ <el-table-column
+ label="鎸囨爣绫诲瀷"
+ align="center"
+ prop="indexType"
+ :formatter="indexTypeFormat"
+ />
+ <el-table-column
+ label="鍗曚綅"
+ align="center"
+ prop="unitId"
+ :formatter="unitIdFormat"
+ />
+ <!-- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<!–<el-button
size="mini"
@@ -26,13 +47,13 @@
</template>
</el-table-column>-->
</el-table>
-<!-- <pagination-->
-<!-- v-show="total>0"-->
-<!-- :total="total"-->
-<!-- :page.sync="queryParams.pageNum"-->
-<!-- :limit.sync="queryParams.pageSize"-->
-<!-- @pagination="getList"-->
-<!-- />-->
+ <!-- <pagination-->
+ <!-- v-show="total>0"-->
+ <!-- :total="total"-->
+ <!-- :page.sync="queryParams.pageNum"-->
+ <!-- :limit.sync="queryParams.pageSize"-->
+ <!-- @pagination="getList"-->
+ <!-- />-->
</el-row>
<div slot="footer" class="dialog-footer">
<el-button @click="handclose">鍙� 娑�</el-button>
@@ -41,8 +62,8 @@
</template>
<script>
-import { listIndex,addIndex,delIndex } from "@/api/meter/index";
-let meterid="";
+import { listIndex, addIndex, delIndex } from "@/api/meter/index";
+let meterid = "";
// 閫氱敤涓嬭浇鏂规硶
export default {
@@ -58,7 +79,7 @@
multiple: true,
// 鎬绘潯鏁�
total: 0,
- qjcode:"",
+ qjcode: "",
// 璁￠噺鍣ㄥ叿妗ｆ 鎸囨爣 琛ㄦ牸鏁版嵁
impIndexList: [],
// 璁￠噺鍣ㄥ叿妗ｆ 鎸囨爣鐨� 鍗曚綅闆嗗悎
@@ -79,9 +100,9 @@
queryParams: {
pageNum: 1,
pageSize: 10,
- implementId:'',
+ implementId: "",
tableName: undefined
- },
+ }
};
},
created() {
@@ -94,13 +115,13 @@
},
methods: {
// 鏄剧ず寮规
- show(impid,code) {
+ show(impid, code) {
this.reset();
this.qjcode = code;
this.queryParams.implementId = impid;
this.meterid = impid;
this.getList();
- this.title='缂栧彿 '+code+' 鎸囨爣';
+ this.title = "缂栧彿 " + code + " 鎸囨爣";
this.open = true;
},
// 鎸囨爣绫诲瀷瀛楀吀缈昏瘧
@@ -116,7 +137,7 @@
this.queryParams = {
pageNum: 1,
pageSize: 10,
- implementId:'',
+ implementId: "",
tableName: undefined
};
//娓呯┖涓婁紶缁勪欢鐨勬枃浠跺垪琛�
@@ -132,37 +153,51 @@
// 鐢熸垚璁￠噺鍣ㄥ叿鎸囨爣
createIndex() {
let aa = this.meterid;
- console.log("aa==="+aa);
- this.$confirm('鏄惁纭閲嶆柊鐢熸垚鍣ㄥ叿缂栫爜涓�"' + this.qjcode + '"鐨勬寚鏍囧悧?閲嶆柊鐢熸垚鍚庢墍鏈夋寚鏍囦細杩樺師鍒版ā鏉跨姸鎬�', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
+ console.log("aa===" + aa);
+ this.$confirm(
+ '鏄惁纭閲嶆柊鐢熸垚鍣ㄥ叿缂栫爜涓�"' +
+ this.qjcode +
+ '"鐨勬寚鏍囧悧?閲嶆柊鐢熸垚鍚庢墍鏈夋寚鏍囦細杩樺師鍒版ā鏉跨姸鎬�',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
return addIndex(aa);
- }).then(() => {
- this.getList();
- this.msgSuccess("鎸囨爣鐢熸垚鎴愬姛");
- }).catch(function() {});
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鎸囨爣鐢熸垚鎴愬姛");
+ })
+ .catch(function() {});
},
/** 鍏抽棴鎸夐挳鎿嶄綔 */
- handclose()
- {
- this.open=false;
+ handclose() {
+ this.open = false;
},
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
- this.$confirm('鏄惁纭鍒犻櫎鎸囨爣缂栫爜涓�"' + row.code + '"鐨勬寚鏍囧悧?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
- return delIndex(row.indexId);
- }).then(() => {
- this.getList();
- this.msgSuccess("鎸囨爣鍒犻櫎鎴愬姛");
- }).catch(function() {});
- },
+ this.$confirm(
+ '鏄惁纭鍒犻櫎鎸囨爣缂栫爜涓�"' + row.code + '"鐨勬寚鏍囧悧?',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
+ return delIndex(row.indexId);
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鎸囨爣鍒犻櫎鎴愬姛");
+ })
+ .catch(function() {});
+ }
}
};
-
</script>
diff --git a/energy_management_ui/src/views/power-statistics-analyse/pari-passu/BarChart.vue b/energy_management_ui/src/views/power-statistics-analyse/pari-passu/BarChart.vue
index b28189f..e95f918 100644
--- a/energy_management_ui/src/views/power-statistics-analyse/pari-passu/BarChart.vue
+++ b/energy_management_ui/src/views/power-statistics-analyse/pari-passu/BarChart.vue
@@ -99,13 +99,16 @@
}
},
legend: {
- right: 0
+ right: 0,
+ textStyle: {
+ color: "#fff"
+ }
},
grid: {
left: 10,
right: 10,
bottom: "10%",
- top: 30,
+ top: 50,
containLabel: true
},
xAxis: [
@@ -123,6 +126,9 @@
type: "value",
axisTick: {
show: false
+ },
+ splitLine: {
+ show: false
}
},
{
diff --git a/energy_management_ui/src/views/power-statistics-analyse/pari-passu/LineChart.vue b/energy_management_ui/src/views/power-statistics-analyse/pari-passu/LineChart.vue
index 0a01de0..2c3eeaa 100644
--- a/energy_management_ui/src/views/power-statistics-analyse/pari-passu/LineChart.vue
+++ b/energy_management_ui/src/views/power-statistics-analyse/pari-passu/LineChart.vue
@@ -107,7 +107,10 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
series: [
{
diff --git a/energy_management_ui/src/views/power-statistics-analyse/pari-passu/index.vue b/energy_management_ui/src/views/power-statistics-analyse/pari-passu/index.vue
index 92444df..b858830 100644
--- a/energy_management_ui/src/views/power-statistics-analyse/pari-passu/index.vue
+++ b/energy_management_ui/src/views/power-statistics-analyse/pari-passu/index.vue
@@ -246,10 +246,10 @@
});
},
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 105 + "px"
+ height: window.innerHeight - 155 + "px"
};
},
@@ -341,7 +341,7 @@
margin-bottom: 0;
}
.chart-list {
- margin-top: 16px;
+ // margin-top: 16px;
::v-deep .el-card__body {
padding: 10px 12px;
}
diff --git a/energy_management_ui/src/views/power-statistics-analyse/per-passu/index.vue b/energy_management_ui/src/views/power-statistics-analyse/per-passu/index.vue
index f178e64..2ca755d 100644
--- a/energy_management_ui/src/views/power-statistics-analyse/per-passu/index.vue
+++ b/energy_management_ui/src/views/power-statistics-analyse/per-passu/index.vue
@@ -246,10 +246,10 @@
});
},
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
+ this.bodyStyle.height = window.innerHeight - 185 + "px";
this.bodyStyleRight = {
...this.bodyStyle,
- height: window.innerHeight - 105 + "px"
+ height: window.innerHeight - 155 + "px"
};
},
@@ -341,7 +341,7 @@
margin-bottom: 0;
}
.chart-list {
- margin-top: 16px;
+ // margin-top: 16px;
::v-deep .el-card__body {
padding: 10px 12px;
}
diff --git a/energy_management_ui/src/views/reportForm/annualReport/index.vue b/energy_management_ui/src/views/reportForm/annualReport/index.vue
index 8576371..2391852 100644
--- a/energy_management_ui/src/views/reportForm/annualReport/index.vue
+++ b/energy_management_ui/src/views/reportForm/annualReport/index.vue
@@ -1,8 +1,16 @@
<template>
<div class="app-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-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨鑳芥簮鍝佺">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨鑳芥簮鍝佺"
+ >
<el-option
v-for="dict in indexCategoryOptions"
:key="dict.dictValue"
@@ -17,152 +25,217 @@
</el-radio-group>
</el-form-item>-->
<el-form-item label="缁熻鏃堕棿">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- type="year"
- value-format="yyyy"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ type="year"
+ value-format="yyyy"
+ 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="warning" icon="el-icon-download" size="mini" @click="handleExport">瀵煎嚭</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-button
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ @click="handleExport"
+ >瀵煎嚭</el-button
+ >
</el-form-item>
</el-form>
- <el-table :data="list" border style="width: 100%; margin-top: 20px" class="tableList" >
- <el-table-column fixed prop="indexName" align="center" label="鑳芥簮鍚嶇О" min-width="240px"></el-table-column>
- <el-table-column label="1鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value1)}}</template></el-table-column>
- <el-table-column label="2鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value2)}}</template></el-table-column>
- <el-table-column label="3鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value3)}}</template></el-table-column>
- <el-table-column label="4鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value4)}}</template></el-table-column>
- <el-table-column label="5鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value5)}}</template></el-table-column>
- <el-table-column label="6鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value6)}}</template></el-table-column>
- <el-table-column label="7鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value7)}}</template></el-table-column>
- <el-table-column label="8鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value8)}}</template></el-table-column>
- <el-table-column label="9鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value9)}}</template></el-table-column>
- <el-table-column label="10鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value10)}}</template></el-table-column>
- <el-table-column label="11鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value11)}}</template></el-table-column>
- <el-table-column label="12鏈�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value12)}}</template></el-table-column>
+ <el-table :data="list" border style="width: 100%; margin-top: 20px">
+ <el-table-column
+ fixed
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鎸囨爣鍚嶇О"
+ min-width="240px"
+ ></el-table-column>
+ <el-table-column label="1鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value1)
+ }}</template></el-table-column
+ >
+ <el-table-column label="2鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value2)
+ }}</template></el-table-column
+ >
+ <el-table-column label="3鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value3)
+ }}</template></el-table-column
+ >
+ <el-table-column label="4鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value4)
+ }}</template></el-table-column
+ >
+ <el-table-column label="5鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value5)
+ }}</template></el-table-column
+ >
+ <el-table-column label="6鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value6)
+ }}</template></el-table-column
+ >
+ <el-table-column label="7鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value7)
+ }}</template></el-table-column
+ >
+ <el-table-column label="8鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value8)
+ }}</template></el-table-column
+ >
+ <el-table-column label="9鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value9)
+ }}</template></el-table-column
+ >
+ <el-table-column label="10鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value10)
+ }}</template></el-table-column
+ >
+ <el-table-column label="11鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value11)
+ }}</template></el-table-column
+ >
+ <el-table-column label="12鏈�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value12)
+ }}</template></el-table-column
+ >
</el-table>
-
</div>
</template>
<script>
- import { reportStatisticsList,exportList} from "@/api/reportForm/annualReport/annualReport";
+import {
+ reportStatisticsList,
+ exportList
+} from "@/api/reportForm/annualReport/annualReport";
- export default {
- data() {
- return {
- list: [],
- skinName:"",
- queryParams:{
- timeType:"MONTH",
- energyId:undefined,
- dataTime:undefined,
- beginTime:undefined,
- endTime:undefined,
- indexCode:undefined,
- indexStorageId:undefined,
- },
- indexCategoryOptions:[],
- };
- },
- created() {
- this.modelCode=this.$route.query.modelCode;
- /*this.getDicts("report_form").then(response => {
+export default {
+ data() {
+ return {
+ list: [],
+ skinName: "",
+ queryParams: {
+ timeType: "MONTH",
+ energyId: undefined,
+ dataTime: undefined,
+ beginTime: undefined,
+ endTime: undefined,
+ indexCode: undefined,
+ indexStorageId: undefined
+ },
+ indexCategoryOptions: []
+ };
+ },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ /*this.getDicts("report_form").then(response => {
this.dateTypeOptions = response.data;
this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
});*/
- this.getDicts("energy_type").then(response => {
- this.indexCategoryOptions = response.data;
- //this.queryParams.indexStorageId = this.indexCategoryOptions[0].dictValue;
+ this.getDicts("energy_type").then(response => {
+ this.indexCategoryOptions = response.data;
+ //this.queryParams.indexStorageId = this.indexCategoryOptions[0].dictValue;
+ });
+ this.getConfigKey("report_statistics").then(response => {
+ this.skinName = response.msg;
+ });
+ this.getTime();
+ this.getList();
+ },
+ methods: {
+ /** 鏌ヨ閮ㄩ棬鍒楄〃 */
+ getList() {
+ //this.loading = true;
+ this.queryParams.indexCode = this.modelCode;
+ let times = this.queryParams.dataTime.slice(0, 4);
+ this.queryParams.beginTime = times + "-01-01 00:00:00";
+ this.queryParams.endTime = times + "-12-31 00:00:00";
+ reportStatisticsList(this.queryParams).then(response => {
+ this.list = response.data;
+ this.loading = false;
});
- this.getConfigKey("report_statistics").then(response => {
- this.skinName=response.msg;
- });
- this.getTime();
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
this.getList();
},
- methods: {
- /** 鏌ヨ閮ㄩ棬鍒楄〃 */
- getList() {
- //this.loading = true;
- this.queryParams.indexCode=this.modelCode;
- let times=this.queryParams.dataTime.slice(0,4);
- this.queryParams.beginTime=times+"-01-01 00:00:00"
- this.queryParams.endTime=times+"-12-31 00:00:00"
- reportStatisticsList(this.queryParams).then(response => {
- this.list=response.data;
- this.loading = false;
- });
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- queryParams.dataTime=queryParams.dataTime+"-01-01";
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤琛ㄦ暟鎹�?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ queryParams.dataTime = queryParams.dataTime + "-01-01";
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤琛ㄦ暟鎹�?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
return exportList(queryParams);
- }).then(response => {
+ })
+ .then(response => {
this.download(response.msg);
- }).catch(function () {
- });
- },
- handleTime(date){
- if(date=='MONTH'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='DAY'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
- }
- },
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime=year + '-' + month
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
- } else {
- realVal = '--'
- }
- return realVal
- },
+ })
+ .catch(function() {});
+ },
+ handleTime(date) {
+ if (date == "MONTH") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "DAY") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
+ }
+ },
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month;
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(this.skinName);
+ } else {
+ realVal = "--";
+ }
+ return realVal;
}
- };
+ }
+};
</script>
-<style scoped>
- .tableList th.is-leaf, .tableList td{
- border-bottom: 1px solid #000000 !important;
- border-right: 1px solid #000000 !important;
- }
- .tableList{
- border: 1px solid #000000 !important;
- }
-</style>
+<style scoped></style>
diff --git a/energy_management_ui/src/views/reportForm/dailyReport/index.vue b/energy_management_ui/src/views/reportForm/dailyReport/index.vue
index 85176c7..18fcda9 100644
--- a/energy_management_ui/src/views/reportForm/dailyReport/index.vue
+++ b/energy_management_ui/src/views/reportForm/dailyReport/index.vue
@@ -1,8 +1,16 @@
<template>
<div class="app-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-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨鑳芥簮鍝佺">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨鑳芥簮鍝佺"
+ >
<el-option
v-for="dict in indexCategoryOptions"
:key="dict.dictValue"
@@ -17,159 +25,274 @@
</el-radio-group>
</el-form-item>-->
<el-form-item label="缁熻鏃堕棿">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- type="date"
- value-format="yyyy-MM-dd"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ type="date"
+ value-format="yyyy-MM-dd"
+ 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="warning" icon="el-icon-download" size="mini" v-hasPermi="['report:dailyReport:export']" @click="handleExport">瀵煎嚭</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-button
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ v-hasPermi="['report:dailyReport:export']"
+ @click="handleExport"
+ >瀵煎嚭</el-button
+ >
</el-form-item>
</el-form>
- <el-table :data="list" border style="width: 100%; margin-top: 20px;" class="tableList" >
- <el-table-column fixed prop="indexName" fixed align="center" label="鑳芥簮鍚嶇О" min-width="240px"></el-table-column>
- <el-table-column label="0鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value0)}}</template></el-table-column>
- <el-table-column label="1鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value1)}}</template></el-table-column>
- <el-table-column label="2鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value2)}}</template></el-table-column>
- <el-table-column label="3鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value3)}}</template></el-table-column>
- <el-table-column label="4鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value4)}}</template></el-table-column>
- <el-table-column label="5鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value5)}}</template></el-table-column>
- <el-table-column label="6鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value6)}}</template></el-table-column>
- <el-table-column label="7鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value7)}}</template></el-table-column>
- <el-table-column label="8鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value8)}}</template></el-table-column>
- <el-table-column label="9鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value9)}}</template></el-table-column>
- <el-table-column label="10鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value10)}}</template></el-table-column>
- <el-table-column label="11鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value11)}}</template></el-table-column>
- <el-table-column label="12鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value12)}}</template></el-table-column>
- <el-table-column label="13鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value13)}}</template></el-table-column>
- <el-table-column label="14鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value14)}}</template></el-table-column>
- <el-table-column label="15鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value15)}}</template></el-table-column>
- <el-table-column label="16鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value16)}}</template></el-table-column>
- <el-table-column label="17鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value17)}}</template></el-table-column>
- <el-table-column label="18鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value18)}}</template></el-table-column>
- <el-table-column label="19鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value19)}}</template></el-table-column>
- <el-table-column label="20鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value20)}}</template></el-table-column>
- <el-table-column label="21鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value21)}}</template></el-table-column>
- <el-table-column label="22鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value22)}}</template></el-table-column>
- <el-table-column label="23鏃�" align="center" min-width="140px"> <template slot-scope="scope">{{numFilter(scope.row.value23)}}</template></el-table-column>
+ <el-table :data="list" border style="width: 100%; margin-top: 20px;">
+ <el-table-column
+ fixed
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鎸囨爣鍚嶇О"
+ min-width="240px"
+ ></el-table-column>
+ <el-table-column label="0鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value0)
+ }}</template></el-table-column
+ >
+ <el-table-column label="1鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value1)
+ }}</template></el-table-column
+ >
+ <el-table-column label="2鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value2)
+ }}</template></el-table-column
+ >
+ <el-table-column label="3鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value3)
+ }}</template></el-table-column
+ >
+ <el-table-column label="4鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value4)
+ }}</template></el-table-column
+ >
+ <el-table-column label="5鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value5)
+ }}</template></el-table-column
+ >
+ <el-table-column label="6鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value6)
+ }}</template></el-table-column
+ >
+ <el-table-column label="7鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value7)
+ }}</template></el-table-column
+ >
+ <el-table-column label="8鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value8)
+ }}</template></el-table-column
+ >
+ <el-table-column label="9鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value9)
+ }}</template></el-table-column
+ >
+ <el-table-column label="10鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value10)
+ }}</template></el-table-column
+ >
+ <el-table-column label="11鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value11)
+ }}</template></el-table-column
+ >
+ <el-table-column label="12鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value12)
+ }}</template></el-table-column
+ >
+ <el-table-column label="13鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value13)
+ }}</template></el-table-column
+ >
+ <el-table-column label="14鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value14)
+ }}</template></el-table-column
+ >
+ <el-table-column label="15鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value15)
+ }}</template></el-table-column
+ >
+ <el-table-column label="16鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value16)
+ }}</template></el-table-column
+ >
+ <el-table-column label="17鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value17)
+ }}</template></el-table-column
+ >
+ <el-table-column label="18鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value18)
+ }}</template></el-table-column
+ >
+ <el-table-column label="19鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value19)
+ }}</template></el-table-column
+ >
+ <el-table-column label="20鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value20)
+ }}</template></el-table-column
+ >
+ <el-table-column label="21鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value21)
+ }}</template></el-table-column
+ >
+ <el-table-column label="22鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value22)
+ }}</template></el-table-column
+ >
+ <el-table-column label="23鏃�" align="center" min-width="140px">
+ <template slot-scope="scope">{{
+ numFilter(scope.row.value23)
+ }}</template></el-table-column
+ >
</el-table>
</div>
</template>
<script>
- import { reportStatisticsList,exportList} from "@/api/reportForm/dailyReport/dailyReport";
+import {
+ reportStatisticsList,
+ exportList
+} from "@/api/reportForm/dailyReport/dailyReport";
- export default {
- data() {
- return {
- list: [],
- skinName:"",
- queryParams:{
- timeType:"HOUR",
- energyId:undefined,
- dataTime:undefined,
- beginTime:undefined,
- endTime:undefined,
- indexCode:undefined,
- indexStorageId:undefined,
- },
- indexCategoryOptions:[],
- };
- },
- created() {
- this.modelCode=this.$route.query.modelCode;
- /*this.getDicts("report_form").then(response => {
+export default {
+ data() {
+ return {
+ list: [],
+ skinName: "",
+ queryParams: {
+ timeType: "HOUR",
+ energyId: undefined,
+ dataTime: undefined,
+ beginTime: undefined,
+ endTime: undefined,
+ indexCode: undefined,
+ indexStorageId: undefined
+ },
+ indexCategoryOptions: []
+ };
+ },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ /*this.getDicts("report_form").then(response => {
this.dateTypeOptions = response.data;
this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
});*/
- this.getDicts("energy_type").then(response => {
- this.indexCategoryOptions = response.data;
- //this.queryParams.indexStorageId = this.indexCategoryOptions[0].dictValue;
+ this.getDicts("energy_type").then(response => {
+ this.indexCategoryOptions = response.data;
+ //this.queryParams.indexStorageId = this.indexCategoryOptions[0].dictValue;
+ });
+ this.getConfigKey("report_statistics").then(response => {
+ this.skinName = response.msg;
+ });
+ this.getTime();
+ this.getList();
+ },
+ methods: {
+ /** 鏌ヨ閮ㄩ棬鍒楄〃 */
+ getList() {
+ //this.loading = true;
+ this.queryParams.indexCode = this.modelCode;
+ reportStatisticsList(this.queryParams).then(response => {
+ this.list = response.data;
+ this.loading = false;
});
- this.getConfigKey("report_statistics").then(response => {
- this.skinName=response.msg;
- });
- this.getTime();
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
this.getList();
},
- methods: {
- /** 鏌ヨ閮ㄩ棬鍒楄〃 */
- getList() {
- //this.loading = true;
- this.queryParams.indexCode=this.modelCode;
- reportStatisticsList(this.queryParams).then(response => {
- this.list=response.data;
- this.loading = false;
- });
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤琛ㄦ暟鎹�?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤琛ㄦ暟鎹�?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
return exportList(queryParams);
- }).then(response => {
+ })
+ .then(response => {
this.download(response.msg);
- }).catch(function () {
- });
- },
- handleTime(date){
- if(date=='MONTH'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='DAY'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
- }
- },
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime=year + '-' + month + '-' + date
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
- } else {
- realVal = '--'
- }
- return realVal
- },
+ })
+ .catch(function() {});
+ },
+ handleTime(date) {
+ if (date == "MONTH") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "DAY") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
+ }
+ },
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month + "-" + date;
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(this.skinName);
+ } else {
+ realVal = "--";
+ }
+ return realVal;
}
- };
+ }
+};
</script>
-<style scoped>
- .tableList th.is-leaf, .tableList td{
- border-bottom: 1px solid #000000 !important;
- border-right: 1px solid #000000 !important;
- }
- .tableList{
- border: 1px solid #000000 !important;
- }
-</style>
+<style scoped></style>
diff --git a/energy_management_ui/src/views/reportForm/monthlyReport/index.vue b/energy_management_ui/src/views/reportForm/monthlyReport/index.vue
index b6ce4b8..d4cc70c 100644
--- a/energy_management_ui/src/views/reportForm/monthlyReport/index.vue
+++ b/energy_management_ui/src/views/reportForm/monthlyReport/index.vue
@@ -1,8 +1,16 @@
<template>
<div class="app-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-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨鑳芥簮鍝佺">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨鑳芥簮鍝佺"
+ >
<el-option
v-for="dict in indexCategoryOptions"
:key="dict.dictValue"
@@ -17,230 +25,169 @@
</el-radio-group>
</el-form-item>-->
<el-form-item label="缁熻鏃堕棿">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- type="month"
- value-format="yyyy-MM"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ type="month"
+ value-format="yyyy-MM"
+ 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="warning" icon="el-icon-download" size="mini" @click="handleExport">瀵煎嚭</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-button
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ @click="handleExport"
+ >瀵煎嚭</el-button
+ >
</el-form-item>
</el-form>
- <div class="el-table el-table--fit el-table--scrollable-x el-table--enable-row-hover el-table--medium" >
- <div class="el-table__body-wrapper is-scrolling-left">
- <table class="el-table__body tableList" cellspacing="0" cellpadding="0" style="width: 2600px">
- <thead>
- <tr v-for="item in tableHead" >
- <td style="background: #dfe6ec;">鑳芥簮鎸囨爣鍚嶇О</td>
- <td>{{item.value1}}</td>
- <td>{{item.value2}}</td>
- <td>{{item.value3}}</td>
- <td>{{item.value4}}</td>
- <td>{{item.value5}}</td>
- <td>{{item.value6}}</td>
- <td>{{item.value7}}</td>
- <td>{{item.value8}}</td>
- <td>{{item.value9}}</td>
- <td>{{item.value10}}</td>
- <td>{{item.value11}}</td>
- <td>{{item.value12}}</td>
- <td>{{item.value13}}</td>
- <td>{{item.value14}}</td>
- <td>{{item.value15}}</td>
- <td>{{item.value16}}</td>
- <td>{{item.value17}}</td>
- <td>{{item.value18}}</td>
- <td>{{item.value19}}</td>
- <td>{{item.value20}}</td>
- <td>{{item.value21}}</td>
- <td>{{item.value22}}</td>
- <td>{{item.value23}}</td>
- <td>{{item.value24}}</td>
- <td>{{item.value25}}</td>
- <td>{{item.value26}}</td>
- <td>{{item.value27}}</td>
- <td v-if="item.value29 !=null">{{item.value28}}</td>
- <td v-if="item.value29 !=null">{{item.value29}}</td>
- <td v-if="item.value30 !=null">{{item.value30}}</td>
- <td v-if="item.value31 !=null">{{item.value31}}</td>
- </tr>
- </thead>
- <tbody>
- <tr v-for="data in tableData">
- <td>{{data.indexName}}</td>
- <td>{{numFilter(data.value1)}}</td>
- <td>{{numFilter(data.value2)}}</td>
- <td>{{numFilter(data.value3)}}</td>
- <td>{{numFilter(data.value4)}}</td>
- <td>{{numFilter(data.value5)}}</td>
- <td>{{numFilter(data.value6)}}</td>
- <td>{{numFilter(data.value7)}}</td>
- <td>{{numFilter(data.value8)}}</td>
- <td>{{numFilter(data.value9)}}</td>
- <td>{{numFilter(data.value10)}}</td>
- <td>{{numFilter(data.value11)}}</td>
- <td>{{numFilter(data.value12)}}</td>
- <td>{{numFilter(data.value13)}}</td>
- <td>{{numFilter(data.value14)}}</td>
- <td>{{numFilter(data.value15)}}</td>
- <td>{{numFilter(data.value16)}}</td>
- <td>{{numFilter(data.value17)}}</td>
- <td>{{numFilter(data.value18)}}</td>
- <td>{{numFilter(data.value19)}}</td>
- <td>{{numFilter(data.value20)}}</td>
- <td>{{numFilter(data.value21)}}</td>
- <td>{{numFilter(data.value22)}}</td>
- <td>{{numFilter(data.value23)}}</td>
- <td>{{numFilter(data.value24)}}</td>
- <td>{{numFilter(data.value25)}}</td>
- <td>{{numFilter(data.value26)}}</td>
- <td>{{numFilter(data.value27)}}</td>
- <td v-if="data.count>=28">{{numFilter(data.value28)}}</td>
- <td v-if="data.count>=29">{{numFilter(data.value29)}}</td>
- <td v-if="data.count>=30">{{numFilter(data.value30)}}</td>
- <td v-if="data.count==31">{{numFilter(data.value31)}}</td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
+ <el-table :data="tableData" border style="width: 100%;margin-top: 20px">
+ <el-table-column
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鎸囨爣鍚嶇О"
+ min-width="220"
+ fixed="left"
+ />
+
+ <el-table-column
+ v-for="index in 31"
+ :key="index"
+ :label="`${index}鏃"
+ align="center"
+ min-width="140px"
+ >
+ <template slot-scope="scope">
+ <span style="font-size: 12px">
+ {{ numFilter(scope.row[`value${index}`]) || "--" }}
+ </span>
+ </template>
+ </el-table-column>
+ </el-table>
</div>
</template>
<script>
- import { reportStatisticsList,exportList} from "@/api/reportForm/monthlyReport/monthlyReport";
- export default {
- data() {
- return {
- tableData: [],
- tableHead:[],
- skinName:"",
- queryParams:{
- timeType:"DAY",
- energyId:undefined,
- dataTime:undefined,
- beginTime:undefined,
- endTime:undefined,
- indexCode:undefined,
- indexStorageId:undefined,
- },
- indexCategoryOptions:[],
- };
- },
- created() {
- this.modelCode=this.$route.query.modelCode;
- /*this.getDicts("report_form").then(response => {
+import {
+ reportStatisticsList,
+ exportList
+} from "@/api/reportForm/monthlyReport/monthlyReport";
+export default {
+ data() {
+ return {
+ tableData: [],
+ tableHead: [],
+ skinName: "",
+ queryParams: {
+ timeType: "DAY",
+ energyId: undefined,
+ dataTime: undefined,
+ beginTime: undefined,
+ endTime: undefined,
+ indexCode: undefined,
+ indexStorageId: undefined
+ },
+ indexCategoryOptions: []
+ };
+ },
+ created() {
+ this.modelCode = this.$route.query.modelCode;
+ /*this.getDicts("report_form").then(response => {
this.dateTypeOptions = response.data;
this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
});*/
- this.getDicts("energy_type").then(response => {
- this.indexCategoryOptions = response.data;
- //this.queryParams.indexStorageId = this.indexCategoryOptions[0].dictValue;
+ this.getDicts("energy_type").then(response => {
+ this.indexCategoryOptions = response.data;
+ //this.queryParams.indexStorageId = this.indexCategoryOptions[0].dictValue;
+ });
+ this.getConfigKey("report_statistics").then(response => {
+ this.skinName = response.msg;
+ });
+ this.getTime();
+ this.getList();
+ },
+ methods: {
+ /** 鏌ヨ閮ㄩ棬鍒楄〃 */
+ getList() {
+ //this.loading = true;
+ this.queryParams.indexCode = this.modelCode;
+ reportStatisticsList(this.queryParams).then(response => {
+ console.log(response.data);
+ this.tableData = response.data.tabledata;
+ this.tableHead = response.data.tablehead;
+ //this.list=response.data;
+ this.loading = false;
});
- this.getConfigKey("report_statistics").then(response => {
- this.skinName=response.msg;
- });
- this.getTime();
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
this.getList();
},
- methods: {
- /** 鏌ヨ閮ㄩ棬鍒楄〃 */
- getList() {
- //this.loading = true;
- this.queryParams.indexCode=this.modelCode;
- reportStatisticsList(this.queryParams).then(response => {
- console.log(response.data)
- this.tableData=response.data.tabledata
- this.tableHead=response.data.tablehead
- //this.list=response.data;
- this.loading = false;
- });
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.resetForm("queryForm");
- this.handleQuery();
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤琛ㄦ暟鎹�?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤琛ㄦ暟鎹�?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
return exportList(queryParams);
- }).then(response => {
+ })
+ .then(response => {
this.download(response.msg);
- }).catch(function () {
- });
- },
- handleTime(date){
- if(date=='MONTH'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='DAY'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
- }
- },
- getTime(){
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime=year + '-' + month
- },
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '' ;
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
- } else {
- realVal = '--'
- }
- return realVal
- },
+ })
+ .catch(function() {});
+ },
+ handleTime(date) {
+ if (date == "MONTH") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "DAY") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
+ }
+ },
+ getTime() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month;
+ },
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(this.skinName);
+ } else {
+ realVal = "--";
+ }
+ return realVal;
}
- };
+ }
+};
</script>
-<style scoped>
- .tableList th.is-leaf, .tableList td{
- text-align: center;
- width:180px !important;
- border-bottom: 1px solid #000000 !important;
- border-right: 1px solid #000000 !important;
- }
- .tableList{
- border: 1px solid #000000 !important;
- max-height: 300px;
- }
-
-/* .tableList thead tr > th:first-child,*/
- .tableList tr > td:first-child {
- position: sticky;
- left: 0;
- z-index: 1;
- background: #fff;
- width: 240px;
- }
- .tableList thead tr {
- position: sticky;
- top: 0;
- z-index: 2;
- background: #dfe6ec;
- }
-</style>
+<style scoped></style>
diff --git a/energy_management_ui/src/views/reportForm/statements/BarChart.vue b/energy_management_ui/src/views/reportForm/statements/BarChart.vue
index d43373c..7f11346 100644
--- a/energy_management_ui/src/views/reportForm/statements/BarChart.vue
+++ b/energy_management_ui/src/views/reportForm/statements/BarChart.vue
@@ -73,7 +73,11 @@
type: "shadow" // 'shadow' as default; can also be 'line' or 'shadow'
}
},
- legend: {},
+ legend: {
+ textStyle: {
+ color: "#fff"
+ }
+ },
grid: {
left: "3%",
right: "4%",
diff --git a/energy_management_ui/src/views/reportForm/statements/index.vue b/energy_management_ui/src/views/reportForm/statements/index.vue
index 43c53b4..e0f6216 100644
--- a/energy_management_ui/src/views/reportForm/statements/index.vue
+++ b/energy_management_ui/src/views/reportForm/statements/index.vue
@@ -298,11 +298,7 @@
this.handleQuery();
},
setCharts() {
- this.bodyStyle.height = window.innerHeight - 155 + "px";
- this.bodyStyleRight = {
- ...this.bodyStyle,
- height: window.innerHeight - 100 + "px"
- };
+ this.bodyStyle.height = window.innerHeight - 215 + "px";
}
}
};
diff --git a/energy_management_ui/src/views/stage/alarm/LinChart.vue b/energy_management_ui/src/views/stage/alarm/LinChart.vue
index ba88800..06ebe8f 100644
--- a/energy_management_ui/src/views/stage/alarm/LinChart.vue
+++ b/energy_management_ui/src/views/stage/alarm/LinChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
/*import resize from './mixins/resize'*/
export default {
- /* mixins: [resize],*/
+ /* mixins: [resize],*/
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
autoResize: {
type: Boolean,
@@ -34,49 +34,51 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
setOptions({ expectedData, actualData } = {}) {
this.chart.setOption({
-
title: {
- text: '鍏宠仈鐐逛綅鑳借��(鍗曚綅: Kwh)'
+ text: "鍏宠仈鐐逛綅鑳借��(鍗曚綅: Kwh)"
},
tooltip: {
- trigger: 'axis'
+ trigger: "axis"
},
legend: {
- data: ['FT01', 'FT02' , 'FT03' , 'FT04']
+ data: ["FT01", "FT02", "FT03", "FT04"],
+ textStyle: {
+ color: "#fff"
+ }
},
grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
+ left: "3%",
+ right: "4%",
+ bottom: "3%",
containLabel: true
},
toolbox: {
@@ -85,41 +87,41 @@
}
},
xAxis: {
- type: 'category',
+ type: "category",
boundaryGap: false,
- data: ['2鏈�1鏃�', '2鏈�2鏃�', '2鏈�3鏃�', '2鏈�4鏃�']
+ data: ["2鏈�1鏃�", "2鏈�2鏃�", "2鏈�3鏃�", "2鏈�4鏃�"]
},
yAxis: {
- type: 'value'
+ type: "value"
},
series: [
{
- name: 'FT01',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT01",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 172, 181, 224]
},
{
- name: 'FT02',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT02",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 182, 191, 234]
},
{
- name: 'FT03',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT03",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 182, 191, 234]
},
{
- name: 'FT04',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT04",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 182, 191, 234, 290]
- },
+ }
]
- })
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/stage/alarm/alarmIndex.vue b/energy_management_ui/src/views/stage/alarm/alarmIndex.vue
index d20c304..2cb4d1b 100644
--- a/energy_management_ui/src/views/stage/alarm/alarmIndex.vue
+++ b/energy_management_ui/src/views/stage/alarm/alarmIndex.vue
@@ -2,397 +2,473 @@
<div class="app-container" style="padding:0">
<el-card class="box-card">
<div slot="header" class="clearfix">
- <span>{{currentNode?currentNode.label:''}}--鑺傜偣璁剧疆</span>
+ <span>{{ currentNode ? currentNode.label : "" }}--鑺傜偣璁剧疆</span>
</div>
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
- <el-form-item label="鎸囨爣缂栫爜" prop="name">
- <el-select v-model="value" multiple filterable allow-create default-first-option placeholder="璇疯緭鍏ヤ綅鍙�">
- <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
- </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="鎸囨爣鍚嶇О" prop="code">
- <el-select v-model="values" multiple filterable allow-create default-first-option placeholder="璇疯緭鍏ユ寚鏍囧悕绉�">
- <el-option v-for="item in option" :key="item.values" :label="item.label" :value="item.values">
- </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="鏃堕棿">
- <el-date-picker
- v-model="dateRange"
- size="small"
- style="width: 240px"
- value-format="yyyy-MM-dd"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- ></el-date-picker>
- </el-form-item>
- <el-form-item label="鏄惁澶勭悊" prop="">
- <el-select v-model="value" placeholder="璇烽�夋嫨鏄惁澶勭悊" clearable size="small">
- <el-option
- v-for="dict in value"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
- />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button>
- </el-form-item>
- </el-form>
- <el-row :gutter="10" class="mb8">
- <el-col :span="1.5">
- <el-button
- type="warning"
- icon="el-icon-download"
- size="mini"
- @click=""
- v-hasPermi="['']"
- >瀵煎嚭
- </el-button>
- </el-col>
- </el-row>
- <el-table :data="tableData" v-loading="loading" border @selection-change="" @row-click="openDlog">
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="name" />
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="number"/>
- <el-table-column label="瀹為檯鍊�" align="center" prop="value"/>
- <el-table-column label="瓒呴檺鐧惧垎姣�" align="center" prop="values"/>
- <el-table-column label="鏄惁澶勭悊" align="center" prop="code"/>
- <pagination
- v-show="total>0"
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getList"
- />
- </el-table>
- <!--寮规-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false" >
- <el-table :data="tableData" :show-header="hiddenTableHeader" border="1px" >
- <el-table-column label="鎶ヨ鏃堕棿"prop="oa" />
- <el-table-column label="鎶ヨ鍊�" prop="ob" />
- <el-table-column label="瀹為檯鍊�" prop="oc" />
- </el-table>
- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
- <line-chart :chart-data="lineChartData" />
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
+ <el-form-item label="鎸囨爣缂栫爜" prop="name">
+ <el-select
+ v-model="value"
+ multiple
+ filterable
+ allow-create
+ default-first-option
+ placeholder="璇疯緭鍏ヤ綅鍙�"
+ >
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鎸囨爣鍚嶇О" prop="code">
+ <el-select
+ v-model="values"
+ multiple
+ filterable
+ allow-create
+ default-first-option
+ placeholder="璇疯緭鍏ユ寚鏍囧悕绉�"
+ >
+ <el-option
+ v-for="item in option"
+ :key="item.values"
+ :label="item.label"
+ :value="item.values"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鏃堕棿">
+ <el-date-picker
+ v-model="dateRange"
+ size="small"
+ style="width: 240px"
+ value-format="yyyy-MM-dd"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item label="鏄惁澶勭悊" prop="">
+ <el-select
+ v-model="value"
+ placeholder="璇烽�夋嫨鏄惁澶勭悊"
+ clearable
+ size="small"
+ >
+ <el-option
+ v-for="dict in value"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鎼滅储</el-button
+ >
+ </el-form-item>
+ </el-form>
+ <el-row :gutter="10" class="mb8">
+ <el-col :span="1.5">
+ <el-button
+ type="warning"
+ icon="el-icon-download"
+ size="mini"
+ @click=""
+ v-hasPermi="['']"
+ >瀵煎嚭
+ </el-button>
+ </el-col>
</el-row>
- <el-table :data="tableData" :show-header="hiddenTableHeader" border="1px" >
- <el-table-column label="鎶ヨ鏃堕棿"prop="one" />
- <el-table-column label="鎶ヨ鍊�" prop="two" />
- <el-table-column label="瀹為檯鍊�" prop="three" />
- <el-table-column label="瀹為檯鍊�" prop="four" />
- <el-table-column label="瀹為檯鍊�" prop="five" />
-
+ <el-table
+ :data="tableData"
+ v-loading="loading"
+ border
+ @selection-change=""
+ @row-click="openDlog"
+ >
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="name" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="number" />
+ <el-table-column label="瀹為檯鍊�" align="center" prop="value" />
+ <el-table-column label="瓒呴檺鐧惧垎姣�" align="center" prop="values" />
+ <el-table-column label="鏄惁澶勭悊" align="center" prop="code" />
+ <pagination
+ v-show="total > 0"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
+ />
</el-table>
- <div slot="footer" class="dialog-footer">
- <el-button @click="cancel">鍙� 娑�</el-button>
- </div>
- </el-dialog>
+ <!--寮规-->
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ >
+ <el-table
+ :data="tableData"
+ :show-header="hiddenTableHeader"
+ border="1px"
+ >
+ <el-table-column label="鎶ヨ鏃堕棿" prop="oa" />
+ <el-table-column label="鎶ヨ鍊�" prop="ob" />
+ <el-table-column label="瀹為檯鍊�" prop="oc" />
+ </el-table>
+ <el-row style="padding:16px 16px 0;margin-bottom:32px;">
+ <line-chart :chart-data="lineChartData" />
+ </el-row>
+ <el-table
+ :data="tableData"
+ :show-header="hiddenTableHeader"
+ border="1px"
+ >
+ <el-table-column label="鎶ヨ鏃堕棿" prop="one" />
+ <el-table-column label="鎶ヨ鍊�" prop="two" />
+ <el-table-column label="瀹為檯鍊�" prop="three" />
+ <el-table-column label="瀹為檯鍊�" prop="four" />
+ <el-table-column label="瀹為檯鍊�" prop="five" />
+ </el-table>
+ <div slot="footer" class="dialog-footer">
+ <el-button @click="cancel">鍙� 娑�</el-button>
+ </div>
+ </el-dialog>
</el-card>
</div>
</template>
-
<script>
- const lineChartData = {
- newVisitis: {
- }
- }
- import {
- addEnergyindex,
- delEnergyindex,
- exportEnergyindex,
- getEnergyindex,
- listEnergyindex,
- updateEnergyindex
- } from "@/api/basicsetting/energyindex";
- import LineChart from './LinChart'
- import {List} from "@/api/basicsetting/state"
+const lineChartData = {
+ newVisitis: {}
+};
+import {
+ addEnergyindex,
+ delEnergyindex,
+ exportEnergyindex,
+ getEnergyindex,
+ listEnergyindex,
+ updateEnergyindex
+} from "@/api/basicsetting/energyindex";
+import LineChart from "./LinChart";
+import { List } from "@/api/basicsetting/state";
-
-
- export default {
- name: 'energyIndex',
- components: {
- LineChart
- },
- data() {
- return {
- options: [{
- value: 'FT01',
- label: 'FT01'
- }, {
- value: 'FT02',
- label: 'FT02'
- }, {
- value: 'FT03',
- label: 'FT03'
- }, {
- value: 'FT04',
- label: 'FT04'
- }, {
- value: 'BUG',
- label: 'BUG'
- }],
- value: [],
- option: [{
- values: '98013',
- label: '98013'
- }, {
- values: '98014',
- label: '98014'
- }, {
- values: '98015',
- label: '98015'
- }, {
- values: '98016',
- label: '98016'
- }, {
- values: '98017',
- label: '98017'
- }],
- facilityType:'1',
- values: [],
- currentNode: '',
- hiddenTableHeader:false,
- lineChartData: lineChartData.newVisitis,
- // 閬僵灞�
- loading: false,
- // 閫変腑鏁扮粍
- ids: [],
- dateRange: [],
- names: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 0,
- // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
- List: [],
- energyindexList: [],
- // 寮瑰嚭灞傛爣棰�
- title: "",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- // 涓婚敭瀛楀吀
- indexIdOptions: [],
- // 鎸囨爣鍚嶇О瀛楀吀
- nameOptions: [],
- // 鎸囨爣缂栫爜瀛楀吀
- codeOptions: [],
- // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀
- indexCategoryOptions: [],
- // 澶囨敞瀛楀吀
- remarkOptions: [],
- // 鍗曚綅瀛楀吀
- unitIdOptions: [],
- // 鏌ヨ鍙傛暟
- lineChartData:{
- newVisitis:null,
+export default {
+ name: "energyIndex",
+ components: {
+ LineChart
+ },
+ data() {
+ return {
+ options: [
+ {
+ value: "FT01",
+ label: "FT01"
},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- nodeId: undefined
+ {
+ value: "FT02",
+ label: "FT02"
},
-
- tableData: [],
- datas: [{
- name: 'FT01',
- number: '98013',
- value: '500',
- values: '20%',
- code: '鏄�',
- what: '5',
- one: '浣嶅彿',
- two: '2鏈�1鏃�',
- three: '2鏈�2鏃�',
- four : '2鏈�3鏃�',
- five :'2鏈�4鏃�',
- oa : '浣嶅彿',
- ob : '鎸囨爣鍚嶇О',
- oc : '瀹為檯鍊�',
-
+ {
+ value: "FT03",
+ label: "FT03"
},
+ {
+ value: "FT04",
+ label: "FT04"
+ },
+ {
+ value: "BUG",
+ label: "BUG"
+ }
+ ],
+ value: [],
+ option: [
+ {
+ values: "98013",
+ label: "98013"
+ },
+ {
+ values: "98014",
+ label: "98014"
+ },
+ {
+ values: "98015",
+ label: "98015"
+ },
+ {
+ values: "98016",
+ label: "98016"
+ },
+ {
+ values: "98017",
+ label: "98017"
+ }
+ ],
+ facilityType: "1",
+ values: [],
+ currentNode: "",
+ hiddenTableHeader: false,
+ lineChartData: lineChartData.newVisitis,
+ // 閬僵灞�
+ loading: false,
+ // 閫変腑鏁扮粍
+ ids: [],
+ dateRange: [],
+ names: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
+ List: [],
+ energyindexList: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 涓婚敭瀛楀吀
+ indexIdOptions: [],
+ // 鎸囨爣鍚嶇О瀛楀吀
+ nameOptions: [],
+ // 鎸囨爣缂栫爜瀛楀吀
+ codeOptions: [],
+ // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀
+ indexCategoryOptions: [],
+ // 澶囨敞瀛楀吀
+ remarkOptions: [],
+ // 鍗曚綅瀛楀吀
+ unitIdOptions: [],
+ // 鏌ヨ鍙傛暟
+ lineChartData: {
+ newVisitis: null
+ },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ nodeId: undefined
+ },
+
+ tableData: [],
+ datas: [
+ {
+ name: "FT01",
+ number: "98013",
+ value: "500",
+ values: "20%",
+ code: "鏄�",
+ what: "5",
+ one: "浣嶅彿",
+ two: "2鏈�1鏃�",
+ three: "2鏈�2鏃�",
+ four: "2鏈�3鏃�",
+ five: "2鏈�4鏃�",
+ oa: "浣嶅彿",
+ ob: "鎸囨爣鍚嶇О",
+ oc: "瀹為檯鍊�"
+ },
+ {
+ name: "FT02",
+ number: "98014",
+ value: "500",
+ values: "20%",
+ code: "鏄�",
+ what: "5",
+ one: "F01",
+ two: "210",
+ three: "210",
+ four: "210",
+ five: "210",
+ oa: "F01",
+ ob: "1#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�",
+ oc: "3"
+ },
+ {
+ name: "FT03",
+ number: "98015",
+ value: "500",
+ values: "20%",
+ code: "鏄�",
+ what: "5",
+ one: "F02",
+ two: "210",
+ three: "172",
+ four: "181",
+ five: "224",
+ oa: "F02",
+ ob: "2#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�",
+ oc: "6"
+ },
+ {
+ name: "FT04",
+ number: "98016",
+ value: "500",
+ values: "35%",
+ code: "鍚�",
+ what: "5",
+ one: "F03",
+ two: "210",
+ three: "182",
+ four: "191",
+ five: "234",
+ oa: "F03",
+ ob: "3#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�",
+ oc: "5"
+ },
+ {
+ name: "BUG",
+ number: "98017",
+ value: "500",
+ values: "22%",
+ code: "鍚�",
+ what: "5",
+ one: "F04",
+ two: "210",
+ three: "182",
+ four: "191",
+ five: "234",
+ oa: "F04",
+ ob: "4#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�",
+ oc: "6"
+ }
+ ],
+
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ rules: {
+ name: [
+ { required: true, message: "鎸囨爣鍚嶇О涓嶈兘涓虹┖", trigger: "blur" },
+ { min: 2, max: 20, message: "闀垮害鍦� 2 鍒� 20 涓瓧绗�", trigger: "blur" }
+ ],
+ code: [
+ { required: true, message: "鎸囨爣缂栫爜涓嶈兘涓虹┖", trigger: "blur" },
{
- name: 'FT02',
- number: '98014',
- value: '500',
- values: '20%',
- code: '鏄�',
- what: '5',
- one: 'F01',
- two: '210',
- three: '210',
- four : '210',
- five :'210',
- oa : 'F01',
- ob : '1#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�',
- oc : '3',
+ min: 2,
+ max: 20,
+ message: "闀垮害鍦� 2 鍒� 20 涓瓧绗�",
+ trigger: "blur"
},
{
- name: 'FT03',
- number: '98015',
- value : '500',
- values: '20%',
- code: '鏄�',
- what: '5',
- one :'F02',
- two :'210',
- three :'172',
- four : '181',
- five :'224',
- oa : 'F02',
- ob : '2#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�',
- oc : '6',
-
- },
- {
- name: 'FT04',
- number: '98016',
- value : '500',
- values: '35%',
- code: '鍚�',
- what: '5',
- one :'F03',
- two :'210',
- three :'182',
- four : '191',
- five :'234',
- oa : 'F03',
- ob : '3#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�',
- oc : '5',
- },
- {
- name: 'BUG',
- number: '98017',
- value : '500',
- values: '22%',
- code: '鍚�',
- what: '5',
- one :'F04',
- two :'210',
- three :'182',
- four : '191',
- five :'234',
- oa : 'F04',
- ob : '4#绌哄帇鏈烘鐩告湁鍔熸�荤數鑳�',
- oc : '6',
-
+ pattern: /^[a-zA-Z][A-Za-z0-9_-]+$/,
+ message: "蹇呴』涓烘暟瀛椼�佸瓧姣嶃��- 鎴朹 锛屼笖棣栧瓧绗﹀彧鑳戒负瀛楁瘝"
}
],
-
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- rules: {
- name: [
- {required: true, message: "鎸囨爣鍚嶇О涓嶈兘涓虹┖", trigger: "blur"},
- {min: 2, max: 20, message: '闀垮害鍦� 2 鍒� 20 涓瓧绗�', trigger: 'blur'}
- ], code: [
- {required: true, message: "鎸囨爣缂栫爜涓嶈兘涓虹┖", trigger: "blur"},
- {min: 2, max: 20, message: '闀垮害鍦� 2 鍒� 20 涓瓧绗�', trigger: 'blur'},
- {pattern: /^[a-zA-Z][A-Za-z0-9_-]+$/, message: '蹇呴』涓烘暟瀛椼�佸瓧姣嶃��- 鎴朹 锛屼笖棣栧瓧绗﹀彧鑳戒负瀛楁瘝'}
- ], indexCategory: [
- {required: true, message: "璇烽�夋嫨鎸囨爣鍒嗙被", trigger: "blur"}
- ]
- },
- currentNode: undefined,
- indexCategoryDefaultVal: undefined,
- unitDefaultVal: undefined
- };
- },
-
- created() {
- /* this.getList();*/
- this.getDicts("sys_index_category").then(response => {
- this.indexCategoryOptions = response.data;
- this.indexCategoryDefaultVal = this.indexCategoryOptions.find(f => f.isDefault === 'Y');
- });
- this.getDicts("sys_unit").then(response => {
- this.unitIdOptions = response.data;
- this.unitDefaultVal = this.unitIdOptions.find(f => f.isDefault === 'Y');
- });
- setInterval(this.getList(), 30000);
-
- this.bpy()
-
- },
- methods: {
- /** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
- getList(modelNode) {
- this.currentNode = modelNode;
- if (modelNode) {
- this.loading = true;
- this.queryParams.nodeId = modelNode.id;
- listEnergyindex(this.queryParams).then(response => {
- this.energyindexList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- } else {
- this.energyindexList = [];
- }
-
+ indexCategory: [
+ { required: true, message: "璇烽�夋嫨鎸囨爣鍒嗙被", trigger: "blur" }
+ ]
},
- bpy() {
- this.tableData = this.datas;
- },
- /** 鏌ョ湅鎸夐挳鎿嶄綔 */
- handleUpdate(row) {
- this.reset();
- const indexId = row.indexId || this.ids;
- /* getEnergyindex(indexId).then(response => {
+ currentNode: undefined,
+ indexCategoryDefaultVal: undefined,
+ unitDefaultVal: undefined
+ };
+ },
+
+ created() {
+ /* this.getList();*/
+ this.getDicts("sys_index_category").then(response => {
+ this.indexCategoryOptions = response.data;
+ this.indexCategoryDefaultVal = this.indexCategoryOptions.find(
+ f => f.isDefault === "Y"
+ );
+ });
+ this.getDicts("sys_unit").then(response => {
+ this.unitIdOptions = response.data;
+ this.unitDefaultVal = this.unitIdOptions.find(f => f.isDefault === "Y");
+ });
+ setInterval(this.getList(), 30000);
+
+ this.bpy();
+ },
+ methods: {
+ /** 鏌ヨ鎸囨爣淇℃伅鍒楄〃 */
+ getList(modelNode) {
+ this.currentNode = modelNode;
+ if (modelNode) {
+ this.loading = true;
+ this.queryParams.nodeId = modelNode.id;
+ listEnergyindex(this.queryParams).then(response => {
+ this.energyindexList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ } else {
+ this.energyindexList = [];
+ }
+ },
+ bpy() {
+ this.tableData = this.datas;
+ },
+ /** 鏌ョ湅鎸夐挳鎿嶄綔 */
+ handleUpdate(row) {
+ this.reset();
+ const indexId = row.indexId || this.ids;
+ /* getEnergyindex(indexId).then(response => {
this.form = response.data;
this.title = "寮傚父淇℃伅"+ response.data.name ;
});*/
- this.open = true;
- this.title = "FT01鍏宠仈鐐逛綅";
- },
- // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀缈昏瘧
- indexCategoryFormat(row, column) {
- return this.selectDictLabel(this.indexCategoryOptions, row.indexCategory);
- },
+ this.open = true;
+ this.title = "FT01鍏宠仈鐐逛綅";
+ },
+ // 绯荤粺鎸囨爣鍒嗙被锛�1-鑳芥簮绫伙紝2-浜у搧绫伙紝3-鑳芥晥绫伙紝4-缁忚惀绫伙紝5-鍏朵粬瀛楀吀缈昏瘧
+ indexCategoryFormat(row, column) {
+ return this.selectDictLabel(this.indexCategoryOptions, row.indexCategory);
+ },
- // 鍗曚綅瀛楀吀缈昏瘧
- unitIdFormat(row, column) {
- return this.selectDictLabel(this.unitIdOptions, row.unitId);
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- indexId: undefined,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- remark: undefined,
- unitId: undefined
- };
- this.resetForm("form");
- },
- modelNodeChange(modelNode) {
- this.nodeId = modelNode.id;
- this.getList(this.nodeId);
- this.settingDeviceList = [];
- this.settingIndexList = [];
- this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null;
- if (modelNode) {
- this.currentNode = modelNode;
- this.deviceLoading = true;
- /* getSettingDevice(modelNode.id).then((response) => {
+ // 鍗曚綅瀛楀吀缈昏瘧
+ unitIdFormat(row, column) {
+ return this.selectDictLabel(this.unitIdOptions, row.unitId);
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ indexId: undefined,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ remark: undefined,
+ unitId: undefined
+ };
+ this.resetForm("form");
+ },
+ modelNodeChange(modelNode) {
+ this.nodeId = modelNode.id;
+ this.getList(this.nodeId);
+ this.settingDeviceList = [];
+ this.settingIndexList = [];
+ this.disabledSetting =
+ modelNode === undefined || modelNode === "" || modelNode === null;
+ if (modelNode) {
+ this.currentNode = modelNode;
+ this.deviceLoading = true;
+ /* getSettingDevice(modelNode.id).then((response) => {
if (response.code === 200) {
this.settingDeviceList = response.data;
} else {
@@ -411,7 +487,7 @@
this.energyLoading = false;
});*/
- this.productLoading = true;
+ this.productLoading = true;
/* getSettingProduct(modelNode.id).then((response) => {
if (response.code === 200) {
this.settingProductList = response.data;
@@ -421,7 +497,7 @@
this.productLoading = false;
});*/
- /* this.indexLoading = true;
+ /* this.indexLoading = true;
getSettingIndex(modelNode.id).then((response) => {
if (response.code === 200) {
this.settingIndexList = response.data;
@@ -431,139 +507,146 @@
this.indexLoading = false;
});*/
- // this.$refs.energyIndex.getList(modelNode);
- }
- },
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getList(this.currentNode);
- },
- getList(e)
- {
- List("STATISTIC",e).then((response) => {
- if (response.code === 200) {
- this.settingIndexList = response.data;
- } else {
- this.$message.error(response.msg);
- }
- this.indexLoading = false;
- });
-
- },
- deviceSetting() {
- this.deviceDialog = true;
- },
- energySetting() {
- this.energyDialog = true;
- },
- productSetting() {
- this.productDialog = true;
- },
- collectIndexSetting() {
- this.collectIndexDialog = true;
- },
- showDeviceDialog() {
- this.$nextTick(() => {
- this.$refs.deviceSetting.init(this.settingDeviceList);
- })
- },
- showEnergyDialog() {
- this.$nextTick(() => {
- this.$refs.energySetting.init(this.settingEnergyList);
- })
- },
- showProductDialog() {
- this.$nextTick(() => {
- this.$refs.productSetting.init(this.settingProductList);
- })
- },
- showCollectIndexDialog() {
- this.$nextTick(() => {
- this.$refs.collectIndexSetting.init(this.currentNode, this.settingIndexList);
- })
- },
- deviceConfirmSelect(selectedDevice) {
- this.settingDeviceList = selectedDevice;
- let deviceIds = selectedDevice.map(item => item.id);
- setDevice(this.currentNode.id, deviceIds).then((response) => {
- if (response.code !== 200) {
- this.$message.error(response.msg);
- }
- });
- },
- energyConfirmSelect(selectedEnergy) {
- this.settingEnergyList = selectedEnergy;
- let energyIds = selectedEnergy.map(item => item.enerid);
- setEnergy(this.currentNode.id, energyIds).then((response) => {
- if (response.code !== 200) {
- this.$message.error(response.msg);
- }
- });
- },
- productConfirmSelect(selectedProduct) {
- this.settingProductList = selectedProduct;
- let productIds = selectedProduct.map(item => item.productid);
- setProduct(this.currentNode.id, productIds).then((response) => {
- if (response.code !== 200) {
- this.$message.error(response.msg);
- }
- });
- },
- collectIndexConfirmSelect(selectedIndex) {
- this.settingIndexList = selectedIndex;
- let indexIds = selectedIndex.map(item => item.indexId);
- setNodeToIndex(this.currentNode.id, indexIds).then((response) => {
- if (response.code !== 200) {
- this.$message.error(response.msg);
- }
- });
- },
- handleSelectionChange() {
- },
- delDevice(row) {
- delDevice(this.currentNode.id, row.id).then((response) => {
- if (response.code === 200) {
- this.settingDeviceList = this.settingDeviceList.filter(f => f.id !== row.id);
- } else {
- this.$message.error(response.msg);
- }
- });
- },
- delEnergy(row) {
- delEnergy(this.currentNode.id, row.enerid).then((response) => {
- if (response.code === 200) {
- this.settingEnergyList = this.settingEnergyList.filter(f => f.enerid !== row.enerid);
- } else {
- this.$message.error(response.msg);
- }
- });
- },
- delProduct(row) {
- delProduct(this.currentNode.id, row.productid).then((response) => {
- if (response.code === 200) {
- this.settingProductList = this.settingProductList.filter(f => f.productid !== row.productid);
- } else {
- this.$message.error(response.msg);
- }
- });
- },
- bpq(){
- this.tableData=this.datab;
- },
- delIndex(row) {
- delIndex(this.currentNode.id, row.indexId).then((response) => {
- if (response.code === 200) {
- this.settingIndexList = this.settingIndexList.filter(f => f.indexId !== row.indexId);
- } else {
- this.$message.error(response.msg);
- }
- });
- },
- openDlog (){
- this.open=true;
+ // this.$refs.energyIndex.getList(modelNode);
}
-
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList(this.currentNode);
+ },
+ getList(e) {
+ List("STATISTIC", e).then(response => {
+ if (response.code === 200) {
+ this.settingIndexList = response.data;
+ } else {
+ this.$message.error(response.msg);
+ }
+ this.indexLoading = false;
+ });
+ },
+ deviceSetting() {
+ this.deviceDialog = true;
+ },
+ energySetting() {
+ this.energyDialog = true;
+ },
+ productSetting() {
+ this.productDialog = true;
+ },
+ collectIndexSetting() {
+ this.collectIndexDialog = true;
+ },
+ showDeviceDialog() {
+ this.$nextTick(() => {
+ this.$refs.deviceSetting.init(this.settingDeviceList);
+ });
+ },
+ showEnergyDialog() {
+ this.$nextTick(() => {
+ this.$refs.energySetting.init(this.settingEnergyList);
+ });
+ },
+ showProductDialog() {
+ this.$nextTick(() => {
+ this.$refs.productSetting.init(this.settingProductList);
+ });
+ },
+ showCollectIndexDialog() {
+ this.$nextTick(() => {
+ this.$refs.collectIndexSetting.init(
+ this.currentNode,
+ this.settingIndexList
+ );
+ });
+ },
+ deviceConfirmSelect(selectedDevice) {
+ this.settingDeviceList = selectedDevice;
+ let deviceIds = selectedDevice.map(item => item.id);
+ setDevice(this.currentNode.id, deviceIds).then(response => {
+ if (response.code !== 200) {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ energyConfirmSelect(selectedEnergy) {
+ this.settingEnergyList = selectedEnergy;
+ let energyIds = selectedEnergy.map(item => item.enerid);
+ setEnergy(this.currentNode.id, energyIds).then(response => {
+ if (response.code !== 200) {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ productConfirmSelect(selectedProduct) {
+ this.settingProductList = selectedProduct;
+ let productIds = selectedProduct.map(item => item.productid);
+ setProduct(this.currentNode.id, productIds).then(response => {
+ if (response.code !== 200) {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ collectIndexConfirmSelect(selectedIndex) {
+ this.settingIndexList = selectedIndex;
+ let indexIds = selectedIndex.map(item => item.indexId);
+ setNodeToIndex(this.currentNode.id, indexIds).then(response => {
+ if (response.code !== 200) {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ handleSelectionChange() {},
+ delDevice(row) {
+ delDevice(this.currentNode.id, row.id).then(response => {
+ if (response.code === 200) {
+ this.settingDeviceList = this.settingDeviceList.filter(
+ f => f.id !== row.id
+ );
+ } else {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ delEnergy(row) {
+ delEnergy(this.currentNode.id, row.enerid).then(response => {
+ if (response.code === 200) {
+ this.settingEnergyList = this.settingEnergyList.filter(
+ f => f.enerid !== row.enerid
+ );
+ } else {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ delProduct(row) {
+ delProduct(this.currentNode.id, row.productid).then(response => {
+ if (response.code === 200) {
+ this.settingProductList = this.settingProductList.filter(
+ f => f.productid !== row.productid
+ );
+ } else {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ bpq() {
+ this.tableData = this.datab;
+ },
+ delIndex(row) {
+ delIndex(this.currentNode.id, row.indexId).then(response => {
+ if (response.code === 200) {
+ this.settingIndexList = this.settingIndexList.filter(
+ f => f.indexId !== row.indexId
+ );
+ } else {
+ this.$message.error(response.msg);
+ }
+ });
+ },
+ openDlog() {
+ this.open = true;
}
- };
+ }
+};
</script>
diff --git a/energy_management_ui/src/views/system/menu/index.vue b/energy_management_ui/src/views/system/menu/index.vue
index e6248c8..ced75e8 100644
--- a/energy_management_ui/src/views/system/menu/index.vue
+++ b/energy_management_ui/src/views/system/menu/index.vue
@@ -1,35 +1,58 @@
<template>
<div>
<basic-container>
- <el-form class="special-form" label-width="73px" :model="queryParams" ref="queryForm">
+ <el-form
+ class="special-form"
+ label-width="73px"
+ :model="queryParams"
+ ref="queryForm"
+ >
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="鑿滃崟鍚嶇О">
<el-input
- v-model="queryParams.menuName"
- placeholder="璇疯緭鍏ヨ彍鍗曞悕绉�"
- clearable
- size="small"
- @keyup.enter.native="handleQuery"
+ v-model="queryParams.menuName"
+ placeholder="璇疯緭鍏ヨ彍鍗曞悕绉�"
+ clearable
+ size="small"
+ @keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="鐘舵��">
- <el-select v-model="queryParams.visible" placeholder="鑿滃崟鐘舵��" clearable size="small" style="width: 100%">
+ <el-select
+ v-model="queryParams.visible"
+ placeholder="鑿滃崟鐘舵��"
+ clearable
+ size="small"
+ style="width: 100%"
+ >
<el-option
- v-for="dict in visibleOptions"
- :key="dict.dictValue"
- :label="dict.dictLabel"
- :value="dict.dictValue"
+ v-for="dict in visibleOptions"
+ :key="dict.dictValue"
+ :label="dict.dictLabel"
+ :value="dict.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item class="operation">
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button>
- <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:menu:add']">
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鎼滅储</el-button
+ >
+ <el-button
+ type="primary"
+ icon="el-icon-plus"
+ size="mini"
+ @click="handleAdd"
+ v-hasPermi="['system:menu:add']"
+ >
鏂板
</el-button>
</el-form-item>
@@ -39,51 +62,86 @@
</basic-container>
<basic-container :bodyStyle="bodyStyle" style="margin-top: 16px">
<el-table
- v-loading="loading"
- :data="menuList"
- row-key="menuId"
- :height="height"
- :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+ v-loading="loading"
+ :data="menuList"
+ row-key="menuId"
+ :height="height"
+ :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
- <el-table-column prop="menuName" label="鑿滃崟鍚嶇О" :show-overflow-tooltip="true"></el-table-column>
+ <el-table-column
+ prop="menuName"
+ label="鑿滃崟鍚嶇О"
+ align="left"
+ min-width="180"
+ ></el-table-column>
<el-table-column prop="icon" label="鍥炬爣" align="center" width="100px">
<template slot-scope="scope">
- <svg-icon :icon-class="scope.row.icon"/>
+ <svg-icon :icon-class="scope.row.icon" />
</template>
</el-table-column>
- <el-table-column prop="orderNum" label="鎺掑簭" width="60px"></el-table-column>
- <el-table-column prop="perms" label="鏉冮檺鏍囪瘑" width="130px" :show-overflow-tooltip="true"></el-table-column>
- <el-table-column prop="component" label="缁勪欢璺緞" width="180px" :show-overflow-tooltip="true"></el-table-column>
- <el-table-column prop="visible" label="鍙" :formatter="visibleFormat" width="80px"></el-table-column>
- <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180">
+ <el-table-column
+ prop="orderNum"
+ label="鎺掑簭"
+ width="60px"
+ ></el-table-column>
+ <el-table-column
+ prop="perms"
+ label="鏉冮檺鏍囪瘑"
+ width="130px"
+ :show-overflow-tooltip="true"
+ ></el-table-column>
+ <el-table-column
+ prop="component"
+ label="缁勪欢璺緞"
+ width="180px"
+ :show-overflow-tooltip="true"
+ ></el-table-column>
+ <el-table-column
+ prop="visible"
+ label="鍙"
+ :formatter="visibleFormat"
+ width="80px"
+ ></el-table-column>
+ <el-table-column
+ label="鍒涘缓鏃堕棿"
+ align="center"
+ prop="createTime"
+ width="180"
+ >
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" align="center" width="180" class-name="small-padding fixed-width">
+ <el-table-column
+ label="鎿嶄綔"
+ align="center"
+ width="240"
+ class-name="small-padding fixed-width"
+ >
<template slot-scope="scope">
- <el-button size="mini"
- type="text"
- icon="el-icon-edit"
- @click="handleUpdate(scope.row)"
- v-hasPermi="['system:menu:edit']"
- >淇敼
+ <el-button
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="handleUpdate(scope.row)"
+ v-hasPermi="['system:menu:edit']"
+ >淇敼
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-plus"
- @click="handleAdd(scope.row)"
- v-hasPermi="['system:menu:add']"
- >鏂板
+ size="mini"
+ type="text"
+ icon="el-icon-plus"
+ @click="handleAdd(scope.row)"
+ v-hasPermi="['system:menu:add']"
+ >鏂板
</el-button>
<el-button
- size="mini"
- type="text"
- icon="el-icon-delete"
- @click="handleDelete(scope.row)"
- v-hasPermi="['system:menu:remove']"
- >鍒犻櫎
+ size="mini"
+ type="text"
+ icon="el-icon-delete"
+ @click="handleDelete(scope.row)"
+ v-hasPermi="['system:menu:remove']"
+ >鍒犻櫎
</el-button>
</template>
</el-table-column>
@@ -95,10 +153,10 @@
<el-col :span="24">
<el-form-item label="涓婄骇鑿滃崟">
<treeselect
- v-model="form.parentId"
- :options="menuOptions"
- :show-count="true"
- placeholder="閫夋嫨涓婄骇鑿滃崟"
+ v-model="form.parentId"
+ :options="menuOptions"
+ :show-count="true"
+ placeholder="閫夋嫨涓婄骇鑿滃崟"
/>
</el-form-item>
</el-col>
@@ -114,33 +172,49 @@
<el-col :span="24">
<el-form-item v-if="form.menuType != 'F'" label="鑿滃崟鍥炬爣">
<el-popover
- placement="bottom-start"
- width="460"
- trigger="click"
- @show="$refs['iconSelect'].reset()"
+ placement="bottom-start"
+ width="460"
+ trigger="click"
+ @show="$refs['iconSelect'].reset()"
>
- <IconSelect ref="iconSelect" @selected="selected"/>
- <el-input slot="reference" v-model="form.icon" placeholder="鐐瑰嚮閫夋嫨鍥炬爣" readonly>
+ <IconSelect ref="iconSelect" @selected="selected" />
+ <el-input
+ slot="reference"
+ v-model="form.icon"
+ placeholder="鐐瑰嚮閫夋嫨鍥炬爣"
+ readonly
+ >
<svg-icon
- v-if="form.icon"
- slot="prefix"
- :icon-class="form.icon"
- class="el-input__icon"
- style="height: 32px;width: 16px;"
+ v-if="form.icon"
+ slot="prefix"
+ :icon-class="form.icon"
+ class="el-input__icon"
+ style="height: 32px;width: 16px;"
/>
- <i v-else slot="prefix" class="el-icon-search el-input__icon"/>
+ <i
+ v-else
+ slot="prefix"
+ class="el-icon-search el-input__icon"
+ />
</el-input>
</el-popover>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="鑿滃崟鍚嶇О" prop="menuName">
- <el-input v-model="form.menuName" placeholder="璇疯緭鍏ヨ彍鍗曞悕绉�"/>
+ <el-input
+ v-model="form.menuName"
+ placeholder="璇疯緭鍏ヨ彍鍗曞悕绉�"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="鏄剧ず鎺掑簭" prop="orderNum">
- <el-input-number v-model="form.orderNum" controls-position="right" :min="0"/>
+ <el-input-number
+ v-model="form.orderNum"
+ controls-position="right"
+ :min="0"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -152,35 +226,53 @@
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item v-if="form.menuType != 'F'" label="璺敱鍦板潃" prop="path">
- <el-input v-model="form.path" placeholder="璇疯緭鍏ヨ矾鐢卞湴鍧�"/>
+ <el-form-item
+ v-if="form.menuType != 'F'"
+ label="璺敱鍦板潃"
+ prop="path"
+ >
+ <el-input v-model="form.path" placeholder="璇疯緭鍏ヨ矾鐢卞湴鍧�" />
</el-form-item>
</el-col>
<el-col :span="12" v-if="form.menuType == 'C'">
<el-form-item label="缁勪欢璺緞" prop="component">
- <el-input v-model="form.component" placeholder="璇疯緭鍏ョ粍浠惰矾寰�"/>
+ <el-input
+ v-model="form.component"
+ placeholder="璇疯緭鍏ョ粍浠惰矾寰�"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="form.menuType != 'M'" label="鏉冮檺鏍囪瘑">
- <el-input v-model="form.perms" placeholder="璇锋潈闄愭爣璇�" maxlength="50"/>
+ <el-input
+ v-model="form.perms"
+ placeholder="璇锋潈闄愭爣璇�"
+ maxlength="50"
+ />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item v-if="form.menuType != 'F'" label="鑿滃崟鐘舵��">
<el-radio-group v-model="form.visible">
<el-radio
- v-for="dict in visibleOptions"
- :key="dict.dictValue"
- :label="dict.dictValue"
- >{{ dict.dictLabel }}
+ v-for="dict in visibleOptions"
+ :key="dict.dictValue"
+ :label="dict.dictValue"
+ >{{ dict.dictLabel }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
- <el-form-item v-if="form.menuType != 'F'" label="椤甸潰鍙傛暟" prop="parameter">
- <el-input v-model="form.parameter" placeholder="璇疯緭鍏ラ〉闈㈠弬鏁�"/>
+ <el-form-item
+ v-if="form.menuType != 'F'"
+ label="椤甸潰鍙傛暟"
+ prop="parameter"
+ >
+ <el-input
+ v-model="form.parameter"
+ placeholder="璇疯緭鍏ラ〉闈㈠弬鏁�"
+ />
</el-form-item>
</el-col>
</el-row>
@@ -195,16 +287,23 @@
</template>
<script>
-import {listMenu, getMenu, treeselect, delMenu, addMenu, updateMenu} from "@/api/system/menu";
+import {
+ listMenu,
+ getMenu,
+ treeselect,
+ delMenu,
+ addMenu,
+ updateMenu
+} from "@/api/system/menu";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import IconSelect from "@/components/IconSelect";
-import mixins from '@/layout/mixin/getHeight';
+import mixins from "@/layout/mixin/getHeight";
export default {
name: "Menu",
mixins: [mixins],
- components: {Treeselect, IconSelect},
+ components: { Treeselect, IconSelect },
data() {
return {
// 閬僵灞�
@@ -229,10 +328,10 @@
// 琛ㄥ崟鏍￠獙
rules: {
menuName: [
- {required: true, message: "鑿滃崟鍚嶇О涓嶈兘涓虹┖", trigger: "blur"}
+ { required: true, message: "鑿滃崟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
],
orderNum: [
- {required: true, message: "鑿滃崟椤哄簭涓嶈兘涓虹┖", trigger: "blur"}
+ { required: true, message: "鑿滃崟椤哄簭涓嶈兘涓虹┖", trigger: "blur" }
]
},
height: null
@@ -246,11 +345,11 @@
},
methods: {
setCharts() {
- this.bodyStyle ={
- height:window.innerHeight - 210+ 'px',
- overflow: 'hidden'
- }
- this.height = window.innerHeight - 270
+ this.bodyStyle = {
+ height: window.innerHeight - 210 + "px",
+ overflow: "hidden"
+ };
+ this.height = window.innerHeight - 270;
},
// 閫夋嫨鍥炬爣
selected(name) {
@@ -268,7 +367,7 @@
getTreeselect() {
treeselect().then(response => {
this.menuOptions = [];
- const menu = {id: 0, label: '涓荤被鐩�', children: []};
+ const menu = { id: 0, label: "涓荤被鐩�", children: [] };
menu.children = response.data;
this.menuOptions.push(menu);
});
@@ -324,7 +423,7 @@
});
},
/** 鎻愪氦鎸夐挳 */
- submitForm: function () {
+ submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.menuId != undefined) {
@@ -353,30 +452,43 @@
},
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
- this.$confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.menuName + '"鐨勬暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function () {
- return delMenu(row.menuId);
- }).then(() => {
- this.getList();
- this.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(function () {
- });
+ this.$confirm(
+ '鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.menuName + '"鐨勬暟鎹」?',
+ "璀﹀憡",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }
+ )
+ .then(function() {
+ return delMenu(row.menuId);
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("鍒犻櫎鎴愬姛");
+ })
+ .catch(function() {});
}
}
};
</script>
<style lang="scss" scoped>
-.el-table td, .el-table th {
+.el-table td,
+.el-table th {
text-align: left !important;
}
-.el-form-item {
- margin-bottom: 0;
-}
.special-form {
@import "~@/assets/styles/common-table-form.scss";
}
+
+::v-deep {
+ .vue-treeselect__control {
+ background: rgb(54, 108, 185, 0.2);
+ background-color: rgb(54, 108, 185, 0.2);
+ border: 1px solid #366cb9;
+ color: #fff;
+ }
+}
</style>
diff --git a/energy_management_ui/src/views/workingProcedure/dailyWorkingProcedure/LineChart.vue b/energy_management_ui/src/views/workingProcedure/dailyWorkingProcedure/LineChart.vue
index 44964fd..4354cf8 100644
--- a/energy_management_ui/src/views/workingProcedure/dailyWorkingProcedure/LineChart.vue
+++ b/energy_management_ui/src/views/workingProcedure/dailyWorkingProcedure/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#606266"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -94,27 +94,32 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/BarChart.vue b/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/BarChart.vue
index cc9a0a7..44463a5 100644
--- a/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/BarChart.vue
+++ b/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/BarChart.vue
@@ -1,112 +1,119 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 30,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 30,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/LineChart.vue b/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/LineChart.vue
index 44964fd..af2321f 100644
--- a/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/LineChart.vue
+++ b/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -94,27 +94,32 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
diff --git a/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/index.vue b/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/index.vue
index 3166a22..eb473ee 100644
--- a/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/index.vue
+++ b/energy_management_ui/src/views/workingProcedure/monthlyWorkingProcedure/index.vue
@@ -1,8 +1,16 @@
<template>
<div class="app-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-select v-model="queryParams.indexStorageId" placeholder="璇烽�夋嫨鑳芥簮鍝佺">
+ <el-select
+ v-model="queryParams.indexStorageId"
+ placeholder="璇烽�夋嫨鑳芥簮鍝佺"
+ >
<el-option
v-for="dict in indexCategoryOptions"
:key="dict.dictValue"
@@ -17,95 +25,69 @@
</el-radio-group>
</el-form-item>-->
<el-form-item label="缁熻鏃堕棿">
- <el-date-picker clearable size="small" style="width: 200px"
- v-model="queryParams.dataTime"
- type="month"
- value-format="yyyy-MM"
- placeholder="閫夋嫨鏃ユ湡">
+ <el-date-picker
+ clearable
+ size="small"
+ style="width: 200px"
+ v-model="queryParams.dataTime"
+ type="month"
+ value-format="yyyy-MM"
+ 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-button type="warning" icon="el-icon-download" size="mini" @click="handleExport">瀵煎嚭</el-button>-->
</el-form-item>
</el-form>
- <div class="el-table el-table--fit el-table--scrollable-x el-table--enable-row-hover el-table--medium" >
- <div class="el-table__body-wrapper is-scrolling-left">
- <table class="el-table__body tableList" cellspacing="0" cellpadding="0" style="width: 2600px">
- <tr v-for="item in tableHead">
- <td style="background: rgb(240 242 245);width: 80px">鏇茬嚎閫夋嫨</td>
- <td style="background: rgb(240 242 245);width: 240px">鑳芥簮鎸囨爣鍚嶇О</td>
- <td style="background: rgb(240 242 245);">{{item.value1}}</td>
- <td style="background: rgb(240 242 245);">{{item.value2}}</td>
- <td style="background: rgb(240 242 245);">{{item.value3}}</td>
- <td style="background: rgb(240 242 245);">{{item.value4}}</td>
- <td style="background: rgb(240 242 245)">{{item.value5}}</td>
- <td style="background: rgb(240 242 245)">{{item.value6}}</td>
- <td style="background: rgb(240 242 245);">{{item.value7}}</td>
- <td style="background: rgb(240 242 245);">{{item.value8}}</td>
- <td style="background: rgb(240 242 245);">{{item.value9}}</td>
- <td style="background: rgb(240 242 245);">{{item.value10}}</td>
- <td style="background: rgb(240 242 245);">{{item.value11}}</td>
- <td style="background: rgb(240 242 245);">{{item.value12}}</td>
- <td style="background: rgb(240 242 245);">{{item.value13}}</td>
- <td style="background: rgb(240 242 245);">{{item.value14}}</td>
- <td style="background: rgb(240 242 245);">{{item.value15}}</td>
- <td style="background: rgb(240 242 245);">{{item.value16}}</td>
- <td style="background: rgb(240 242 245);">{{item.value17}}</td>
- <td style="background: rgb(240 242 245);">{{item.value18}}</td>
- <td style="background: rgb(240 242 245);">{{item.value19}}</td>
- <td style="background: rgb(240 242 245);">{{item.value20}}</td>
- <td style="background: rgb(240 242 245);">{{item.value21}}</td>
- <td style="background: rgb(240 242 245);">{{item.value22}}</td>
- <td style="background: rgb(240 242 245);">{{item.value23}}</td>
- <td style="background: rgb(240 242 245)">{{item.value24}}</td>
- <td style="background: rgb(240 242 245);">{{item.value25}}</td>
- <td style="background: rgb(240 242 245);">{{item.value26}}</td>
- <td style="background: rgb(240 242 245);">{{item.value27}}</td>
- <td style="background: rgb(240 242 245);" v-if="item.value29 !=null">{{item.value28}}</td>
- <td style="background: rgb(240 242 245);" v-if="item.value29 !=null">{{item.value29}}</td>
- <td style="background: rgb(240 242 245);" v-if="item.value30 !=null">{{item.value30}}</td>
- <td style="background: rgb(240 242 245);" v-if="item.value31 !=null">{{item.value31}}</td>
- </tr>
- <tr v-for="data in tableData">
- <td style="width: 80px"><el-button icon="el-icon-search" circle @click="selectChange(data.indexId)" style="font-size: 10px"></el-button></td>
- <td style="width: 240px">{{data.indexName}}</td>
- <td>{{numFilter(data.value1)}}</td>
- <td>{{numFilter(data.value2)}}</td>
- <td>{{numFilter(data.value3)}}</td>
- <td>{{numFilter(data.value4)}}</td>
- <td>{{numFilter(data.value5)}}</td>
- <td>{{numFilter(data.value6)}}</td>
- <td>{{numFilter(data.value7)}}</td>
- <td>{{numFilter(data.value8)}}</td>
- <td>{{numFilter(data.value9)}}</td>
- <td>{{numFilter(data.value10)}}</td>
- <td>{{numFilter(data.value11)}}</td>
- <td>{{numFilter(data.value12)}}</td>
- <td>{{numFilter(data.value13)}}</td>
- <td>{{numFilter(data.value14)}}</td>
- <td>{{numFilter(data.value15)}}</td>
- <td>{{numFilter(data.value16)}}</td>
- <td>{{numFilter(data.value17)}}</td>
- <td>{{numFilter(data.value18)}}</td>
- <td>{{numFilter(data.value19)}}</td>
- <td>{{numFilter(data.value20)}}</td>
- <td>{{numFilter(data.value21)}}</td>
- <td>{{numFilter(data.value22)}}</td>
- <td>{{numFilter(data.value23)}}</td>
- <td>{{numFilter(data.value24)}}</td>
- <td>{{numFilter(data.value25)}}</td>
- <td>{{numFilter(data.value26)}}</td>
- <td>{{numFilter(data.value27)}}</td>
- <td v-if="data.count>=28">{{numFilter(data.value28)}}</td>
- <td v-if="data.count>=29">{{numFilter(data.value29)}}</td>
- <td v-if="data.count>=30">{{numFilter(data.value30)}}</td>
- <td v-if="data.count==31">{{numFilter(data.value31)}}</td>
- </tr>
- </table>
- </div>
- </div>
+
+ <el-table :data="tableData" border style="width: 100%;margin-top: 20px">
+ <el-table-column
+ prop="indexName"
+ align="center"
+ label="鏇茬嚎閫夋嫨"
+ width="110"
+ >
+ <template slot-scope="scope">
+ <el-button
+ icon="el-icon-search"
+ circle
+ @click="selectChange(scope.row.indexId)"
+ style="font-size: 10px"
+ ></el-button>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="indexName"
+ align="center"
+ label="鑳芥簮鎸囨爣鍚嶇О"
+ min-width="220"
+ />
+
+ <el-table-column
+ v-for="index in 31"
+ :key="index"
+ :label="`${index}鏃"
+ align="center"
+ min-width="140px"
+ >
+ <template slot-scope="scope">
+ <span style="font-size: 12px">
+ {{ numFilter(scope.row[`value${index}`]) || "--" }}
+ </span>
+ </template>
+ </el-table-column>
+ </el-table>
<el-row :gutter="32" style="margin:30px 0">
<el-col :xs="24" :sm="24" :lg="12">
<div class="chart-wrapper">
@@ -122,14 +104,18 @@
</template>
<script>
- import {getDataList,exportList,getlistChart} from "@/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive";
- import LineChart from './LineChart'
- import BarChart from "./BarChart";
- export default {
- components: {
- LineChart,
- BarChart
- },
+import {
+ getDataList,
+ exportList,
+ getlistChart
+} from "@/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive";
+import LineChart from "./LineChart";
+import BarChart from "./BarChart";
+export default {
+ components: {
+ LineChart,
+ BarChart
+ },
data() {
return {
// 閬僵灞�
@@ -143,12 +129,12 @@
// 鎬绘潯鏁�
total: 0,
checked: false,
- dateRange:[],
- dateTypeOptions:[],
+ dateRange: [],
+ dateTypeOptions: [],
energyList: [],
tableData: [],
- tableHead:[],
- indexCategoryOptions:[],
+ tableHead: [],
+ indexCategoryOptions: [],
// 寮瑰嚭灞傛爣棰�
title: "",
// 鏄惁鏄剧ず寮瑰嚭灞�
@@ -159,13 +145,13 @@
pageSize: 10,
indexCode: undefined,
indexId: undefined,
- dataTime:undefined,
- timeType:"DAY",
- indexType:undefined,
- indexStorageId:undefined,
+ dataTime: undefined,
+ timeType: "DAY",
+ indexType: undefined,
+ indexStorageId: undefined
},
- skinName:"",
- lineChartData:{expectedData: [],actualData: []},
+ skinName: "",
+ lineChartData: { expectedData: [], actualData: [] }
};
},
created() {
@@ -174,7 +160,7 @@
//this.queryParams.timeType = this.dateTypeOptions.find(f => f.isDefault === 'Y').dictValue;
});
this.getConfigKey("comprehensive").then(response => {
- this.skinName=response.msg;
+ this.skinName = response.msg;
});
this.getDicts("energy_type").then(response => {
this.indexCategoryOptions = response.data;
@@ -187,27 +173,32 @@
getList() {
this.queryParams.indexCode = this.$route.query.modelCode;
getDataList(this.queryParams).then(response => {
- this.tableData=response.data.tabledata;
- this.tableHead=response.data.tablehead;
- })
+ this.tableData = response.data.tabledata;
+ this.tableHead = response.data.tablehead;
+ });
},
- selectChange(data){
- this.queryParams.indexId=data;
+ selectChange(data) {
+ this.queryParams.indexId = data;
getlistChart(this.queryParams).then(response => {
- let actualData=[];
- let expectedData=[];
- let title="";
+ let actualData = [];
+ let expectedData = [];
+ let title = "";
response.data.forEach(item => {
expectedData.push(this.numFilter(item.value));
- actualData.push(item.timeCode.slice(item.timeCode.length-2,item.timeCode.length)+"鏃�");
- title=item.indexName+"("+item.unitId+")";
- })
- this.lineChartData.actualData=actualData;
- this.lineChartData.expectedData=expectedData;
- this.lineChartData.title=title
+ actualData.push(
+ item.timeCode.slice(
+ item.timeCode.length - 2,
+ item.timeCode.length
+ ) + "鏃�"
+ );
+ title = item.indexName + "(" + item.unitId + ")";
+ });
+ this.lineChartData.actualData = actualData;
+ this.lineChartData.expectedData = expectedData;
+ this.lineChartData.title = title;
this.$refs.LineChart.initChart(this.lineChartData);
this.$refs.BarChart.initChart(this.lineChartData);
- })
+ });
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
@@ -222,145 +213,112 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.id)
- this.single = selection.length != 1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭缁煎悎鑳借��?', "璀﹀憡", {
+ this.$confirm("鏄惁纭瀵煎嚭缁煎悎鑳借��?", "璀﹀憡", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning"
- }).then(function () {
- return exportList(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function () {
- });
+ })
+ .then(function() {
+ return exportList(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
},
- numFilter(value) {// 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
- let realVal = '';
- if (!isNaN(value) && value !== '' && value !== null) {
- realVal = parseFloat(value).toFixed(this.skinName)
+ numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = "";
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(this.skinName);
} else {
- realVal = '0'
+ realVal = "0";
}
- return realVal
+ return realVal;
},
getTime() {
- var date = new Date()
- var year = date.getFullYear()
- var month = date.getMonth() + 1
- var date = date.getDate()
- month = month < 10 ? '0' + month : month
- date = date < 10 ? '0' + date : date
- this.queryParams.dataTime=year + '-' + month
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = date.getMonth() + 1;
+ var date = date.getDate();
+ month = month < 10 ? "0" + month : month;
+ date = date < 10 ? "0" + date : date;
+ this.queryParams.dataTime = year + "-" + month;
/*let startTime = year + '-' + month + '-' + date
let endTime = year + '-' + month + '-' + (date + 1)
this.dateRange = [startTime, endTime]*/
},
- handleTime(date){
- if(date=='MONTH'){
- this.dateTypes= 'year',
- this.valueFormat='yyyy'
- }else if(date=='DAY'){
- this.dateTypes= 'month',
- this.valueFormat='yyyy-MM'
- }else{
- this.dateTypes= 'date',
- this.valueFormat='yyyy-MM-dd'
+ handleTime(date) {
+ if (date == "MONTH") {
+ (this.dateTypes = "year"), (this.valueFormat = "yyyy");
+ } else if (date == "DAY") {
+ (this.dateTypes = "month"), (this.valueFormat = "yyyy-MM");
+ } else {
+ (this.dateTypes = "date"), (this.valueFormat = "yyyy-MM-dd");
}
- },
+ }
}
};
</script>
<style lang="scss" scoped>
-.tableList th.is-leaf, .tableList td{
- border-bottom: 1px solid #000000 !important;
- border-right: 1px solid #000000 !important;
- text-align: center;
- width: 150px;
-}
-.tableList{
- border: 1px solid #000000 !important;
-}
-.tableList tr > td:first-child {
- position: sticky;
- left: 0;
- z-index: 1;
- background: #fff;
-}
-.tableList tr > td:nth-child(2) {
- position: sticky;
- left: 80px;
- z-index: 1;
- background: #fff;
-}
-
-.dashboard-editor-container {
- padding: 32px;
- background-color: rgb(240, 242, 245);
- position: relative;
+@media (max-width: 1024px) {
.chart-wrapper {
- background: #fff;
- padding: 16px 16px 0;
- margin-bottom: 32px;
+ padding: 8px;
}
+}
+.live {
+ position: fixed;
+ right: 0px;
+ top: 70px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 100px;
+ height: 60px;
+ background-color: red;
+ animation: fade 600ms infinite;
+ -webkit-animation: fade 600ms infinite;
+}
+.live_content {
+ font-size: 18px;
+ color: white;
+ font-weight: bold;
+}
+.live_number {
+ font-size: 32px;
+ color: white;
+ font-weight: bolder;
+}
+@keyframes fade {
+ from {
+ opacity: 1;
}
+ 50% {
+ opacity: 0.4;
+ }
+ to {
+ opacity: 1;
+ }
+}
- @media (max-width:1024px) {
- .chart-wrapper {
- padding: 8px;
- }
+@-webkit-keyframes fade {
+ from {
+ opacity: 1;
}
- .live{
- position: fixed;
- right: 0px;
- top:70px;
- display: flex;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- width: 100px;
- height: 60px;
- background-color: red;
- animation: fade 600ms infinite;
- -webkit-animation: fade 600ms infinite;
+ 50% {
+ opacity: 0.4;
}
- .live_content{
- font-size: 18px;
- color: white;
- font-weight: bold;
+ to {
+ opacity: 1;
}
- .live_number{
- font-size: 32px;
- color: white;
- font-weight: bolder;
- }
- @keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
- }
-
- @-webkit-keyframes fade {
- from {
- opacity: 1.0;
- }
- 50% {
- opacity: 0.4;
- }
- to {
- opacity: 1.0;
- }
- }
+}
</style>
diff --git a/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/BarChart.vue b/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/BarChart.vue
index cc9a0a7..44463a5 100644
--- a/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/BarChart.vue
+++ b/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/BarChart.vue
@@ -1,112 +1,119 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
- import echarts from 'echarts'
- require('echarts/theme/macarons') // echarts theme
- import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
- export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- },
- autoResize: {
- type: Boolean,
- default: true
- },
- chartData: {
- type: Object,
- required: true
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: "chart"
+ },
+ width: {
+ type: String,
+ default: "100%"
+ },
+ height: {
+ type: String,
+ default: "300px"
+ },
+ autoResize: {
+ type: Boolean,
+ default: true
+ },
+ chartData: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ chart: null
+ };
+ },
+ watch: {
+ chartData: {
+ deep: true,
+ handler(val) {
+ this.setOptions(val);
}
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart();
+ });
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return;
+ }
+ this.chart.dispose();
+ this.chart = null;
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- data() {
- return {
- chart: null
- }
- },
- watch: {
- chartData: {
- deep: true,
- handler(val) {
- this.setOptions(val)
- }
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
- },
- setOptions({ expectedData, actualData,title } = {}) {
- this.chart.setOption({
- title: {
- text: title,
- left: 'left',
- textStyle: {
- color: '#606266',
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- grid: {
- top: 30,
- left: '2%',
- right: '2%',
- bottom: '3%',
- containLabel: true
- },
- xAxis: [{
- type: 'category',
+ setOptions({ expectedData, actualData, title } = {}) {
+ this.chart.setOption({
+ title: {
+ text: title,
+ left: "left",
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "shadow" // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ grid: {
+ top: 30,
+ left: "2%",
+ right: "2%",
+ bottom: "3%",
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
data: actualData,
axisTick: {
alignWithLabel: true
}
- }],
- yAxis: [{
- type: 'value',
+ }
+ ],
+ yAxis: [
+ {
+ type: "value",
axisTick: {
show: false
}
- }],
- series: [{
+ }
+ ],
+ series: [
+ {
name: title,
- type: 'bar',
- stack: 'vistors',
- barWidth: '60%',
+ type: "bar",
+ stack: "vistors",
+ barWidth: "60%",
data: expectedData,
animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- });
- }
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
+};
</script>
diff --git a/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/LineChart.vue b/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/LineChart.vue
index 44964fd..af2321f 100644
--- a/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/LineChart.vue
+++ b/energy_management_ui/src/views/workingProcedure/yearWorkingProcedure/LineChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
export default {
mixins: [resize],
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '300px'
+ default: "300px"
},
autoResize: {
type: Boolean,
@@ -34,45 +34,45 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
- setOptions({ expectedData, actualData,title } = {}) {
+ setOptions({ expectedData, actualData, title } = {}) {
this.chart.setOption({
title: {
text: title,
- left: 'left',
+ left: "left",
textStyle: {
- color: '#606266',
+ color: "#fff"
}
},
xAxis: {
data: actualData,
- type: 'category',
+ type: "category"
},
grid: {
left: 10,
@@ -82,9 +82,9 @@
containLabel: true
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'cross'
+ type: "cross"
},
padding: [5, 10]
},
@@ -94,27 +94,32 @@
}
},
legend: {
- data: []
+ data: [],
+ textStyle: {
+ color: "#fff"
+ }
},
- series: [{
- name: title,
- itemStyle: {
- normal: {
- color: '#FF005A',
- lineStyle: {
- color: '#FF005A',
- width: 2
+ series: [
+ {
+ name: title,
+ itemStyle: {
+ normal: {
+ color: "#FF005A",
+ lineStyle: {
+ color: "#FF005A",
+ width: 2
+ }
}
- }
- },
- smooth: true,
- type: 'line',
- data: expectedData,
- animationDuration: 2800,
- animationEasing: 'cubicInOut'
- }]
- })
+ },
+ smooth: true,
+ type: "line",
+ data: expectedData,
+ animationDuration: 2800,
+ animationEasing: "cubicInOut"
+ }
+ ]
+ });
}
}
-}
+};
</script>
--
Gitblit v1.9.3