From 696597febade0d104b456252a9101574fd534ce7 Mon Sep 17 00:00:00 2001 From: Rue Ji Date: Thu, 5 Mar 2026 03:08:24 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E6=9B=B4=E6=96=B0=E3=80=81?= =?UTF-8?q?=E6=BA=90=E5=A4=B4=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/webapp/JS/comm.js | 147 ++---- src/main/webapp/jsp/bigScreen.jsp | 73 ++- src/main/webapp/jsp/bigScreen2.jsp | 67 ++- src/main/webapp/jsp/bigScreen3.jsp | 67 ++- src/main/webapp/jsp/left.jsp | 14 - src/main/webapp/jsp/main_JS_Company.jsp | 2 +- src/main/webapp/jsp/user/roleMenu.jsp | 19 +- .../webapp/jsp/visual/newSourceGISPage.jsp | 495 ++++++++++++------ 8 files changed, 599 insertions(+), 285 deletions(-) diff --git a/src/main/webapp/JS/comm.js b/src/main/webapp/JS/comm.js index c8ce9394..af4c833f 100644 --- a/src/main/webapp/JS/comm.js +++ b/src/main/webapp/JS/comm.js @@ -493,89 +493,12 @@ function getMpPic() { function initMenu() { var menu = $('#menu'); - - // 定义一个内部函数来执行DOM操作添加菜单 - var appendS223Menu = function() { - var $menu = $('#menu'); - - // 查找“纳管企业清单”所在的菜单项 - // 情况1: 一级菜单，名称在 span 中 - var $targetSpan = $menu.find("span").filter(function() { - return $(this).text().trim() === '纳管企业清单'; - }); - - var $targetLi = null; - - if ($targetSpan.length > 0) { - $targetLi = $targetSpan.closest('li'); - } else { - // 情况2: 二级菜单，名称直接在 a 标签中（可能是文本节点） - var $targetLink = $menu.find('a').filter(function() { - // 克隆节点，移除子元素（如图标），只获取自身的文本 - return $(this).clone().children().remove().end().text().trim() === '纳管企业清单'; - }); - if ($targetLink.length > 0) { - $targetLi = $targetLink.closest('li'); - } - } - - if ($targetLi && $targetLi.length > 0) { - var $treeviewMenu = $targetLi.find('> .treeview-menu'); - - // 确保 treeview-menu 存在 - if ($treeviewMenu.length === 0) { - $treeviewMenu = $(''); - $targetLi.append($treeviewMenu); - } - - // 检查是否已经添加过，防止重复添加 - // 注意：新菜单项可能直接是文本，也可能包含 i 标签 - var exists = false; - $treeviewMenu.find('li').each(function() { - // if ($(this).text().indexOf('管道管理') > -1) { - // exists = true; - // } - }); - - if (!exists) { - // 根据层级决定样式，通常二级或三级菜单项不需要 span 包裹文字，或者保持一致 - // 这里的样式参考了 menuitems.jsp 中的 Level 3:
  • Name
    • - // 使用 addTab 函数而不是 refreshPage，以支持在 tab 页中打开（如果系统支持）或者在当前 iframe 打开 - // 检查 addTab 是否存在，如果存在则使用它，否则回退到 refreshPage - var newMenuHtml = ''; - if (typeof addTab === 'function') { - // 假设 addTab(id, name, url) - } else { - // 如果没有 addTab，尝试使用 iframe 加载或者直接跳转（但在框架内） - // refreshPage 通常是 location.replace，这会刷新整个页面。 - // 如果目标是内嵌，我们应该寻找 iframe 的加载方式。 - // 查看 comm.js 其他部分，发现有 refreshPage(url) 实现为 location.replace(url)。 - // 如果要内嵌，通常是设置某个 iframe 的 src。 - // 假设主内容区域是一个 iframe，或者支持通过 data-url 加载。 - // 暂时使用 refreshPage，但确认它是在当前窗口（iframe）中加载，而不是弹出新窗口。 - // 用户反馈说“不要新开特么弹窗”，可能是指 window.open 或者 target="_blank"。 - // refreshPage 使用 location.replace，是在当前窗口打开。 - // 如果当前窗口是整个 index 页面，那就会刷新整个页面。 - // 如果是 SPA 或者 iframe 架构，我们需要找到正确的方法。 - - // 观察 menuitems.jsp，发现二级菜单使用 addTab('${cumcl2.id}','${cumcl2.name}','${cumcl2.location}') - // 所以我们应该优先使用 addTab。 - // 如果 addTab 未定义（可能在 index.jsp 中定义），我们尝试模拟它。 - // 由于 comm.js 被 index.jsp 引用，addTab 应该可用。 - } - $treeviewMenu.append(newMenuHtml); - - // 确保父菜单是展开状态（可选） - // $targetLi.addClass('active menu-open'); - } - } - }; if (sessionStorage.menu != undefined) { $('#menu').html(sessionStorage.menu); - // 即使是缓存加载，也尝试添加新菜单 - appendS223Menu(); + // 更新大屏菜单的onclick事件，确保使用全屏功能 + updateBigScreenMenuEvents(); if (sessionStorage.m1 != undefined) { $('#' + sessionStorage.m1).addClass('treeview active menu-open') @@ -589,29 +512,8 @@ function initMenu() { //return; } else { $.post(ext.contextPath + "/user/showMenuListByCu.do", {}, function (result) { - var bigScreenHtml = '
  • ' + - '' + - ' 大屏展示' + - '' + - '' + - '' + - '' + - '' + - '
    • '; - result = result + bigScreenHtml; - // 替换源头GIS管理页面链接为JSP - result = result.replace('newSourceGISPage.html', 'newSourceGISPage.jsp'); - result = result.replace('newGIS.html', 'newSourceGISPage.jsp'); - $('#menu').html(result); - // 在设置HTML后执行DOM注入 - appendS223Menu(); - sessionStorage.setItem("menu", $('#menu').html()); // 保存修改后的HTML到sessionStorage if (sessionStorage.m1 != undefined) { @@ -647,6 +549,51 @@ function initMenuScroll(menu) { }); } +/** 获取浏览器当前缩放比例 + * @returns 100为100% + */ +/** + * 打开全屏窗口 + * @param url 页面URL + */ +function openFullScreenWindow(url) { + // 打开新窗口，使用屏幕全部尺寸 + var width = screen.width; + var height = screen.height; + var newWindow = window.open(url, '_blank', + 'width=' + width + ',height=' + height + + ',top=0,left=0,menubar=no,toolbar=no,location=no,status=no,resizable=yes,scrollbars=no'); + + // 尝试让新窗口获得焦点 + if (newWindow) { + newWindow.focus(); + } + return false; +} + +/** + * 更新大屏菜单的点击事件，确保使用全屏功能 + * 用于处理缓存菜单的情况 + */ +function updateBigScreenMenuEvents() { + // 查找所有大屏菜单项并更新onclick事件 + $('#menu a').each(function() { + var text = $(this).text().trim(); + var url = ''; + if (text === '水厂大屏') { + url = ext.contextPath + '/jsp/bigScreen.jsp'; + } else if (text === '区域管线大屏') { + url = ext.contextPath + '/jsp/bigScreen2.jsp'; + } else if (text === '排污户大屏') { + url = ext.contextPath + '/jsp/bigScreen3.jsp'; + } + if (url) { + $(this).attr('href', 'javascript:void(0);'); + $(this).attr('onclick', 'openFullScreenWindow(\'' + url + '\');'); + } + }); +} + /** 获取浏览器当前缩放比例 * @returns 100为100% */ diff --git a/src/main/webapp/jsp/bigScreen.jsp b/src/main/webapp/jsp/bigScreen.jsp index 94df6e72..a8dd16b5 100644 --- a/src/main/webapp/jsp/bigScreen.jsp +++ b/src/main/webapp/jsp/bigScreen.jsp @@ -24,7 +24,7 @@ .screen-container { width: 6500px; height: 1800px; - background-image: url('<%=request.getContextPath()%>/IMG/screen1-1.png'); + background-image: url('<%=request.getContextPath()%>/IMG/screen1.png'); /* background-image: url("../../IMG/screen1.png"); */ background-size: 100% 100%; background-repeat: no-repeat; @@ -178,9 +178,48 @@ top: 300px; left: 2700px; } + /* 全屏提示遮罩 */ + .fullscreen-overlay { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.9); + display: flex; + justify-content: center; + align-items: center; + z-index: 9999; + cursor: pointer; + } + .fullscreen-overlay .tip-content { + text-align: center; + color: #fff; + } + .fullscreen-overlay .tip-content h2 { + font-size: 48px; + margin-bottom: 20px; + color: #46F2FF; + } + .fullscreen-overlay .tip-content p { + font-size: 24px; + color: #7ef3ff; + } + .fullscreen-overlay .tip-content .icon { + font-size: 80px; + margin-bottom: 20px; + } + +
    +
    +
    🖥️
    +

    点击进入全屏展示

    +

    按 ESC 键可退出全屏

    +
    +
    @@ -305,7 +344,8 @@
    - + +
    @@ -325,6 +365,35 @@
    - + + @@ -735,7 +724,30 @@ var records = []; var markers = []; - // Mock API Function + // 获取上下文路径 + var contextPath = '<%=request.getContextPath()%>'; + + // 真实API请求函数 + function apiRequest(url, params) { + console.log('API Request:', contextPath + url, params); + return new Promise(function(resolve, reject) { + $.ajax({ + url: contextPath + url, + type: 'POST', + data: params || {}, + success: function(data) { + console.log('API Response:', url, data); + resolve(data); + }, + error: function(xhr, status, error) { + console.error('API Request Error:', url, error); + reject(error); + } + }); + }); + } + + // Mock API Function (保留用于没有真实接口的数据) function mockApiRequest(url, params) { return new Promise(function(resolve, reject) { setTimeout(function() { @@ -826,15 +838,15 @@ resolve(wls); } else if (url === '/api/plan/list') { resolve([ - { id: 1, name: "金山一车间周检", status: "启用", duration: "2小时", interval: "每周", start: "2026-02-01", end: "2026-12-31" }, - { id: 2, name: "泵站日常巡检", status: "启用", duration: "4小时", interval: "每日", start: "2026-02-01", end: "2026-12-31" }, - { id: 3, name: "管网全面排查", status: "停用", duration: "3天", interval: "每季度", start: "2026-01-01", end: "2026-03-31" } + { id: 1, name: "金山一车间周检", status: "启用", duration: "2小时", interval: "每周", startTime: "2026-02-01", endTime: "2026-12-31" }, + { id: 2, name: "泵站日常巡检", status: "启用", duration: "4小时", interval: "每日", startTime: "2026-02-01", endTime: "2026-12-31" }, + { id: 3, name: "管网全面排查", status: "停用", duration: "3天", interval: "每季度", startTime: "2026-01-01", endTime: "2026-03-31" } ]); } else if (url === '/api/record/list') { resolve([ - { id: 1, name: "金山一车间周检", status: "已完成", planStart: "2026-02-03 09:00", planEnd: "2026-02-03 11:00", actualEnd: "2026-02-03 10:45" }, - { id: 2, name: "泵站日常巡检", status: "已完成", planStart: "2026-02-08 08:00", planEnd: "2026-02-08 12:00", actualEnd: "2026-02-08 11:30" }, - { id: 3, name: "泵站日常巡检", status: "进行中", planStart: "2026-02-11 08:00", planEnd: "2026-02-11 12:00", actualEnd: "-" } + { id: 1, taskName: "金山一车间周检", status: "已完成", planStartTime: "2026-02-03 09:00", planEndTime: "2026-02-03 11:00", actualTime: "2026-02-03 10:45" }, + { id: 2, taskName: "泵站日常巡检", status: "已完成", planStartTime: "2026-02-08 08:00", planEndTime: "2026-02-08 12:00", actualTime: "2026-02-08 11:30" }, + { id: 3, taskName: "泵站日常巡检", status: "进行中", planStartTime: "2026-02-11 08:00", planEndTime: "2026-02-11 12:00", actualTime: "-" } ]); } else { reject("Unknown API Endpoint"); @@ -843,44 +855,220 @@ }); } - // Initialize Data + // 加载企业数据（排污源） + // 接口字段参考 Sewage 实体类和 sewageList.jsp + function loadCompanyData() { + return apiRequest('/sparepart/sewage/getList.do', { + page: 1, + rows: 1000, + sort: 'contract_order', + order: 'asc' + }).then(function(data) { + // 接口返回格式: {total: xxx, rows: [...]} + var list = data.rows || []; + console.log('企业接口返回数据条数:', list.length); + companies = list.map(function(items) { + const item = items.company; + // 解析经纬度 (格式: "经度" 或 "经度,纬度") + var lng = null, lat = null; + if (item.longitudeLatitude) { + var coords = String(item.longitudeLatitude).split(','); + if (coords.length >= 2) { + lng = parseFloat(coords[0]); + lat = parseFloat(coords[1]); + } else if (coords.length === 1) { + lng = parseFloat(coords[0]); + } + } + // 如果经纬度不完整，从 company 对象获取 + if ((!lng || !lat) && item.company) { + lng = lng || item.company.longitude; + lat = lat || item.company.latitude; + } + return { + id: item.id, + // 合同编号 + contractNumber: item.contractNumber || '', + // 公司名称 + name: item.name || '', + // 地址 + address: item.address || '', + // 所属区域 (company.name) + areaName: item.company ? (item.company.name || '') : '', + // 所属泵站ID + processSectionId: item.processSectionId || '', + // 所属泵站名称 (processSection为null时显示空) + processSectionName: item.processSection ? (item.processSection.name || '') : '', + // 排污许可证编号 + permitNum: item.permitNum || '', + // 排放编号 + ventNum: item.ventNum || '', + // 所属行业 + trade: item.trade || '', + // 实际日排量(吨/天) + displacement: item.displacement ? (item.displacement + '吨/天') : '-', + // 统一社会信用代码 + societyNumber: item.societyNumber || '', + // 管网所有权单位 + city: item.city || '', + // 联系人 + username: item.username || '', + // 电话 + phone: item.phone || '', + // 经纬度 + longitudeLatitude: item.longitudeLatitude || '', + // 已关联点位 + point: item._point ? '是' : '否', + // 已录入数据 + input: item._input ? '是' : '否', + // 地图坐标 + lng: lng, + lat: lat, + // 保留原始数据 + _raw: item + }; + }); + return companies; + }).catch(function(err) { + console.error('加载企业数据失败:', err); + return []; + }); + } + + // 加载泵站数据（工艺段） + function loadPumpData() { + return apiRequest('/user/processSection/getProcessSection4Select.do', { + companyId: 'JSBZ' // 根据排污源信息页面传参 + }).then(function(data) { + console.log('泵站接口返回原始数据:', data, '类型:', typeof data); + // 确保data是数组 + var dataList = data; + if (typeof data === 'string') { + try { + dataList = JSON.parse(data); + } catch(e) { + console.error('解析泵站数据失败:', e); + dataList = []; + } + } + // 接口返回格式: [{id: xxx, text: xxx}, ...] 或 [{text: xxx}, ...] + pumpStations = (dataList || []).map(function(item, index) { + return { + id: item.id || ('pump_' + index), + name: item.text || item.name || '', + code: item.id || '', + level: '-', + flow: '-', + status: '-', + time: '-', + // 泵站暂无坐标信息，使用默认位置 + lng: 121.320000 + index * 0.01, + lat: 30.760000 - index * 0.005 + }; + }); + console.log('泵站数据处理后:', pumpStations); + return pumpStations; + }).catch(function(err) { + console.error('加载泵站数据失败:', err); + return []; + }); + } + + // Initialize Data - 只加载默认Tab(污水厂)的数据 function loadData() { - Promise.all([ - mockApiRequest('/api/sewage/list'), - mockApiRequest('/api/pump/list'), - mockApiRequest('/api/company/list'), - mockApiRequest('/api/pipeline/list'), - mockApiRequest('/api/well/list'), - mockApiRequest('/api/plan/list'), - mockApiRequest('/api/record/list'), - ]).then(function(results) { - sources = results[0]; - pumpStations = results[1]; - companies = results[2]; - pipelines = results[3]; - wells = results[4]; - plans = results[5]; - records = results[6]; - - // Initialize View with default tab (Sewage) + // 初始加载污水厂数据 + mockApiRequest('/api/sewage/list').then(function(data) { + sources = data; initSewageTable(); initMarkers('sewage'); - - // Initialize other tables but they are hidden - initPumpTable(); - initCompanyTable(); - initPipelineTable(); - initWellTable(); - initPlanTable(); - initRecordTable(); - }).catch(function(err) { - console.error("Failed to load data:", err); - alert("数据加载失败，请重试"); + console.error("Failed to load sewage data:", err); }); } - // Call loadData instead of inline data definitions + // 数据加载状态标记 + var dataLoaded = { + sewage: true, // 初始已加载 + pump: false, + company: false, + pipeline: false, + well: false, + plan: false, + record: false + }; + + // 按Tab类型加载数据 + function loadTabData(type) { + // 如果数据已加载，直接返回 + if (dataLoaded[type]) { + return Promise.resolve(); + } + + var loadPromise; + + switch(type) { + case 'pump': + loadPromise = loadPumpData().then(function(data) { + console.log('loadTabData pump 接收数据:', data); + pumpStations = data; + console.log('pumpStations 赋值后:', pumpStations); + initPumpTable(); + dataLoaded.pump = true; + }); + break; + + case 'company': + loadPromise = loadCompanyData().then(function(data) { + console.log('loadTabData company 接收数据:', data); + companies = data; + console.log('companies 赋值后:', companies); + initCompanyTable(); + dataLoaded.company = true; + }); + break; + + case 'pipeline': + loadPromise = mockApiRequest('/api/pipeline/list').then(function(data) { + pipelines = data; + initPipelineTable(); + dataLoaded.pipeline = true; + }); + break; + + case 'well': + loadPromise = mockApiRequest('/api/well/list').then(function(data) { + wells = data; + initWellTable(); + dataLoaded.well = true; + }); + break; + + case 'plan': + loadPromise = mockApiRequest('/api/plan/list').then(function(data) { + plans = data; + initPlanTable(); + dataLoaded.plan = true; + }); + break; + + case 'record': + loadPromise = mockApiRequest('/api/record/list').then(function(data) { + records = data; + initRecordTable(); + dataLoaded.record = true; + }); + break; + + default: + return Promise.resolve(); + } + + return loadPromise.catch(function(err) { + console.error('加载' + type + '数据失败:', err); + }); + } + + // Call loadData for initial tab loadData(); function initMarkers(dataType) { @@ -954,35 +1142,35 @@ console.log('currentType', currentType) if (currentType === 'well') { var icon = new T.Icon({ - iconUrl: "../../IMG/wsgj.png", + iconUrl: "<%=request.getContextPath()%>/IMG/wsgj.png", iconSize: new T.Point(10, 10), iconAnchor: new T.Point(15, 15) }); marker = new T.Marker(point, {icon: icon}); } else if (currentType === 'pipeline-node') { var icon = new T.Icon({ - iconUrl: "../../IMG/icon_gd.png", + iconUrl: "<%=request.getContextPath()%>/IMG/icon_gd.png", iconSize: new T.Point(18, 18), iconAnchor: new T.Point(15, 15) }); marker = new T.Marker(point, {icon: icon}); } else if (currentType === 'pump') { var icon = new T.Icon({ - iconUrl: "../../IMG/icon_bz.png", + iconUrl: "<%=request.getContextPath()%>/IMG/icon_bz.png", iconSize: new T.Point(18, 18), iconAnchor: new T.Point(15, 15) }); marker = new T.Marker(point, {icon: icon}); } else if (currentType === 'company') { var icon = new T.Icon({ - iconUrl: "../../IMG/icon_qy.png", + iconUrl: "<%=request.getContextPath()%>/IMG/icon_qy.png", iconSize: new T.Point(18, 18), iconAnchor: new T.Point(15, 15) }); marker = new T.Marker(point, {icon: icon}); } else if (currentType === 'sewage') { var icon = new T.Icon({ - iconUrl: "../../IMG/icon_wsc.png", + iconUrl: "<%=request.getContextPath()%>/IMG/icon_wsc.png", iconSize: new T.Point(18, 18), iconAnchor: new T.Point(15, 15) }); @@ -1151,27 +1339,32 @@ } function initPumpTable() { + console.log('initPumpTable 被调用, pumpStations:', pumpStations); var tbody = document.getElementById('pump-table-body'); + console.log('tbody 元素:', tbody); + if (!tbody) { + console.error('找不到 pump-table-body 元素!'); + return; + } var html = ''; + if (!pumpStations || pumpStations.length === 0) { + console.warn('pumpStations 为空或长度为0'); + tbody.innerHTML = '暂无数据'; + return; + } pumpStations.forEach(function(station, index) { - var rowClass = index % 2 === 0 ? '' : 'active'; // stripe effect - // Add soft blue background for some rows as in screenshot - if (index % 2 !== 0) { - // bootstrap 'active' class adds a grey background, let's use custom style if needed, - // but 'active' or 'info' class is standard bootstrap. - // The screenshot shows light blue stripes. - rowClass = 'info'; - } + var rowClass = index % 2 === 0 ? '' : 'info'; html += ''; html += '' + (index + 1) + ''; - html += '' + station.name + ''; - html += '' + station.level + ''; - html += '' + station.flow + ''; - html += '' + station.status + ''; - html += '' + station.time + ''; + html += '' + (station.name || '-') + ''; + html += '' + (station.level || '-') + ''; + html += '' + (station.flow || '-') + ''; + html += '' + (station.status || '-') + ''; + html += '' + (station.time || '-') + ''; html += ''; }); + console.log('生成的表格HTML长度:', html.length); tbody.innerHTML = html; } @@ -1222,29 +1415,11 @@ } } - initMarkers(); - initPumpTable(); - initSewageTable(); + // initMarkers() 和表格初始化在 loadData() 完成后调用 + // 不要在这里单独调用，否则会使用空数据 - // Mock Data for Companies - var companies = [ - { id: 1, code: "JSALQY01", name: "福达（上海）食品有限公司", address: "上海市金山区工业区金...", sewageNo: "JS2C", dischargeNo: "AL9654501", discharge: "717m³", point: "AL9654501_CSLL", lng: 121.320000, lat: 30.730000 }, - { id: 2, code: "JSALQY02", name: "上海嘉乐股份有限公司", address: "上海市金山区亭林镇...", sewageNo: "MM_AL11_C", dischargeNo: "AL9654502", discharge: "1010m³", point: "AL9654502_CSLL", lng: 121.330000, lat: 30.740000 }, - ]; - - // Mock Data for Pipelines - var pipelines = [ - { id: 1, name: "", diameter: "0", length: "0", startDepth: "0", endDepth: "0", startElev: "0", endElev: "0", invertElev: "0", path: [[121.3400, 30.7400], [121.3410, 30.7410]] }, - { id: 2, name: "", diameter: "1600", length: "72.0223546", startDepth: "0.149", endDepth: "0.251", startElev: "5.649", endElev: "5.451", invertElev: "0.2", path: [[121.3410, 30.7410], [121.3430, 30.7430]] }, - { id: 3, name: "", diameter: "200", length: "11.1513874", startDepth: "0.251", endDepth: "3.035", startElev: "5.451", endElev: "5.335", invertElev: "1.643", path: [[121.3430, 30.7430], [121.3440, 30.7440]] }, - ]; - - // Mock Data for Wells - var wells = [ - { id: 1, name: "BWS1", depth: "8.15", bottomElev: "-3.963", groundElev: "0", spec: "", lng: "3420414.23109246", lat: "340424.84811152", mapLng: "121.3410", mapLat: "30.7410" }, - { id: 2, name: "BWS2", depth: "8.15", bottomElev: "-3.619", groundElev: "0", spec: "", lng: "3420475.77946245", lat: "340408.18952986", mapLng: "121.3420", mapLat: "30.7420" }, - { id: 3, name: "BWS3", depth: "7.15", bottomElev: "-2.414", groundElev: "0", spec: "", lng: "3420467.51573462", lat: "340548.72770082", mapLng: "121.3430", mapLat: "30.7430" }, - ]; + // 数据定义 (pipelines 和 wells) 已在 loadData() 中加载 + // 如果需要默认数据，请在 loadData() 的 mockApiRequest 中配置 // --------------------------------------------------------- // 坐标转换处理 @@ -1273,26 +1448,49 @@ } function initCompanyTable() { + console.log('initCompanyTable 被调用, companies:', companies); var tbody = document.getElementById('company-table-body'); + console.log('company-table-body 元素:', tbody); + if (!tbody) { + console.error('找不到 company-table-body 元素!'); + return; + } var html = ''; + if (!companies || companies.length === 0) { + console.warn('companies 为空或长度为0'); + tbody.innerHTML = '暂无数据'; + return; + } companies.forEach(function(item, index) { - var rowClass = index % 2 === 0 ? '' : 'active'; - if (index % 2 !== 0) rowClass = 'info'; + var rowClass = index % 2 === 0 ? '' : 'info'; - html += ''; + html += ''; html += '' + (index + 1) + ''; - html += '' + item.code + ''; - html += '' + item.name + ''; - html += '' + item.address + ''; - html += '' + item.sewageNo + ''; - html += '' + item.dischargeNo + ''; - html += '' + item.discharge + ''; - html += '' + item.point + ''; + html += '' + (item.contractNumber || '-') + ''; + html += '' + (item.name || '-') + ''; + html += '' + (item.address || '-') + ''; + html += '' + (item.areaName || '-') + ''; + html += '' + (item.processSectionName || '-') + ''; + html += '' + (item.permitNum || '-') + ''; + html += '' + (item.trade || '-') + ''; + html += '' + (item.displacement || '-') + ''; + html += '' + (item.point || '-') + ''; + html += '' + (item.input || '-') + ''; html += ''; }); + console.log('生成的企业表格HTML长度:', html.length); tbody.innerHTML = html; } + // 选择企业在地图上定位 + function selectCompany(index) { + var item = companies[index]; + if (item && item.lng && item.lat) { + map.panTo(new T.LngLat(item.lng, item.lat)); + map.setZoom(15); + } + } + function initPipelineTable() { var tbody = document.getElementById('pipeline-table-body'); var html = ''; @@ -1351,25 +1549,11 @@ tbody.innerHTML = html; } - initCompanyTable(); - initPipelineTable(); - initWellTable(); + // initCompanyTable(), initPipelineTable(), initWellTable() 已在 loadData() 完成后调用 + // 不要在这里重复调用 - // Mock Data for Plans - var plans = [ - { id: 1, name: "金山一车间日常巡检", status: "启用", duration: "2小时", interval: "1天", startTime: "2026-01-01", endTime: "2026-12-31" }, - { id: 2, name: "泵站设备专项检查", status: "启用", duration: "4小时", interval: "7天", startTime: "2026-02-01", endTime: "2026-06-30" }, - { id: 3, name: "管网防汛排查", status: "停用", duration: "8小时", interval: "30天", startTime: "2026-05-01", endTime: "2026-09-30" }, - { id: 4, name: "排污口突击检查", status: "启用", duration: "3小时", interval: "15天", startTime: "2026-03-15", endTime: "2026-09-15" } - ]; - - // Mock Data for Records - var records = [ - { id: 1, taskName: "金山一车间日常巡检", status: "已完成", planStartTime: "09:00", planEndTime: "11:00", actualTime: "10:45" }, - { id: 2, taskName: "泵站设备专项检查", status: "未完成", planStartTime: "14:00", planEndTime: "17:30", actualTime: "--" }, - { id: 3, taskName: "金山一车间日常巡检", status: "已完成", planStartTime: "09:00", planEndTime: "10:50", actualTime: "10:30" }, - { id: 4, taskName: "管网防汛排查", status: "进行中", planStartTime: "10:00", planEndTime: "16:00", actualTime: "--" } - ]; + // plans 和 records 数据已在 loadData() 中通过 mockApiRequest 加载 + // 不要在这里重复定义，否则会覆盖已加载的数据 function initPlanTable() { var tbody = document.getElementById('plan-table-body'); @@ -1419,8 +1603,8 @@ tbody.innerHTML = html; } - initPlanTable(); - initRecordTable(); + // initPlanTable() 和 initRecordTable() 已在 loadData() 完成后调用 + // 不要在这里重复调用 // Drawer Logic function toggleDrawer() { @@ -1474,6 +1658,7 @@ } function switchTab(tabId, navItem) { + console.log('switchTab 被调用, tabId:', tabId); // Update Nav Items var navItems = document.querySelectorAll('.drawer-nav-item'); navItems.forEach(function(item) { @@ -1488,29 +1673,37 @@ }); document.getElementById(tabId).classList.add('active'); - // Update Map Markers based on Tab ID + // 根据Tab ID确定数据类型 var type = 'sewage'; if (tabId === 'tab-pump') type = 'pump'; else if (tabId === 'tab-company') type = 'company'; else if (tabId === 'tab-well') type = 'well'; else if (tabId === 'tab-pipeline') type = 'pipeline'; + else if (tabId === 'tab-plan') type = 'plan'; + else if (tabId === 'tab-record') type = 'record'; + + console.log('确定的数据类型 type:', type); - initMarkers(type); + // 加载该Tab的数据，然后更新地图 + loadTabData(type).then(function() { + console.log('loadTabData 完成, type:', type); + initMarkers(type); + }); } - + - + - + - +