/**
|
* 企业用电量监测
|
*/
|
function ElectrictyMode(options) {
|
this.companys
|
this.showingSites = []
|
|
this.deviceName = {
|
'31011020210601': '废气净化装置',
|
'31011020210602': '产线风机',
|
'31011020210603': '产线喷漆房',
|
'31011020210604': '废气净化装置',
|
}
|
|
this.deviceCodes = ['31011020210601', '31011020210602', '31011020210603', '31011020210604']
|
this.cIds = [
|
['麦格纳汽车镜像(上海)有限公司', '15xCtnjxa9pfmDSj'],
|
['上海慧嵘五金有限公司', 'J3euwNl19WZvH7iE'],
|
]
|
|
this.historyMode = options.historyMode
|
this.timePicker = options.timePicker
|
}
|
|
ElectrictyMode.prototype = {
|
init: function () {
|
this.getStats()
|
this.dailyAnalysis()
|
},
|
enable: function () {
|
this.isEnable = true
|
this.uiChange(true)
|
|
// var k = Object.keys(this.companys)
|
// if (k[0] != undefined) {
|
// this.showData(this.companys[k[0]].code)
|
// }
|
|
if (this.electrictyUtil == undefined) {
|
var that = this
|
this.electrictyUtil = new ElectrictyUtil({
|
lineChart: that.historyMode.lineChart,
|
chartSlider: that.historyMode.slider,
|
pageSize: that.historyMode.pageSize
|
})
|
}
|
this.electrictyUtil.init()
|
},
|
disable: function () {
|
this.isEnable = false
|
this.uiChange(false)
|
|
Object.keys(this.companys).forEach(k => {
|
this._hideSite(this.companys[k].code)
|
});
|
},
|
deviceStatus: function (code, data) {
|
var t = 0
|
var c = data.length
|
data.forEach(d => {
|
t += d
|
});
|
var ave = c == 0 ? 0 : t / c
|
|
var values = [1, 100]
|
var status = ['待机', '运行', '超负荷']
|
switch (code) {
|
case '31011020210601':
|
values = [1, 100]
|
status = ['待机', '运行', '超负荷']
|
break;
|
case '31011020210602':
|
values = [13, 30]
|
status = ['待机', '运行', '超负荷']
|
break;
|
case '31011020210603':
|
values = [1, 50, 80]
|
status = ['待机', '低负荷运行', '运行', '超负荷']
|
break;
|
case '31011020210604':
|
values = [15, 90, 125]
|
status = ['待机', '低负荷运行', '运行', '超负荷']
|
break;
|
default:
|
values = [1, 100]
|
break;
|
}
|
for (let i = 0; i < values.length; i++) {
|
const v = values[i];
|
if (ave < v) {
|
return status[i]
|
}
|
}
|
return status[status.length - 1]
|
},
|
getStats: function () {
|
this.companys = {
|
'15xCtnjxa9pfmDSj': {
|
name: '麦格纳汽车镜像(上海)有限公司',
|
code: '15xCtnjxa9pfmDSj',
|
company: {
|
|
},
|
show: false,
|
data: '',
|
location: [0, 0],
|
// 地图标记点
|
marker: '',
|
// 标记点信息窗体
|
infoWindow: ''
|
},
|
'J3euwNl19WZvH7iE': {
|
name: '上海慧嵘五金有限公司',
|
code: 'J3euwNl19WZvH7iE',
|
company: {
|
|
},
|
show: false,
|
data: '',
|
location: [0, 0],
|
// 地图标记点
|
marker: '',
|
// 标记点信息窗体
|
infoWindow: ''
|
},
|
}
|
|
var that = this
|
|
var group = $('#electricity_sites')
|
group.empty()
|
Object.keys(this.companys).forEach(k => {
|
var s = this.companys[k]
|
var d1 = $('<div class="form-check"></div>')
|
var check = $('<input type="checkbox" class="form-check-input">')
|
check.attr('id', s.code)
|
check.attr('value', s.code)
|
check.on('click', function () {
|
var code = $(this).val()
|
that.showData(code)
|
})
|
var label = $('<label class="form-check-label">')
|
label.attr('for', s.code)
|
label.text(s.name)
|
d1.append(check)
|
d1.append(label)
|
|
group.append(d1)
|
});
|
},
|
fetchingData: function (cId, callback) {
|
var that = this
|
HttpService.getCompany(cId, function (company) {
|
HttpService.getElectricData(company.ciGuid, function (data) {
|
that.parseData(company, data, callback)
|
})
|
})
|
},
|
parseData: function (company, data, callback) {
|
var site = this.companys[company.ciGuid]
|
site.company = company
|
site.data = data
|
if (site.marker === '') {
|
site.infoWindow = new AMap.InfoWindow({
|
isCustom: true, //使用自定义窗体
|
content: this.createInfoWindow(site),
|
offset: new AMap.Pixel(16, -45)
|
})
|
site.location = [company.ciLongitude, company.ciLatitude]
|
MapUtil.convertFromGPS([site.location], function (result) {
|
site.marker = new AMap.Marker({
|
position: new AMap.LngLat(...result[0]), // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9]
|
title: site.name,
|
content: '<div><img src="./asset/mipmap/company.png" /><div class="marker-content">' + site.name + '</div></div>',
|
// icon: "./asset/mipmap/location.png",
|
animation: "AMAP_ANIMATION_DROP"
|
});
|
|
//鼠标点击marker弹出自定义的信息窗体
|
AMap.event.addListener(site.marker, 'click', function () {
|
site.infoWindow.open(MapUtil._map, site.marker.getPosition());
|
});
|
|
if (callback != undefined) {
|
callback()
|
}
|
})
|
} else {
|
site.infoWindow.setContent(this.createInfoWindow(site))
|
if (callback != undefined) {
|
callback()
|
}
|
}
|
},
|
showData: function (...deviceCodes) {
|
deviceCodes.forEach(d => {
|
if (this._isSiteShowing(d)) {
|
this._hideSite(d)
|
} else {
|
this._showSite(d)
|
}
|
})
|
},
|
_isSiteShowing: function (dCode) {
|
return this.showingSites.indexOf(dCode) != -1
|
},
|
_hideSite: function (dCode) {
|
$('#'+ dCode).attr('checked', false)
|
var site = this.companys[dCode]
|
var m = site.marker
|
MapUtil.removeViews(m)
|
|
var info = site.infoWindow
|
if (info != "") {
|
info.close()
|
var i = this.showingSites.indexOf(dCode)
|
this.showingSites.splice(i, 1)
|
}
|
},
|
_showSite: function (dCode) {
|
$('#'+ dCode).attr('checked', true)
|
var that = this
|
var site = this.companys[dCode]
|
if (site.marker == '') {
|
this.fetchingData(site.code, function () {
|
that._siteShow(dCode)
|
})
|
} else {
|
this._siteShow(dCode)
|
}
|
},
|
_siteShow: function (dCode) {
|
var site = this.companys[dCode]
|
var m = site.marker
|
MapUtil.addViews(m)
|
|
var info = site.infoWindow
|
info.open(MapUtil._map, m.getPosition());
|
|
this.showingSites.push(dCode)
|
},
|
|
/**
|
* 站点标记信息窗体
|
*/
|
createInfoWindow: function (site) {
|
var that = this
|
//实例化信息窗体
|
var title = '<div class="margin-left-8">' + site.name + '</div>' + '<div class="margin-left-8">经营地址:' + site.company.ciAddress + '</div>',
|
contents = ''
|
|
site.data.forEach(d => {
|
var content = '<div class="margin-left-8">',
|
tag = ''
|
tag += "<div class='time-2'>" + moment(d.mvDataTime).format('YYYY-MM-DD HH:mm:ss') + "</div>"
|
|
// 遍历站点数据中的每一项监测因子,生成页面
|
content += `<div>${this.deviceName[d.mvStatCode]}</div>`
|
|
content += "<table class='text-table-2'>"
|
content += "<tr class=''>"
|
content += "<td>" + "编号" + "</td>"
|
content += "<td>" + ': ' + "</td>"
|
content += "<td>" + d.mvStatCode + "</td>"
|
content += "</tr>"
|
content += "<tr class=''>"
|
content += "<td>" + "状态" + "</td>"
|
content += "<td>" + ': ' + "</td>"
|
content += "<td>" + this.deviceStatus(d.mvStatCode, [d.mvElectricityA, d.mvElectricityB, d.mvElectricityC]) + "</td>"
|
content += "</tr>"
|
content += "</table>"
|
|
content += "<table class='text-table margin-top'>"
|
content += "<tr class=''>"
|
content += "<td>" + "A相" + "</td>"
|
content += "<td>" + ': ' + "</td>"
|
content += "<td>" + d.mvElectricityA + "</td>"
|
content += "</tr>"
|
content += "<tr class=''>"
|
content += "<td>" + "B相" + "</td>"
|
content += "<td>" + ': ' + "</td>"
|
content += "<td>" + d.mvElectricityB + "</td>"
|
content += "</tr>"
|
content += "<tr class=''>"
|
content += "<td>" + "C相" + "</td>"
|
content += "<td>" + ': ' + "</td>"
|
content += "<td>" + d.mvElectricityC + "</td>"
|
content += "</tr>"
|
content += "</table>"
|
|
content += tag
|
|
content += '</div>'
|
|
contents += content
|
})
|
|
var info = document.createElement("div");
|
// info.className = "custom-info input-card content-window-card";
|
info.className = "flexbox-col";
|
|
//可以通过下面的方式修改自定义窗体的宽高
|
//info.style.width = "400px";
|
// 定义顶部标题
|
var top = document.createElement("div");
|
// top.className = "info-top";
|
top.className = "ff-content ff-content-top-left ff-content-small-borderless-t info-top";
|
var top_b = document.createElement("div");
|
top_b.className = "ff-border-bottom"
|
var top_t = document.createElement("div");
|
top_t.className = "ff-border-top"
|
var top_c = document.createElement("div");
|
top_c.className = "ff-border-content flexbox flex-space-between"
|
|
|
var titleD = document.createElement("div");
|
var closeX = document.createElement("i");
|
titleD.innerHTML = title;
|
closeX.className = "fa fa-times"
|
$(closeX).attr('aria-hidden', 'true')
|
closeX.onclick = function () {
|
that.closeInfoWindow(site);
|
}
|
|
top_c.appendChild(titleD);
|
top_c.appendChild(closeX);
|
|
top_t.appendChild(top_c)
|
top.appendChild(top_b)
|
top.appendChild(top_t)
|
|
info.appendChild(top);
|
|
// 定义中部内容
|
var refreshV = document.createElement("div");
|
refreshV.className = 'refresh-btn'
|
var refresh = document.createElement("i");
|
refresh.className = 'fa fa-refresh'
|
$(refresh).attr('aria-hidden', 'true')
|
$(refresh).css('color', '#ffffffc0')
|
$(refresh).css('cursor', 'pointer')
|
refresh.onclick = function () {
|
$(this).addClass('fa-spin')
|
that.fetchingData(site.code, function () {
|
setTimeout(() => {
|
$(this).removeClass('fa-spin')
|
}, 1000);
|
}.bind(this))
|
}
|
var m_top = document.createElement("div");
|
m_top.className = "ff-content ff-content-left ff-content-medium";
|
var m_top_b = document.createElement("div");
|
m_top_b.className = "ff-border-bottom"
|
var m_top_t = document.createElement("div");
|
m_top_t.className = "ff-border-top"
|
var m_top_c = document.createElement("div");
|
m_top_c.className = "ff-border-content"
|
var m_top_f = document.createElement("div");
|
m_top_f.className = "ff-footer flexbox-col flex-center"
|
var m_top_tr = document.createElement("div");
|
m_top_tr.className = "ff-triangle"
|
var m_top_trb = document.createElement("div");
|
m_top_trb.className = "ff-triangle-border"
|
|
refreshV.appendChild(refresh)
|
m_top_c.appendChild(refreshV);
|
|
var middle = document.createElement("div");
|
middle.className = "info-middle flexbox align-items flex-space-between";
|
middle.innerHTML = contents;
|
// m_top_f.innerHTML = tag
|
|
m_top_c.appendChild(middle);
|
|
m_top_t.appendChild(m_top_c)
|
m_top_tr.appendChild(m_top_trb)
|
|
m_top.appendChild(m_top_b)
|
m_top.appendChild(m_top_t)
|
m_top.appendChild(m_top_f)
|
m_top.appendChild(m_top_tr)
|
|
info.appendChild(m_top);
|
|
|
// 定义底部内容
|
var bottom = document.createElement("div");
|
bottom.className = "info-bottom";
|
bottom.style.position = 'relative';
|
bottom.style.top = '0px';
|
bottom.style.margin = '0 auto';
|
var sharp = document.createElement("img");
|
sharp.src = "https://webapi.amap.com/images/sharp.png";
|
bottom.appendChild(sharp);
|
info.appendChild(bottom);
|
return info;
|
},
|
closeInfoWindow: function (site) {
|
site.infoWindow.close()
|
},
|
|
/**
|
* UI显示隐藏变化
|
*/
|
uiChange: function (isShow) {
|
// var g = $('#btn_electricity')
|
// g.addClass('btn-unselected')
|
if (isShow) {
|
this.historyMode.setFactorMode('type3')
|
|
setTimeout(() => {
|
// g.removeClass()
|
// g.addClass('btn-selected margin-left-8')
|
$('#elec_model').show();
|
$('#electrcity_status_box').show();
|
|
$('#historybox').slideDown("fast")
|
$('#history_table_box').slideDown("fast")
|
$('#searchbox').slideDown("fast")
|
|
$('#table_title').html(" 监<br>测<br>数<br>据<br>详<br>情")
|
|
this.searchBox()
|
}, 500)
|
} else {
|
// DataUtil.hideAll()
|
$('#electrcity_status_box').hide();
|
$('#elec_model').hide();
|
}
|
},
|
/**
|
* 搜索框重新初始化
|
*/
|
searchBox: function () {
|
|
var that = this
|
|
$('.hMode').hide()
|
|
var tD = $('#select_device_code')
|
tD.empty()
|
var options2 = this.cIds
|
var op = $('<option></option>')
|
options2.forEach(element => {
|
var op = $('<option></option>')
|
op.html(element[0])
|
op.attr('value', element[1])
|
tD.append(op)
|
});
|
|
$('#btn_search').off()
|
$('#btn_search').on('click', function () {
|
var deviceCode = $('#select_device_code').val()
|
var startTime = $('#starttime_text').text()
|
var endTime = $('#endtime_text').text()
|
|
DataUtil.toggleLoading()
|
that.getHistoryData(deviceCode, startTime, endTime, 1, undefined, true)
|
})
|
|
DataUtil.toggleLoading()
|
this.getHistoryData('15xCtnjxa9pfmDSj', undefined, undefined, 1, 100, true)
|
},
|
getRealtimeData: function () {
|
var that = this
|
DataUtil.toggleLoading()
|
HttpService.getLatestMinuteData("31011020210603", 100, function (data) {
|
DataUtil.toggleLoading()
|
if (data.length == 0) {
|
alert("数据库没有任何数据")
|
return
|
}
|
var code = data[0].deviceCode
|
var factorMode = DataUtil.refreshFactorMode(code)
|
|
$('#starttime_text').text(data[0].time)
|
$('#endtime_text').text(data[data.length - 1].time)
|
that.timePicker.setStartDate(data[0].time)
|
that.timePicker.setEndDate(data[data.length - 1].time)
|
|
// that.historyMode.setFactorData(data, factorMode, true)
|
|
MapUtil.clear3D()
|
// that._showSite("0d0000000001")
|
})
|
},
|
getHistoryData: function (cId, startTime, endTime, page, perPage, loading) {
|
var that = this
|
if (perPage == undefined) {
|
perPage = 10000
|
}
|
HttpService.getElectricityInfo(cId, startTime, endTime, page, perPage, function (data) {
|
if (loading) {
|
DataUtil.toggleLoading(false)
|
}
|
if (data.length == 0) {
|
alert('未查询到数据')
|
return
|
}
|
$('#starttime_text').text(data[0].time + ':00')
|
$('#endtime_text').text(data[data.length - 1].time + ':00')
|
timePicker.setStartDate(data[0].time)
|
timePicker.setEndDate(data[data.length - 1].time)
|
// var factorMode = DataUtil.refreshFactorMode(deviceCode)
|
|
that.showData(cId)
|
that.electrictyUtil.setData(data)
|
var type = 0
|
if (cId == '15xCtnjxa9pfmDSj') {
|
type = 0
|
} else if (cId == 'J3euwNl19WZvH7iE'){
|
type = 1
|
}
|
that.electrictyUtil.refreshChartCheckBox(type)
|
that.electrictyUtil.refreshChart()
|
// that.historyMode.initTable("type3")
|
that.electrictyUtil.refreshTable()
|
})
|
},
|
|
setPage: function(pageSize) {
|
this.electrictyUtil.setPage(pageSize)
|
},
|
|
dailyAnalysis () {
|
var that = this
|
// 下拉框
|
var tD = $('#elec_company')
|
tD.empty()
|
var options2 = this.cIds
|
options2.forEach(element => {
|
var op = $('<option></option>')
|
op.html(element[0])
|
op.attr('value', element[1])
|
tD.append(op)
|
});
|
// 日期选择
|
this.timePicker = DPicker.timePicker(
|
'elec_date',
|
function (startTime, endTime) {
|
$('#elec_starttime_text').text(startTime);
|
$('#elec_endtime_text').text(endTime);
|
}
|
);
|
var m = moment();
|
m.hour(0)
|
m.minute(0)
|
m.second(0)
|
var now = m.format('YYYY-MM-DD HH:mm:ss');
|
var hourago = m.add(-1, 'days').format('YYYY-MM-DD HH:mm:ss');
|
$('#elec_starttime_text').text(hourago);
|
$('#elec_endtime_text').text(now);
|
this.timePicker.setStartDate(hourago);
|
this.timePicker.setEndDate(now);
|
// 查询结果
|
$('#btn_search_elec').on('click', function () {
|
var deviceCode = $('#elec_company').val()
|
var startTime = $('#elec_starttime_text').text()
|
var endTime = $('#elec_endtime_text').text()
|
|
DataUtil.toggleLoading()
|
HttpService.dailyStatistics(deviceCode, startTime, endTime, function (data) {
|
DataUtil.toggleLoading()
|
$('#analysis_result').empty()
|
var text = '<table class="border-table small"><tr class="tr-head">'
|
+ '<th>日期</th>'
|
+ '<th>运行时间差(分)</th>'
|
+ '<th>设备开启合规</th>'
|
+ '<th>关闭时间差(分)</th>'
|
+ '<th>设备关闭合规</th>'
|
+ '<th>运行时长(分)</th>'
|
+ '<th>运行过程合规</th>'
|
+ '</tr>'
|
data.forEach(d => {
|
text += `<tr class="tr-content">
|
<td>${d.day}</td>
|
<td>${d.rtimeDiff}</td>
|
<td>${d.sresult ? '合规' : '不合规'}</td>
|
<td>${d.etimeDiff}</td>
|
<td>${d.eresult ? '合规' : '不合规'}</td>
|
<td>${d.runningTimeDiff}</td>
|
<td>${d.rresult ? '合规' : '不合规'}</td>
|
</tr>`
|
});
|
text += '</table>'
|
$('#analysis_result').html(text)
|
})
|
});
|
}
|
}
|