From 1237567bdf2585fd74e8ad638fd327c92396e9be Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期一, 12 四月 2021 15:05:42 +0800 Subject: [PATCH] 修改废气图表 --- src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue | 101 +++++++++++++++++++++++++++++++------------------- 1 files changed, 63 insertions(+), 38 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue index 89a6cf8..c93b933 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue @@ -2,17 +2,12 @@ <template> <div id="Tab"> <div class="infomation"> -<!-- <el-tag>姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</el-tag>--> -<!-- <el-tag>浜屾哀鍖栫~ : 17.34 鏍囧噯 : 50</el-tag>--> -<!-- <el-tag>鐑熷皹 : 6.93 鏍囧噯 : 30</el-tag>--> -<!-- <el-tag>搴熸皵娴侀噺 : 120343.18</el-tag>--> - <el-row> - <el-col :span="6"><div class="grid-content bg-purple">姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</div></el-col> - <el-col :span="6"><div class="grid-content bg-purple">浜屾哀鍖栫~ : 17.34 鏍囧噯 : 50</div></el-col> - <el-col :span="6"><div class="grid-content bg-purple">鐑熷皹 : 6.93 鏍囧噯 : 30</div></el-col> - <el-col :span="6"><div class="grid-content bg-purple">搴熸皵娴侀噺 : 120343.18</div></el-col> -<!-- <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>--> - </el-row> + <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> + </div> </div> <div class="form-echrts"> <div class="from-search"> @@ -37,8 +32,8 @@ </div> <div> 閲囨牱鐐规暟: - <input list="source" id="ipt" class="echatsInput"> - <datalist id="source"> + <input list="source" id="ipt" class="echatsInput" v-model="value"> + <datalist id="source" > <option value="0" /> <option value="25" /> <option value="50" /> @@ -69,6 +64,7 @@ <script> import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList' +// import export default { name: 'ECharts', @@ -77,12 +73,12 @@ }, data () { return { + value: '50', value1: '', value2: '', watchData: [], dialogVisible: false, myChar: null, - value: '', formInline: { user: '', region: '' @@ -91,7 +87,16 @@ }, methods: { onSubmit () { - console.log('submit!') + const date = [this.value1, this.value2, this.value] + console.log(date) + if (date) { + var date1 = new Date(date) + date1 = new Date(date1.getTime() - (8 * 3600000)) + console.log(date1) + // var dateUtil = new DateUtil() + // var datePkg = dateUtil.getTowDate(date1, "a", 24 * 3600000 - 1); + // var datatype = 2; + } }, drawChart: function () { window.onresize = function () { @@ -280,22 +285,41 @@ var dataValue1 = [] var dataValue2 = [] var dataValue3 = [] + var dataValue4 = [] var dataDate = [] for (var i = 0; i < 24; i++) { dataDate.push(dataWatch[i].MonTimeStr.substring(9)) } for (var n = 0; n < dataWatch.length; n++) { - if (dataWatch[n].PoltmtrlName === 'COD') { - dataValue1.push(dataWatch[n].MonQty) - } else if (dataWatch[n].PoltmtrlName === '姘ㄦ爱') { - dataValue2.push(dataWatch[n].MonQty) - } else if (dataWatch[n].PoltmtrlName === '搴熸按娴侀噺') { - dataValue3.push(dataWatch[n].MonQty) + if (this.$attrs.value === 'feishui') { + if (dataWatch[n].PoltmtrlName === 'COD') { + dataValue1.push(dataWatch[n].MonQty) + } else if (dataWatch[n].PoltmtrlName === '姘ㄦ爱') { + dataValue2.push(dataWatch[n].MonQty) + } else if (dataWatch[n].PoltmtrlName === '搴熸按娴侀噺') { + dataValue3.push(dataWatch[n].MonQty) + } + const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3) + this.myChart = this.$echarts.init(this.$refs.main) + this.myChart.setOption(opitons) + } else if (this.$attrs.value === 'feiqi') { + if (dataWatch[n].PoltmtrlName === '搴熸皵娴侀噺') { + dataValue1.push(dataWatch[n].MonQty) + } else if (dataWatch[n].PoltmtrlName === '鐑熷皹') { + dataValue2.push(dataWatch[n].MonQty) + } else if (dataWatch[n].PoltmtrlName === '浜屾哀鍖栫~') { + dataValue3.push(dataWatch[n].MonQty) + } else if (dataWatch[n].PoltmtrlName === '"姘哀鍖栫墿"') { + dataValue4.push(dataWatch[n].MonQty) + const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3, dataValue4) + this.myChart = this.$echarts.init(this.$refs.main) + this.myChart.setOption(opitons) + } } } - const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3) - this.myChart = this.$echarts.init(this.$refs.main) - this.myChart.setOption(opitons) + // const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3) + // this.myChart = this.$echarts.init(this.$refs.main) + // this.myChart.setOption(opitons) }) } } @@ -308,21 +332,13 @@ text-align: center; margin: 0 2px 4px 2px; border-radius: 2px; + >i{ + font-style: normal; + color: #eef309; + } } .Infomation { margin-left: 10px; -} - -.el-tag { - height: 25px; - width: 140px; - line-height: 25px; - margin-right: 10px; - font-size: 10px; - background-color: rgba(0, 255, 246, 0.14); - color: #00d0f9; - border: none; - padding: 0 15px; } .form-echrts { @@ -344,10 +360,14 @@ >span{line-height: 22px} .pickerTable{ margin-left: 6px; - /deep/.el-input__prefix{ + /deep/.el-input{ + font-size: 0px; + .el-input__prefix{ + width: 100%; + } } /deep/.el-input__icon { - font-size: 0; + //font-size: 0; width: 100%; } } @@ -358,6 +378,8 @@ } /deep/.el-input__inner{ position: relative; + width: 0.9rem!important; + height: 0.125rem!important; background-color: #2e4967; color: #ffffff; font-size: 12px; @@ -374,6 +396,9 @@ width: 80px; height: 22px; } + input::-webkit-calendar-picker-indicator { + opacity: 100; + } .detailbtn{ background-color:#2e4967; text-align: center; -- Gitblit v1.8.0