From a94e89e2a85d05ce57853bbb0f6c6f0b6f7c536a Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期四, 08 四月 2021 11:22:25 +0800 Subject: [PATCH] 弹框问题修改 --- src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue | 142 ++++++++++++++++++++++++++--------------------- 1 files changed, 79 insertions(+), 63 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue b/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue index 1c67015..3a928e9 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue @@ -1,34 +1,35 @@ <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> - </div> - <div class="form-echrts"> - <div> - <el-button size="mini" round @click="dialogVisible = true">鏄庣粏琛�</el-button> - <el-dialog :visible.sync="dialogVisible" - :append-to-body="true" - :title="this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName" - width="68%" - center - v-dialogDrag - > - <div class="el-dialog-div" style="height: 500px"> - <public-detailed-list v-bind="$attrs"></public-detailed-list> - </div> - </el-dialog> - </div> - <div style="width:750px;height:260px;" id="echarts" ref="main"> - </div> + <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> + </div> + <div class="form-echrts"> + <div> + <el-button size="mini" round @click="dialogVisible = true">鏄庣粏琛�</el-button> + <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 + > + <div class="el-dialog-div" style="height: 500px"> + <public-detailed-list v-bind="$attrs"></public-detailed-list> + </div> + </el-dialog> + </div> + <div style="width:4.8rem;height:1rem;margin-top:-0.1rem;position:absolute;" id="echarts" ref="main"> </div> </div> + </div> </template> <script> import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList' + export default { name: 'ECharts', components: { @@ -36,13 +37,10 @@ }, data () { return { - dialogVisible: false - } - }, - methods: { - drawChart: function () { - const myChart = this.$echarts.init(this.$refs.main) - const option = { + watchData: [], + dialogVisible: false, + dataDate: [], + options: { title: { // text: '鎶樼嚎鍥惧爢鍙�' }, @@ -122,7 +120,7 @@ xAxis: { type: 'category', boundaryGap: false, - data: ['2021.01.01', '2021.01.02', '2021.01.03', '2021.01.04', '2021.01.05', '2021.01.06', '2021.01.07'], + data: ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄥ叚'], axisLabel: { // x杞村叏閮ㄦ樉绀� rotate: 20, interval: 0, @@ -198,44 +196,62 @@ } ] } - myChart.setOption(option) + } + }, + methods: { + drawChart: function () { + const myChart = this.$echarts.init(this.$refs.main) + myChart.setOption(this.options) } }, mounted () { - this.drawChart() + this.$nextTick(() => { + this.drawChart() + const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getWasteWaterMonitoring)) + // console.log(dataWatch) + for (var i = 0; i < dataWatch.length; i++) { + this.dataDate.push(dataWatch[i].MonTimeStr.substring(10, 17)) + } + // console.log(this.dataDate) + }) } } </script> <style scoped lang="less"> - .Infomation{ - margin-left: 10px; - } - .el-tag{ - height: 25px; - 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{ - width: 100%; - height: 100%; - border-top: 1px solid #396d83; - //margin: 10px 10px 10px 10px; - .el-dialog-div{ - //height: 50vh!important; - overflow: auto; - //overflow: hidden; - } - #echarts { - margin: 0; - padding: 0; - //border: 1px solid #396d83; - //margin: 10px 10px 10px 10px; - } +.Infomation { + margin-left: 10px; + height: 0.2rem; +} + +.el-tag { + height: 25px; + 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 { + width: 100%; + height: 1rem; + border-top: 1px solid #396d83; + //margin: 10px 10px 10px 10px; + .el-dialog-div { + //height: 50vh!important; + overflow: auto; + //overflow: hidden; } + + #echarts { + margin: 0; + padding: 0; + //height: 3rem; + //border: 1px solid #396d83; + //margin: 10px 10px 10px 10px; + } +} </style> -- Gitblit v1.8.0