mirror of
https://gitee.com/js-yhsec/energy_storage.git
synced 2026-05-27 18:59:26 +08:00
95 lines
3.4 KiB
JavaScript
95 lines
3.4 KiB
JavaScript
|
||
|
||
|
||
|
||
function addCard(deviceId, type, name, code) {
|
||
var a = '<div class="myrow">' +
|
||
'< div style = "width: 100px;height: 70px; background-color: #2991b6;border-radius: 10px;" > </div>' +
|
||
'< div class="mycolumn" style = "margin-left: 10px;" > ' +
|
||
'<div>3201001234567890</div>' +
|
||
'<div>逆变器1 </div>' +
|
||
'<div style="color: #08afff; font-size:14px; font-weight: bold;">逆变器 </div>' +
|
||
'</div >' +
|
||
'</div >'
|
||
|
||
var elementDeviceList = document.getElementById('deviceList')
|
||
// <div class="mycard" ></div>
|
||
var card = document.createElement('div')
|
||
card.className = 'mycard'
|
||
card.innerHTML = '<div class="myrow" style="margin-bottom: 20px">' +
|
||
'<div style="width: 100px;height: 70px; background-color: #2991b6;border-radius: 10px;"></div>' +
|
||
'<div class="mycolumn" style="margin-left: 10px;">' +
|
||
'<div>' + code + '</div><div>' + name + '</div>' +
|
||
'<div style="color: #08afff; font-size:14px; font-weight: bold;">' + type + '</div>' +
|
||
'</div></div>'
|
||
|
||
var params = {
|
||
工作状态: '运行',
|
||
在线状态: '运行',
|
||
故障状态: '运行',
|
||
额定功率: '20 kW',
|
||
电压: '220 V',
|
||
电流: '30 A',
|
||
功率: '11 kW',
|
||
}
|
||
|
||
Object.keys(params).forEach((k) => {
|
||
var id = deviceId + '_' + k
|
||
card.innerHTML += ('<div class="mycard-param">' +
|
||
'<div class="mycard-param-title">' + k + '</div>' + '<div id="' + id + '" class="mycard-param-text">' + params[k] + '</div>' +
|
||
'</div>')
|
||
});
|
||
|
||
elementDeviceList.appendChild(card)
|
||
}
|
||
|
||
function updateParam(deviceId, k, v) {
|
||
var id = deviceId + '_' + k
|
||
document.getElementById(id).innerHTML = v
|
||
}
|
||
|
||
|
||
var activeCardBtn = null
|
||
function clickCardBtn(btn, id) {
|
||
if (activeCardBtn) activeCardBtn.className = 'mycardbtn'
|
||
activeCardBtn = btn
|
||
activeCardBtn.className = 'mycardbtn-active'
|
||
}
|
||
|
||
function initDeviceList() {
|
||
}
|
||
|
||
// 【注意】 DOM 元素的移除不会自动清理 JavaScript 运行时创建的资源（如定时器、事件监听器等），这些都需要手动管理
|
||
// 开启定时器更新页面数据
|
||
var timerId = null
|
||
// 【注意】 DOM 元素的移除不会自动清理 JavaScript 运行时创建的资源（如定时器、事件监听器等），这些都需要手动管理
|
||
// 监听当前script元素的移除事件，清理定时器
|
||
document.currentScript.addEventListener('DOMNodeRemoved', () => {
|
||
G.cppNative.log('DOMNodeRemoved: 运行监控')
|
||
clearInterval(timerId);
|
||
});
|
||
|
||
$(document).ready(function () {
|
||
addCard('1', '逆变器', '逆变器1', '1111')
|
||
addCard('2', '汇流箱', '汇流箱', '2222')
|
||
addCard('3', '光伏板', '光伏板1', '3333')
|
||
addCard('4', '光伏板', '光伏板2', '4444')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
addCard('5', '光伏板', '光伏板3', '5555')
|
||
|
||
clickCardBtn(document.getElementById('solarCardBtn'), 'solar')
|
||
|
||
timerId = setInterval(() => {
|
||
updateParam('1', '电压', Math.floor(Math.random() * 220) + ' V')
|
||
}, 2000);
|
||
}) |