From 270b06c2faed5f2aa564c4a3b1246a5891188bc7 Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期二, 13 四月 2021 16:01:14 +0800 Subject: [PATCH] 废气图表点击显示 --- src/components/LayerController/logic/WasteGas.js | 2 src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue | 8 +++- src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue | 22 +++++++++-- src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue | 18 +++++++-- src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue | 38 ++----------------- src/components/BaseNav/PublicBounced/PublicBounced.vue | 5 +- 6 files changed, 46 insertions(+), 47 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue index 63f6a30..2c354b2 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue @@ -139,6 +139,10 @@ } } }, + mounted () { + this.onSubmit() + // this.CreateChart(this.JsonDayCharts.id, this.JsonDayCharts.title, this.JsonDayCharts.legend, this.JsonDayCharts.xdata, this.JsonDayCharts.ydatas, this.JsonDayCharts.yname, this.JsonDayCharts.id, this.JsonDayCharts.datatype) + }, methods: { onSubmit () { console.log('submit!') @@ -667,40 +671,6 @@ // } // return options // } - }, - mounted () { - // this.$nextTick(() => { - // this.drawChart() - // const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getQueryOnlineMonDateData)).reverse() - // console.log(dataWatch) - // var dateDate = [] - // // {COD:[3,4,5]} - // var data = {} - // for (var n = 0; n < dataWatch.length; n++) { - // var d = dataWatch[n].MonTimeStr.substring(5, 9) - // if (dateDate.indexOf(d) < 0) { - // dateDate.push(d) - // } - // if (data[dataWatch[n].PoltmtrlName]) { - // data[dataWatch[n].PoltmtrlName].push(dataWatch[n].MonQty) - // } else { - // data[dataWatch[n].PoltmtrlName] = [dataWatch[n].MonQty] - // } - // } - // var series = [] - // for (var k in data) { - // series.push({ - // name: k, - // type: 'line', - // yAxisIndex: k === '搴熸按娴侀噺' ? 1 : 0, - // data: data[k] - // }) - // } - // console.log(series) - // const opitons = this.initOptions(dateDate, series) - // this.mychartDay = this.$echarts.init(this.$refs.main) - // this.mychartDay.setOption(opitons) - // }) } } </script> diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue index ce8f4e9..e8b032e 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue @@ -141,18 +141,31 @@ } } }, - // mounted () { + // created () { // // 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) // // } // }, + mounted () { + 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 () { + 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) + // 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() var dataUnit = '' @@ -450,6 +463,7 @@ }], series: serLists } + console.log(option) this.myChart.setOption(option) /* this.myChart.on('legendselectchanged', function (params) { diff --git a/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue b/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue index feb9840..510cb8e 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue @@ -14,7 +14,7 @@ <div class="pickerData"> <span> 寮�濮嬫椂闂�:</span> <span class="pickerTable"> - <el-date-picker type="datetime" v-model="formInline.timeStart"></el-date-picker> + <el-date-picker type="datetime" v-model="formInline.timeStart"></el-date-picker> </span> </div> <div class="pickerData"> @@ -205,10 +205,20 @@ } } }, - // mounted () { - // this.DrawEXHRealTimeDateChart() - // }, + mounted () { + // const Day = new Date() + // console.log(Day) + this.DrawEXHRealTimeDateChart(this.JsonTimeCtarts.id, this.JsonTimeCtarts.title, this.JsonTimeCtarts.legend, this.JsonTimeCtarts.ydatas, this.JsonTimeCtarts.yname) + }, methods: { + // EndTime () { + // var myDate = new Date() + // var mytime = myDate.toLocaleTimeString() // 鑾峰彇褰撳墠鏃堕棿 + // console.log(mytime) + // }, + // handleshowcomplaint(row) { + // this.temp.complaint_consultationtime = new Date() + // }, onSubmit () { this.DrawEXHRealTimeDateChart(this.JsonTimeCtarts.id, this.JsonTimeCtarts.title, this.JsonTimeCtarts.legend, this.JsonTimeCtarts.ydatas, this.JsonTimeCtarts.yname) }, diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue index 584f1db..dcd5bc6 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue @@ -18,7 +18,7 @@ <span >瓒呮爣</span> <i style=" background: orange;"></i> </div> - <component :is="currentTab" v-bind="$attrs"></component> + <component :is="currentTab" v-bind="$attrs" ref="Echatrs"></component> </div> </template> @@ -40,14 +40,18 @@ EChartsHourWasteWater, EChartsTable }, + mounted () { + this.$refs.Echatrs.CreateChart() + }, data () { return { - currentTab: 'EChartsHour' + currentTab: EChartsHour } }, methods: { tabTaggle (taggleMenu) { this.currentTab = taggleMenu + console.log(this.$refs.Echatrs.CreateChart()) // debugger } } diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue index b31bc24..abfd8a6 100644 --- a/src/components/BaseNav/PublicBounced/PublicBounced.vue +++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue @@ -64,7 +64,7 @@ mounted () { // this.$nextTick(() => { // console.log(this.$refs.publicBounced) - // console.log(this.$refs.PublicChart) + console.log(this.$refs.PublicChart) // }) }, methods: { @@ -83,11 +83,12 @@ this.value = value }, setGasData (data, dataDetails, GasHourData, ManualData, value) { + // console.log(this.$refs) this.setWasteGasdata = data this.getWasteGasDetails = dataDetails this.getQueryOnlineMonData = GasHourData this.ManualData = ManualData - console.log(this.getQueryOnlineMonData) + // console.log(this.getQueryOnlineMonData) this.displayContentTitle = data.Name this.flag = true this.value = value diff --git a/src/components/LayerController/logic/WasteGas.js b/src/components/LayerController/logic/WasteGas.js index 9b85faf..bc7369b 100644 --- a/src/components/LayerController/logic/WasteGas.js +++ b/src/components/LayerController/logic/WasteGas.js @@ -82,10 +82,10 @@ // console.log(result.Result.DataInfo) const PublicBounced = window.Vue.extend(publicBounced) const instance = new PublicBounced() - instance.setGasData(e.layer.options.test, result.Result.DataInfo, Mondata.Result.DataInfo, ManualData.Result.DataInfo, 'feiqi') // console.log(e.layer.options.test) instance.$mount() document.body.appendChild(instance.$el) + instance.setGasData(e.layer.options.test, result.Result.DataInfo, Mondata.Result.DataInfo, ManualData.Result.DataInfo, 'feiqi') this.setPanTo(e.latlng, 80) } // 涓嶅悓绫诲瀷鍥剧墖鍔犺浇 -- Gitblit v1.8.0