From 704f7357444b36b63663be7d79bc2ed41d6eb932 Mon Sep 17 00:00:00 2001 From: stt Date: Mon, 24 Nov 2025 14:53:07 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8A=A5=E8=A1=A8=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../cockpit/governanceReport/index.vue | 190 ++++++++++++++---- 1 file changed, 146 insertions(+), 44 deletions(-) diff --git a/src/components/cockpit/governanceReport/index.vue b/src/components/cockpit/governanceReport/index.vue index 437cc82..b200485 100644 --- a/src/components/cockpit/governanceReport/index.vue +++ b/src/components/cockpit/governanceReport/index.vue @@ -3,18 +3,28 @@ -
+
+
@@ -39,18 +58,18 @@ import { ref, onMounted, provide, reactive, watch, h, computed } from 'vue' import TableStore from '@/utils/tableStore' import { exportExcel } from '@/views/govern/reportForms/export.js' import TableHeader from '@/components/table/header/index.vue' -import { getTimeOfTheMonth } from '@/utils/formatTime' import { useConfig } from '@/stores/config' import Json from './index.json' -import { useRoute } from 'vue-router' -import { useTimeCacheStore } from '@/stores/timeCache' +import JsonAfter from './index.json' +import { getTemplateList } from '@/api/harmonic-boot/luckyexcel' +import { getListByIds } from '@/api/harmonic-boot/cockpit/cockpit' const prop = defineProps({ - w: { type: [String, Number]}, - h: { type: [String, Number]}, - width: { type: [String, Number]}, - height: { type: [String, Number]}, - timeKey: { type: [String, Number]}, + w: { type: [String, Number] }, + h: { type: [String, Number] }, + width: { type: [String, Number] }, + height: { type: [String, Number] }, + timeKey: { type: [String, Number] }, timeValue: { type: Object } }) const config = useConfig() @@ -65,9 +84,6 @@ const powerList: any = ref([ } ]) -const route = useRoute() -const timeCacheStore = useTimeCacheStore() - const tableStore: any = new TableStore({ url: '/user-boot/role/selectRoleDetail?id=0', method: 'POST', @@ -75,7 +91,7 @@ const tableStore: any = new TableStore({ showPage: false, exportName: '主要监测点列表', column: [], - beforeSearchFun: () => { + beforeSearchFun: () => { tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0] tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1] }, @@ -87,27 +103,115 @@ provide('tableRef', tableRef) tableStore.table.params.power = '1' provide('tableStore', tableStore) -// 下载表格 -const downloadExcel = () => { - exportExcel(luckysheet.getAllSheets(), '治理效果报表') -} -onMounted(() => { - luckysheet.create({ - container: 'luckysheet', - title: '', // 表 头名 - lang: 'zh', // 中文 - showtoolbar: false, // 是否显示工具栏 - showinfobar: false, // 是否显示顶部信息栏 - showsheetbar: true, // 是否显示底部sheet按钮 - allowEdit: false, // 禁止所有编辑操作（必填） - data: Json - }) - tableStore.index() +// 报表模板列表 +const templateList = ref([]) + +// 监测对象 +const idList = ref() + +// 监测对象 +const initListByIds = () => { + getListByIds({}).then((res: any) => { + if (res.data.length > 0) { + idList.value = res.data + if (!tableStore.table.params.sensitiveUserId && idList.value?.length > 0) { + tableStore.table.params.sensitiveUserId = idList.value[0].id + } + } + }) +} + +const templateListData = () => { + getTemplateList({}).then(res => { + templateList.value = res.data + if (!tableStore.table.params.tempId && templateList.value?.length > 0) { + tableStore.table.params.tempId = res.data[0].id + } + }) +} + +// 治理前和治理后的Luckysheet实例 +let luckysheetBefore: any +let luckysheetAfter: any + +onMounted(() => { + templateListData() + // 等待DOM更新完成后再创建Luckysheet实例 + nextTick(() => { + setTimeout(() => { + createLuckysheets() + }, 100) + }) }) -const selectChange = (showSelect: any, height: any, datePickerValue?: any) => { +// 下载表格 +const downloadExcel = () => { + // 可以选择导出治理前、治理后或两个报表 + const beforeSheets = luckysheetBefore.getAllSheets() + const afterSheets = luckysheetAfter.getAllSheets() + exportExcel([...beforeSheets, ...afterSheets], '治理效果对比报表') +} +onMounted(() => { + templateListData() + initListByIds() + nextTick(() => { + setTimeout(() => { + createLuckysheets() + }, 100) + }) +}) + +const createLuckysheets = () => { + try { + // 检查容器 + const beforeContainer = document.getElementById('luckysheet-before') + const afterContainer = document.getElementById('luckysheet-after') + + if (!beforeContainer) { + return + } + + if (!afterContainer) { + return + } + + // 验证并准备数据 + const beforeData = Json && Array.isArray(Json) ? Json : [] + const afterData = JsonAfter && Array.isArray(JsonAfter) ? JsonAfter : [] + + // 创建治理前报表 + luckysheetBefore = luckysheet.create({ + container: 'luckysheet-before', + title: '治理前', + lang: 'zh', + showtoolbar: false, + showinfobar: false, + showsheetbar: true, + allowEdit: false, + data: beforeData + }) + + // 创建治理后报表 + luckysheetAfter = luckysheet.create({ + container: 'luckysheet-after', + title: '治理后', + lang: 'zh', + showtoolbar: false, + showinfobar: false, + showsheetbar: true, + allowEdit: false, + data: afterData + }) + + tableStore.index() + } catch (error) { + console.error('创建Luckysheet实例时发生错误:', error) + } +} + +const selectChange = (showSelect: any, height: any, datePickerValue?: any) => { if (datePickerValue && datePickerValue.timeValue) { // 更新时间参数 tableStore.table.params.searchBeginTime = datePickerValue.timeValue[0] @@ -146,11 +250,9 @@ watch( deep: true } ) - -const addMenu = () => {}