mirror of
https://gitee.com/js-yhsec/energy_storage.git
synced 2026-05-27 18:59:26 +08:00
512 lines
17 KiB
JavaScript
512 lines
17 KiB
JavaScript
var pageSys = {
|
||
|
||
}
|
||
|
||
|
||
function renderIsOpen(data, type, row) { return data == 1 ? "启用" : "禁用" }
|
||
|
||
var roleTypeDef = {} // = { 1: "角色1", 2: "角色2" } // 调用接口查询获取角色定义
|
||
function renderRole(data, type, row) {
|
||
var text = roleTypeDef[data]
|
||
return text != undefined ? text : ''
|
||
}
|
||
|
||
// 需要调用接口查询获取策略类型定义
|
||
var policyTypeDef = { 1: "发电策略", 2: "储能策略", 3: "充电策略" }
|
||
function renderPolicy(data, type, row) {
|
||
var text = policyTypeDef[data]
|
||
return text != undefined ? text : ''
|
||
}
|
||
|
||
var deviceTypeDef = {
|
||
1: "变压器",
|
||
2: "配电柜",
|
||
3: "电表",
|
||
4: "门禁",
|
||
5: "空调",
|
||
6: "照明",
|
||
7: "消防",
|
||
8: "光照监测设备",
|
||
9: "风速监测设备",
|
||
10: "温湿度监测设备",
|
||
11: "烟感监测设备",
|
||
12: "水浸传感器",
|
||
13: "视频监控",
|
||
101: "逆变器",
|
||
102: "汇流箱",
|
||
103: "光伏板",
|
||
104: "风力发电机",
|
||
105: "储能变流器",
|
||
106: "储能电池",
|
||
107: "BMS",
|
||
108: "充电桩",
|
||
109: "充电枪",
|
||
110: "集中器",
|
||
}
|
||
function renderDeviceType(data, type, row) {
|
||
var text = deviceTypeDef[data]
|
||
return text != undefined ? text : ''
|
||
}
|
||
|
||
var priceTypeDef = {
|
||
1: "充电计费"
|
||
}
|
||
function renderPriceType(data, type, row) {
|
||
var text = priceTypeDef[data]
|
||
return text != undefined ? text : ''
|
||
}
|
||
|
||
var syslogTypeDef = {
|
||
0: "其它",
|
||
1: "系统日志",
|
||
2: "操作员日志",
|
||
3: "设备日志",
|
||
4: "告警日志",
|
||
}
|
||
function renderSyslogType(data, type, row) {
|
||
var text = syslogTypeDef[data]
|
||
return text != undefined ? text : ''
|
||
}
|
||
|
||
var tableDef = {
|
||
user: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '账户', width: '150px' },
|
||
{ title: '姓名' },
|
||
{ title: '性别', render: function (data, type, row) { return data == 1 ? "男" : "女" } },
|
||
{ title: '年龄' },
|
||
{ title: '手机号' },
|
||
{ title: '邮箱' },
|
||
{ title: '是否启用', width: '120px', render: renderIsOpen },
|
||
{ title: '上次登录时间', width: '180px' },
|
||
{ title: '角色', render: renderRole },
|
||
{
|
||
title: '操作',
|
||
width: '200px',
|
||
render: function (data, type, row) { return htmlOptEdit + htmlOptDel },
|
||
},
|
||
],
|
||
header: ['user_id', 'account', 'name', 'gender', 'age', 'phone', 'email', 'is_open', 'login_time', 'role_id'],
|
||
query: G.cppNative.queryUserList,
|
||
update: G.cppNative.updateUser,
|
||
insert: G.cppNative.insertUser,
|
||
poptitle: "人员",
|
||
popkeys: ['', 'account', 'name', 'gender', 'age', 'phone', 'email', 'is_open', '', 'role_id'],
|
||
},
|
||
|
||
role: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '名称', width: '150px' },
|
||
{ title: '描述' },
|
||
{ title: '是否启用', width: '120px', render: renderIsOpen },
|
||
{ title: '创建时间', width: '180px' },
|
||
{ title: '更新时间', width: '180px' },
|
||
{
|
||
title: '操作',
|
||
width: '200px',
|
||
render: function (data, type, row) { return htmlOptEdit + htmlOptDel },
|
||
},
|
||
],
|
||
header: ['role_id', 'name', 'describe', 'is_open', 'create_time', 'update_time', 'update_by'],
|
||
query: G.cppNative.queryRoleList,
|
||
update: G.cppNative.updateRole,
|
||
insert: G.cppNative.insertRole,
|
||
poptitle: "角色",
|
||
popkeys: ['', 'name', 'describe', 'is_open', 'permission'],
|
||
},
|
||
|
||
permission: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '名称', width: '150px' },
|
||
{ title: '描述' },
|
||
{ title: '是否启用', width: '120px', render: renderIsOpen },
|
||
{ title: '创建时间', width: '180px' },
|
||
{ title: '更新时间', width: '180px' },
|
||
{ title: '更新人', width: '180px' },
|
||
{
|
||
title: '操作',
|
||
width: '200px',
|
||
render: function (data, type, row) { return htmlOptEdit + htmlOptDel },
|
||
},
|
||
],
|
||
header: ['permission_id', 'name', 'describe', 'is_open', 'create_time', 'update_time', 'update_by'],
|
||
query: G.cppNative.queryPermissionList,
|
||
update: G.cppNative.updatePermission,
|
||
insert: G.cppNative.insertPermission,
|
||
poptitle: "权限",
|
||
popkeys: ['', 'name', 'describe', 'is_open'],
|
||
},
|
||
|
||
device: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '类型', width: '150px', render: renderDeviceType },
|
||
{ title: '名称', width: '150px' },
|
||
{ title: '编号' },
|
||
{ title: '型号' },
|
||
{ title: '厂家' },
|
||
{ title: '是否启用', width: '120px', render: renderIsOpen },
|
||
{ title: '创建时间', width: '180px' },
|
||
{ title: '更新时间', width: '180px' },
|
||
{
|
||
title: '操作',
|
||
width: '200px',
|
||
render: function (data, type, row) { return htmlOptEdit + htmlOptAttrs },
|
||
},
|
||
],
|
||
header: ['device_id', 'type', 'name', 'code', 'model', 'factory', 'is_open', 'create_time', 'update_time', 'attrs'],
|
||
query: G.cppNative.queryDeviceList,
|
||
update: G.cppNative.updateDevice,
|
||
insert: G.cppNative.insertDevice,
|
||
poptitle: "设备",
|
||
popkeys: ['', 'type', 'name', 'code', 'model', 'factory', 'is_open'],
|
||
},
|
||
|
||
price: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '类型', width: '120px', render: renderPriceType },
|
||
{ title: '名称', width: '150px' },
|
||
{ title: '描述' },
|
||
{ title: '是否启用', width: '120px', render: renderIsOpen },
|
||
{ title: '创建时间', width: '180px' },
|
||
{ title: '更新时间', width: '180px' },
|
||
{
|
||
title: '操作',
|
||
width: '200px',
|
||
render: function (data, type, row) { return htmlOptEdit + htmlOptDel },
|
||
},
|
||
],
|
||
header: ['price_id', 'type', 'name', 'describe', 'is_open', 'create_time', 'update_time'],
|
||
query: G.cppNative.queryPriceList,
|
||
update: G.cppNative.updatePrice,
|
||
insert: G.cppNative.insertPrice,
|
||
poptitle: "计费",
|
||
popkeys: ['', 'type', 'name', 'describe', 'is_open'],
|
||
},
|
||
|
||
policy: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '名称', width: '150px' },
|
||
{ title: '类型', render: renderPolicy },
|
||
{ title: '参数' },
|
||
{ title: '描述' },
|
||
{ title: '是否启用', width: '120px', render: renderIsOpen },
|
||
{ title: '创建时间', width: '180px' },
|
||
{ title: '更新时间', width: '180px' },
|
||
{
|
||
title: '操作',
|
||
width: '200px',
|
||
render: function (data, type, row) { return htmlOptEdit + htmlOptDel },
|
||
},
|
||
],
|
||
header: ['policy_id', 'name', 'type', 'value', 'describe', 'is_open', 'create_time', 'update_time'],
|
||
query: G.cppNative.queryPolicyList,
|
||
update: G.cppNative.updatePolicy,
|
||
insert: G.cppNative.insertPolicy,
|
||
poptitle: "策略",
|
||
popkeys: ['', 'name', 'type', 'value', 'describe', 'is_open'],
|
||
},
|
||
|
||
syslog: {
|
||
table: null,
|
||
columns: [
|
||
{ title: 'ID', width: '80px' },
|
||
{ title: '类型', width: '100px', render: renderSyslogType },
|
||
{ title: '用户ID', width: '120px' },
|
||
{ title: '用户账户', width: '120px' },
|
||
{ title: '内容' },
|
||
{ title: '记录时间', width: '180px' }
|
||
],
|
||
header: ['log_id', 'type', 'user_id', 'user_acount', 'content', 'create_time'],
|
||
query: G.cppNative.querySyslogList,
|
||
}
|
||
}
|
||
|
||
var htmlOptEdit = '<button class="btn btn-primary btn-sm" style="width:80px; height:28px;" id="btnRowEdit">编辑</button>'
|
||
var htmlOptDel = '' //'<button class="btn btn-outline-danger btn-sm" style="width:80px; margin-left:8px;" id="btnRowDel">删除</button>'
|
||
var htmlOptAttrs = '<button class="btn btn-primary btn-sm" style="width:80px; height:28px; margin-left:8px;" id="btnRowAttrs">属性设置</button>'
|
||
|
||
var popRowdata = null
|
||
|
||
// 初始化页面和表格的基础数据
|
||
async function initSubpage(id) {
|
||
G.clickSubpageBtn(id)
|
||
|
||
if (id == 'user') {
|
||
// 查询获取角色列表，初始化下拉表单和表格角色id的映射
|
||
var elementSelectRole = document.getElementById('userForm_role_id')
|
||
elementSelectRole.innerHTML = ''
|
||
await G.cppNative.queryRoleList(0, 0).then(res => {
|
||
res.data.forEach(item => {
|
||
elementSelectRole.options.add(new Option(item.name, item.role_id))
|
||
roleTypeDef[item.role_id] = item.name
|
||
})
|
||
})
|
||
}
|
||
else if (id == 'role') { }
|
||
else if (id == 'price') {
|
||
var elementSelectPriceType = document.getElementById('priceForm_type')
|
||
elementSelectPriceType.innerHTML = ''
|
||
G.cppNative.queryPriceTypeList().then(res => {
|
||
res.forEach(item => { elementSelectPriceType.options.add(new Option(item.name, item.id)) })
|
||
})
|
||
}
|
||
else if (id == 'policy') {
|
||
var elementSelectPolicyType = document.getElementById('policyForm_type')
|
||
elementSelectPolicyType.innerHTML = ''
|
||
for (var k in policyTypeDef) { elementSelectPolicyType.options.add(new Option(policyTypeDef[k], k)) }
|
||
}
|
||
|
||
var tableInfo = tableDef[id]
|
||
// 表格已经初始化，重新加载数据
|
||
if (tableInfo.table) {
|
||
tableInfo.table.ajax.reload()
|
||
return
|
||
}
|
||
|
||
// 初始化表格
|
||
G.initTable(id, tableInfo)
|
||
// 初始化弹窗Form
|
||
G.initForm(id, popConfirm)
|
||
if (id == 'device') { G.initForm("deviceAttr", popConfirm) }
|
||
|
||
// 绑定行编辑
|
||
tableInfo.table.on('click', '#btnRowEdit', function () {
|
||
var row = tableInfo.table.row($(this).closest('tr'))
|
||
showPop(id, row.data())
|
||
})
|
||
|
||
tableInfo.table.on('click', '#btnRowAttrs', function () {
|
||
var row = tableInfo.table.row($(this).closest('tr'))
|
||
showPopDeviceAttr(row.data())
|
||
})
|
||
}
|
||
|
||
|
||
function showPop(id, rowData) {
|
||
popRowdata = (rowData && rowData.length > 0) ? rowData : null
|
||
var isEdit = (popRowdata) ? true : false
|
||
|
||
G.showElement(id + 'Pop', true)
|
||
document.getElementById(id + 'FormOk').disabled = true
|
||
|
||
var tableInfo = tableDef[id]
|
||
|
||
// 设置弹框的标题
|
||
$('#' + id + 'PopTitle').text((isEdit ? '编辑' : '新增') + tableInfo.poptitle)
|
||
// 设置弹框的参数信息
|
||
G.popSetParams(id, tableInfo.popkeys, popRowdata, callbackPopSetParams)
|
||
|
||
if (id == 'user') { G.popSetParamReadonly('user', 'account', isEdit) }
|
||
}
|
||
|
||
var deviceAttrKeyDef = { commType: "通讯方式", ip: "通讯地址", port: "通讯端口", isclient: "客户端" }
|
||
|
||
// 显示设备的属性编辑弹窗，属性字段格式为JSON: attrs="{}"
|
||
function showPopDeviceAttr(rowData) {
|
||
G.showElement('deviceAttrPop', true)
|
||
|
||
popRowdata = (rowData && rowData.length > 0) ? rowData : null
|
||
|
||
var device_id = rowData[0]
|
||
var deviceType = rowData[1]
|
||
var deviceTypeStr = deviceTypeDef[deviceType]
|
||
var attrsStr = rowData[9]
|
||
|
||
var attrs = {}
|
||
try { attrs = JSON.parse(attrsStr); } catch (error) { attrs = {} }
|
||
if (Object.keys(attrs).length == 0) { attrs = { commType: "", ip: "", port: 0, isclient: 1 } }
|
||
|
||
var elemtForm = document.getElementById('deviceAttrForm')
|
||
elemtForm.innerHTML =
|
||
`<div class="input-group mb-3">
|
||
<span class="input-group-text" style="width: 90px; background-color: #a6c0da">ID</span>
|
||
<input type="text" class="form-control" value='${device_id}' disabled />
|
||
</div>
|
||
<div class="input-group mb-3">
|
||
<span class="input-group-text" style="width: 90px; background-color: #a6c0da">设备类型</span>
|
||
<input type="text" class="form-control" value='${deviceTypeStr}' disabled />
|
||
</div>
|
||
`
|
||
for (k in attrs) {
|
||
var title = deviceAttrKeyDef[k]
|
||
var v = attrs[k]
|
||
if (k == "commType") {
|
||
|
||
var optionStr = ('<option ' + (v == "TCP" ? 'selected ' : '') + 'value="TCP">TCP</option>')
|
||
+ ('<option ' + (v == "MODBUS" ? 'selected ' : '') + 'value="MODBUS">MODBUS</option>')
|
||
+ ('<option ' + (v == "SDK" ? 'selected ' : '') + 'value="SDK">SDK</option>')
|
||
+ ('<option ' + (v == "ACTIVEX" ? 'selected ' : '') + 'value="ACTIVEX">ACTIVEX</option>')
|
||
|
||
elemtForm.innerHTML +=
|
||
`<div class="input-group mb-3">
|
||
<span class="input-group-text" style="width: 90px; background-color: #a6c0da">${title}</span>
|
||
<select id="${k}" class="form-select" required>
|
||
${optionStr}
|
||
</select>
|
||
</div>
|
||
`
|
||
} else {
|
||
elemtForm.innerHTML +=
|
||
`<div class="input-group mb-3">
|
||
<span class="input-group-text" style="width: 90px; background-color: #a6c0da">${title}</span>
|
||
<input id="${k}" type="text" class="form-control" value='${v}' />
|
||
</div>
|
||
`
|
||
}
|
||
}
|
||
|
||
G.cppNative.log(elemtForm.innerHTML);
|
||
}
|
||
|
||
function showPrompt(text, status) {
|
||
G.showElement('promptPop', true)
|
||
var promptText = $('#promptText')
|
||
promptText.text(text)
|
||
promptText.css('color', status == 0 ? 'green' : 'red')
|
||
}
|
||
function hidePrompt() {
|
||
G.showElement('promptPop', false)
|
||
}
|
||
|
||
function callbackPopSetParams(id, key, val) {
|
||
if (key == 'permission') {
|
||
var elementFormPermission = document.getElementById('roleForm_permission')
|
||
elementFormPermission.innerHTML = ""
|
||
|
||
if (popRowdata) {
|
||
var roleId = popRowdata[0]
|
||
// 查询权限列表， 更新编辑弹框的权限列表显示内容
|
||
G.cppNative.queryRolePermissionList(roleId).then(res => {
|
||
res.forEach(item => {
|
||
// <li><input class="form-check-input" type="checkbox" value="" />系统总览-查看</li>
|
||
var elemHtml = '<li><input class="form-check-input" type="checkbox" value="' + item.permission_id + '" ' +
|
||
(item.is_open == '1' ? 'checked' : '') + '/>' + item.name + '</li>'
|
||
elementFormPermission.innerHTML += elemHtml
|
||
})
|
||
})
|
||
} else {
|
||
G.cppNative.queryPermissionList(0, 0).then(res => {
|
||
res.data.forEach(item => {
|
||
var elemHtml = '<li><input class="form-check-input" type="checkbox" value="' + item.permission_id + '" ' +
|
||
(item.is_open == '1') + '/>' + item.name + '</li>'
|
||
elementFormPermission.innerHTML += elemHtml
|
||
})
|
||
})
|
||
}
|
||
// 不需要设置参数值
|
||
return undefined
|
||
}
|
||
else {
|
||
return val
|
||
}
|
||
}
|
||
|
||
function callbackPopGetParams(id, key) {
|
||
var val = undefined
|
||
if (key == 'permission') {
|
||
val = []
|
||
var elemtFormPermission = document.getElementById('roleForm_permission')
|
||
var elemtPermissionList = elemtFormPermission.querySelectorAll('input')
|
||
elemtPermissionList.forEach((elemt => { val.push({ permission_id: elemt.value, is_open: (elemt.checked ? 1 : 0) }) }))
|
||
}
|
||
return val
|
||
}
|
||
|
||
function updateTableData(id) {
|
||
var info = tableDef[id]
|
||
var queryFunc = info.query
|
||
if (!queryFunc) return
|
||
|
||
queryFunc(1, 10).then((res) => {
|
||
})
|
||
}
|
||
|
||
// 用户弹窗确认
|
||
function popConfirm(id) {
|
||
// 设备属性弹窗： 读取属性配置
|
||
if (id == "deviceAttr") {
|
||
/// 选择所有表单元素(input, select, textarea) $('#parentElement :input')
|
||
/// :input 是jQuery特有的选择器，可以匹配所有input、select、textarea和button元素。
|
||
/// 同时选择input和select元素 $('#parentElement input, #parentElement select')
|
||
var param = {}
|
||
$("#deviceAttrForm :input").each(function () {
|
||
var id = $(this).attr('id'); // 获取id属性
|
||
var val = $(this).val(); // 获取value值
|
||
if ((id == "port" || id == "isclient")) { param[id] = parseInt(val) }
|
||
else if (id == "commType") { }
|
||
else if (id) { param[id] = val }
|
||
});
|
||
G.cppNative.log(JSON.stringify(param))
|
||
|
||
// 存储更新数据
|
||
G.cppNative.log("rowdata: " + JSON.stringify(popRowdata))
|
||
var dataId = popRowdata[0]
|
||
G.cppNative.updateDevice(dataId, { attrs: JSON.stringify(param) }).then(ret => {
|
||
G.showElement('deviceAttrPop', false)
|
||
showPrompt((ret == 0 ? '操作成功!' : '操作失败!'), ret)
|
||
})
|
||
return;
|
||
}
|
||
|
||
// 获取数据表格操作对象
|
||
var mytable = $('#' + id + 'Table').DataTable()
|
||
// 获取弹框的参数信息
|
||
var tableInfo = tableDef[id]
|
||
G.cppNative.log(id + " edit: rowdata=" + JSON.stringify(popRowdata))
|
||
var params = G.popGetParams(id, tableInfo.popkeys, popRowdata, callbackPopGetParams)
|
||
if (Object.keys(params).length == 0) {
|
||
G.showElement(id + 'Pop', false)
|
||
return
|
||
}
|
||
|
||
var isEdit = popRowdata ? true : false
|
||
if (isEdit) {
|
||
var msg = '编辑' + tableInfo.poptitle
|
||
var dataId = popRowdata[0]
|
||
tableInfo.update(dataId, params).then(ret => {
|
||
if (ret == 0 && id == "role" && params.permission.length > 0) {
|
||
G.cppNative.updateRolePermission(dataId, params.permission).then(ret => {
|
||
G.showElement(id + 'Pop', false)
|
||
showPrompt(msg + (ret == 0 ? '操作成功!' : '操作失败!'), ret)
|
||
mytable.ajax.reload()
|
||
})
|
||
} else {
|
||
G.showElement(id + 'Pop', false)
|
||
showPrompt(msg + (ret == 0 ? '操作成功!' : '操作失败!'), ret)
|
||
mytable.ajax.reload()
|
||
}
|
||
})
|
||
} else {
|
||
var msg = '新增' + tableInfo.poptitle
|
||
tableInfo.insert(params).then(ret => {
|
||
G.showElement(id + 'Pop', false)
|
||
showPrompt(msg + (ret == 0 ? '操作成功!' : '操作失败!'), ret)
|
||
mytable.ajax.reload()
|
||
})
|
||
}
|
||
}
|
||
|
||
// 设置设备类型下拉列表
|
||
var elementSelectDeviceType = document.getElementById('deviceForm_type')
|
||
elementSelectDeviceType.innerHTML = ''
|
||
for (k in deviceTypeDef) {
|
||
elementSelectDeviceType.options.add(new Option(deviceTypeDef[k], k))
|
||
}
|
||
|
||
$(document).ready(function () {
|
||
initSubpage('user')
|
||
//G.initTable('user', tableDef['user'])
|
||
})
|