From 95fdec54d006ddd9bedd632486b708ba03a78cb3 Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期二, 06 四月 2021 18:08:58 +0800
Subject: [PATCH] 明细表动态渲染
---
src/components/LayerController/logic/WasteGas.js | 11 ++-
src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue | 2
src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue | 47 +++++++++++++--
src/api/mapApi.js | 5 +
src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue | 51 +++++++++++++++++
src/api/mapUrl.js | 1
src/components/BaseNav/PublicBounced/PublicBounced.vue | 9 ++-
7 files changed, 111 insertions(+), 15 deletions(-)
diff --git a/src/api/mapApi.js b/src/api/mapApi.js
index e43f988..4542721 100644
--- a/src/api/mapApi.js
+++ b/src/api/mapApi.js
@@ -28,9 +28,14 @@
getSolidWasteSurveyDetail (data) {
return axios.get(mapUrl.getSolidWasteSurveyDetail, data)
},
+ // 搴熸皵鐐瑰姞杞�
getWasteGas (data) {
return axios.get(mapUrl.getWasteGas, data)
},
+ // 搴熸皵鏄庣粏琛�
+ getWasteGasDetails (data) {
+ return axios.get(mapUrl.getWasteGasDetails, data)
+ },
getWasteWater (data) {
return axios.get(mapUrl.getWasteWater, data)
},
diff --git a/src/api/mapUrl.js b/src/api/mapUrl.js
index 03933ac..33bf39f 100644
--- a/src/api/mapUrl.js
+++ b/src/api/mapUrl.js
@@ -11,6 +11,7 @@
export const getSolidWasteSurveyDetail = $HOST + '/wasteSolid/getSolidWasteSurveyDetail'
export const getWasteGas = $HOST + '/wasteGas/getWasteGas'
+export const getWasteGasDetails = $HOST + '/wasteGas/getWasteGasMonitoringDetails'
export const getWasteWater = $HOST + '/wasteWater/getWasteWater'
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue b/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue
index 0fc0cfb..c3338d4 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue
@@ -6,13 +6,37 @@
<el-tag>鐑熷皹 : 6.93 鏍囧噯 : 30</el-tag>
<el-tag>搴熸皵娴侀噺 : 120343.18</el-tag>
</div>
- <div style="width:750px;height:260px;" id="echarts" ref="main"></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"
+ width="66%"
+ center
+ >
+ <div class="el-dialog-div" style="height: 600px">
+ <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>
</div>
</template>
<script>
+import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
export default {
name: 'ECharts',
+ components: {
+ PublicDetailedList
+ },
+ data () {
+ return {
+ dialogVisible: false
+ }
+ },
methods: {
drawChart: function () {
const myChart = this.$echarts.init(this.$refs.main)
@@ -195,10 +219,21 @@
border: none;
padding: 0 15px;
}
- #echarts{
- margin: 0;
- padding: 0;
- border: 1px solid #396d83;
- margin: 10px 10px 10px 10px;
+ .form-echrts{
+ width: 100%;
+ height: 100%;
+ border: 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;
+ }
}
</style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
index db99764..8fd38d7 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
@@ -10,7 +10,7 @@
<li @click='tabTaggle("ECharts")'>鏈堟暟鎹�</li>
<li @click='tabTaggle("ECharts")'>浜哄伐鏁版嵁</li>
</ul>
- <component :is="currentTab"></component>
+ <component :is="currentTab" v-bind="$attrs"></component>
</div>
</template>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue
new file mode 100644
index 0000000..efdfd77
--- /dev/null
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue
@@ -0,0 +1,51 @@
+<template>
+ <div class="PublicDetailedList">
+ <el-table :data="tableData" max-height="600px">
+ <el-table-column prop="OnLineMonEmissPointName" label="鎺掓斁鐐�"></el-table-column>
+ <el-table-column prop="MonTimeStr" label="鐩戞祴鏃堕棿"></el-table-column>
+ <el-table-column label="姘哀鍖栫墿">
+ <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)"></el-table-column>
+ <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)"></el-table-column>
+ <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)"></el-table-column>
+ <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)"></el-table-column>
+ </el-table-column>
+ <el-table-column label="浜屾哀鍖栫～">
+ <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)"></el-table-column>
+ <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)"></el-table-column>
+ <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)"></el-table-column>
+ <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)"></el-table-column>
+ </el-table-column>
+ <el-table-column label="鐑熷皹">
+ <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)"></el-table-column>
+ <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)"></el-table-column>
+ <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)"></el-table-column>
+ <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)"></el-table-column>
+ </el-table-column>
+ <el-table-column label="搴熸皵娴侀噺">
+ <el-table-column prop="StdValue" label="姘旈噺"></el-table-column>
+ </el-table-column>
+ </el-table>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'PublicDetailedList',
+ data () {
+ return {
+ tableData: []
+ }
+ },
+ mounted () {
+ this.tableData = this.$attrs.getWasteGasDetails
+ console.log(this.$attrs.getWasteGasDetails)
+ }
+}
+
+</script>
+
+<style scoped>
+.PublicDetailedList{
+ /*height: 100%*/
+}
+</style>
diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue
index 9a379d9..501d120 100644
--- a/src/components/BaseNav/PublicBounced/PublicBounced.vue
+++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue
@@ -10,7 +10,7 @@
:setWasteGasdata="setWasteGasdata"></PublicTabs>
<div class="public-bounced-content-left-bottom">
<PublicTable v-if="value === 'gufei'" :displayContentTable="displayContentTable"></PublicTable>
- <PublicChart v-else></PublicChart>
+ <PublicChart :getWasteGasDetails="getWasteGasDetails" v-else></PublicChart>
</div>
</div>
<div class="public-bounced-content-right">
@@ -43,7 +43,8 @@
displayContentTab: '',
displayContentTable: '',
flag: false,
- value: ''
+ value: '',
+ getWasteGasDetails: []
}
},
methods: {
@@ -56,8 +57,10 @@
this.flag = true
this.value = value
},
- setGasData (data, value) {
+ setGasData (data, dataDetails, value) {
this.setWasteGasdata = data
+ this.getWasteGasDetails = dataDetails
+ // console.log(dataDetails)
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 c5c2465..9e7b219 100644
--- a/src/components/LayerController/logic/WasteGas.js
+++ b/src/components/LayerController/logic/WasteGas.js
@@ -50,13 +50,14 @@
this.clickListener = async (e) => {
// console.log(e)
this.animalService.pulseEffect(e.latlng)
- // const dataValue = {
- // StoragePlaceId: e.layer.options.test.StoragePlaceId
- // }
- // const result = await mapApi.getWasteGas(dataValue)
+ const dataValue = {
+ StoragePlaceId: e.layer.options.test.StoragePlaceId
+ }
+ const result = await mapApi.getWasteGasDetails(dataValue)
+ // console.log(result.Result.DataInfo)
const PublicBounced = window.Vue.extend(publicBounced)
const instance = new PublicBounced()
- instance.setGasData(e.layer.options.test, 'feiqi')
+ instance.setGasData(e.layer.options.test, result.Result.DataInfo, 'feiqi')
// console.log(e.layer.options.test)
instance.$mount()
document.body.appendChild(instance.$el)
--
Gitblit v1.8.0