From 392ff42d4115e0edf003757c85827cf0b5b56acb Mon Sep 17 00:00:00 2001 From: zhouwx <1175765986@qq.com> Date: 星期二, 16 七月 2024 13:47:16 +0800 Subject: [PATCH] 导出 --- src/views/monitorData/fluxData/index.vue | 69 ++++++++++++++++++++++++++++++++++ 1 files changed, 68 insertions(+), 1 deletions(-) diff --git a/src/views/monitorData/fluxData/index.vue b/src/views/monitorData/fluxData/index.vue index 664a26c..97ef4ff 100644 --- a/src/views/monitorData/fluxData/index.vue +++ b/src/views/monitorData/fluxData/index.vue @@ -46,6 +46,14 @@ </el-icon> 重置 </el-button> + <vue3-json-excel + class="ml10" + :json-data="state.tableData.excelData" + :fields="fields" + name="通量数据.xls" + > + <el-button type="primary" :icon="Download" size="default">导出</el-button> + </vue3-json-excel> </el-form> </div> <div :id="fluxChart" style="height: 500px;width: auto"></div> @@ -86,6 +94,8 @@ import { gasManageApi } from "/@/api/basicDataManage/gasManage"; import { areaManageApi } from "/@/api/basicDataManage/areaManage"; import { fluxDataApi } from "/@/api/monitorData/fluxData"; +import {Download} from "@element-plus/icons-vue"; +import {gasDataApi} from "/@/api/monitorData/gasData"; const state = reactive<TableFluxState>({ tableData: { @@ -103,7 +113,29 @@ }, gasList: [], areaList: [], + excelData: [] }, +}); +const fields = ref({ + 'time':'dataReceivingTime', + '设备ID':'equipmentId', + '区域': 'areaId', + '风速':'windSpeed', + '风向':'windDirection', + '甲烷CH4':'gasName01', + 'gasValue01':'gasValue01', + '乙烷C2H6':'gasName02', + 'gasValue02':'gasValue02', + '丙烷C3H8':'gasName03', + 'gasValue03':'gasValue03', + '丁烷C4H10':'gasName04', + 'gasValue04':'gasValue04', + '硫化氢H2S':'gasName05', + 'gasValue05':'gasValue05', + '乙烯C2H4':'gasName06', + 'gasValue06':'gasValue06', + '异丁烷C4H10':'gasName07', + 'gasValue07':'gasValue07', }); const loading = ref(false); @@ -157,6 +189,7 @@ const yData = ref([]); const areaChart = ref([]as any); const initInfoData = async () => { + await exportFluxData() //柱状图 const chartParam = { startTime: moment(state.tableData.listQuery.searchParams.time[0]).format('YYYY-MM-DD HH:mm:ss'), @@ -211,6 +244,7 @@ yData.value = []; xData.value = []; dataZoomEnd.value = 100; + initCharts([],[]); } // initCharts(); @@ -236,7 +270,7 @@ let res = await fluxDataApi().getFluxLinePage(pageParam); if(res.data.code == 100) { state.tableData.data = res.data.data; - state.tableData.total = res.data.total; + state.tableData.total = res.data.total == null ? 0 :res.data.total; state.tableData.listQuery.pageIndex = res.data.pageIndex; state.tableData.listQuery.pageSize = res.data.pageSize; loading.value = false; @@ -247,6 +281,38 @@ }); } }; + +const exportFluxData = async () => { + const pageParam = { + startTime: moment(state.tableData.listQuery.searchParams.time[0]).format('YYYY-MM-DD HH:mm:ss'), + endTime: moment(state.tableData.listQuery.searchParams.time[1]).format('YYYY-MM-DD HH:mm:ss'), + ch4: state.tableData.listQuery.searchParams.gas == 1 ? 1 : 0, + c2h6: state.tableData.listQuery.searchParams.gas == 2 ? 1:0, + c3H8: state.tableData.listQuery.searchParams.gas == 3 ? 1:0, + c4h101: state.tableData.listQuery.searchParams.gas == 4 ? 1:0, + h2s: state.tableData.listQuery.searchParams.gas == 5 ? 1:0, + c2h4: state.tableData.listQuery.searchParams.gas == 6 ? 1:0, + c4h102: state.tableData.listQuery.searchParams.gas == 7 ? 1:0, + +// 发对应的编号,查询数据;null,不查询 + areaId1: state.tableData.listQuery.searchParams.area == 1 ? '1':null, + areaId2: state.tableData.listQuery.searchParams.area == 2 ? '2':null, + areaId3: state.tableData.listQuery.searchParams.area == 3 ? '3':null, + areaId4: state.tableData.listQuery.searchParams.area == 4 ? '4':null, + areaId5: state.tableData.listQuery.searchParams.area == 5 ? '5':null, + areaId6: state.tableData.listQuery.searchParams.area == 6 ? '6':null, + } + let res = await fluxDataApi().exportFlux(pageParam); + if(res.data.code == 200) { + state.tableData.excelData = res.data.data + console.log('excelData',state.tableData.excelData) + }else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } +} const labelOption = { rotate: 90, @@ -355,6 +421,7 @@ if (myChart.value != null && myChart.value != "" && myChart.value != undefined) { myChart.value.dispose(); } + console.log(yData.value.length,'xxxx') myChart.value = echarts.init(document.getElementById(fluxChart.value)); // 指定图表的配置项和数据 -- Gitblit v1.9.2