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/keyEquipment/dailykeyEquipment/index.vue | 241 +++++++++++++++++++++++++++++++++--------------
1 files changed, 169 insertions(+), 72 deletions(-)
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;
}
}
--
Gitblit v1.9.3