Merge branch 'deng' into deng-release
This commit is contained in:
Timer
Binary file not shown.
|
Before Width: | Height: | Size: 28 MiB After Width: | Height: | Size: 21 MiB |
@ -191,10 +191,109 @@
|
||||
}
|
||||
|
||||
.Middle3 {
|
||||
width: 2100px;
|
||||
width: 2800px;
|
||||
height: 1600px;
|
||||
position: absolute;
|
||||
top: 300px;
|
||||
left: 2700px;
|
||||
top: 206px;
|
||||
left: 2376px;
|
||||
}
|
||||
.Middle3 img,
|
||||
.Middle3 .monitor-img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
}
|
||||
/* 绿色圆点样式 */
|
||||
.green-dot {
|
||||
position: absolute;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: #00ff00;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 0 20px #00ff00, 0 0 40px #00ff00;
|
||||
z-index: 10000;
|
||||
transition: all 0.3s ease;
|
||||
pointer-events: auto;
|
||||
}
|
||||
.green-dot:hover {
|
||||
transform: scale(1.3);
|
||||
box-shadow: 0 0 15px #00ff00, 0 0 30px #00ff00;
|
||||
}
|
||||
/* 数据弹窗样式 */
|
||||
.dot-popup {
|
||||
position: absolute;
|
||||
background: rgba(0, 30, 60, 0.98);
|
||||
border: 3px solid #00ff00;
|
||||
border-radius: 15px;
|
||||
padding: 30px 40px;
|
||||
z-index: 99999;
|
||||
min-width: 400px;
|
||||
max-width: 600px;
|
||||
display: none;
|
||||
box-shadow: 0 0 30px rgba(0, 255, 0, 0.5);
|
||||
}
|
||||
.dot-popup.show {
|
||||
display: block;
|
||||
}
|
||||
.dot-popup-title {
|
||||
color: #00ff00;
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
border-bottom: 2px solid rgba(0, 255, 0, 0.5);
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.dot-popup-content {
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
}
|
||||
.dot-popup-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 12px 0;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
.dot-popup-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.dot-popup-label {
|
||||
color: #7ef3ff;
|
||||
font-size: 24px;
|
||||
}
|
||||
.dot-popup-value {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
font-size: 24px;
|
||||
}
|
||||
.dot-popup-close {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 20px;
|
||||
color: #fff;
|
||||
font-size: 36px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dot-popup-close:hover {
|
||||
color: #00ff00;
|
||||
}
|
||||
.popup-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/*background: rgba(0, 0, 0, 0.5);*/
|
||||
z-index: 99998;
|
||||
display: none;
|
||||
}
|
||||
.popup-overlay.show {
|
||||
display: block;
|
||||
}
|
||||
/* 全屏提示遮罩 */
|
||||
.fullscreen-overlay {
|
||||
@ -422,6 +521,7 @@
|
||||
<div class="Middle">
|
||||
<div class="Middle1">
|
||||
<!-- 药耗 -->
|
||||
|
||||
<div>
|
||||
<div class="yaohao D_PACDSYH"></div>
|
||||
<div class="yaohao D_YiSNDSYH"></div>
|
||||
@ -507,111 +607,76 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Middle2">
|
||||
<div>
|
||||
<span class="Middle2-value" id="D_YanYCORP"></span>
|
||||
<span class="Middle2-value" id="D_QueYCRJY1"></span>
|
||||
<span class="Middle2-value" id="D_HaoYCRJY"></span>
|
||||
<span class="Middle2-value" id="D_HaoYCRJY2"></span>
|
||||
<span class="Middle2-value" id="D_HaoYCWNND"></span>
|
||||
<span class="Middle2-value" id="D_MoCWNND"></span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span class="Middle2-value" id="D_BengZYW"></span>
|
||||
<span class="Middle2-value" id="D_TiSB101DL"></span>
|
||||
<span class="Middle2-value" id="D_TiSB102DL"></span>
|
||||
<span class="Middle2-value" id="D_TiSB103DL"></span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="Middle2-value" id="D_NingMSJYLL"></span>
|
||||
<span class="Middle2-value" id="D_YaLSQNLL"></span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="Middle2-value" id="D_NingMSCGYW"></span>
|
||||
<span class="Middle2-value" id="D_YaLSQNLL"></span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="Middle2-value" id="D_CiLSNJYLL"></span>
|
||||
<span class="Middle2-value" id="D_PACJYLL"></span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="Middle2-value" id="D_CiLSNCGYW"></span>
|
||||
<span class="Middle2-value" id="D_PACCGYW"></span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 隐藏的数据容器，由JS动态生成 -->
|
||||
<div id="hiddenDataContainer" style="display: none;"></div>
|
||||
|
||||
<!-- 中间图表 -->
|
||||
<div class="Middle3">
|
||||
<!-- <img src="../../IMG/monitor.png" style="width: 100%; height: 100%" /> -->
|
||||
<img
|
||||
src="<%=request.getContextPath()%>/IMG/monitor.png"
|
||||
style="width: 100%; height: 100%"
|
||||
/>
|
||||
<img class="monitor-img" src="<%=request.getContextPath()%>/IMG/monitor.png" />
|
||||
<!-- 10个绿色圆点 -->
|
||||
<div class="green-dot" data-index="0" style="top: 431px; left: 200px;"></div>
|
||||
<div class="green-dot" data-index="1" style="top: 150px; left: 600px;"></div>
|
||||
<div class="green-dot" data-index="2" style="top: 174px; left: 1112px;"></div>
|
||||
<div class="green-dot" data-index="3" style="top: 280px; left: 1800px;"></div>
|
||||
<div class="green-dot" data-index="4" style="top: 150px; left: 2550px;"></div>
|
||||
<div class="green-dot" data-index="5" style="top: 1130px; left: 200px;"></div>
|
||||
<div class="green-dot" data-index="6" style="top: 800px; left: 600px;"></div>
|
||||
<div class="green-dot" data-index="7" style="top: 900px; left: 1000px;"></div>
|
||||
<div class="green-dot" data-index="8" style="top: 1000px; left: 2530px;"></div>
|
||||
<div class="green-dot" data-index="9" style="top: 800px; left: 1800px;"></div>
|
||||
<!-- 数据弹窗 -->
|
||||
<div class="dot-popup" id="dotPopup">
|
||||
<span class="dot-popup-close" onclick="closePopup()">×</span>
|
||||
<div class="dot-popup-title" id="popupTitle">设备数据</div>
|
||||
<div class="dot-popup-content" id="popupContent"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Middle4">
|
||||
<!-- 进水 -->
|
||||
<div>
|
||||
<div class="Middle4_val" id="D_JSLL">100</div>
|
||||
<div class="Middle4_val" id="D_JinSPH">100</div>
|
||||
<div class="Middle4_val" id="D_JinSCOD">100</div>
|
||||
<div class="Middle4_val" id="D_JinSAL">100</div>
|
||||
<div class="Middle4_val" id="D_JinSWD">100</div>
|
||||
<div class="Middle4_val" id="D_JinSLJLL">100</div>
|
||||
</div>
|
||||
|
||||
<!-- 出水 -->
|
||||
<div>
|
||||
<div class="Middle4_val" id="D_ChuSLL">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSPH">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSCOD">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSAL">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSWD">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSZL">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSZLv">100</div>
|
||||
<div class="Middle4_val" id="D_ChuSLJLL">100</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="Middle4_val" id="D_FanXBCKLL">200</div>
|
||||
<div class="Middle4_val" id="D_FanXBCKYL">200</div>
|
||||
<div class="Middle4_val" id="D_ShengYWNCKLL">200</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="Middle4_val" id="D_QingSCYW">200</div>
|
||||
<div class="Middle4_val" id="D_FeiYCYW">200</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 视频 -->
|
||||
<div class="right"></div>
|
||||
</div>
|
||||
|
||||
<!-- 弹窗遮罩 -->
|
||||
<div class="popup-overlay" id="popupOverlay"></div>
|
||||
|
||||
<script>
|
||||
// 定义 ext 变量供 main_js.js 使用
|
||||
var ext = {
|
||||
contextPath: '<%=request.getContextPath()%>'
|
||||
};
|
||||
|
||||
// ==================== 数据统一管理 ====================
|
||||
var pageData = {
|
||||
// 水量数据 (slqs)
|
||||
slqs: {
|
||||
todayTotal: 6040, // 今日水量
|
||||
yesterdayTotal: 4197, // 昨日水量
|
||||
monthTotal: 12356, // 本月水量
|
||||
todayTotal: 0, // 今日水量
|
||||
yesterdayTotal: 0, // 昨日水量
|
||||
monthTotal: 0, // 本月水量
|
||||
},
|
||||
|
||||
// 泥处理指标 (ncl)
|
||||
ncl: {
|
||||
val1: 0, // 泥处理指标1
|
||||
val2: 200, // 泥处理指标2
|
||||
val3: 4.89, // 泥处理指标3
|
||||
val2: 0, // 泥处理指标2
|
||||
val3: 0, // 泥处理指标3
|
||||
},
|
||||
|
||||
// 泥处理点位编码配置
|
||||
nclMPointKeys: {
|
||||
val1: "D_NiCL", // 泥处理指标1点位编码
|
||||
val2: "D_NiCL", // 泥处理指标2点位编码
|
||||
val3: "D_NiCL", // 泥处理指标3点位编码
|
||||
chart: "D_NiCL", // 泥处理图表点位编码
|
||||
},
|
||||
|
||||
// 药耗数据 (yaohao)
|
||||
yaohao: {
|
||||
D_PACDSYH: 19800,
|
||||
D_YiSNDSYH: 2090,
|
||||
D_CiLSNDSYH: 1092,
|
||||
D_PACDSYH: 0,
|
||||
D_YiSNDSYH: 0,
|
||||
D_CiLSNDSYH: 0,
|
||||
},
|
||||
|
||||
// 质量指标表格数据
|
||||
@ -676,43 +741,102 @@
|
||||
|
||||
// 七日水量图表数据
|
||||
sevenDaysChart: {
|
||||
xAxis: [
|
||||
"11-10",
|
||||
"11-11",
|
||||
"11-12",
|
||||
"11-13",
|
||||
"11-14",
|
||||
"11-15",
|
||||
"11-16",
|
||||
"11-17",
|
||||
],
|
||||
data: [5200, 4300, 4200, 4300, 6800, 5200, 7400, 5600],
|
||||
xAxis: [],
|
||||
data: [],
|
||||
},
|
||||
|
||||
// 泥处理图表数据
|
||||
nclChart: {
|
||||
xAxis: [
|
||||
"2:00",
|
||||
"4:00",
|
||||
"6:00",
|
||||
"8:00",
|
||||
"10:00",
|
||||
"12:00",
|
||||
"14:00",
|
||||
"16:00",
|
||||
"18:00",
|
||||
"20:00",
|
||||
],
|
||||
xAxis: [],
|
||||
data: [120, 160, 90, 250, 170, 340, 280, 330, 80, 260],
|
||||
},
|
||||
|
||||
// 质量图表数据
|
||||
qualityChart: {
|
||||
xAxis: ["11", "12", "13", "14", "15", "16", "17"],
|
||||
data: [8, 13, 9, 14, 21, 14, 18],
|
||||
xAxis: [],
|
||||
data: [],
|
||||
},
|
||||
};
|
||||
|
||||
// ==================== 统一点位配置管理 ====================
|
||||
// 所有点位配置：ID + 名称 + 分组
|
||||
var pointConfig = {
|
||||
// 工艺参数 (middle2)
|
||||
D_YanYCORP: { name: "厌氧池ORP", group: "middle2" },
|
||||
D_QueYCRJY1: { name: "缺氧池入口溶解氧1", group: "middle2" },
|
||||
D_HaoYCRJY: { name: "好氧池溶解氧", group: "middle2" },
|
||||
D_HaoYCRJY2: { name: "好氧池溶解氧2", group: "middle2" },
|
||||
D_HaoYCWNND: { name: "好氧池污泥浓度", group: "middle2" },
|
||||
D_MoCWNND: { name: "膜池污泥浓度", group: "middle2" },
|
||||
D_BengZYW: { name: "泵站液位", group: "middle2" },
|
||||
D_TiSB101DL: { name: "提升泵101电流", group: "middle2" },
|
||||
D_TiSB102DL: { name: "提升泵102电流", group: "middle2" },
|
||||
D_TiSB103DL: { name: "提升泵103电流", group: "middle2" },
|
||||
D_NingMSJYLL: { name: "混凝沉淀进水流量", group: "middle2" },
|
||||
D_YaLSQNLL: { name: "压力气流量", group: "middle2" },
|
||||
D_NingMSCGYW: { name: "混凝沉淀出水液位", group: "middle2" },
|
||||
D_CiLSNJYLL: { name: "次氯酸钠加药流量", group: "middle2" },
|
||||
D_PACJYLL: { name: "PAC加药流量", group: "middle2" },
|
||||
D_CiLSNCGYW: { name: "次氯酸钠储罐液位", group: "middle2" },
|
||||
D_PACCGYW: { name: "PAC储罐液位", group: "middle2" },
|
||||
// 进出水指标 (middle4)
|
||||
D_JSLL: { name: "进水流量", group: "middle4" },
|
||||
D_JinSPH: { name: "进水PH", group: "middle4" },
|
||||
D_JinSCOD: { name: "进水COD", group: "middle4" },
|
||||
D_JinSAL: { name: "进水氨氮", group: "middle4" },
|
||||
D_JinSWD: { name: "进水温度", group: "middle4" },
|
||||
D_JinSLJLL: { name: "进水累计流量", group: "middle4" },
|
||||
D_ChuSLL: { name: "出水流量", group: "middle4" },
|
||||
D_ChuSPH: { name: "出水PH", group: "middle4" },
|
||||
D_ChuSCOD: { name: "出水COD", group: "middle4" },
|
||||
D_ChuSAL: { name: "出水氨氮", group: "middle4" },
|
||||
D_ChuSWD: { name: "出水温度", group: "middle4" },
|
||||
D_ChuSZL: { name: "出水浊度", group: "middle4" },
|
||||
D_ChuSZLv: { name: "出水浊度值", group: "middle4" },
|
||||
D_ChuSLJLL: { name: "出水累计流量", group: "middle4" },
|
||||
D_FanXBCKLL: { name: "反洗泵出口流量", group: "middle4" },
|
||||
D_FanXBCKYL: { name: "反洗泵出口压力", group: "middle4" },
|
||||
D_ShengYWNCKLL: { name: "剩余污泥浓度流量", group: "middle4" },
|
||||
D_QingSCYW: { name: "清水池液位", group: "middle4" },
|
||||
D_FeiYCYW: { name: "废液池液位", group: "middle4" }
|
||||
};
|
||||
|
||||
// 圆点数据配置：每个圆点对应的数据点ID
|
||||
var dotDataConfig = [
|
||||
{ name: "进水口", points: ["D_JSLL", "D_JinSPH", "D_JinSCOD", "D_JinSAL", "D_JinSWD", "D_JinSLJLL"] },
|
||||
{ name: "泵房", points: ["D_BengZYW", "D_TiSB101DL", "D_TiSB102DL", "D_TiSB103DL"] },
|
||||
{ name: "厌氧池", points: ["D_YanYCORP"] },
|
||||
{ name: "缺氧池", points: ["D_QueYCRJY1", "D_HaoYCRJY"] },
|
||||
{ name: "好氧池", points: ["D_HaoYCRJY2", "D_HaoYCWNND", "D_MoCWNND"] },
|
||||
{ name: "污泥处理", points: ["D_QingSCYW", "D_FeiYCYW"] },
|
||||
{ name: "混凝沉淀", points: ["D_NingMSJYLL", "D_YaLSQNLL", "D_NingMSCGYW"] },
|
||||
{ name: "加药间", points: ["D_CiLSNJYLL", "D_PACJYLL", "D_CiLSNCGYW", "D_PACCGYW"] },
|
||||
{ name: "出水口", points: ["D_ChuSLL", "D_ChuSPH", "D_ChuSCOD", "D_ChuSAL", "D_ChuSWD", "D_ChuSZL", "D_ChuSZLv", "D_ChuSLJLL"] },
|
||||
{ name: "反洗泵房", points: ["D_FanXBCKLL", "D_FanXBCKYL", "D_ShengYWNCKLL"] }
|
||||
];
|
||||
|
||||
// 获取所有点位ID列表
|
||||
function getAllPointIds() {
|
||||
return Object.keys(pointConfig);
|
||||
}
|
||||
|
||||
// 根据分组获取点位ID列表
|
||||
function getPointIdsByGroup(group) {
|
||||
return Object.keys(pointConfig).filter(function(id) {
|
||||
return pointConfig[id].group === group;
|
||||
});
|
||||
}
|
||||
|
||||
// 动态生成隐藏的数据容器元素
|
||||
function initHiddenDataContainer() {
|
||||
var container = document.getElementById('hiddenDataContainer');
|
||||
var html = '';
|
||||
Object.keys(pointConfig).forEach(function(pointId) {
|
||||
html += '<span id="' + pointId + '"></span>';
|
||||
});
|
||||
container.innerHTML = html;
|
||||
}
|
||||
|
||||
// 更新水量显示
|
||||
function updateSlqs() {
|
||||
$(".slqs-todayTotal").text(pageData.slqs.todayTotal);
|
||||
@ -764,44 +888,6 @@
|
||||
});
|
||||
}
|
||||
|
||||
// 从接口获取数据并更新页面（示例方法，供后期调用）
|
||||
function fetchDataFromApi(apiUrl) {
|
||||
$.ajax({
|
||||
url: apiUrl,
|
||||
type: "GET",
|
||||
dataType: "json",
|
||||
success: function (response) {
|
||||
// 假设接口返回的数据格式如下：
|
||||
// {
|
||||
// slqs: { todayTotal: xxx, yesterdayTotal: xxx, monthTotal: xxx },
|
||||
// ncl: { val1: xxx, val2: xxx, val3: xxx },
|
||||
// yaohao: { val1: xxx, val2: xxx, val3: xxx },
|
||||
// qualityTable: [...],
|
||||
// sevenDaysChart: { xAxis: [...], data: [...] },
|
||||
// nclChart: { xAxis: [...], data: [...] },
|
||||
// qualityChart: { xAxis: [...], data: [...] }
|
||||
// }
|
||||
if (response) {
|
||||
if (response.slqs) pageData.slqs = response.slqs;
|
||||
if (response.ncl) pageData.ncl = response.ncl;
|
||||
if (response.yaohao) pageData.yaohao = response.yaohao;
|
||||
if (response.qualityTable)
|
||||
pageData.qualityTable = response.qualityTable;
|
||||
if (response.sevenDaysChart)
|
||||
pageData.sevenDaysChart = response.sevenDaysChart;
|
||||
if (response.nclChart) pageData.nclChart = response.nclChart;
|
||||
if (response.qualityChart)
|
||||
pageData.qualityChart = response.qualityChart;
|
||||
|
||||
refreshPage();
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
console.error("获取数据失败:", error);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 刷新页面所有数据
|
||||
function refreshPage() {
|
||||
updateSlqs();
|
||||
@ -813,6 +899,14 @@
|
||||
initQualityChart();
|
||||
}
|
||||
|
||||
// 格式化日期为 YYYY-MM-DD 格式
|
||||
function formatDate(date) {
|
||||
var year = date.getFullYear();
|
||||
var month = (date.getMonth() + 1).toString().padStart(2, "0");
|
||||
var day = date.getDate().toString().padStart(2, "0");
|
||||
return year + "-" + month + "-" + day;
|
||||
}
|
||||
|
||||
// 进入全屏函数
|
||||
function enterFullscreen() {
|
||||
var elem = document.documentElement;
|
||||
@ -825,23 +919,31 @@
|
||||
/* IE11 */
|
||||
elem.msRequestFullscreen();
|
||||
}
|
||||
// 隐藏提示遮罩
|
||||
document.getElementById("fullscreenOverlay").style.display = "none";
|
||||
}
|
||||
|
||||
// 监听全屏状态变化
|
||||
document.addEventListener("fullscreenchange", function () {
|
||||
var overlay = document.getElementById("fullscreenOverlay");
|
||||
if (!document.fullscreenElement) {
|
||||
// 退出全屏时显示提示
|
||||
overlay.style.display = "flex";
|
||||
// 退出全屏函数
|
||||
function exitFullscreen() {
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen();
|
||||
}
|
||||
});
|
||||
document.addEventListener("webkitfullscreenchange", function () {
|
||||
var overlay = document.getElementById("fullscreenOverlay");
|
||||
if (!document.webkitFullscreenElement) {
|
||||
overlay.style.display = "flex";
|
||||
}
|
||||
|
||||
// 切换全屏状态
|
||||
function toggleFullscreen() {
|
||||
if (document.fullscreenElement || document.webkitFullscreenElement) {
|
||||
exitFullscreen();
|
||||
} else {
|
||||
enterFullscreen();
|
||||
}
|
||||
}
|
||||
|
||||
// 双击全屏功能（只进入全屏，不退出）
|
||||
document.addEventListener('dblclick', function(e) {
|
||||
enterFullscreen();
|
||||
});
|
||||
|
||||
// 获取水量统计数据
|
||||
@ -953,54 +1055,52 @@
|
||||
});
|
||||
}
|
||||
|
||||
// 获取点位信息数据
|
||||
// mpcode: 点位编码
|
||||
// sdt: 开始时间 (可选，默认7天前)
|
||||
// edt: 结束时间 (可选，默认当前时间)
|
||||
// 返回: Promise对象
|
||||
function fetchPointData(mpcode, sdt, edt) {
|
||||
// 默认时间范围：近7天
|
||||
if (!edt) {
|
||||
// 获取泥处理数据（每日汇总）
|
||||
function fetchNclData() {
|
||||
var mPointKey = pageData.nclMPointKeys.chart;
|
||||
var now = new Date();
|
||||
edt = formatDate(now);
|
||||
}
|
||||
if (!sdt) {
|
||||
var sevenDaysAgo = new Date();
|
||||
sevenDaysAgo.setDate(sevenDaysAgo.getDate() - 7);
|
||||
sdt = formatDate(sevenDaysAgo);
|
||||
}
|
||||
var endTime = formatDate(now) + " 23:59:59";
|
||||
var startTime = formatDate(new Date(now.getTime() - 10 * 24 * 60 * 60 * 1000)) + " 00:00:00"; // 最近10天
|
||||
|
||||
return new Promise(function(resolve, reject) {
|
||||
$.ajax({
|
||||
url: '<%=request.getContextPath()%>/data/getDetailData.do',
|
||||
type: 'GET',
|
||||
url: "<%=request.getContextPath()%>/mpoint/data/getDailyAggregation.do",
|
||||
type: "GET",
|
||||
data: {
|
||||
mpcode: mpcode,
|
||||
sdt: sdt,
|
||||
edt: edt
|
||||
mPointKey: mPointKey,
|
||||
startTime: startTime,
|
||||
endTime: endTime
|
||||
},
|
||||
dataType: 'json',
|
||||
dataType: "json",
|
||||
success: function (response) {
|
||||
console.log('点位数据[' + mpcode + ']:', response);
|
||||
resolve(response);
|
||||
console.log("泥处理数据:", response);
|
||||
if (response && response.success && response.dailyData) {
|
||||
var xAxis = [];
|
||||
var data = [];
|
||||
response.dailyData.forEach(function (item) {
|
||||
// 日期格式: "2026-03-07" -> "03-07"
|
||||
var dateStr = item.dateStr || "";
|
||||
if (dateStr.length >= 10) {
|
||||
xAxis.push(dateStr.substring(5)); // 取 "MM-DD" 部分
|
||||
} else {
|
||||
xAxis.push(dateStr);
|
||||
}
|
||||
data.push(parseFloat(item.totalValue) || 0);
|
||||
});
|
||||
pageData.nclChart.xAxis = xAxis;
|
||||
pageData.nclChart.data = data;
|
||||
initNclChart(); // 重新渲染图表
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
console.error('获取点位数据失败:', mpcode, error);
|
||||
reject(error);
|
||||
console.error("获取泥处理数据失败:", error);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 格式化日期为 YYYY-MM-DD 格式
|
||||
function formatDate(date) {
|
||||
var year = date.getFullYear();
|
||||
var month = (date.getMonth() + 1).toString().padStart(2, "0");
|
||||
var day = date.getDate().toString().padStart(2, "0");
|
||||
return year + "-" + month + "-" + day;
|
||||
}
|
||||
|
||||
$(function () {
|
||||
// 初始化隐藏数据容器
|
||||
initHiddenDataContainer();
|
||||
|
||||
// 初始化数据显示
|
||||
updateSlqs();
|
||||
updateNcl();
|
||||
@ -1018,73 +1118,121 @@
|
||||
// 获取质量指标表格数据
|
||||
fetchQualityTableData();
|
||||
|
||||
<%--// 定时刷新所有数据（每分钟刷新一次）--%>
|
||||
<%--setInterval(function() {--%>
|
||||
<%-- console.log('定时刷新数据...');--%>
|
||||
<%-- fetchSlqsData();--%>
|
||||
<%-- fetchQualityTableData();--%>
|
||||
<%-- // 批量刷新点位数据--%>
|
||||
<%-- pointList.forEach(function (mpcode) {--%>
|
||||
<%-- getValue('0533JS', mpcode, mpcode, `${mpcode}_name`, '<%=request.getContextPath()%>');--%>
|
||||
<%-- });--%>
|
||||
<%--}, 60000); // 60000毫秒 = 1分钟--%>
|
||||
|
||||
<%--// 批量获取点位数据并更新显示--%>
|
||||
var pointList = [
|
||||
"D_PACDSYH", // PAC吨水药耗
|
||||
"D_YiSNDSYH", // 乙酸钠吨水药耗
|
||||
"D_CiLSNDSYH", // 次氯酸钠吨水药耗
|
||||
"D_YanYCORP",
|
||||
"D_QueYCRJY1",
|
||||
"D_HaoYCRJY",
|
||||
"D_HaoYCRJY2",
|
||||
"D_HaoYCWNND",
|
||||
"D_MoCWNND",
|
||||
"D_BengZYW",
|
||||
"D_TiSB101DL",
|
||||
"D_TiSB102DL",
|
||||
"D_TiSB103DL",
|
||||
"D_NingMSJYLL",
|
||||
"D_YaLSQNLL",
|
||||
"D_NingMSCGYW",
|
||||
"D_CiLSNJYLL",
|
||||
"D_PACJYLL",
|
||||
"D_CiLSNCGYW",
|
||||
"D_PACCGYW",
|
||||
"D_JSLL",
|
||||
"D_JinSPH",
|
||||
"D_JinSCOD",
|
||||
"D_JinSAL",
|
||||
"D_JinSWD",
|
||||
"D_JinSLJLL",
|
||||
"D_ChuSLL",
|
||||
"D_ChuSPH",
|
||||
"D_ChuSCOD",
|
||||
"D_ChuSAL",
|
||||
"D_ChuSWD",
|
||||
"D_ChuSZL",
|
||||
"D_ChuSZLv",
|
||||
"D_ChuSLJLL",
|
||||
"D_FanXBCKLL",
|
||||
"D_FanXBCKYL",
|
||||
"D_ShengYWNCKLL",
|
||||
"D_QingSCYW",
|
||||
"D_FeiYCYW",
|
||||
];
|
||||
// 获取泥处理数据
|
||||
fetchNclData();
|
||||
|
||||
// 批量获取点位数据并更新显示
|
||||
var pointList = getAllPointIds();
|
||||
pointList.forEach(function (mpcode) {
|
||||
// fetchPointData(mpcode).then(function(res) {
|
||||
// $('#' + mpcode).text(1000 || 0);
|
||||
// // if (res && res[0] && res[0].data && res[0].data.length > 0) {
|
||||
// // var lastData = res[0].data[res[0].data.length - 1];
|
||||
// // var value = lastData[1]; // 取最后一个数据点的值
|
||||
// // $('#' + mpcode).text(1000 || 0);
|
||||
// // }
|
||||
// }).catch(function(error) {
|
||||
// console.error('点位数据获取失败:', mpcode, error);
|
||||
// });
|
||||
getValue('0533JS', mpcode, mpcode, `${mpcode}_name`, '<%=request.getContextPath()%>');
|
||||
});
|
||||
|
||||
// 定时刷新所有数据（每分钟刷新一次）
|
||||
setInterval(function() {
|
||||
console.log('定时刷新数据...');
|
||||
fetchSlqsData();
|
||||
fetchQualityTableData();
|
||||
fetchNclData();
|
||||
// 批量刷新点位数据
|
||||
pointList.forEach(function (mpcode) {
|
||||
getValue('0533JS', mpcode, mpcode, `${mpcode}_name`, '<%=request.getContextPath()%>');
|
||||
});
|
||||
}, 60000); // 60000毫秒 = 1分钟
|
||||
|
||||
// 初始化绿色圆点点击事件
|
||||
initGreenDots();
|
||||
});
|
||||
|
||||
// 初始化绿色圆点点击事件
|
||||
function initGreenDots() {
|
||||
var dots = document.querySelectorAll('.green-dot');
|
||||
console.log('初始化绿色圆点，数量:', dots.length);
|
||||
dots.forEach(function(dot) {
|
||||
dot.addEventListener('click', function(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
var index = parseInt(this.getAttribute('data-index'));
|
||||
console.log('点击圆点，索引:', index);
|
||||
showDotPopup(index, this);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 显示弹窗
|
||||
function showDotPopup(index, dotElement) {
|
||||
var config = dotDataConfig[index];
|
||||
if (!config) return;
|
||||
|
||||
var title = document.getElementById('popupTitle');
|
||||
var content = document.getElementById('popupContent');
|
||||
var overlay = document.getElementById('popupOverlay');
|
||||
var popup = document.getElementById('dotPopup');
|
||||
|
||||
title.textContent = config.name;
|
||||
|
||||
var html = '';
|
||||
|
||||
// 遍历所有点位
|
||||
config.points.forEach(function(pointId) {
|
||||
var pointInfo = pointConfig[pointId];
|
||||
var value = document.getElementById(pointId);
|
||||
var val = value ? value.textContent : '--';
|
||||
var pointName = pointInfo ? pointInfo.name : pointId;
|
||||
|
||||
html += '<div class="dot-popup-item">';
|
||||
html += '<span class="dot-popup-label">' + pointName + '</span>';
|
||||
html += '<span class="dot-popup-value">' + val + '</span>';
|
||||
html += '</div>';
|
||||
});
|
||||
|
||||
content.innerHTML = html;
|
||||
|
||||
// 计算弹窗位置，显示在绿点右侧
|
||||
var dotRect = dotElement.getBoundingClientRect();
|
||||
var container = document.querySelector('.screen-container');
|
||||
var containerRect = container.getBoundingClientRect();
|
||||
|
||||
// 获取绿点相对于容器的位置
|
||||
var dotTop = parseInt(dotElement.style.top) || 0;
|
||||
var dotLeft = parseInt(dotElement.style.left) || 0;
|
||||
|
||||
// 弹窗定位在绿点右侧，稍微偏上
|
||||
var popupLeft = dotLeft + 60; // 绿点右侧60px
|
||||
var popupTop = dotTop - 50; // 绿点上方50px
|
||||
|
||||
// 确保弹窗不超出容器右边界
|
||||
if (popupLeft + 450 > 2800) {
|
||||
popupLeft = dotLeft - 470; // 显示在左侧
|
||||
}
|
||||
|
||||
// 确保弹窗不超出容器上边界
|
||||
if (popupTop < 20) {
|
||||
popupTop = 20;
|
||||
}
|
||||
|
||||
// 确保弹窗不超出容器下边界
|
||||
if (popupTop + 400 > 1600) {
|
||||
popupTop = 1600 - 400;
|
||||
}
|
||||
|
||||
popup.style.left = popupLeft + 'px';
|
||||
popup.style.top = popupTop + 'px';
|
||||
|
||||
overlay.classList.add('show');
|
||||
popup.classList.add('show');
|
||||
}
|
||||
|
||||
// 关闭弹窗
|
||||
function closePopup() {
|
||||
document.getElementById('popupOverlay').classList.remove('show');
|
||||
document.getElementById('dotPopup').classList.remove('show');
|
||||
}
|
||||
|
||||
// 点击遮罩关闭弹窗
|
||||
document.addEventListener('click', function(e) {
|
||||
if (e.target.id === 'popupOverlay') {
|
||||
closePopup();
|
||||
}
|
||||
});
|
||||
|
||||
// 七日水量图表
|
||||
|
||||
@ -246,17 +246,19 @@ pageEncoding="UTF-8"%>
|
||||
// 柱状图数据
|
||||
barCharts: {
|
||||
bar5: [
|
||||
3000, 4500, 1500, 5000, 23000, 1500, 15000, 3000, 4000, 5000, 2000,
|
||||
1000, 500, 2563, 4000
|
||||
// 3000, 4500, 1500, 5000, 23000, 1500, 15000, 3000, 4000, 5000, 2000,
|
||||
// 1000, 500, 2563, 4000
|
||||
],
|
||||
bar6: [
|
||||
2000, 3000, 1000, 4000, 18000, 1000, 12000, 2000, 3000, 4000, 1500,
|
||||
800, 400, 2000, 3000
|
||||
// 2000, 3000, 1000, 4000, 18000, 1000, 12000, 2000, 3000, 4000, 1500,
|
||||
// 800, 400, 2000, 3000
|
||||
]
|
||||
},
|
||||
|
||||
// 柱状图X轴数据
|
||||
barXAxis: ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15"]
|
||||
barXAxis: [
|
||||
// "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15"
|
||||
]
|
||||
};
|
||||
|
||||
// 更新统计卡片显示
|
||||
@ -338,6 +340,79 @@ pageEncoding="UTF-8"%>
|
||||
}
|
||||
});
|
||||
|
||||
// 获取管道统计数据
|
||||
function fetchPipelineStats() {
|
||||
$.ajax({
|
||||
url: "<%=request.getContextPath()%>/pipeline/pipelineData/getStatistics.do",
|
||||
type: "GET",
|
||||
dataType: "json",
|
||||
success: function(response) {
|
||||
console.log("管道统计数据:", response);
|
||||
if (response && response.success) {
|
||||
// 更新统计卡片
|
||||
$(".card-1").text(response.totalLength || 0);
|
||||
$(".card-2").text(response.totalCount || 0);
|
||||
$(".card-3").text(response.totalCount || 0);
|
||||
|
||||
// 更新仪表盘数据
|
||||
pageData.gaugeCharts.gauge3 = response.totalLength || 0;
|
||||
pageData.gaugeCharts.gauge4 = response.totalLength || 0;
|
||||
|
||||
// 更新饼图数据 - 材质长度比例
|
||||
if (response.materialLengthRatio && response.materialLengthRatio.length > 0) {
|
||||
pageData.pieChart1 = response.materialLengthRatio.map(function(item) {
|
||||
return {
|
||||
name: item.material,
|
||||
value: item.length
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
// 更新饼图数据 - 材质数量比例
|
||||
if (response.materialCountRatio && response.materialCountRatio.length > 0) {
|
||||
pageData.pieChart2 = response.materialCountRatio.map(function(item) {
|
||||
return {
|
||||
name: item.material,
|
||||
value: item.count
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
// 更新柱状图数据 - 管径长度分布
|
||||
if (response.diameterLengthRatio && response.diameterLengthRatio.length > 0) {
|
||||
// 取前15个数据
|
||||
var topData = response.diameterLengthRatio.slice(0, 15);
|
||||
pageData.barCharts.bar5 = topData.map(function(item) {
|
||||
return item.length;
|
||||
});
|
||||
pageData.barXAxis = topData.map(function(item) {
|
||||
return item.diameter;
|
||||
});
|
||||
}
|
||||
|
||||
// 更新柱状图数据 - 管径数量分布
|
||||
if (response.diameterCountRatio && response.diameterCountRatio.length > 0) {
|
||||
var topData = response.diameterCountRatio.slice(0, 15);
|
||||
pageData.barCharts.bar6 = topData.map(function(item) {
|
||||
return item.count;
|
||||
});
|
||||
}
|
||||
|
||||
// 重新渲染图表
|
||||
initPieChart();
|
||||
initPieChart2();
|
||||
initGaugeChart("gauge-chart-content-3", pageData.gaugeCharts.gauge3);
|
||||
initGaugeChart("gauge-chart-content-4", pageData.gaugeCharts.gauge4);
|
||||
initBarChart("bar-chart-content-5", pageData.barCharts.bar5);
|
||||
initBarChart("bar-chart-content-6", pageData.barCharts.bar6);
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.error("获取管道统计数据失败:", error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
// 初始化统计数据
|
||||
updateStatCards();
|
||||
@ -350,6 +425,9 @@ pageEncoding="UTF-8"%>
|
||||
initBarChart("bar-chart-content-5", pageData.barCharts.bar5);
|
||||
initBarChart("bar-chart-content-6", pageData.barCharts.bar6);
|
||||
|
||||
// 获取管道统计数据
|
||||
fetchPipelineStats();
|
||||
|
||||
// Double click to toggle fullscreen
|
||||
$("body").on("dblclick", function () {
|
||||
launchIntoFullscreen(document.documentElement);
|
||||
@ -376,6 +454,10 @@ pageEncoding="UTF-8"%>
|
||||
"#915eff",
|
||||
"#ff7f00",
|
||||
],
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{b}: {c}m ({d}%)"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "管线类型统计",
|
||||
@ -386,17 +468,20 @@ pageEncoding="UTF-8"%>
|
||||
label: {
|
||||
show: true,
|
||||
position: "outside",
|
||||
formatter: "{b}",
|
||||
fontSize: 14,
|
||||
lineHeight: 20,
|
||||
formatter: "{b}\n{d}%",
|
||||
fontSize: 32,
|
||||
lineHeight: 40,
|
||||
align: "left",
|
||||
color: "#fff",
|
||||
fontWeight: "bold",
|
||||
},
|
||||
labelLine: {
|
||||
show: true,
|
||||
length: 20,
|
||||
length2: 30,
|
||||
length: 30,
|
||||
length2: 40,
|
||||
lineStyle: {
|
||||
type: "solid",
|
||||
width: 2,
|
||||
},
|
||||
},
|
||||
data: pageData.pieChart1,
|
||||
@ -426,6 +511,10 @@ pageEncoding="UTF-8"%>
|
||||
"#915eff",
|
||||
"#ff7f00",
|
||||
],
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{b}: {c}条 ({d}%)"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "管线类型统计2",
|
||||
@ -436,17 +525,20 @@ pageEncoding="UTF-8"%>
|
||||
label: {
|
||||
show: true,
|
||||
position: "outside",
|
||||
formatter: "{b}",
|
||||
fontSize: 14,
|
||||
lineHeight: 20,
|
||||
formatter: "{b}\n{d}%",
|
||||
fontSize: 32,
|
||||
lineHeight: 40,
|
||||
align: "left",
|
||||
color: "#fff",
|
||||
fontWeight: "bold",
|
||||
},
|
||||
labelLine: {
|
||||
show: true,
|
||||
length: 20,
|
||||
length2: 30,
|
||||
length: 30,
|
||||
length2: 40,
|
||||
lineStyle: {
|
||||
type: "solid",
|
||||
width: 2,
|
||||
},
|
||||
},
|
||||
data: pageData.pieChart2,
|
||||
@ -500,8 +592,8 @@ pageEncoding="UTF-8"%>
|
||||
},
|
||||
axisLabel: {
|
||||
color: "#00d4ff",
|
||||
fontSize: 14,
|
||||
distance: -60,
|
||||
fontSize: 20,
|
||||
distance: -80,
|
||||
formatter: function (value) {
|
||||
return value;
|
||||
},
|
||||
@ -567,7 +659,7 @@ pageEncoding="UTF-8"%>
|
||||
},
|
||||
axisLabel: {
|
||||
color: "#B7C9E2",
|
||||
fontSize: 25,
|
||||
fontSize: 40,
|
||||
},
|
||||
// axisTick: {
|
||||
// show: false
|
||||
@ -575,27 +667,18 @@ pageEncoding="UTF-8"%>
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
name: "长度(m)",
|
||||
// name: "长度(m)",
|
||||
// nameTextStyle: {
|
||||
// color: '#fff',
|
||||
// padding: [0, 0, 0, 20]
|
||||
// },
|
||||
// axisLabel: {
|
||||
// color: '#fff',
|
||||
// fontSize: 14
|
||||
// },
|
||||
// splitLine: {
|
||||
// show: true,
|
||||
// lineStyle: {
|
||||
// color: 'rgba(255, 255, 255, 0.1)'
|
||||
// }
|
||||
// color: '#B7C9E2',
|
||||
// padding: [0, 0, 40, 2300],
|
||||
// fontSize: 40,
|
||||
// },
|
||||
splitNumber: 5,
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
color: "#B7C9E2",
|
||||
fontSize: 18,
|
||||
fontSize: 40,
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
@ -610,11 +693,6 @@ pageEncoding="UTF-8"%>
|
||||
data: data,
|
||||
type: "bar",
|
||||
barWidth: "40%",
|
||||
// itemStyle: {
|
||||
// color: '#FF9900',
|
||||
// borderColor: '#FF9900',
|
||||
// borderWidth: 1
|
||||
// },
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
@ -633,46 +711,7 @@ pageEncoding="UTF-8"%>
|
||||
]),
|
||||
},
|
||||
},
|
||||
// markPoint: {
|
||||
// symbol: 'pin',
|
||||
// symbolSize: 50,
|
||||
// label: {
|
||||
// show: true,
|
||||
// color: '#fff',
|
||||
// fontSize: 12
|
||||
// },
|
||||
// itemStyle: {
|
||||
// color: '#FF9900'
|
||||
// },
|
||||
// data: [
|
||||
// { type: 'max', name: 'Max' },
|
||||
// { type: 'min', name: 'Min' }
|
||||
// ]
|
||||
// },
|
||||
// markLine: {
|
||||
// symbol: 'none',
|
||||
// data: [
|
||||
// { yAxis: 2563.31, name: 'Average' }
|
||||
// ],
|
||||
// label: {
|
||||
// show: true,
|
||||
// position: 'end',
|
||||
// formatter: '{c}',
|
||||
// color: '#FF9900'
|
||||
// },
|
||||
// lineStyle: {
|
||||
// type: 'dotted',
|
||||
// color: '#FF9900'
|
||||
// }
|
||||
// }
|
||||
},
|
||||
// {
|
||||
// type: 'bar',
|
||||
// barGap: '-100%',
|
||||
// data: (function(){ var yMax = 10000; var shadow=[]; for (var i=0;i<data.length;i++){shadow.push(yMax);} return shadow; })(),
|
||||
// itemStyle: { normal: { color: 'rgba(0,0,0,0.05)' } },
|
||||
// silent: true
|
||||
// }
|
||||
],
|
||||
};
|
||||
myChart.setOption(option);
|
||||
|
||||
@ -151,31 +151,31 @@
|
||||
<body>
|
||||
<div id="mainDiv" style="background:#f1f1f1;">
|
||||
|
||||
<div style="float:left;height:100%;width:35%;">
|
||||
<div style="float:left;height:100%;width:100%;padding:5px 5px 5px 5px;">
|
||||
<div style="height:100%;width:100%;background-color:#ffffff;">
|
||||
<%--图片--%>
|
||||
<!-- <img src="" id="mainImg" style="width:100%;height:100%;"> -->
|
||||
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" style="width:100%;height:100%;">
|
||||
<%-- <div style="float:left;height:100%;width:35%;">--%>
|
||||
<%-- <div style="float:left;height:100%;width:100%;padding:5px 5px 5px 5px;">--%>
|
||||
<%-- <div style="height:100%;width:100%;background-color:#ffffff;">--%>
|
||||
<%-- <%–图片–%>--%>
|
||||
<%-- <!-- <img src="" id="mainImg" style="width:100%;height:100%;"> -->--%>
|
||||
<%-- <div id="carousel-example-generic" class="carousel slide" data-ride="carousel" style="width:100%;height:100%;">--%>
|
||||
<%-- --%>
|
||||
<%-- <!-- Wrapper for slides -->--%>
|
||||
<%-- <div class="carousel-inner" role="listbox" id="carousel-items">--%>
|
||||
<%-- </div>--%>
|
||||
<%-- <!-- Controls -->--%>
|
||||
<%-- <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">--%>
|
||||
<%-- <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>--%>
|
||||
<%-- <span class="sr-only">Previous</span>--%>
|
||||
<%-- </a>--%>
|
||||
<%-- <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">--%>
|
||||
<%-- <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>--%>
|
||||
<%-- <span class="sr-only">Next</span>--%>
|
||||
<%-- </a>--%>
|
||||
<%-- </div>--%>
|
||||
<%-- </div>--%>
|
||||
<%-- </div>--%>
|
||||
<%-- </div>--%>
|
||||
|
||||
<!-- Wrapper for slides -->
|
||||
<div class="carousel-inner" role="listbox" id="carousel-items">
|
||||
</div>
|
||||
<!-- Controls -->
|
||||
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
|
||||
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
|
||||
<span class="sr-only">Previous</span>
|
||||
</a>
|
||||
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
|
||||
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
|
||||
<span class="sr-only">Next</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="float:left;height:100%;width:65%;">
|
||||
<div style="float:left;height:100%;width:100%;">
|
||||
<div style="float:left;height:50%;width:100%;padding:5px 5px 5px 5px;">
|
||||
<div style="height:100%;width:100%;background-color:#ffffff;">
|
||||
<div class="section-header">
|
||||
|
||||
@ -479,45 +479,75 @@ pageEncoding="UTF-8"%>
|
||||
企业查询
|
||||
</h5>
|
||||
|
||||
<!-- <div
|
||||
<!-- 查询条件 -->
|
||||
<div
|
||||
class="well well-sm"
|
||||
style="
|
||||
background: white;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
"
|
||||
>
|
||||
<div class="query-form-group">
|
||||
<label>企业名称/合同编号</label>
|
||||
<div class="input-group">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
id="company-search-name"
|
||||
placeholder="请输入企业名称或合同编号"
|
||||
/>
|
||||
<div class="row" style="margin-bottom: 8px;">
|
||||
<div class="col-xs-6" style="padding-right: 5px;">
|
||||
<div class="form-group" style="margin-bottom: 0;">
|
||||
<label style="font-size: 12px; margin-bottom: 3px; display: block;">所属泵站</label>
|
||||
<select id="company-processSection" class="form-control input-sm" style="width: 100%;">
|
||||
<option value="">请选择</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6" style="padding-left: 5px;">
|
||||
<div class="form-group" style="margin-bottom: 0;">
|
||||
<label style="font-size: 12px; margin-bottom: 3px; display: block;">管网所有权单位</label>
|
||||
<select id="company-city" class="form-control input-sm" style="width: 100%;">
|
||||
<option value="">请选择</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-bottom: 8px;">
|
||||
<div class="col-xs-6" style="padding-right: 5px;">
|
||||
<div class="form-group" style="margin-bottom: 0;">
|
||||
<label style="font-size: 12px; margin-bottom: 3px; display: block;">是否关联点位</label>
|
||||
<select id="company-point" class="form-control input-sm" style="width: 100%;">
|
||||
<option value="">请选择</option>
|
||||
<option value="true">是</option>
|
||||
<option value="false">否</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6" style="padding-left: 5px;">
|
||||
<div class="form-group" style="margin-bottom: 0;">
|
||||
<label style="font-size: 12px; margin-bottom: 3px; display: block;">是否录入数据</label>
|
||||
<select id="company-input" class="form-control input-sm" style="width: 100%;">
|
||||
<option value="">请选择</option>
|
||||
<option value="true">是</option>
|
||||
<option value="false">否</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="text" id="company-search-name" class="form-control" placeholder="合同编号/单位名称">
|
||||
<span class="input-group-btn">
|
||||
<button
|
||||
class="btn btn-primary"
|
||||
type="button"
|
||||
onclick="searchCompany()"
|
||||
>
|
||||
<button class="btn btn-primary" type="button" onclick="searchCompany()">
|
||||
<i class="glyphicon glyphicon-search"></i> 查询
|
||||
</button>
|
||||
<button class="btn btn-default" type="button" onclick="resetCompanySearch()" style="margin-left: 5px;">
|
||||
<i class="glyphicon glyphicon-refresh"></i> 重置
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div style="margin-bottom: 10px">
|
||||
<label
|
||||
><input type="checkbox" checked id="company-show-label" />
|
||||
显示标注</label
|
||||
>
|
||||
</div> -->
|
||||
|
||||
<div style="max-height: 500px; overflow-y: auto">
|
||||
<div style="max-height: 400px; overflow-y: auto">
|
||||
<table
|
||||
class="table table-bordered table-hover table-condensed table-custom"
|
||||
style="font-size: 12px; white-space: nowrap"
|
||||
@ -1110,7 +1140,7 @@ pageEncoding="UTF-8"%>
|
||||
map.addEventListener("zoomstart", function(e) {
|
||||
var newZoom = e.zoom;
|
||||
console.log("[地图缩放] 当前级别:", currentZoomLevel, "目标级别:", newZoom);
|
||||
if (newZoom <td minZoomLevel) {
|
||||
if (newZoom < minZoomLevel) {
|
||||
console.log("[地图缩放] 阻止缩小操作，最小级别:", minZoomLevel);
|
||||
map.setZoom(minZoomLevel);
|
||||
return false;
|
||||
@ -1200,7 +1230,26 @@ pageEncoding="UTF-8"%>
|
||||
company: {
|
||||
data: [],
|
||||
loaded: false,
|
||||
api: { url: '/sparepart/sewage/getList.do', mock: false, params: { page: 1, rows: 1000, sort: 'id', order: 'asc', unitId: '0533JS' } },
|
||||
api: {
|
||||
url: '/sparepart/sewage/getList.do',
|
||||
mock: false,
|
||||
// 动态获取查询参数
|
||||
getParams: function() {
|
||||
return {
|
||||
page: 1,
|
||||
rows: 1000,
|
||||
sort: 'id',
|
||||
order: 'asc',
|
||||
unitId: '0533JS',
|
||||
search_name: $('#company-search-name').val() || '',
|
||||
processSectionId: $('#company-processSection').val() || '',
|
||||
city: $('#company-city').val() || '',
|
||||
_point: $('#company-point').val() || '',
|
||||
_input: $('#company-input').val() || ''
|
||||
};
|
||||
},
|
||||
params: { page: 1, rows: 1000, sort: 'id', order: 'asc', unitId: '0533JS' }
|
||||
},
|
||||
tableBody: 'company-table-body',
|
||||
icon: 'icon_qy.png',
|
||||
transform: function(item, idx) {
|
||||
@ -1337,7 +1386,9 @@ pageEncoding="UTF-8"%>
|
||||
if (!config || config.loaded) return Promise.resolve(config.data);
|
||||
|
||||
var api = config.api;
|
||||
return apiRequest(api.url, api.params, api.mock, api.isStatic).then(function(res) {
|
||||
// 支持动态参数获取（用于企业查询）
|
||||
var params = api.getParams ? api.getParams() : api.params;
|
||||
return apiRequest(api.url, params, api.mock, api.isStatic).then(function(res) {
|
||||
// 根据数据源类型提取数据列表
|
||||
var list = [];
|
||||
if (api.isStatic && res.features) {
|
||||
@ -1629,6 +1680,80 @@ pageEncoding="UTF-8"%>
|
||||
selectMarker(item.name, 'company');
|
||||
}
|
||||
|
||||
// ==================== 企业查询功能 ====================
|
||||
// 初始化企业查询下拉选项
|
||||
function initCompanySearchOptions() {
|
||||
// 加载所属泵站选项
|
||||
$.ajax({
|
||||
url: contextPath + '/sparepart/sewage/getProcessSectionId4Select.do',
|
||||
type: 'POST',
|
||||
data: { companyId: 'JSBZ' },
|
||||
success: function(data) {
|
||||
if (typeof data === 'string') {
|
||||
try { data = JSON.parse(data); } catch(e) { data = []; }
|
||||
}
|
||||
var $select = $('#company-processSection');
|
||||
$select.empty().append('<option value="">请选择</option>');
|
||||
(data || []).forEach(function(item) {
|
||||
$select.append('<option value="' + item.id + '">' + item.text + '</option>');
|
||||
});
|
||||
},
|
||||
error: function() {
|
||||
console.error('[企业查询] 加载泵站选项失败');
|
||||
}
|
||||
});
|
||||
|
||||
// 加载管网所有权单位选项
|
||||
$.ajax({
|
||||
url: contextPath + '/sparepart/sewage/getSewageCity4Select.do',
|
||||
type: 'POST',
|
||||
data: { unitId: '0533JS' },
|
||||
success: function(data) {
|
||||
if (typeof data === 'string') {
|
||||
try { data = JSON.parse(data); } catch(e) { data = []; }
|
||||
}
|
||||
var $select = $('#company-city');
|
||||
$select.empty().append('<option value="">请选择</option>');
|
||||
(data || []).forEach(function(item) {
|
||||
$select.append('<option value="' + item.id + '">' + item.text + '</option>');
|
||||
});
|
||||
},
|
||||
error: function() {
|
||||
console.error('[企业查询] 加载管网所有权单位选项失败');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 企业查询
|
||||
function searchCompany() {
|
||||
var config = dataConfig.company;
|
||||
// 重置已加载状态，强制重新加载
|
||||
config.loaded = false;
|
||||
config.data = [];
|
||||
|
||||
// 获取动态参数
|
||||
var params = config.api.getParams();
|
||||
console.log('[企业查询] 查询参数:', params);
|
||||
|
||||
// 重新加载数据
|
||||
loadData('company').then(function() {
|
||||
renderTable('company');
|
||||
initMarkers('company');
|
||||
});
|
||||
}
|
||||
|
||||
// 重置企业查询条件
|
||||
function resetCompanySearch() {
|
||||
$('#company-search-name').val('');
|
||||
$('#company-processSection').val('');
|
||||
$('#company-city').val('');
|
||||
$('#company-point').val('');
|
||||
$('#company-input').val('');
|
||||
|
||||
// 重新加载数据
|
||||
searchCompany();
|
||||
}
|
||||
|
||||
// 选择管道并定位
|
||||
function selectPipeline(index) {
|
||||
var item = dataConfig.pipeline.data[index];
|
||||
@ -1729,6 +1854,11 @@ pageEncoding="UTF-8"%>
|
||||
renderTable(type);
|
||||
initMarkers(type);
|
||||
});
|
||||
|
||||
// 企业 Tab 初始化查询下拉选项
|
||||
if (type === 'company') {
|
||||
initCompanySearchOptions();
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 抽屉和调整大小逻辑 ====================
|
||||
|
||||
Reference in New Issue
Block a user