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/energyPlan/energyForecast/energyForecast.vue | 305 +++++++++++++++++++++++++++-----------------------
1 files changed, 164 insertions(+), 141 deletions(-)
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>
--
Gitblit v1.9.3