/** * 全局事件模块。 * 页面大部分内容由模板字符串动态生成,因此统一使用事件代理监听 click,再按 data-* 属性更新 state 或打开外链。 */ document.addEventListener("click", (event) => { // 维度切换会影响企业、项目、指标所有派生数据;项目页切换维度后回到企业页,防止旧项目 id 失效。 const dimButton = event.target.closest("[data-dim]"); if (dimButton) { state.dimension = dimButton.dataset.dim; if (state.view === "project") { state.view = "enterprise"; state.projectId = ""; } if (state.drillOpen && state.drillView === "project") { state.drillView = "trend"; } render(); return; } // 系统切换后需要校验当前选中指标是否仍属于新系统,不属于则切换到该系统第一个指标。 const systemButton = event.target.closest("[data-system]"); if (systemButton) { if (!allowedSystems.includes(systemButton.dataset.system)) return; state.system = systemButton.dataset.system; if (!getWarningIndicators().some((item) => item.name === state.selectedIndicator)) { state.selectedIndicator = getWarningIndicators()[0]?.name || ""; } render(); return; } // 显式操作按钮:外链预览、弹窗开关、面包屑返回都通过 data-action 分发。 const action = event.target.closest("[data-action]"); if (action) { if (action.dataset.action === "more-indicators") { window.open(INDICATOR_MORE_URL, "_blank", "noopener,noreferrer"); return; } if (action.dataset.action === "enterprise-more-indicators") { window.open(ENTERPRISE_INDICATOR_MORE_URL, "_blank", "noopener,noreferrer"); return; } if (action.dataset.action === "group-usage-report-preview") { window.open(GROUP_USAGE_REPORT_URL, "_blank", "noopener,noreferrer"); return; } if (action.dataset.action === "preview-unit-report") { const unit = action.dataset.unit || ""; const fileName = usageReportFiles[unit]; if (!fileName) { window.alert(`${unit || "该单位"}未上传一览表`); return; } const fileUrl = `${REPORT_FILE_BASE_URL}${encodeURIComponent(fileName)}`; window.open(`${OFFICE_PREVIEW_BASE_URL}${encodeURIComponent(fileUrl)}`, "_blank", "noopener,noreferrer"); return; } if (action.dataset.action === "group-online-stats") { state.drillOpen = true; state.drillView = "groupOnlineStats"; state.drillEnterpriseName = ""; state.drillListType = ""; state.projectId = ""; renderDrillModal(); return; } if (action.dataset.action === "close-drill") { state.drillOpen = false; state.drillView = "trend"; state.drillEnterpriseName = ""; state.drillListType = ""; renderDrillModal(); return; } if (action.dataset.action === "enterprise-project-list") { state.drillOpen = true; state.drillView = "enterpriseProjectList"; state.drillListType = "all"; state.projectId = ""; renderDrillModal(); return; } if (action.dataset.action === "enterprise-offline-list") { state.drillOpen = true; state.drillView = "enterpriseProjectList"; state.drillListType = "offline"; state.projectId = ""; renderDrillModal(); return; } if (action.dataset.action === "indicator-trend") { state.drillOpen = true; state.drillView = "trend"; state.drillEnterpriseName = ""; state.projectId = ""; state.drillListType = ""; renderDrillModal(); return; } if (action.dataset.action === "group") { state.view = "group"; state.enterpriseName = ""; state.projectId = ""; } if (action.dataset.action === "enterprise") { state.view = "enterprise"; state.enterpriseName = action.dataset.enterprise || state.enterpriseName; state.projectId = ""; } render(); return; } // 指标卡点击:集团页打开指标趋势,企业页打开该企业下的项目指标穿透。 const indicatorTarget = event.target.closest("[data-indicator]"); if (indicatorTarget) { state.selectedIndicator = indicatorTarget.dataset.indicator; state.drillOpen = true; if (state.view === "enterprise") { state.drillView = "project"; state.drillEnterpriseName = state.enterpriseName; } else { state.drillView = "trend"; state.drillEnterpriseName = ""; } state.projectId = ""; renderDrillModal(); return; } // 指标排行中的企业点击:保留当前指标,切换穿透企业,弹窗内容更新为项目维度明细。 const indicatorEnterpriseTarget = event.target.closest("[data-indicator-enterprise]"); if (indicatorEnterpriseTarget) { state.drillEnterpriseName = indicatorEnterpriseTarget.dataset.indicatorEnterprise; state.drillOpen = true; state.drillView = "project"; state.projectId = ""; renderDrillModal(); return; } // 企业点击:从集团图表、表格或面包屑进入企业看板。 const enterpriseTarget = event.target.closest("[data-enterprise]"); if (enterpriseTarget) { state.view = "enterprise"; state.enterpriseName = enterpriseTarget.dataset.enterprise; state.projectId = ""; render(); return; } // 项目点击:进入项目级看板,并关闭当前弹窗,避免弹窗遮挡项目详情。 const projectTarget = event.target.closest("[data-project]"); if (projectTarget) { state.view = "project"; state.projectId = projectTarget.dataset.project; state.drillOpen = false; state.drillView = "trend"; state.drillListType = ""; render(); } }); /** * 初始化顺序: * 先绑定缩放并渲染兜底数据,再异步加载集团主数据接口; * 接口返回后 loadProjectMasterDataAnalysis 会再次 render,刷新集团上线率卡片和统计弹窗。 */ window.addEventListener("resize", scaleScreen); if (window.visualViewport) { window.visualViewport.addEventListener("resize", scaleScreen); } scaleScreen(); render(); loadProjectMasterDataAnalysis();