import * as echarts from '../../components/ec-canvas/echarts'; import constant from '../../utils/constant.js'; var Constant = require('../../utils/constant.js'); var util = require('../../utils/util.js'); import Request from "../../utils/api" var app = getApp(); var g_pointParas = {}; var g_refreshTime = 120; var g_realTimeChartRecords = []; var barec1 = null; var barec2 = null; Page({ data: { ec1: { onInit: function (canvas, width, height, dpr) { barec1 = echarts.init(canvas, null, { width: width, height: height, devicePixelRatio: dpr }); canvas.setChart(barec1); return barec1; } }, ec2: { onInit: function (canvas, width, height, dpr) { barec2 = echarts.init(canvas, null, { width: width, height: height, devicePixelRatio: dpr }); canvas.setChart(barec2); return barec2; } }, Fixed: { ec1: { refresh: "onTapRefresh", interval: "onTapInterval" }, ec2: { refresh: "onTapRefreshHistory", interval: "onTapIntervalHistory" }, }, tabBar: [{ index: 0, iconPath: "icon-shebeijiance-dianji", selectedIconPath: "icon-shebeijiance-dianji blue", text: "监控" }, { index: 1, iconPath: "icon-lishi2", selectedIconPath: "icon-lishi2 blue", text: "历史" }, { index: 2, iconPath: "icon-guzhang2", selectedIconPath: "icon-guzhang2 blue", text: "警报" } ], loadingInfo: "加载中,请稍等...", loadingHidden: false, realChartWidth: 100, realChartHeight: 100, historyChartWidth: 100, historyChartHeight: 200, today: util.formatDay(new Date()), yestday: util.formatDay(util.GetNextDate(new Date(), -1)), historyDate: util.formatDay(util.GetNextDate(new Date(), -1)), isNextDayAble: false, //是否可以点击下一天 pointID: 0, pointName:"", pointUnit:"", pointParas: null, historyChart: null, realTimeChart: null, isInitialHistoryData: false, //是否初始化过历史记录 isInitialAlarmData: false, //是否初始化警报记录 lastRefreshTime: g_refreshTime, //秒 currentTabIndex: 0, hasAlarmData: false, isChecked: false, //switch选中状态 ---是否显示报警点 alarmListInfo: [], currentRecordParas: {}, scrollOneId: '', //实时监控数据列表对应的列表子项id scrollTwoId: '', //历史监控数据列表对应的列表子项id startAlarmDate: util.formatDay(util.GetBeforeDate(7)), endAlarmDate: util.formatDay(new Date()), PageIndex: 1, //初始化页数 PageSize: 20, //初始化条数 message: '未发生报警', bottomStatus: false, isShowFloatMenu: false, //是否显示 animationFloatMenu: '', //显示动画 scrollHeight: wx.getSystemInfoSync().windowHeight, scrollTop: 0, historyScrollTop: 0, ishidden: false, monitorList: [], //监测页面列表 historyStatus: false, real_time_records: [], //存放实时的监控点 monitorAlam: [], //存放监测界面 -- 所有报警点的监控值 history_records:[],//存放历史的监控点 historyAlam: [], //存放历史界面 -- 所有报警点的监控值 isMonitorChange: false, //监测界面 --- 是否启用状态筛选 isHistoryChange: false, //历史界面 --- 是否启用状态筛选 currentCorpID:1, }, /**生命周期函数--监听页面加载*/ onLoad: function (options) { var pointid = options.id; console.log('打印point', options); wx.setNavigationBarTitle({ //自定义顶部页面标题 title: options.name }) if (pointid == null) { return; } var chartWidth = app.getWindowWidth(); //console.log(app.getWindowWidth()) this.setData({ currentCorpID:options.corpID, pointID: pointid, pointName:options.name, pointUnit:options.unit, realChartWidth: app.globalData.screenSize.width, realChartHeight: app.globalData.screenSize.height * 1.5 - 120, historyChartWidth: app.globalData.screenSize.width, historyChartHeight: app.globalData.screenSize.height * 2.5 - 50, }); }, //初始化数据(实时数据) initialRealTimeRecord: function () { var that = this; that.setData({ loadingHidden: false, loadingInfo: "数据请求中,请稍等..." }); //console.log(Constant.BASE_SERVER_URL + "Monitor/GeneralRecord/GetDayRecordBySingle") //console.log(that.data.pointID, util.formatDay(new Date())) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorRealRecord/Mobile/GetByMonitorPointIDOfDay@V1.0", method: 'GET', data: { CorpID:that.data.currentCorpID, MonitorPointID : that.data.pointID, Day: util.formatDay(new Date()) }, header: { 'content-type': 'application/json' }, fail: function (err) { //请求失败 util.popup.showModal('', '通讯失败'); return; }, complete: function () { //请求完成后执行的函数 that.setData({ loadingHidden: true }); }, success: function (res) { var result = res.data; // console.log('195行', result); if (result.Code != 0) { wx.showModal({ title: '', content: result.Message, }); return; } var real_time_records = result.Data; let chartData = [] // console.log(real_time_records,189) real_time_records.forEach(element => { if(element.DataStatus.length == 0){ chartData.push(element) } }); // console.log(real_time_records, 213) if (real_time_records == null || real_time_records.length == 0) { util.popup.showModal('', '未开启监控'); return; } var last_record = real_time_records[real_time_records.length - 1]; last_record.DataValue = parseFloat(last_record.DataValue).toFixed(2) // console.log(last_record); //获取监控当天的监控指及状态 var monitorList = [] for (var i = 0; i < real_time_records.length; i++) { real_time_records[i].DataStatusText = DataStatusTextEmun(real_time_records[i].DataStatus[0]) var monitor = { id: real_time_records[i].SignalID, RecordValue: parseFloat(real_time_records[i].DataValue).toFixed(2), RecordStatus: real_time_records[i].DataStatus, RecordStatusText:real_time_records[i].DataStatusText, RecordTime: util.functions.sub(real_time_records[i].DataTime, 11, 16), } monitorList.push(monitor) } // console.log(monitorList,"monitorList") var alarm_number = 0; for (var i = 0; i < real_time_records.length; i++) { // 循环获取报警次数 var record = real_time_records[i]; if (record.DataStatus[0] == "BJ") { alarm_number++; } } // console.log(monitorList,241) that.setData({ loadingHidden: true, real_time_records: real_time_records, monitorList: monitorList.reverse(), currentRecordParas: { HistoryRecordValue: '', RecordValue: parseFloat(last_record.DataValue).toFixed(2), RecordTime: util.functions.sub(last_record.DataTime, 0, 10), RecordStatus: last_record.DataStatus, RecordStatusName: alarm_number > 0 ? "报警" : "正常", AlarmNumber: alarm_number } }); //判断是否有报警点，如果有则显示在图表上 var realAlarmPoint = [] for (let r = 0; r < real_time_records.length; r++) { if (real_time_records[r].DataStatus[0] == "BJ") { real_time_records[r].DataTime = real_time_records[r].DataTime.replace(/-/gi, '/') var real_alarm_point = { value: '', coord: [real_time_records[r].DataTime, real_time_records[r].DataValue], itemStyle: { color: '#ff0000' } } realAlarmPoint.push(real_alarm_point) } } g_realTimeChartRecords = TransChartRecordPoint(chartData); if (barec1 == null) { util.popup.showModal('图表提示', '图表加载错误，请点击刷新重试') return; } barec1.setOption({ color: ["#37A2DA"], legend: { // data: [g_pointParas.RecordName + '/' + g_pointParas.UnitName], top: 0, left: 'center', z: 100 }, grid: { containLabel: true, top: 30, left: 15, right: 20, }, tooltip: { show: true, trigger: 'axis', formatter: function (params) { // console.log('479', params); let pointTime = 'T' + params[0].axisValueLabel.slice(0, 5) that.setData({ scrollOneId: pointTime, nowDayMonitorTime: params[0].axisValueLabel.slice(0, 5) }) // console.log(pointTime) // that.filterMonitorList(pointTime) return '时间：' + util.functions.sub(params[0].value[0], 11, 16) + '\n' + "实时值：" + params[0].value[1]; }, }, xAxis: { type: 'time', min: function (value) { //设置X轴的最小刻度 let minTime = new Date().setHours(0,0,0,0) return minTime; }, max: function (value) { //设置X轴的最大刻度 let maxTime = new Date().setHours(23,59,59,0) return maxTime; }, boundaryGap: false, axisLabel: { formatter: function (v, index) { var date = new Date(v); return util.formatTimeUtil("hh:mm",date); } }, }, yAxis: { x: 'center', type: 'value', splitLine: { lineStyle: { type: 'dashed' } }, // show: false }, dataZoom: [{ type: 'slider', //图表下方的伸缩条 show: true, //是否显示 realtime: true, // start: 0, //伸缩条开始位置（1-100），可以随时更改 end: 100, //伸缩条结束位置（1-100），可以随时更改 left: 10, right: 15, fillerColor: "rgba(22,181,203,0.4)", //选中范围的填充颜色。 borderColor: "#ddd", //边框颜色。 backgroundColor: "rgba(167,183,204,0.4)", //组件的背景颜色 throttle: 100, //设置触发视图刷新的频率。单位为毫秒（ms）。 handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%', // 控制手柄的尺寸，可以是像素大小，也可以是相对于 dataZoom 组件宽度的百分比，默认跟 dataZoom 宽度相同。 handleStyle: { color: '#16b5cb', shadowBlur: 3, // shadowBlur图片阴影模糊值，shadowColor阴影的颜色 shadowColor: '#77CCD8', shadowOffsetX: 1, shadowOffsetY: 1, opacity: 0.6, } }], series: [{ type: 'line', showSymbol: false, data: g_realTimeChartRecords, markPoint: { symbol: 'pin', symbolSize: 10, data: realAlarmPoint } }] }) // barec1.setOption({series:{markPoint:{data:}}}) //获取报警记录 var drawRefreshTimeText = that.data.lastRefreshTime + "s后刷新"; util.popup.showToast(drawRefreshTimeText, 'none', '', 2000) //定时器 var intervalRefreshTime = setInterval(function () { var lastRefreshTime = that.data.lastRefreshTime; lastRefreshTime = lastRefreshTime - 1; if (lastRefreshTime <= 0) { var drawRefreshTimeText = "刷新中"; util.popup.showToast(drawRefreshTimeText, 'none', '', 2000) lastRefreshTime = g_refreshTime; //更新数据 // console.log('马上刷新') that.refreshRealTimeValue(); } that.setData({ lastRefreshTime: lastRefreshTime }); }, 1000); that.setData({ intervalRefreshTime: intervalRefreshTime }); //获取报警记录 that.getAlarmRecord() return; } }); }, //获取当天的报警记录 getAlarmRecord(){ let that = this let real_time_records = this.data.real_time_records Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorAlarmRecord/Mobile/GetByMonitorPointIDOfDay@V1.0", method: 'GET', data: { CorpID:that.data.currentCorpID, MonitorPointID : that.data.pointID, Day: util.formatDay(new Date()) }, header: { 'content-type': 'application/json' }, success:(res)=>{ // console.log("报警记录",res) if(res.data.Data == null){ res.data.Data = [] }else { var monitorList = [] let result = res.data.Data for (let j = 0; j < result.length; j++) { let resultRecord = result[j] resultRecord.DataTime = resultRecord.DataTime.replace(/-/gi, '/') let resultRecordDataTime = new Date(resultRecord.DataTime).getTime() for (var i = 0; i < real_time_records.length; i++) { let realRecord = real_time_records[i] realRecord.DataTime = realRecord.DataTime.replace(/-/gi, '/') let realRecordDataTime = new Date(realRecord.DataTime).getTime() if(realRecordDataTime == resultRecordDataTime){ // realRecord.DataStatus.push('BJ') //BJ:报警 realRecord.DataStatus[0] = "BJ" realRecord.DataStatusText = DataStatusTextEmun(realRecord.DataStatus[0]) break; } } } // console.log(real_time_records,475) for (let index = 0; index < real_time_records.length; index++) { let element = real_time_records[index]; let monitorNode = { id:element.SignalID, RecordStatus:element.DataStatus, RecordStatusText:DataStatusTextEmun(element.DataStatus[0]), RecordTime:util.functions.sub(realRecord.DataTime, 11, 16), RecordValue:parseFloat(realRecord.DataValue).toFixed(2), } monitorList.push(monitorNode) } // console.log(monitorList,469) var alarm_number = 0; for (var i = 0; i < real_time_records.length; i++) { // 循环获取报警次数 var record = real_time_records[i]; if (record.DataStatus[0] == 'BJ') { alarm_number++; } } console.log(monitorList.reverse(),497) that.setData({ real_time_records: real_time_records, monitorList: monitorList.reverse(), "currentRecordParas.RecordStatusName":alarm_number > 0 ? "报警" : "正常", "currentRecordParas.AlarmNumber":alarm_number }); //判断是否有报警点，如果有则显示在图表上 var realAlarmPoint = [] for (let r = 0; r < real_time_records.length; r++) { if (real_time_records[r].DataStatus[0] == "BJ") { real_time_records[r].DataTime = real_time_records[r].DataTime.replace(/-/gi, '/') var real_alarm_point = { value: '', coord: [real_time_records[r].DataTime, real_time_records[r].DataValue], itemStyle: { color: '#ff0000' } } realAlarmPoint.push(real_alarm_point) } } barec1.setOption({series:{markPoint:{data:realAlarmPoint}}}) } }, fail:(err)=>{ } }) }, //刷新获取最近一条报警记录 refreshRealAlarmRecord(){ var that = this; var real_time_records = that.data.real_time_records that.setData({ loadingHidden: false, loadingInfo: "刷新中,请稍等..." }); //console.log(that.data.pointID) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorAlarmRecord/Mobile/GetLastRecordListByMonitorPointID@V1.0", method: 'GET', data: { CorpID : that.data.currentCorpID, MonitorPointID : that.data.pointID, }, header: { 'content-type': 'application/json' }, fail: function (err) { that.setData({ loadingHidden: true }); util.popup.showModal('', '通讯失败'); }, //请求失败 complete: function () { that.setData({ loadingHidden: true }); }, //请求完成后执行的函数 success: function (res) { var result = res.data; // console.log(result, '540行') if (result.Code != 0) { return; } var newAlarmRecords = result.Data; // console.log(newAlarmRecords, '356行') if (newAlarmRecords == null || newAlarmRecords.length == 0) return; var last_alarm_record = newAlarmRecords[0]; last_alarm_record.DataTime = last_alarm_record.DataTime.replace(/-/gi, '/') let last_recordTime = new Date(last_alarm_record.DataTime).getTime() var isAlarm = false; // 新数据与现有的数据的最后一条比对 for(let i = 0,length = real_time_records.length;i this.data.scrollHeight / 2) { this.setData({ isShowFloatMenu: true, animationFloatMenu: 'fadeIn' }) } else { this.setData({ isShowFloatMenu: false, animationFloatMenu: 'fadeOut' }) // setTimeout(() => {this.setData({visual: false})}, 1000) } }, //监控刷新 onTapRefresh() { //clearInterval(this.data.intervalRefreshTime); this.setData({ scrollOneId: '', nowDayMonitorTime: '', scrollTop: 0 }) this.refreshRealTimeValue(); }, //刷新实时值 refreshRealTimeValue: function () { var that = this; var real_time_records = that.data.real_time_records that.setData({ loadingHidden: false, loadingInfo: "刷新中,请稍等..." }); //console.log(that.data.pointID) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorRealRecord/Mobile/GetLastRecordByMonitorPointID@V1.0", method: 'GET', data: { CorpID : that.data.currentCorpID, MonitorPointID : that.data.pointID, }, header: { 'content-type': 'application/json' }, fail: function (err) { that.setData({ loadingHidden: true }); util.popup.showModal('', '通讯失败'); }, //请求失败 complete: function () { that.setData({ loadingHidden: true }); }, //请求完成后执行的函数 success: function (res) { var result = res.data; // console.log(result, '355行') if (result.Code != 0) { return; } var newRecords = result.Data; //console.log(newRecords, '356行') if (newRecords == null || newRecords.length == 0) return; var last_record = newRecords[0]; last_record.DataValue = parseFloat(last_record.DataValue).toFixed(2) last_record.DataTime = last_record.DataTime.replace(/-/gi, '/') if(last_record.DataStatus.length>0){ last_record.DataStatusText = DataStatusTextEmun(last_record.DataStatus[0]) } // 新数据与现有的数据的最后一条比对 let current_record = real_time_records[real_time_records.length - 1] current_record.DataTime = current_record.DataTime.replace(/-/gi, '/') let last_recordTime = new Date(last_record.DataTime).getTime() let curren_last_recordTime = new Date(current_record.DataTime).getTime() if(last_recordTime > curren_last_recordTime && last_record.DataValue != current_record.DataValue){ real_time_records.push(last_record) //添加最后一条数据 } var isAlarm = false; if (last_record.DataStatus[0] == "BJ" ) { isAlarm = true; } //获取监控当天的监控指及状态 var monitorList = [] for (var i = 0; i < real_time_records.length; i++) { // console.log(real_time_records[i],529) var monitor = { id: i, RecordValue: parseFloat(real_time_records[i].DataValue).toFixed(2), RecordStatus: real_time_records[i].DataStatus, RecordStatusText:DataStatusTextEmun(real_time_records[i].DataStatus[0]), RecordTime: util.functions.sub(real_time_records[i].DataTime, 11, 16) } monitorList.push(monitor) } that.setData({ loadingHidden: true, real_time_records: real_time_records, monitorList: monitorList.reverse(), currentRecordParas: { HistoryRecordValue: that.data.currentRecordParas.RecordValue, RecordValue: last_record.DataValue, RecordTime: util.functions.sub(last_record.DataTime, 0, 10), RecordStatus: last_record.DataStatus, RecordStatusName: isAlarm ? "报警" : "正常", AlarmNumber: isAlarm ? that.data.currentRecordParas.AlarmNumber + 1 : that.data.currentRecordParas.AlarmNumber } }); //判断是否有报警点，如果有则显示在图表上 var realRefreshAlarmPoint = [] for (let r = 0; r < that.data.real_time_records.length; r++) { that.data.real_time_records[r].DataTime = that.data.real_time_records[r].DataTime.replace(/-/gi, '/') if (that.data.real_time_records[r].DataStatus == "BJ") { var real_refresh_alarm_point = { value: '', coord: [that.data.real_time_records[r].DataTime, that.data.real_time_records[r].DataValue], itemStyle: { color: '#ff0000' } } realRefreshAlarmPoint.push(real_refresh_alarm_point) } } console.log(last_record,732) if(last_record.DataStatus.length>0){ return } var m_chartRecordList = TransChartRecordPoint([last_record]); g_realTimeChartRecords.push(m_chartRecordList[0]); // console.log(g_realTimeChartRecords,418) if (barec1 == null) { util.popup.showModal('图表提示', '图表加载错误，请点击刷新重试') return; } barec1.setOption({ color: ["#37A2DA"], legend: { // data: [g_pointParas.RecordName + '/' + g_pointParas.UnitName], top: 0, left: 'center', z: 100 }, grid: { containLabel: true, top: 30, left: 15, right: 20, }, tooltip: { show: true, trigger: 'axis', formatter: function (params) { // console.log('479', params); // let pointTime = 'T' + params[0].axisValueLabel.slice(0, 5) // that.setData({ // scrollOneId: pointTime, // nowDayMonitorTime: params[0].axisValueLabel.slice(0, 5) // }) return '时间：' + util.functions.sub(params[0].value[0], 11, 16) + '\n' + "实时值：" + params[0].value[1]; }, }, xAxis: { type: 'time', boundaryGap: false, min: function (value) { //设置X轴的最小刻度 let minTime = new Date().setHours(0,0,0,0) return minTime; }, max: function (value) { //设置X轴的最大刻度 let maxTime = new Date().setHours(23,59,59,0) return maxTime; }, axisLabel: { formatter: function (v, index) { var date = new Date(v); return util.formatTimeUtil("hh:mm",date); } }, }, yAxis: { x: 'center', type: 'value', splitLine: { lineStyle: { type: 'dashed' } } // show: false }, dataZoom: [{ type: 'slider', //图表下方的伸缩条 show: true, //是否显示 realtime: true, // start: 0, //伸缩条开始位置（1-100），可以随时更改 end: 100, //伸缩条结束位置（1-100），可以随时更改 left: 10, right: 15, fillerColor: "rgba(22,181,203,0.4)", //选中范围的填充颜色。 borderColor: "#ddd", //边框颜色。 backgroundColor: "rgba(167,183,204,0.4)", //组件的背景颜色 throttle: 100, //设置触发视图刷新的频率。单位为毫秒（ms）。 handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%', // 控制手柄的尺寸，可以是像素大小，也可以是相对于 dataZoom 组件宽度的百分比，默认跟 dataZoom 宽度相同。 handleStyle: { color: '#16b5cb', shadowBlur: 3, // shadowBlur图片阴影模糊值，shadowColor阴影的颜色 shadowColor: '#77CCD8', shadowOffsetX: 1, shadowOffsetY: 1, opacity: 0.6, } }], series: [{ type: 'line', showSymbol: false, // smooth: true, // name: g_pointParas.RecordName + '/' + g_pointParas.UnitName, data: g_realTimeChartRecords, markPoint: { symbol: 'pin', symbolSize: 10, data: realRefreshAlarmPoint } }] }) that.refreshRealAlarmRecord() return; } }); }, //监测界面---是否展示报警点 isShowPoint: function (e) { var that = this let real_time_records = that.data.real_time_records g_realTimeChartRecords = TransChartRecordPoint(real_time_records); // console.log(e.detail.value) let status = e.detail.value if (status == true) { barec1.setOption({ series: [{ type: 'line', showSymbol: false, // smooth: true, // name: g_pointParas.RecordName + '/' + g_pointParas.UnitName, data: g_realTimeChartRecords, markPoint: { symbol: 'pin', symbolSize: 10, data: "" } }] }) } else { //判断是否有报警点，如果有则显示在图表上 let realAlarmPoint = [] for (let r = 0; r < real_time_records.length; r++) { real_time_records[r].DataTime = real_time_records[r].DataTime.replace(/-/gi, '/') if (real_time_records[r].DataStatus.length > 0) { let real_alarm_point = { value: '', coord: [real_time_records[r].DataTime, real_time_records[r].DataValue], itemStyle: { color: '#ff0000' } } realAlarmPoint.push(real_alarm_point) } } barec1.setOption({ series: [{ type: 'line', showSymbol: false, // smooth: true, // name: g_pointParas.RecordName + '/' + g_pointParas.UnitName, data: g_realTimeChartRecords, markPoint: { symbol: 'pin', symbolSize: 10, data: realAlarmPoint } }] }) } }, bindStartAlarmDateChange: function (e) { this.setData({ startAlarmDate: e.detail.value }) }, bindEndAlarmDateChange: function (e) { this.setData({ endAlarmDate: e.detail.value }) }, //底部导航栏切换 tapTab: function (e) { var selIndex = e.currentTarget.dataset.index; var that = this; this.setData({ currentTabIndex: selIndex }); if (selIndex == 0) { setTimeout(function () { that.refreshRealTimeValue() }, 1000) } if (selIndex == 1) { //当选中的下标为1的时候修改图表配置 setTimeout(function () { that.getHistoryData() }, 500) } if (selIndex == 2 && !this.data.isInitialAlarmData) { //当选中的下标为2的时候展示报警列表 this.setData({ loadingHidden: false, isInitialAlarmData: true }) that.getAlarmData(); //调用警报 } }, //选择日期 tapChangeHistoryDay: function (e) { var isNextDayAble = true; if (e.detail.value == this.data.yestday) { isNextDayAble = false; } this.setData({ historyDate: e.detail.value, isNextDayAble: isNextDayAble }) this.getHistoryData(); }, // 上一天 lastHistoryDay: function () { this.setData({ historyDate: util.formatDay(util.GetNextDate(this.data.historyDate, -1)), isNextDayAble: true, isHistoryChange: false }); this.getHistoryData(); }, //下一天 nextHistoryDay: function () { var day = util.formatDay(util.GetNextDate(this.data.historyDate, 1)); var isNextDayAble = true; if (day == this.data.yestday) { isNextDayAble = false; } this.setData({ historyDate: day, isNextDayAble: isNextDayAble, isHistoryChange: false }); this.getHistoryData(); }, //历史数据 getHistoryData: function () { var that = this; that.setData({ loadingHidden: false, loadingInfo: "数据请求中,请稍等..." }); //console.log(that.data.pointID, that.data.historyDate) //console.log(Constant.BASE_SERVER_URL + "Monitor/GeneralRecord/GetDayRecordBySingle") //return; Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorRealRecord/Mobile/GetByMonitorPointIDOfDay@V1.0", method: 'GET', data: { CorpID: that.data.currentCorpID, MonitorPointID : that.data.pointID, Day: that.data.historyDate }, header: { 'content-type': 'application/json' }, fail: function (err) { //util.popup.showModal('', '通讯失败'); }, //请求失败 complete: function () { that.setData({ loadingHidden: true }); }, //请求完成后执行的函数 success: function (res) { var result = res.data; // console.log("历史数据",result) if (result.Code != 0) { wx.showModal({ title: '', content: result.Message, }); return; } var history_records = result.Data; if (history_records == null || history_records.length == 0) { wx.showModal({ title: '', content: "当前日期,没有获取到监控值", }); barec2.setOption({series:{ data:"" }}) that.setData({ recordsHistory: [] }) return; } var recordsHistoryList = []; var alamPointList = []; let historyChartPoint = [] for (var i = 0; i < history_records.length; i++) { history_records[i].DataTime = history_records[i].DataTime.replace(/-/gi, '/') var rec = { RecordValue: history_records[i].DataValue, RecordStatus: history_records[i].DataStatus, RecordStatusText:DataStatusTextEmun(history_records[i].DataStatus[0]), RecordTime: util.functions.sub(history_records[i].DataTime, 11, 16) } recordsHistoryList.push(rec) if (history_records[i].DataStatus[0] == "BJ") { var alarm_point = { value: '', coord: [history_records[i].DataTime, history_records[i].DataValue], itemStyle: { color: '#ff0000' } } alamPointList.push(alarm_point) } } history_records.forEach(ele=>{ if(ele.DataStatus.length == 0){ historyChartPoint.push(ele) } }) that.setData({ recordsHistory: recordsHistoryList, history_records:history_records }) // console.log('recordsHistory', that.data.recordsHistory) var history_chartRecordList = TransChartRecordPoint(historyChartPoint); // console.log('767', history_chartRecordList) if (barec2 == null) { wx.showModal({ title: '', content: "图表提示', '图表加载错误，请点击刷新重试", }); return; } barec2.setOption({ color: ["#37A2DA"], legend: { data: [that.data.pointName + '/' + that.data.pointUnit], top: 0, left: 'center', z: 100 }, grid: { containLabel: true, top: 30, left: 15, right: 20, }, tooltip: { show: true, trigger: 'axis', formatter: function (params) { // console.log('479', params); let pointTime = 'T' + params[0].axisValueLabel.slice(0, 5) that.setData({ scrollTwoId: pointTime, nowHistoryMonitorTime: params[0].axisValueLabel.slice(0, 5) }) return '时间：' + util.functions.sub(params[0].value[0], 11, 16) + '\n' + "历史值：" + params[0].value[1]; }, }, xAxis: { type: 'time', boundaryGap: false, axisLabel: { formatter: function (v, index) { var date = new Date(v); return util.formatTimeUtil("hh:mm",date); } }, }, yAxis: { x: 'center', type: 'value', splitLine: { lineStyle: { type: 'dashed' } } // show: false }, dataZoom: [{ type: 'slider', //图表下方的伸缩条 show: true, //是否显示 realtime: true, // start: 0, //伸缩条开始位置（1-100），可以随时更改 end: 100, //伸缩条结束位置（1-100），可以随时更改 left: 10, right: 15, fillerColor: "rgba(22,181,203,0.4)", //选中范围的填充颜色。 borderColor: "#ddd", //边框颜色。 backgroundColor: "rgba(167,183,204,0.4)", //组件的背景颜色 throttle: 100, //设置触发视图刷新的频率。单位为毫秒（ms）。 handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%', // 控制手柄的尺寸，可以是像素大小，也可以是相对于 dataZoom 组件宽度的百分比，默认跟 dataZoom 宽度相同。 handleStyle: { color: '#16b5cb', shadowBlur: 3, // shadowBlur图片阴影模糊值，shadowColor阴影的颜色 shadowColor: '#77CCD8', shadowOffsetX: 1, shadowOffsetY: 1, opacity: 0.6, } }], series: [{ type: 'line', showSymbol: false, // smooth: true, name: that.data.pointName + '/' + that.data.pointUnit, data: history_chartRecordList, markPoint: { symbol: 'pin', symbolSize: 10, data: alamPointList } }] }) that.getHistoryAlarmRecord() } }); }, //获取历史的报警记录 getHistoryAlarmRecord(){ let that = this let history_records = that.data.history_records // console.log(history_records,1180) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorAlarmRecord/Mobile/GetByMonitorPointIDOfDay@V1.0", method: 'GET', data: { CorpID:that.data.currentCorpID, MonitorPointID : that.data.pointID, Day: that.data.historyDate }, header: { 'content-type': 'application/json' }, success:(res)=>{ // console.log("报警记录",res) if(res.data.Data == null){ res.data.Data = [] }else { let result = res.data.Data let recordHistoryList =[] for (let j = 0; j < result.length; j++) { let resultRecord = result[j] resultRecord.DataTime = resultRecord.DataTime.replace(/-/gi, '/') let resultRecordDataTime = new Date(resultRecord.DataTime).getTime() for (var i = 0; i < history_records.length; i++) { let realRecord = history_records[i] realRecord.DataTime = realRecord.DataTime.replace(/-/gi, '/') let realRecordDataTime = new Date(realRecord.DataTime).getTime() let rec = { RecordValue: parseFloat(realRecord.DataValue).toFixed(2), RecordStatus: realRecord[i].DataStatus, RecordStatusText:DataStatusTextEmun(realRecord[i].DataStatus[0]), RecordTime: util.functions.sub(realRecord.DataTime, 11, 16) } if(realRecordDataTime == resultRecordDataTime){ // console.log(realRecordDataTime == resultRecordDataTime,1209) // realRecord.DataStatus.push('BJ') //BJ:报警 realRecord.DataStatus[0] = 'BJ' //BJ:报警 rec.RecordStatus = realRecord.DataStatus[0] rec.RecordStatusText = DataStatusTextEmun(realRecord.DataStatus[0]) } recordHistoryList.push(rec) } } // console.log(historyMonitorList.length,469) that.setData({ recordsHistory: history_records, }); //判断是否有报警点，如果有则显示在图表上 var realAlarmPoint = [] for (let r = 0; r < history_records.length; r++) { if (history_records[r].RecordStatus == 'BJ') { history_records[r].DataTime = history_records[r].DataTime.replace(/-/gi, '/') var real_alarm_point = { value: '', coord: [history_records[r].DataTime, history_records[r].DataValue], itemStyle: { color: '#ff0000' } } realAlarmPoint.push(real_alarm_point) } } barec2.setOption({series:{markPoint:{data:realAlarmPoint}}}) } }, fail:(err)=>{ } }) }, //监控界面详情列表隐藏 hiddenList(e) { this.data.ishidden = !this.data.ishidden this.setData({ ishidden: this.data.ishidden }) }, //点击筛选时历史数据列表状态改变 changeStatus() { console.log('我被点击了'); this.data.historyStatus = !this.data.historyStatus this.setData({ historyStatus: this.data.historyStatus }) console.log() }, /**生命周期函数--监听页面初次渲染完成*/ onReady: function () { var DelayTime = 500; //毫秒 延迟0.5秒 防止图表barec1/barec2为null setTimeout(this.initialRealTimeRecord, DelayTime) }, /**生命周期函数--监听页面显示*/ onShow: function () {}, /**生命周期函数--监听页面隐藏*/ onHide: function () {}, /**生命周期函数--监听页面卸载*/ onUnload: function () { if (this.data.intervalRefreshTime != null) clearInterval(this.data.intervalRefreshTime); }, /**页面相关事件处理函数--监听用户下拉动作*/ onPullDownRefresh: function () {}, /**页面上拉触底事件的处理函数*/ onReachBottom: function () {}, //获取警报 getAlarmData: function () { var that = this; var alarmListInfo = that.data.alarmListInfo wx.showLoading({ title: '加载中...', }) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorAlarmRecord/Mobile/GetPageListByMonitorPointID@V1.1", method: 'GET', data: { CorpID : that.data.currentCorpID, MonitorPointID : that.data.pointID, StartTime : that.data.startAlarmDate, EndTime : that.data.endAlarmDate, PageIndex : that.data.PageIndex, PageSize : that.data.PageSize }, header: { 'content-type': 'application/json' }, fail: function (err) { wx.showModal({ title: '', content: '通讯失败', }) }, //请求失败 complete: function () { that.setData({ loadingHidden: true }); }, //请求完成后执行的函数 success: function (res) { console.log('打印警报信息', res.data) wx.hideLoading() if (res.data.Code != 0) { wx.showToast({ title: '获取数据失败', }); that.setData({ hasAlarmData: false }); return; } if (res.data.Data.List.length == 0) { wx.showToast({ title: '当前日期,没有获取到监控值', }); that.setData({ hasAlarmData: false }); return; } if (res.data.Data.Total == 0) { that.setData({ hasAlarmData: false, message: '暂无报警数据' }); return; } if (res.data.Data.List == null) { that.setData({ bottomStatus: true, message: '暂无报警数据' }); return; } if (that.data.PageIndex * that.data.PageSize > res.data.Data.Total) { let list = res.data.Data.List that.setData({ bottomStatus: true, hasAlarmData: false, alarmListInfo: alarmListInfo.concat(list) }) return; } var ListInfo = res.data.Data.List var pageIndex = that.data.PageIndex //更新数据 that.setData({ hasAlarmData: true, alarmListInfo: alarmListInfo.concat(ListInfo), PageIndex: ++pageIndex }); } }); }, //警报列表 -- 到底部时加载数据 lowRefresh: function () { var that = this if (that.data.bottomStatus == true) { return; } that.getAlarmData() }, //刷新报警 tapRefreshAlarm: function () { this.setData({ PageIndex: 1, alarmListInfo: [], }) this.getAlarmData(); }, /**用户点击右上角分享*/ onShareAppMessage: function () { return Constant.Share; }, //监控图标间隔 onTapInterval() { var fixed = this.data.Fixed; fixed.ec1.interval = "onTapIntervalF"; this.setData({ Fixed: fixed }); barec1.setOption({ yAxis: { boundaryGap: ['15%', '15%'], scale: true, } }) }, onTapIntervalF() { var fixed = this.data.Fixed; fixed.ec1.interval = "onTapInterval"; this.setData({ Fixed: fixed }); barec1.setOption({ yAxis: { boundaryGap: ['0%', '0%'], scale: false, } }) }, //历史刷新 onTapRefreshHistory() { var that = this that.getHistoryData() setTimeout(function () { that.setData({ scrollTwoId: '', historyScrollTop: 0, nowHistoryMonitorTime: '' }) }, 1000) // console.log(this.data.scrollTwoId, this.data.historyScrollTop, this.data.nowHistoryMonitorTime) }, //历史图标间隔 onTapIntervalHistory() { var fixed = this.data.Fixed; fixed.ec2.interval = "onTapIntervalHistoryF"; this.setData({ Fixed: fixed }); barec2.setOption({ yAxis: { boundaryGap: ['15%', '15%'], scale: true, } }) }, onTapIntervalHistoryF() { var fixed = this.data.Fixed; fixed.ec2.interval = "onTapIntervalHistory"; this.setData({ Fixed: fixed }); barec2.setOption({ yAxis: { boundaryGap: ['0%', '0%'], scale: false, } }) }, //筛选监测页面报警或者正常状态 changeMonitorStatus() { var that = this var isMonitorChange = that.data.isMonitorChange var monitorList = that.data.monitorList var monitorAlam = [] if (isMonitorChange) { isMonitorChange = false that.setData({ isMonitorChange: isMonitorChange, monitorList: monitorList }) } else { isMonitorChange = true for (var a = 0; a < monitorList.length; a++) { if (monitorList[a].RecordStatus.length > 0) { monitorAlam.push(monitorList[a]) } } that.setData({ isMonitorChange: isMonitorChange, monitorAlam: monitorAlam }) } }, //筛选历史页面报警或者正常状态 changeHistoryStatus() { var that = this var isHistoryChange = that.data.isHistoryChange var recordsHistory = that.data.recordsHistory var historyAlam = [] if (isHistoryChange) { isHistoryChange = false that.setData({ isHistoryChange: isHistoryChange, recordsHistory: recordsHistory }) } else { isHistoryChange = true for (var h = 0; h < recordsHistory.length; h++) { if (recordsHistory[h].RecordStatus.length > 0 ) { historyAlam.push(recordsHistory[h]) } } that.setData({ isHistoryChange: isHistoryChange, historyAlam: historyAlam }) } } }) function DataStatusTextEmun(value){ let text = "" if(value == "GLSB"){ text = "过滤失败" }else if(value == "SZGSCW"){ text = "数据格式错误" }else if(value == "ZHSB"){ text = "转换失败" }else{ text = "正常" } return text } //数据格式转换 function TransChartRecordPoint(record) { let m_chartRecordList = []; let length = record.length; for (let i = 0; i < length; i++) { let dataValue = { value: [record[i].DataTime, record[i].DataValue] }; m_chartRecordList.push(dataValue); } return m_chartRecordList; }