From b993a85744f7ff5fb72fbb5a68ffe64173cce2d7 Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期三, 14 四月 2021 09:54:35 +0800
Subject: [PATCH] 開始結束時間
---
src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue | 85 ++++++++++++++++++++++++++----------------
1 files changed, 52 insertions(+), 33 deletions(-)
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue
index 2dd2517..51b1e20 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue
@@ -3,10 +3,10 @@
<div id="Tab">
<div class="infomation">
<div>
- <span class="grid-content">姘哀鍖栫墿 :<i>29.93</i> 鏍囧噯 : 100</span>
- <span class="grid-content">浜屾哀鍖栫～ : <i>17.34</i> 鏍囧噯 : 50</span>
- <span class="grid-content">鐑熷皹 : <i>6.93</i> 鏍囧噯 : 30</span>
- <span class="grid-content">搴熸皵娴侀噺 : <i>120343.18</i></span>
+ <span class="grid-content">姘哀鍖栫墿 :<i style="color: #e8ee0b">29.93</i> 鏍囧噯 : 100</span>
+ <span class="grid-content">浜屾哀鍖栫～ : <i style="color: #e8ee0b">17.34</i> 鏍囧噯 : 50</span>
+ <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : 30</span>
+ <span class="grid-content">搴熸皵娴侀噺 : <i style="color: #e8ee0b">120343.18</i></span>
</div>
</div>
<div class="form-echrts">
@@ -30,26 +30,28 @@
</span>
</div>
</div>
- <div>
- 閲囨牱鐐规暟:
- <el-select v-model="formInline.region">
- <el-option label="0" value="0"></el-option>
- <el-option label="25" value="25"></el-option>
- <el-option label="50" value="50"></el-option>
- <el-option label="75" value="75"></el-option>
- <el-option label="100" value="100"></el-option>
- </el-select>
- </div>
+<!-- <div>-->
+<!-- 閲囨牱鐐规暟:-->
+<!-- <el-select v-model="formInline.region">-->
+<!-- <el-option label="0" value="0"></el-option>-->
+<!-- <el-option label="25" value="25"></el-option>-->
+<!-- <el-option label="50" value="50"></el-option>-->
+<!-- <el-option label="75" value="75"></el-option>-->
+<!-- <el-option label="100" value="100"></el-option>-->
+<!-- </el-select>-->
+<!-- </div>-->
<div class="detailbtn" @click="onSubmit">鏌ヨ</div>
<div class="detailbtn" @click="dialogVisible = true" >鏄庣粏琛�</div>
</div>
- <div style="width:5rem;height:2rem;" id="echarts" ref="main">
+<!-- <div style="width: 5rem;height: 2rem">-->
+<!-- <div style="width:100%;height:100%;" id="echarts" ref="main">–>-->
+<!-- </div>-->
+ <div style="width:720px;height:252px;" id="echarts" ref="main">
</div>
</div>
<!-- 鏄庣粏寮规 -->
<el-dialog :visible.sync="dialogVisible"
:append-to-body="true"
- :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName"
width="68%"
center
v-dialogDrag
@@ -63,7 +65,7 @@
<script>
import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
-
+import dayjs from 'dayjs'
export default {
name: 'ECharts',
components: {
@@ -129,11 +131,11 @@
],
xdata: ['0鏃�', '1鏃�', '2鏃�', '3鏃�', '4鏃�', '5鏃�', '6鏃�', '7鏃�', '8鏃�', '9鏃�', '10鏃�', '11鏃�', '12鏃�', '13鏃�', '14鏃�', '15鏃�', '16鏃�'],
ydatas: [
- { name: '姘哀鍖栫墿', data: ['34.44', '36.91', '37.65', '37.16', '38.03', '38.23', '37.21', '37.67', '37.97', '37.58', '36.61', '37.76', '37.27', '37.24', '35.86', 'NaN', 'NaN'], zdcbcolor: 'red', zxcolor: '#00B0F0', bzz: 50 },
- { name: '浜屾哀鍖栫～', data: ['4.98', '4.57', '4.19', '3.14', '3.80', '3.62', '3.33', '2.80', '3.13', '2.54', '3.08', '2.48', '1.97', '1.76', '0.82', 'NaN', 'NaN'], zdcbcolor: 'red', zxcolor: '#fff21c', bzz: 35 },
- { name: '搴熸皵娴侀噺', data: ['381907.22', '376474.19', '378572.31', '379369.44', '385225.72', '388657.56', '330667.31', '26560.98', '0.00', '0.00', '49567.43', '357837.31', '376972.66', '379693.50', '379982.22', 'NaN', 'NaN'], zdcbcolor: 'red', zxcolor: '#9ACD32', bzz: null },
- { name: '鐑熷皹', data: ['4.02', '4.17', '4.31', '4.00', '4.45', '4.40', '4.40', '4.25', '4.26', '4.18', '4.58', '4.21', '3.96', '3.83', '3.78', 'NaN', 'NaN'], zdcbcolor: 'red', zxcolor: '#f48183', bzz: 10 },
- { name: '娓╁害', data: ['46.55', '46.70', '46.47', '46.56', '46.57', '46.58', '46.56', '46.58', '46.69', '46.47', '46.58', '46.60', '46.54', '46.55', '46.60', 'NaN', 'NaN'], zdcbcolor: 'red', zxcolor: '#F206FF', bzz: null }
+ { name: '姘哀鍖栫墿', data: ['34.44', '36.91', '37.65', '37.16', '38.03', '38.23', '37.21', '37.67', '37.97', '37.58', '36.61', '37.76', '37.27', '37.24', '35.86', '36.61', '37.21'], zdcbcolor: 'red', zxcolor: '#00B0F0', bzz: 50 },
+ { name: '浜屾哀鍖栫～', data: ['4.98', '4.57', '4.19', '3.14', '3.80', '3.62', '3.33', '2.80', '3.13', '2.54', '3.08', '2.48', '1.97', '1.76', '0.82', '1.01', '1.5'], zdcbcolor: 'red', zxcolor: '#fff21c', bzz: 35 },
+ { name: '搴熸皵娴侀噺', data: ['381907.22', '376474.19', '378572.31', '379369.44', '385225.72', '388657.56', '330667.31', '26560.98', '0.00', '0.00', '49567.43', '357837.31', '376972.66', '379693.50', '379982.22', '379693.50', '379982.22'], zdcbcolor: 'red', zxcolor: '#9ACD32', bzz: null },
+ { name: '鐑熷皹', data: ['4.02', '4.17', '4.31', '4.00', '4.45', '4.40', '4.40', '4.25', '4.26', '4.18', '4.58', '4.21', '3.96', '3.83', '3.78', '3.83', '3.78'], zdcbcolor: 'red', zxcolor: '#f48183', bzz: 10 },
+ { name: '娓╁害', data: ['46.55', '46.70', '46.47', '46.56', '46.57', '46.58', '46.56', '46.58', '46.69', '46.47', '46.58', '46.60', '46.54', '46.55', '46.60', '46.55', '46.60'], zdcbcolor: 'red', zxcolor: '#F206FF', bzz: null }
],
yname: ' 娴撳害(mg/m鲁)',
// id:'mychart',
@@ -141,20 +143,36 @@
}
}
},
- // mounted () {
- // // this.$nextTick(() => {
- // // console.log(1)
- // this.CreateChart(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
- // // }
- // },
+ created () {
+ // console.log(dayjs().format('YYYY-MM-DD HH:mm:ss'))
+ // this.$nextTick(() => {
+ // this.CreateChart(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
+ // }
+ },
+ mounted () {
+ this.formInline.timeEnd = dayjs().format('YYYY-MM-DD HH:mm:ss')
+ this.formInline.timeStart = dayjs().subtract(12, 'hour').format('YYYY-MM-DD HH:mm:ss')
+ this.onSubmit()
+ // this.CreateChart(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
+ },
methods: {
onSubmit () {
- console.log(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
- this.CreateChart(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
+ this.CreateChart()
+ // console.log(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
+ // this.CreateChart(this.JsonCtarts.id, this.JsonCtarts.title, this.JsonCtarts.legend, this.JsonCtarts.xdata, this.JsonCtarts.ydatas, this.JsonCtarts.yname, this.JsonCtarts.id, this.JsonCtarts.datatype)
},
- CreateChart: function (id, title, legend, xdata, ydatas, yname, jcdID, datatype) {
+ CreateChart: function () {
+ // var id = this.JsonCtarts.id
+ // var title = this.JsonCtarts.title
+ var legend = this.JsonCtarts.legend
+ var xdata = this.JsonCtarts.xdata
+ var ydatas = this.JsonCtarts.ydatas
+ var yname = this.JsonCtarts.yname
+ // var jcdId = this.JsonCtarts.jcdID
+ var datatype = this.JsonCtarts.datatype
+
this.myChart = this.$echarts.init(this.$refs.main)
- // this.myChart.clear()
+ this.myChart.clear()
var dataUnit = ''
if (datatype === 1) {
dataUnit = '姘旈噺(m鲁/d)'
@@ -339,7 +357,6 @@
},
legend: { // 鍥句緥
data: legend
- // color:
},
dataZoom: [{
type: 'inside',
@@ -451,6 +468,7 @@
}],
series: serLists
}
+ console.log(option)
this.myChart.setOption(option)
/*
this.myChart.on('legendselectchanged', function (params) {
@@ -537,6 +555,7 @@
// }
// }
}
+
}
</script>
--
Gitblit v1.8.0