642 lines
19 KiB
JavaScript
642 lines
19 KiB
JavaScript
|
$(function () {
|
|||
|
|
yearElect();
|
|||
|
|
// powerConsumptionRank();
|
|||
|
|
|
|||
|
|
getDeviceMessage();
|
|||
|
|
getAllLampStatus();
|
|||
|
|
getSevenDayElectricity()
|
|||
|
|
getTwelveMonthElectricity()
|
|||
|
|
getElectricityOrderBy()
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
//控制管理
|
|||
|
|
function control(){
|
|||
|
|
var index = layer.open({
|
|||
|
|
title: ['媒体设定', 'color: #fff; cursor: move;background: transparent;float: left;'],
|
|||
|
|
type: 2,
|
|||
|
|
closeBtn: 2,
|
|||
|
|
content: '../../page/light/videoLightSecondaryPage.html',
|
|||
|
|
area: ["50%", "70%"],
|
|||
|
|
maxmin: false
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// window.open("http://192.168.0.110:81?user=LED001&pd=YTw4t2H9kHjpfzhokbZ%2BIT31th6xCBOyJtGWmgMxvsc3P%2BW4V7EikPFjaDMpoBTT0%2F%2BHxueI8KoJaLrwKsjO%2BNiWGGoGgb5VkD4hqMhczyUhNjVKr10L8Tcl9yw1U3CgGorKUdGyjB%2Fm8GZARuVNANd0LejaPmxrMTC%2BbGKNAf4%3D&path=/equipmentCorrelation");
|
|||
|
|
}
|
|||
|
|
function getDeviceMessage(){
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'POST',
|
|||
|
|
url: dataUrl + 'lamp/getDeviceMessage',
|
|||
|
|
data: "",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (data) {
|
|||
|
|
dome(data.obj);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
/**
|
|||
|
|
* 智慧路灯-七日用电量
|
|||
|
|
*/
|
|||
|
|
function getSevenDayElectricity() {
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'POST',
|
|||
|
|
url: dataUrl + 'lamp/getElectricityFromWeek',
|
|||
|
|
data: "",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (data) {
|
|||
|
|
sevenDayElectricityEcharts(data.obj);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function sevenDayElectricityEcharts(data){
|
|||
|
|
let sevenDayChart = echarts.init(document.getElementById('sevenDayElectricity'));
|
|||
|
|
const xSevenArray = data.map(item => item.date+"日");
|
|||
|
|
const ySevenArray = data.map(item => parseFloat( item.electricityUse).toFixed(3));
|
|||
|
|
const maxEntity = data.reduce((max, entity) => {
|
|||
|
|
return (entity.electricityUse > max.electricityUse) ? entity : max;
|
|||
|
|
});
|
|||
|
|
let options = {
|
|||
|
|
backgroundColor: "transparent",
|
|||
|
|
tooltip: { // 配置弹窗
|
|||
|
|
trigger: 'axis', // 触发类型为坐标轴触发
|
|||
|
|
axisPointer: { // 轴指示器配置
|
|||
|
|
type: 'shadow', // 影子指示器
|
|||
|
|
},
|
|||
|
|
formatter: function(params) {
|
|||
|
|
const date = params[0].name; // 获取日期
|
|||
|
|
const electricityUse = params[0].value; // 获取电量
|
|||
|
|
return `${date}<br/>电量使用: ${electricityUse} KW\h`;
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
data: xSevenArray,
|
|||
|
|
axisLine: {
|
|||
|
|
color: "#0177d4",
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
color: "#fff",
|
|||
|
|
fontSize: 14,
|
|||
|
|
// rotate: 45, // 旋转角度，帮助节省空间
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
name: "单位：KW\\h",
|
|||
|
|
nameTextStyle: {
|
|||
|
|
color: "#fff",
|
|||
|
|
fontSize: 14,
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: "#0177d4",
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
color: "#fff",
|
|||
|
|
fontSize: 14,
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true, // 显示分隔线
|
|||
|
|
lineStyle: {
|
|||
|
|
color: "#ffffff",
|
|||
|
|
type: 'dashed', // 设置为虚线
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
//interval: 10,
|
|||
|
|
max: Math.ceil(maxEntity.electricityUse),
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
type: "bar",
|
|||
|
|
barWidth: 18,
|
|||
|
|
itemStyle: {
|
|||
|
|
color: new echarts.graphic.LinearGradient(
|
|||
|
|
0,
|
|||
|
|
0,
|
|||
|
|
0,
|
|||
|
|
1,
|
|||
|
|
[
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: "#0eebe4",
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 0.8,
|
|||
|
|
color: "#058fe7",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
false
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
data: ySevenArray,
|
|||
|
|
label: {
|
|||
|
|
show: true,
|
|||
|
|
position: "top",
|
|||
|
|
formatter: "{c}",
|
|||
|
|
textStyle: {
|
|||
|
|
color: "#fff",
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
};
|
|||
|
|
sevenDayChart.setOption(options);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 智慧路灯-月总和年总用电量
|
|||
|
|
*/
|
|||
|
|
//年度用电情况接口数据获取
|
|||
|
|
function yearElect() {
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'POST',
|
|||
|
|
url: dataUrl + 'lamp/getElectricityCount',
|
|||
|
|
data: "",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function(res) {
|
|||
|
|
yearElects(res.obj)
|
|||
|
|
monthElects(res.obj)
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
function yearElects(data){
|
|||
|
|
let yearChart = echarts.init(document.getElementById('year-chart'));
|
|||
|
|
const payload = { id: 'liquid-fill-5', color: ['#1791ff', '#1791ff'], data: { data: Number(data.yearElectricity) } };
|
|||
|
|
const color = payload.color
|
|||
|
|
|
|||
|
|
yearOption = {
|
|||
|
|
backgroundColor: 'transparent',
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '水球图',
|
|||
|
|
type: 'liquidFill',
|
|||
|
|
radius: '95%',
|
|||
|
|
center: ['50%', '50%'],
|
|||
|
|
waveAnimation: 10, // 动画时长
|
|||
|
|
amplitude: 5, // 振幅
|
|||
|
|
data: [0.55, 0.45],
|
|||
|
|
itemStyle: {
|
|||
|
|
//渐变色设置
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: color[0]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: color[1]
|
|||
|
|
}
|
|||
|
|
])
|
|||
|
|
},
|
|||
|
|
color: {
|
|||
|
|
type: 'linear',
|
|||
|
|
x: 0,
|
|||
|
|
y: 0,
|
|||
|
|
x2: 1,
|
|||
|
|
y2: 1,
|
|||
|
|
colorStops: [
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: color[0]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: color[1]
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
globalCoord: false
|
|||
|
|
},
|
|||
|
|
outline: {
|
|||
|
|
show: true,
|
|||
|
|
borderDistance: 0,
|
|||
|
|
itemStyle: {
|
|||
|
|
borderWidth: 0,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
backgroundStyle: {
|
|||
|
|
color: '#001c22'
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
color: '#ffffff',
|
|||
|
|
insideColor: '#ffffff',
|
|||
|
|
fontSize: 18,
|
|||
|
|
lineHeight: 30,
|
|||
|
|
formatter: params => {
|
|||
|
|
|
|||
|
|
return parseFloat( data.yearElectricity).toFixed(3) + 'KW\\h' + '\n' + '年总用电量'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
}
|
|||
|
|
yearChart.setOption(yearOption);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function monthElects(data){
|
|||
|
|
let yearChart = echarts.init(document.getElementById('year-container'));
|
|||
|
|
const payload = { id: 'liquid-fill-5', color: ['#1791ff', '#1791ff'], data: { data: Number(data.monthElectricity) } };
|
|||
|
|
const color = payload.color
|
|||
|
|
|
|||
|
|
monthOption = {
|
|||
|
|
backgroundColor: 'transparent',
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '水球图',
|
|||
|
|
type: 'liquidFill',
|
|||
|
|
radius: '85%',
|
|||
|
|
center: ['50%', '50%'],
|
|||
|
|
waveAnimation: 10, // 动画时长
|
|||
|
|
amplitude: 5, // 振幅
|
|||
|
|
data: [0.55, 0.45],
|
|||
|
|
itemStyle: {
|
|||
|
|
//渐变色设置
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: color[0]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: color[1]
|
|||
|
|
}
|
|||
|
|
])
|
|||
|
|
},
|
|||
|
|
color: {
|
|||
|
|
type: 'linear',
|
|||
|
|
x: 0,
|
|||
|
|
y: 0,
|
|||
|
|
x2: 1,
|
|||
|
|
y2: 1,
|
|||
|
|
colorStops: [
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: color[0]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: color[1]
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
globalCoord: false
|
|||
|
|
},
|
|||
|
|
outline: {
|
|||
|
|
show: true,
|
|||
|
|
borderDistance: 0,
|
|||
|
|
itemStyle: {
|
|||
|
|
borderWidth: 0,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
backgroundStyle: {
|
|||
|
|
color: '#001c22'
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
color: '#ffffff',
|
|||
|
|
insideColor: '#ffffff',
|
|||
|
|
fontSize: 18,
|
|||
|
|
lineHeight: 30,
|
|||
|
|
formatter: params => {
|
|||
|
|
return parseFloat( data.monthElectricity).toFixed(3) + 'KW\\h' + '\n' + '月总用电量'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
}
|
|||
|
|
yearChart.setOption(monthOption);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 智慧路灯-近十二个月用电量
|
|||
|
|
*/
|
|||
|
|
function getTwelveMonthElectricity() {
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'POST',
|
|||
|
|
url: dataUrl + 'lamp/getElectricityFromMonth',
|
|||
|
|
data: "",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (data) {
|
|||
|
|
yearElectricityEcharts(data.obj);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
/**
|
|||
|
|
* 智慧路灯-近十二个月用电量
|
|||
|
|
*/
|
|||
|
|
function yearElectricityEcharts(res){
|
|||
|
|
let yearChart = echarts.init(document.getElementById('yearElectricity'));
|
|||
|
|
|
|||
|
|
const xMonthArray = res.map(item => item.date);
|
|||
|
|
const yMonthArray = res.map(item => parseFloat( item.electricityUse).toFixed(3));
|
|||
|
|
const maxEntity = res.reduce((max, entity) => {
|
|||
|
|
return (entity.electricityUse > max.electricityUse) ? entity : max;
|
|||
|
|
});
|
|||
|
|
let option = {
|
|||
|
|
backgroundColor: "transparent",
|
|||
|
|
tooltip: { // 配置弹窗
|
|||
|
|
trigger: 'axis', // 触发类型为坐标轴触发
|
|||
|
|
axisPointer: { // 轴指示器配置
|
|||
|
|
type: 'shadow', // 影子指示器
|
|||
|
|
},
|
|||
|
|
formatter: function(params) {
|
|||
|
|
const date = params[0].name; // 获取日期
|
|||
|
|
const electricityUse = params[0].value; // 获取电量
|
|||
|
|
return `${date}<br/>电量使用: ${electricityUse} KW\h`;
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
data: xMonthArray ,
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: "#0177d4",
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
color: "#fff",
|
|||
|
|
fontSize: 14,
|
|||
|
|
rotate: -45, // 旋转角度，帮助节省空间
|
|||
|
|
overflow: 'truncate', // 或者 'break'，根据需要选择
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
name: "单位：KW\\h",
|
|||
|
|
nameTextStyle: {
|
|||
|
|
color: "#fff",
|
|||
|
|
fontSize: 14,
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: "#0177d4",
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
color: "#fff",
|
|||
|
|
fontSize: 14,
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true, // 显示分隔线
|
|||
|
|
lineStyle: {
|
|||
|
|
color: "#ffffff",
|
|||
|
|
type: 'dashed', // 设置为虚线
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
//interval: 1000,
|
|||
|
|
max: Math.ceil(maxEntity.electricityUse),
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
type: "line",
|
|||
|
|
barWidth: 18,
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color: new echarts.graphic.LinearGradient(
|
|||
|
|
0,
|
|||
|
|
0,
|
|||
|
|
0,
|
|||
|
|
1,
|
|||
|
|
[
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: "#6b59f5",
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 0.8,
|
|||
|
|
color: "#05bfb5",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
false
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
data: yMonthArray,
|
|||
|
|
label: {
|
|||
|
|
normal: {
|
|||
|
|
show: true,
|
|||
|
|
position: "top",
|
|||
|
|
formatter: "{c}",
|
|||
|
|
textStyle: {
|
|||
|
|
color: "#fff",
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
};
|
|||
|
|
yearChart.setOption(option);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 智慧路灯-昨日用电排名
|
|||
|
|
*/
|
|||
|
|
function getElectricityOrderBy() {
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'POST',
|
|||
|
|
url: dataUrl + 'lamp/getElectricityOrderBy',
|
|||
|
|
data: "",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (res) {
|
|||
|
|
powerConsumptionRank(res.obj);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 智慧路灯-昨日用电排名
|
|||
|
|
*/
|
|||
|
|
function powerConsumptionRank(data){
|
|||
|
|
const myChart = echarts.init(document.getElementById('powerConsumptionRanking'));
|
|||
|
|
data.sort((a, b) => b.value - a.value);
|
|||
|
|
var datas = data;
|
|||
|
|
option = {
|
|||
|
|
backgroundColor: 'transparent',
|
|||
|
|
grid: {
|
|||
|
|
left: 30,
|
|||
|
|
right:10,
|
|||
|
|
bottom: 0,
|
|||
|
|
top:0,
|
|||
|
|
containLabel: true,
|
|||
|
|
},
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'item',
|
|||
|
|
axisPointer: {
|
|||
|
|
type: 'none',
|
|||
|
|
},
|
|||
|
|
formatter: function (params) {
|
|||
|
|
return params.data.name + ' : ' + parseFloat(params.data.value).toFixed(3);
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
show: false,
|
|||
|
|
type: 'value',
|
|||
|
|
},
|
|||
|
|
yAxis: [
|
|||
|
|
{
|
|||
|
|
type: 'category',
|
|||
|
|
inverse: true,
|
|||
|
|
axisLabel: {
|
|||
|
|
show: true,
|
|||
|
|
align: 'right',
|
|||
|
|
textStyle: {
|
|||
|
|
fontSize: 18,
|
|||
|
|
color: 'rgb(255,255,255)',
|
|||
|
|
rich: {
|
|||
|
|
name: {
|
|||
|
|
padding: [0,10,0,20],
|
|||
|
|
width:50,
|
|||
|
|
borderWidth:1,
|
|||
|
|
align: 'left',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
formatter: (name) => {
|
|||
|
|
var index = datas.map((item) => item.name).indexOf(name) + 1;
|
|||
|
|
return [
|
|||
|
|
'{' + 'index' + '|' +'NO.'+ index + '}',
|
|||
|
|
'{name|' + name + '}',
|
|||
|
|
].join('');
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: false,
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
show: false,
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false,
|
|||
|
|
},
|
|||
|
|
data: datas.map((item) => item.name),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
type:'category',
|
|||
|
|
inverse: true,
|
|||
|
|
axisLabel:{
|
|||
|
|
show:true,
|
|||
|
|
margin:30,//右侧y轴数字的外边距
|
|||
|
|
textStyle: {
|
|||
|
|
fontSize: 16,
|
|||
|
|
color: 'rgb(255,255,255)',
|
|||
|
|
},
|
|||
|
|
formatter: (value) => {
|
|||
|
|
return parseFloat( value).toFixed(3) +'KW\\h'
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: false,
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
show: false,
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false,
|
|||
|
|
},
|
|||
|
|
data: datas.map((item) => {
|
|||
|
|
return item.value
|
|||
|
|
}),
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '值',
|
|||
|
|
type: 'bar',
|
|||
|
|
zlevel: 1,
|
|||
|
|
showBackground: true,
|
|||
|
|
// 柱状条上方的白色线条
|
|||
|
|
label: {
|
|||
|
|
show: true,
|
|||
|
|
position: 'right', // 位置
|
|||
|
|
color: '#fff',
|
|||
|
|
fontSize: 14,
|
|||
|
|
fontWeight:'bold',
|
|||
|
|
distance: -1, // 字与条形图bar 的距离
|
|||
|
|
formatter: '|', // 这里是数据展示的时候显示的数据
|
|||
|
|
},
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: '#3cf0f1',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: '#67b1f5',
|
|||
|
|
},
|
|||
|
|
]),
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
barWidth: 14,
|
|||
|
|
data: data,
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
myChart.setOption(option);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function dome(data){
|
|||
|
|
const container = document.getElementById('centerContainer');
|
|||
|
|
let row = document.createElement('div');
|
|||
|
|
row.className = 'center_title';
|
|||
|
|
|
|||
|
|
data.forEach((item, index) => {
|
|||
|
|
if (index > 0 && index % 3 === 0) {
|
|||
|
|
container.appendChild(row);
|
|||
|
|
row = document.createElement('div');
|
|||
|
|
row.className = 'center_title';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const icon = document.createElement('div');
|
|||
|
|
icon.className = 'icon';
|
|||
|
|
if (item.type === '1') {
|
|||
|
|
icon.style.backgroundImage = `url(../../img/streeLamp/openButton.png)`;
|
|||
|
|
}else {
|
|||
|
|
icon.style.backgroundImage = `url(../../img/streeLamp/closeKey.png)`;
|
|||
|
|
}
|
|||
|
|
icon.onclick = () => {
|
|||
|
|
localStorage.setItem("id", item.id);
|
|||
|
|
var index = layer.open({
|
|||
|
|
title: ['设备', 'color: #fff; cursor: move;background: transparent;float: left;'],
|
|||
|
|
type: 2,
|
|||
|
|
closeBtn: 2,
|
|||
|
|
content: '../../page/light/streetLightSecondaryPage.html',
|
|||
|
|
area: ["50%", "70%"],
|
|||
|
|
maxmin: false
|
|||
|
|
});
|
|||
|
|
// window.parent.jump('', 17);
|
|||
|
|
};
|
|||
|
|
const nameSpan = document.createElement('span');
|
|||
|
|
nameSpan.className = 'icon_top';
|
|||
|
|
nameSpan.id = `streetLightName${item.id}`;
|
|||
|
|
nameSpan.textContent = item.lightName;
|
|||
|
|
|
|||
|
|
const typeSpan = document.createElement('span');
|
|||
|
|
typeSpan.className = 'icon_top1';
|
|||
|
|
typeSpan.id = `streetLightType${item.id}`;
|
|||
|
|
typeSpan.textContent = item.type ==='1'?"开启":"关闭";
|
|||
|
|
|
|||
|
|
icon.appendChild(nameSpan);
|
|||
|
|
icon.appendChild(typeSpan);
|
|||
|
|
row.appendChild(icon);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
container.appendChild(row);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getAllLampStatus() {
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'POST',
|
|||
|
|
url: dataUrl + 'lamp/getAllLampStatus',
|
|||
|
|
data: "",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function(res) {
|
|||
|
|
$("#online").text(res.obj.online);
|
|||
|
|
$("#offline").text(res.obj.offline);
|
|||
|
|
$("#total").text(res.obj.deviceTotal);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|