293 lines
12 KiB
JavaScript
293 lines
12 KiB
JavaScript
let table, layer, form, laydate;
|
||
let myChart = null, myChart2 = null;
|
||
layui.use(['layer', 'table', 'form', 'laydate'], function () {
|
||
layer = layui.layer;
|
||
table = layui.table;
|
||
form = layui.form;
|
||
laydate = layui.laydate;
|
||
laydate.render({
|
||
elem: "#ID-laydate-rangeLinked",
|
||
range: ["#ID-laydate-start-date-1", "#ID-laydate-end-date-1"],
|
||
rangeLinked: true, // 开启日期范围选择时的区间联动标注模式 --- 2.8+ 新增
|
||
});
|
||
|
||
// 工程安全分析-一本账
|
||
initTable();
|
||
// 工程安全分析-球机列表
|
||
getBallSelect()
|
||
|
||
initTable2();
|
||
|
||
});
|
||
|
||
function initTable(startTime, endTime) {
|
||
const url = commonUrl + "screen/proSafety/selectProSafetyLedger";
|
||
table.render({
|
||
elem: '#demo1',
|
||
url: url,
|
||
id: 'demo1',
|
||
skin: 'line',
|
||
page: true,
|
||
height: 'full-505',
|
||
headers: {
|
||
"decrypt": "decrypt",
|
||
"Authorization": token
|
||
},
|
||
where: {
|
||
startTime: startTime,
|
||
endTime: endTime
|
||
},
|
||
cols: [[
|
||
{type: 'numbers', title: '序号', width: '10%'}, // 添加序号列
|
||
{field: 'riskCode', title: '风险编号', align: 'center', width: '15%'},
|
||
{field: 'riskSite', title: '作业部位', align: 'center', width: '15%'},
|
||
{field: 'riskLevel', title: '风险等级', align: 'center', width: '15%'},
|
||
{field: 'controller', title: '预控措施', align: 'center', width: '15%'},
|
||
{field: 'riskController', title: '风险控制关键因素', align: 'center', width: '20%'},
|
||
{field: 'startTime', title: '开始日期', align: 'center', width: '10%'},
|
||
]],
|
||
initComplete: function () {
|
||
// 在表格渲染完成后，重新渲染序号列
|
||
var that = this.elem.next();
|
||
var tool = that.children('.layui-table-box').children('.layui-table-fixed').children('.layui-table-body').children('.layui-table');
|
||
tool.find("tr").each(function (index, item) {
|
||
$(this).find('td[data-field="LAY_TABLE_INDEX"]').text(index + 1);
|
||
});
|
||
},
|
||
done: function (res, curr, count, origin) {
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
function query() {
|
||
let startTime = "";
|
||
let endTime = "";
|
||
if ($("#ID-laydate-start-date-1").val() != "") {
|
||
startTime = $("#ID-laydate-start-date-1").val();
|
||
endTime = $("#ID-laydate-end-date-1").val();
|
||
} else {
|
||
startTime = "";
|
||
endTime = "";
|
||
}
|
||
initTable(startTime, endTime);
|
||
}
|
||
|
||
function getBallSelect() {
|
||
|
||
const url = commonUrl + "screen/proSafety/selectBallSelect"
|
||
ajaxRequestGet(
|
||
url,
|
||
"GET",
|
||
true,
|
||
function () {
|
||
},
|
||
function (result) {
|
||
if (result.code === 200) {
|
||
setData(result.data);
|
||
} else if (result.code === 500) {
|
||
console.error("实时监测" + result.msg);
|
||
setData(null);
|
||
} else if (result.code === 401) {
|
||
loginout(1);
|
||
}
|
||
},
|
||
function (xhr, status, error) {
|
||
errorFn(xhr, status, error);
|
||
setData(null);
|
||
},
|
||
aqEnnable
|
||
);
|
||
|
||
/* 实时检测赋值 */
|
||
function setData(data) {
|
||
if (data) {
|
||
console.log(data)
|
||
const dynamicList = document.getElementById('dynamic-list');
|
||
dynamicList.innerHTML = ''; // 清空现有内容
|
||
|
||
data.forEach((item, index) => {
|
||
const listItem = document.createElement('li');
|
||
listItem.className = index === 0 ? 'layout check' : 'layout nocheck';
|
||
listItem.textContent = item.ballName;
|
||
listItem.onclick = function() {
|
||
changeDynamicData(this, index);
|
||
};
|
||
dynamicList.appendChild(listItem);
|
||
});
|
||
}
|
||
}
|
||
|
||
function changeDynamicData(element, index){
|
||
// 移除所有选中状态
|
||
const dynamicItems = document.querySelectorAll('#dynamic-list .layout');
|
||
dynamicItems.forEach(item => {
|
||
item.className = 'layout nocheck';
|
||
});
|
||
|
||
// 设置当前选中项
|
||
element.className = 'layout check';
|
||
|
||
// 显示选中项信息
|
||
const selectedItem = responseData.data[index];
|
||
const display = document.getElementById('selected-data');
|
||
|
||
let displayHTML = `
|
||
<div class="data-item"><strong>选中项:</strong> ${selectedItem.ballName}</div>
|
||
<div class="data-item"><strong>索引:</strong> ${index}</div>
|
||
`;
|
||
|
||
// 添加其他非空字段
|
||
Object.keys(selectedItem).forEach(key => {
|
||
if (selectedItem[key] !== null && key !== 'ballName') {
|
||
displayHTML += `<div class="data-item"><strong>${key}:</strong> ${selectedItem[key]}</div>`;
|
||
}
|
||
});
|
||
display.innerHTML = displayHTML;
|
||
}
|
||
// 页面加载完成后初始化
|
||
window.onload = function() {
|
||
// 默认选中第一个动态项
|
||
const firstDynamicItem = document.querySelector('#dynamic-list .layout');
|
||
if (firstDynamicItem) {
|
||
changeDynamicData(firstDynamicItem, 0);
|
||
}
|
||
};
|
||
|
||
|
||
}
|
||
|
||
function initTable2(startTime, endTime,ballName) {
|
||
const url = commonUrl + "screen/proSafety/selectProSafetyVideo";
|
||
// 获取数据
|
||
$.ajax({
|
||
url: url,
|
||
type: "get",
|
||
headers: {
|
||
"decrypt": "decrypt",
|
||
"Authorization": token
|
||
},
|
||
data: {
|
||
startTime:'2025-10-12',
|
||
endTime:'2025-10-17',
|
||
ballName:'测试球机',
|
||
page: '1',
|
||
limit: '10'
|
||
},
|
||
success: function (data) {
|
||
const container = document.getElementById('demo2-container');
|
||
container.innerHTML = ''; // 清空容器
|
||
|
||
if (data.data && data.data.length > 0) {
|
||
data.data.forEach(item => {
|
||
const card = document.createElement('div');
|
||
card.className = 'card';
|
||
card.style.cssText = ` width: calc(20% - 10px);height: 150px;background-color: #1a3a4c;border: none;border-radius: 8px;display: flex;flex-direction: column;overflow: hidden;`;
|
||
// 创建图片区域
|
||
const imgDiv = document.createElement('div');
|
||
imgDiv.style.cssText = ` flex: 1;background-color: #2a4a5c;display: flex;align-items: center;justify-content: center;color: #fff;font-size: 12px;`;
|
||
imgDiv.textContent = data.name;
|
||
card.appendChild(imgDiv);
|
||
// 创建信息区域
|
||
const infoDiv = document.createElement('div');
|
||
infoDiv.style.cssText = `padding: 5px;background-color: #1a3a4c;color: #fff;font-size: 12px;display: flex;justify-content: space-between;`;
|
||
|
||
const dateSpan = document.createElement('span');
|
||
dateSpan.textContent = item.createTime;
|
||
|
||
const statusSpan = document.createElement('span');
|
||
statusSpan.textContent = data.name;
|
||
|
||
infoDiv.appendChild(dateSpan);
|
||
infoDiv.appendChild(statusSpan);
|
||
card.appendChild(infoDiv);
|
||
|
||
container.appendChild(card);
|
||
});
|
||
|
||
// 添加 Layui 分页
|
||
layui.use('laypage', function () {
|
||
var laypage = layui.laypage;
|
||
laypage.render({
|
||
elem: 'demo2-pagination', // 分页容器ID
|
||
count: data.data.length, // 总条数
|
||
limit: 10, // 每页显示条数
|
||
curr: 1, // 当前页
|
||
layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'], // 布局
|
||
prev: '<i class="layui-icon layui-icon-left"></i>', // 上一页图标
|
||
next: '<i class="layui-icon layui-icon-right"></i>', // 下一页图标
|
||
theme: '#3ACAB8', // 主题色
|
||
jump: function (obj, first) {
|
||
if (!first) { // 非首次触发
|
||
// 获取当前页码和每页条数
|
||
const currentPage = obj.curr;
|
||
const pageSize = obj.limit;
|
||
|
||
// 计算起始索引和结束索引
|
||
const startIndex = (currentPage - 1) * pageSize;
|
||
const endIndex = startIndex + pageSize;
|
||
|
||
// 重新获取数据（这里需要根据实际API调整）
|
||
$.ajax({
|
||
url: commonUrl + "screen/proSafety/selectProSafetyVideo",
|
||
type: "get",
|
||
headers: {
|
||
"decrypt": "decrypt",
|
||
"Authorization": token
|
||
},
|
||
data: {
|
||
startTime:startTime,
|
||
endTime:endTime,
|
||
ballName:ballName,
|
||
page: currentPage,
|
||
limit: pageSize
|
||
},
|
||
success: function (data) {
|
||
// 清空容器
|
||
const container = document.getElementById('demo2-container');
|
||
container.innerHTML = '';
|
||
|
||
// 渲染当前页的数据
|
||
if (data.data && data.data.length > 0) {
|
||
const pageData = data.data.slice(startIndex, endIndex);
|
||
|
||
pageData.forEach(item => {
|
||
const card = document.createElement('div');
|
||
card.className = 'card';
|
||
card.style.cssText = ` width: calc(20% - 10px);height: 150px;background-color: #1a3a4c;border: none;border-radius: 8px;display: flex;flex-direction: column;overflow: hidden;`;
|
||
|
||
// 创建图片区域
|
||
const imgDiv = document.createElement('div');
|
||
imgDiv.style.cssText = ` flex: 1;background-color: #2a4a5c;display: flex;align-items: center;justify-content: center;color: #fff;font-size: 12px;`;
|
||
imgDiv.textContent = '未带安全帽';
|
||
card.appendChild(imgDiv);
|
||
|
||
// 创建信息区域
|
||
const infoDiv = document.createElement('div');
|
||
infoDiv.style.cssText = ` padding: 5px;background-color: #1a3a4c;color: #fff;font-size: 12px;display: flex;justify-content: space-between;`;
|
||
|
||
const dateSpan = document.createElement('span');
|
||
dateSpan.textContent = item.date || 'XXX-XX-XX';
|
||
|
||
const statusSpan = document.createElement('span');
|
||
statusSpan.textContent = '未带安全帽';
|
||
|
||
infoDiv.appendChild(dateSpan);
|
||
infoDiv.appendChild(statusSpan);
|
||
card.appendChild(infoDiv);
|
||
|
||
container.appendChild(card);
|
||
});
|
||
}
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
});
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|