北京市中宝生文化有限公司
北京市信和易信息技术有限公司
北京昌达鑫顺建筑设备租赁有限公司
在线数量：
66
离线数量：
394
在线率：
14.35%
| 站点名称 |
网关 |
串口号 |
仪表地址 |
仪表名称 |
开关状态 |
通讯状态 |
离线时间 |
最后采集时间 |
累计中断时间 |
| 新太堆煤配电房 |
ARTU监控网关 |
1 |
1 |
2 |
- |
|
2025-03-07 09:15:32 |
2025-03-21 09:45:10 |
20天1时32分 |
| 新太堆煤配电房 |
ARTU监控网关 |
COM1 |
1 |
noise |
- |
|
|
|
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
COM1 |
1 |
Partial discharge |
- |
|
|
|
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ETH01 |
001 |
1 |
- |
|
2025-03-20 17:30:15 |
2025-03-24 13:45:22 |
6天17时42分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ETH02 |
001 |
smog2 |
- |
|
|
2025-03-27 10:15:30 |
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ETH02 |
001 |
Smog3 |
- |
|
|
2025-03-27 10:18:42 |
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ETH02 |
001 |
Smog1 |
- |
|
|
2025-03-27 10:20:15 |
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ETH02 |
001 |
Smog4 |
- |
|
|
2025-03-27 10:22:30 |
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ETH02 |
001 |
Water flooding |
- |
|
|
2025-03-27 10:25:18 |
0分 |
| 新太堆煤配电房 |
ARTU监控网关 |
ff |
1 |
dr |
- |
|
|
|
0分 |
| 安科瑞光伏电站 |
A楼5F |
1 |
1 |
辐照度仪表 |
- |
|
|
2025-03-27 10:30:45 |
0分 |
| 安科瑞光伏电站 |
A楼5F |
1 |
1 |
PV1 |
- |
|
|
2025-03-27 10:32:15 |
0分 |
| 安科瑞光伏电站 |
A楼5F |
1 |
1 |
温湿度（传感器1） |
- |
|
|
2025-03-27 10:35:22 |
0分 |
| 安科瑞光伏电站 |
A楼5F |
1 |
1 |
风速仪表 |
- |
|
|
2025-03-27 10:38:10 |
0分 |
function showToast(message, type = 'info') {
const toast = document.createElement('div');
toast.className = `fixed top-4 right-4 px-6 py-3 rounded-lg shadow-lg z-50 ${
type === 'success' ? 'bg-green-600' :
type === 'error' ? 'bg-red-600' :
'bg-gray-800'
} text-white transition-opacity duration-300`;
toast.textContent = message;
document.body.appendChild(toast);
setTimeout(() => {
toast.style.opacity = '0';
setTimeout(() => toast.remove(), 300);
}, 1700);
}
function showToast(message, type = 'info') {
const toast = document.createElement('div');
toast.className = `fixed top-4 right-4 px-6 py-3 rounded-lg shadow-lg z-50 ${
type === 'success' ? 'bg-green-600' :
type === 'error' ? 'bg-red-600' :
'bg-gray-800'
} text-white transition-opacity duration-300`;
toast.textContent = message;
document.body.appendChild(toast);
setTimeout(() => {
toast.style.opacity = '0';
setTimeout(() => toast.remove(), 300);
}, 1700);
}
function setQueryButtonState(isLoading) {
const queryButton = document.getElementById('queryButton');
const buttonText = queryButton.querySelector('span');
const buttonIcon = queryButton.querySelector('i');
queryButton.disabled = isLoading;
queryButton.style.opacity = isLoading ? '0.7' : '1';
queryButton.style.cursor = isLoading ? 'not-allowed' : 'pointer';
if (isLoading) {
buttonText.textContent = '查询中...';
buttonIcon.className = 'ri-loader-4-line ml-1 animate-spin';
} else {
buttonText.textContent = '查询';
buttonIcon.className = 'ri-search-line ml-1';
}
}
function updateStatistics(data) {
const onlineCount = data.filter(item => item.communication === 'good').length;
const offlineCount = data.length - onlineCount;
const onlineRate = ((onlineCount / data.length) * 100).toFixed(2);
document.querySelector('.text-blue-500.font-medium').textContent = onlineCount;
document.querySelector('.text-red-500.font-medium').textContent = offlineCount;
document.querySelector('.text-blue-500.font-medium:last-child').textContent = onlineRate + '%';
}
queryButton.addEventListener('click', async function() {
if (isQuerying) return;
isQuerying = true;
const tableBody = document.querySelector('tbody');
setQueryButtonState(true);
showToast('正在查询数据...', 'info');
try {
await new Promise(resolve => setTimeout(resolve, 800));
let mockData;
const currentDate = new Date();
const randomMinutes = Math.floor(Math.random() * 60);
const randomHours = Math.floor(Math.random() * 24);
const lastCollectTime = `2025-06-29 ${String(randomHours).padStart(2, '0')}:${String(randomMinutes).padStart(2, '0')}:${String(Math.floor(Math.random() * 60)).padStart(2, '0')}`;
const deviceTypes = {
'北京市中宝生文化有限公司': [
{ site: '中宝生大厦', gateway: 'ARTU监控网关-A', devices: ['空调系统', '照明系统', '电梯系统', '安防系统', 'UPS系统'] },
{ site: '中宝生文化中心', gateway: 'ARTU监控网关-B', devices: ['配电系统', '给排水系统', '新风系统', '消防系统'] }
],
'北京市信和易信息技术有限公司': [
{ site: '信和易园区', gateway: 'ARTU监控网关-C', devices: ['服务器机房', 'UPS系统', '配电系统', '空调系统', '门禁系统'] },
{ site: '信和易数据中心', gateway: 'ARTU监控网关-D', devices: ['机房环境', '动力系统', '安防系统', '消防系统'] }
],
'北京昌达鑫顺建筑设备租赁有限公司': [
{ site: '昌达鑫顺仓库', gateway: 'ARTU监控网关-E', devices: ['温湿度监控', '安防系统', '消防系统', '照明系统', '门禁系统'] },
{ site: '昌达鑫顺维修中心', gateway: 'ARTU监控网关-F', devices: ['设备监控', '环境监控', '电力监控', '视频监控'] }
]
};
function generateMockData(company) {
const data = [];
const companyDevices = deviceTypes[company] || deviceTypes['北京市信和易信息技术有限公司'];
companyDevices.forEach(location => {
location.devices.forEach((device, index) => {
const communication = Math.random() > 0.3 ? 'good' : 'bad';
const offlineTime = communication === 'bad' ? `2025-06-${Math.floor(Math.random() * 5) + 24} ${String(Math.floor(Math.random() * 24)).padStart(2, '0')}:${String(Math.floor(Math.random() * 60)).padStart(2, '0')}:${String(Math.floor(Math.random() * 60)).padStart(2, '0')}` : '';
const totalOfflineTime = communication === 'bad' ? `${Math.floor(Math.random() * 5)}天${Math.floor(Math.random() * 24)}时${Math.floor(Math.random() * 60)}分` : '0分';
data.push({
site: location.site,
gateway: location.gateway,
port: `COM${Math.floor(Math.random() * 4) + 1}`,
address: String(index + 1),
name: device,
status: '-',
communication,
offlineTime,
lastCollectTime: communication === 'good' ? lastCollectTime : offlineTime,
totalOfflineTime
});
});
});
return data;
}
try {
setQueryButtonState(true);
showToast('正在查询数据...', 'info');
await new Promise(resolve => setTimeout(resolve, 800));
mockData = generateMockData(companyInput.value);
updateStatistics(mockData);
const fadeOut = document.createElement('style');
fadeOut.textContent = `
@keyframes fadeOut {
from { opacity: 1; }
to { opacity: 0; }
}
.fade-out {
animation: fadeOut 0.3s ease-out forwards;
}
`;
document.head.appendChild(fadeOut);
tableBody.classList.add('fade-out');
await new Promise(resolve => setTimeout(resolve, 300));
tableBody.innerHTML = mockData.map(item => `
| ${item.site} |
${item.gateway} |
${item.port} |
${item.address} |
${item.name} |
${item.status} |
|
${item.offlineTime} |
${item.lastCollectTime} |
${item.totalOfflineTime} |
`).join('');
tableBody.classList.remove('fade-out');
const rows = tableBody.querySelectorAll('tr');
rows.forEach((row, index) => {
setTimeout(() => row.classList.remove('opacity-0'), index * 50);
});
showToast('查询成功', 'success');
} catch (error) {
console.error('Query error:', error);
showToast('查询失败，请重试', 'error');
} finally {
setQueryButtonState(false);
isQuerying = false;
}
});
});