import * as echarts from '../../components/ec-canvas/echarts'; import constant from '../../utils/constant.js'; var util = require('../../utils/util.js'); var Constant = require('../../utils/constant.js'); import Request from "../../utils/api" //获取引用实例 var app = getApp(); var RefreshTime = 120; var barec = null; //动态配置图表数据的变量 Page({ /** * 页面的初始数据 */ data: { tabBar: [{ index: 0, iconPath: "icon-shebeijiance-dianji", selectedIconPath: "icon-shebeijiance-dianji blue", text: "监测" }, { index: 1, iconPath: "icon-gongzuo", selectedIconPath: "icon-gongzuo blue", text: "工作时间" }, { index: 2, iconPath: "icon-guzhang", selectedIconPath: "icon-guzhang blue", text: "警报" } ], machineList: [], //泵组详情名称 startAlarmDate: util.formatDay(util.GetBeforeDate(7)), endAlarmDate: util.formatDay(new Date()), today: util.formatDay(new Date()), stationID: 0, currentTabIndex: 0, lastRefreshTime: RefreshTime, //秒 loadingHidden: false, loadingInfo: "加载中,请稍等...", intervalRefreshTime: null, allProductPoints: [], allPointId: [], alarmListInfo: [], isInitialAlarmData: false, //是否初始化警报记录 hasAlarmData: false, hasPointData: true, IsDefault: true, kpiParas: { //顶部状态 status: '正常', runNnumber: 4, alarmNumber: "无" }, currentCorpID:1, scrollHeight: wx.getSystemInfoSync().windowHeight, isShowFloatMenu: false, //是否显示 animationFloatMenu: '', //显示动画 //echart 所有变量定义 ec: { onInit: function (canvas, width, height, dpr) { //初始化echarts元素,绑定到全局变量,方便更改数据 barec = echarts.init(canvas, null, { width: width, height: height, devicePixelRatio: dpr }); canvas.setChart(barec); return barec; }, }, //当前时间 yestday: util.formatDay(util.GetNextDate(new Date(), 0)), historyDate: util.formatDay(util.GetNextDate(new Date(), 0)), isNextDayAble: false, //是否可以点击下一天 PageIndex: 1, //初始化页数 PageSize: 20, //初始化条数 message: '未发生报警', bottomStatus: false, isExpandList: false, //列表展开状态 默认true不展开 isShowFloatMenu: false, //是否显示 animationFloatMenu: '', //显示动画 scrollHeight: wx.getSystemInfoSync().windowHeight, scrollTop: 0, }, //监测列表伸缩 tapExpandList() { var allProductPoints = this.data.allProductPoints if (this.data.isExpandList) { for (let i = 0; i < allProductPoints.length; i++) { allProductPoints[i].IsExpand = false } this.setData({ isExpandList: false, allProductPoints: allProductPoints }) } else if (this.data.isExpandList == false) { for (let i = 0; i < allProductPoints.length; i++) { allProductPoints[i].IsExpand = true } this.setData({ isExpandList: true, allProductPoints: allProductPoints }) } }, //上一天点击事件 yesterDay: function () { this.setData({ historyDate: util.formatDay(util.GetNextDate(this.data.historyDate, -1)), isNextDayAble: true, }); this.getWorkTime() }, //下一天点击事件 tomorrow: function () { var day = util.formatDay(util.GetNextDate(this.data.historyDate, 1)); // console.log(day); // console.log(this.data.yestday); var isNextDayAble = true; if (day == this.data.yestday) { isNextDayAble = false; } this.setData({ historyDate: day, isNextDayAble: isNextDayAble }); this.getWorkTime() }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { // console.log(options) wx.setNavigationBarTitle({ title: "泵站监控" + options.name }) var getNewDateArry = util.getNewDateArry.getNewDateArry(); var that = this; var stationID = options.id; let corpID = options.corpID //console.log('打印stationID', stationID); if (stationID == null) { stationID = 5; } that.setData({ stationID: stationID, currentCorpID:corpID, getNewDateArry: getNewDateArry.ymdhm }); var userInfo = app.globalData.userInfo; if (userInfo == null) { return; } Request({ url: Constant.BASE_SERVER_URL + "Monitor/MonitorPoint/Mobile/GetGeneralGroupListByStationID@V1.0", method: 'GET', data: { StationID: stationID, CorpID: corpID }, header: { 'content-type': 'application/json' }, fail: function (err) { that.setData({ loadingHidden: true }); }, //请求失败 success: function (res) { that.setData({ loadingHidden: true }); var result = res.data; // console.log('获取的泵站信息', result); if (result.Code != 0) { wx.showModal({ title: '', content: result.Message, }); return; } // console.log(result); var dict = result.Data; // var dict = result.Data.PointList; // console.log('dict',dict); var allProductPoints = dict; if (allProductPoints.length == 0) { return; } // console.log('allProductPoints', allProductPoints); var machineList = [] for (var i = 1; i < allProductPoints.length; i++) { var node = allProductPoints[i]; machineList.push({ ID: node.ID, TitleName: node.Name, MachineName: node.Name, WorkTime: 0 }); } var allPointIds = []; for (var k = 0; k < allProductPoints.length; k++) { var product = allProductPoints[k]; product.IsExpand = false; product.isExpandAll = false; var dis_num = 0; for (var n = 0; n < product.Items.length; n++) { var record = product.Items[n]; record.SignalList[0].SignalValue = "" record.SignalList[0].RecordTime= "" record.isDisp = false; if (record.length <= 2) { record.isDisp = true; dis_num++; allPointIds.push(record.ID); } } if (dis_num < 2) { //没有就显示前两个 for (var n = 0; n < product.Items.length; n++) { var record = product.Items[n]; if (dis_num <= 2) { record.isDisp = true; dis_num++; allPointIds.push(record.ID); } } } } // console.log(allPointIds) //定时刷新 var intervalRefreshTime = setInterval(function () { var getNewDateArry = util.getNewDateArry.getNewDateArry() var miao = that.data.lastRefreshTime; miao = miao - 1; if (miao <= 0) { that.setData({ lastRefreshTime: RefreshTime, getNewDateArry: getNewDateArry.ymdhm }); that.refreshRecordValue(); } else { that.setData({ lastRefreshTime: miao }); } }, 1000); // console.log('289行',allProductPoints) //更新数据 that.setData({ allPointId: allPointIds, hasPointData: true, allProductPoints: allProductPoints, intervalRefreshTime: intervalRefreshTime, machineList: machineList }); //console.log('machineList', that.data.machineList); that.refreshRecordValue(); //刷新一下 } }); }, onReady: function () { // this.getPoint(); //更新图表配置 }, //获取泵站运行时间 getWorkTime: function () { wx.showLoading({ title: '正在获取开机时间', }) var that = this; var machineList = this.data.machineList; var userInfo = app.globalData.userInfo; Request({ url: Constant.BASE_SERVER_URL + 'Run/RunSpan/Mobile/GetByStationIDOfDay@V1.0', method: 'GET', data: { CorpID: that.data.currentCorpID, StationID :that.data.stationID, Day: that.data.historyDate }, header: { 'content-type': 'application/json' }, success(res) { wx.hideLoading() console.log(res,306) var result = res.data if (result.Code != 0) { return; } // var run_time_array = result.Data; // console.log('291行 ', that.data.historyDate + '的开停机:', run_time_array); for (var i = 0; i < machineList.length; i++) { console.log() run_time_array.forEach(item => { if(machineList[i].TitleName == item.Name){ machineList[i].WorkTime = (item.RumTime / 60 / 60).toFixed(1) } }); } that.setData({ machineList: machineList }) that.calcChartWorkTime(run_time_array) }, fail(err) {} }) }, //构建图表 calcChartWorkTime: function (records) { // console.log(records,"已获取导数据") var that = this var seriesData = []; //定义图表内容的数组 var yAxisData = []; //定义y轴内容的数组 var machineList = that.data.machineList; for (let i = 0; i < machineList.length; i++) { // 循环遍历获取开关机状态 var machineListNode = [] records.forEach(item => { if(item.Name == machineList[i].MachineName){ machineListNode.push(item.Spans) } }); // console.log('machineListNode', machineListNode) yAxisData.push(machineList[i].MachineName) machineList[i].list = machineListNode for (let j = 0; j < machineListNode[0].length; j++) { var nodeItem = machineListNode[0][j]; nodeItem.StartTime = nodeItem.StartTime.replace(/-/gi, '/') nodeItem.EndTime = nodeItem.EndTime.replace(/-/gi, '/') if (nodeItem.RunStatus == 1) { seriesData.push({ name: "开机", value: [ i, new Date(new Date(nodeItem.StartTime)) - 0, new Date(new Date(nodeItem.EndTime)) - 0, "开启", "关闭", (nodeItem.Duration/60/60).toFixed(1) ], itemStyle: { normal: { color: '#7b9ce1' } } }) } else if (nodeItem.RunStatus == 0) { seriesData.push({ name: "关机", value: [ i, +new Date(new Date(nodeItem.StartTime)) - 0, +new Date(new Date(nodeItem.EndTime)) - 0, "关闭", "开启", (nodeItem.Duration/60/60).toFixed(1) ], itemStyle: { normal: { color: '#ddd' } } }) } } } // console.log(seriesData,"seriesData") var minTime = ''; var maxTime = ''; if (seriesData.length == 0) { //判断处理x轴的最小时间和最大时间 minTime = that.data.historyDate maxTime = that.data.historyDate + " 23:59:59" } else { minTime = seriesData[0].value[1] maxTime = seriesData[seriesData.length - 1].value[2] } // var time1 = util.formatDay(util.GetNextDate(seriesData[0].value[1], 0)) + ' 00:00:00' // var time2 = util.formatDay(util.GetNextDate(seriesData[0].value[1], 1)) + ' 00:00:00' barec.setOption({ disableTouch: true, tooltip: { formatter: function (params) { // console.log(new Date(params.value[1]).getHours()); // console.log(params.value[3]); // console.log('111',params) return params.name + ': ' + params.value[5] + "小时" + '\n' + params.value[4] + ': ' + (new Date(params.value[1]).getHours()) + ":" + (new Date(params.value[1]).getMinutes()) + '\n' + params.value[3] + ': ' + (new Date(params.value[2]).getHours()) + ":" + (new Date(params.value[2]).getMinutes()); } }, title: { text: '泵开关机状态表', x: 'center', y: '7px', textStyle: { color: '#16b5cb', fontSize: 16 }, textAlign: 'left' }, grid: { left: '17%', bottom: '60', top: '40', right: '4%' }, xAxis: { position: 'right', type: 'time', splitLine: { show: false }, // min: +new Date(time1), min: minTime, max: maxTime, // max: +new Date(time2), scale: false, axisLabel: { formatter: function (val) { // console.log(val); var date = new Date(val); var texts = [date.getHours(), date.getMinutes()]; return texts.join(':'); } } }, yAxis: { splitLine: { show: false }, axisLabel: { interval: 0, rotate: 20 }, scale: false, offset: 2, inverse: true, data: yAxisData }, series: [{ type: 'custom', renderItem: function (params, api) { var categoryIndex = api.value(0); var start = api.coord([api.value(1), categoryIndex]); var end = api.coord([api.value(2), categoryIndex]); var height = (api.size([0, 1])[1] * 0.6) < 40 ? api.size([0, 1])[1] * 0.6 : 40; var barLength = end[0] - start[0]; // var runtime = '开机:' + api.value(5) + '小时'; var runtime = ''; var flightNumberWidth = echarts.format.getTextRect(runtime).width; var text = api.value(3) == '开启' ? runtime : ''; text = (barLength > flightNumberWidth) ? text : ''; var rectShape = echarts.graphic.clipRectByRect({ x: start[0], y: start[1] - height / 2, width: end[0] - start[0], height: height }, { x: params.coordSys.x, y: params.coordSys.y, width: params.coordSys.width, height: params.coordSys.height }); return { type: 'rect', shape: rectShape, style: api.style({ text: text, textFill: '#fff' }) }; }, itemStyle: { opacity: 1 }, encode: { x: [1, 2], y: 0 }, data: seriesData }] }) // console.log(barec,"获取图标配置") }, //自定义图表方法 renderItemFunc: function (params, api) { var categoryIndex = api.value(0); var start = api.coord([api.value(1), categoryIndex]); var end = api.coord([api.value(2), categoryIndex]); var height = (api.size([0, 1])[1] * 0.6) < 40 ? api.size([0, 1])[1] * 0.6 : 40; var barLength = end[0] - start[0]; var runtime = '开机:' + api.value(5) + '小时'; var flightNumberWidth = echarts.format.getTextRect(runtime).width; var text = api.value(3) == '开启' ? runtime : ''; text = (barLength > flightNumberWidth) ? text : ''; var rectShape = echarts.graphic.clipRectByRect({ x: start[0], y: start[1] - height / 2, width: end[0] - start[0], height: height }, { x: params.coordSys.x, y: params.coordSys.y, width: params.coordSys.width, height: params.coordSys.height }); return { type: 'rect', shape: rectShape, style: api.style({ text: text, textFill: '#fff' }) }; }, //底部tab切换栏 tapTab: function (e) { var selIndex = e.currentTarget.dataset.index; var that = this; this.setData({ currentTabIndex: selIndex }); if (selIndex == 1) { //当选中的下标为1的时候修改图表配置 setTimeout(function () { that.getWorkTime() }, 500) } if (selIndex == 2 && !this.data.isInitialAlarmData) { this.setData({ loadingHidden: false, isInitialAlarmData: true }) that.getAlarmData(); //调用警报 } }, tapProductItem: function (e) { // console.log(e.currentTarget.dataset.id) // wx.navigateTo({ // url: '../product/index?id=' + e.currentTarget.dataset.id, //}) }, refreshRecordValue: function (e) { var that = this; var allPointId = this.data.allPointId; var userInfo = app.globalData.userInfo; if (allPointId == null || allPointId.length == 0) return; that.setData({ loadingHidden: false, loadingInfo: "刷新中,请稍等..." }); // console.log(allPointId.join(',')) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorRecord/Mobile/GetGeneralLastRecordByStationID@V1.0", method: 'GET', data: { CorpID: that.data.currentCorpID, StationID: that.data.stationID }, header: { 'content-type': 'application/json' }, fail: function (err) { that.setData({ loadingHidden: true }); wx.showModal({ title: '', content: '通讯失败', }) }, //请求失败 complete: function () {}, //请求完成后执行的函数 success: function (res) { // console.log('打印刷新后的数据',res); that.setData({ loadingHidden: true }); var result = res.data; if (result.Code != 0) { wx.showModal({ title: '', content: result.Message, }); return; } // var newRecordList = result.Data; //console.log(result); if (newRecordList == null) return; var allProductPoints = that.data.allProductPoints; for (var p = 0; p < allProductPoints.length; p++) { var allRecordList = allProductPoints[p].Items; for (var i = 0; i < allRecordList.length; i++) { var r_ds = allRecordList[i]; for (var j = 0; j < newRecordList.length; j++) { if (r_ds.ID == newRecordList[j].MonitorPointID) { r_ds.SignalList[0].SignalValue = newRecordList[j].DataValue; r_ds.SignalList[0].RecordTime = newRecordList[j].DataTime; if (r_ds.SignalList[0].ValueType == 2 && r_ds.SignalList[0].ValueSettings != null) { r_ds.SignalList[0].SignalValue = r_ds.SignalList[0].ValueSettings[r_ds.SignalList[0].SignalValue]; } break; } } } } //更新数据 that.setData({ allProductPoints: allProductPoints }); } }); }, tapeMonitorPoint: function (e) { // console.log(e,653) var pointid = e.currentTarget.dataset.pointid; let cronType = e.currentTarget.dataset.crontype; let pointName = e.currentTarget.dataset.pointname; let pointUnit = e.currentTarget.dataset.pointunit; console.log(pointid); if(cronType != 0){ wx.showModal({ title:"提示", content:"不是实时测点,暂无配置", showCancel:false, }) return } wx.navigateTo({ url: '../singlePoint/index?id=' + pointid + '&name=' + pointName + "&unit=" + pointUnit + "&corpID=" + this.data.currentCorpID, }); }, //刷新警报数据 tapRefreshAlarm: function () { this.setData({ //初始化设置 bottomStatus: false, PageIndex: 1, alarmListInfo: [] }) this.getAlarmData(); }, //警报 getAlarmData: function () { var that = this; var alarmListInfo = that.data.alarmListInfo var userInfo = app.globalData.userInfo; wx.showLoading({ title: '加载中...', }) let data = { CorpID:Constant.CorpID, StationID: that.data.stationID, StartTime : that.data.startAlarmDate, EndTime : that.data.endAlarmDate, PageIndex: that.data.PageIndex, PageSize: that.data.PageSize } // console.log(data,697) Request({ url: Constant.BASE_SERVER_URL + "Run/MonitorAlarmRecord/Mobile/GetPageListByStationID@V1.1", method: 'GET', data: { CorpID:Constant.CorpID, StationID: that.data.stationID, 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; } let result = res.data.Data if (result.List.length == 0) { wx.showToast({ title: '当前无报警数据', }); that.setData({ hasAlarmData: false }); return; } if (result.Total == 0) { that.setData({ hasAlarmData: false, message: '暂无报警数据' }); return; } if (result == null) { that.setData({ bottomStatus: true, message: '暂无报警数据' }); return; } // console.log(that.data.PageIndex, that.data.PageSize) // console.log(that.data.PageIndex * that.data.PageSize) 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 pageIndex = that.data.PageIndex var ListInfo = res.data.Data.List // console.log(pageIndex,733) //更新数据 that.setData({ hasAlarmData: true, alarmListInfo: alarmListInfo.concat(ListInfo), PageIndex: ++pageIndex }); // console.log(that.data.alarmListInfo); } }); }, //回到scroll组件顶部 goTop() { this.setData({ scrollTop: 0 }) }, //scroll组件高度监听 scrollListView(e) { let scrollTop = e.detail.scrollTop // 如果超过半屏 if (scrollTop > this.data.scrollHeight / 2) { this.setData({ isShowFloatMenu: true, animationFloatMenu: 'fadeIn' }) } else { this.setData({ isShowFloatMenu: false, animationFloatMenu: 'fadeOut' }) // setTimeout(() => {this.setData({visual: false})}, 1000) } }, //警报 -- 开始时间选择器 bindStartAlarmDateChange: function (e) { this.setData({ startAlarmDate: e.detail.value }) }, //警报 -- 结束时间选择器 bindEndAlarmDateChange: function (e) { this.setData({ endAlarmDate: e.detail.value }) }, //展开与收缩 tapProductName: function (e) { var list = this.data.allProductPoints; var pid = e.currentTarget.dataset.productid; // console.log(pid,801) for (var i = 0; i < list.length; i++) { if (list[i].ID == pid) { list[i].IsExpand = !list[i].IsExpand } } this.setData({ allProductPoints: list }); // console.log(list,364) }, //列表展示更多 tapMoreMonitor(e) { var that = this; var allProductPoints = that.data.allProductPoints; //var id = e.currentTarget.dataset.id; var index = e.currentTarget.dataset.index; var product = allProductPoints[index]; product.isExpandAll = true; // console.log(RecordList) //allProductPoints[index].RecordList = JSON.parse(JSON.stringify(RecordList).replace(/false/g, "true")); //allProductPoints[index].StateMore = "是否展示更多"; var pointids = this.data.allPointId; // console.log(pointids,product,825) for (var n = 0; n < product.Items.length; n++) { var record = product.Items[n]; if (!record.isDisp) { record.isDisp = true; pointids.push(record.PointID); } } //console.log(allProductPoints) //更新数据 that.setData({ allProductPoints: allProductPoints, allPointId: pointids }); that.refreshRecordValue(); }, //警报列表 -- 到底部时加载数据 lowRefresh: function () { var that = this if (that.data.bottomStatus == true) { return; } that.getAlarmData() }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () {}, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { if (this.data.intervalRefreshTime != null) clearInterval(this.data.intervalRefreshTime); }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** 时间选择器状态 **/ tapChangeWorkTime(e) { var isNextDayAble = true; if (e.detail.value == this.data.yestday) { isNextDayAble = false; } this.setData({ historyDate: e.detail.value, isNextDayAble: isNextDayAble }) this.getWorkTime(); }, /**返回顶部 */ goTop() { this.setData({ scrollTop: 0 }) }, scrollListView(e) { var that = this; let scrollTop = e.detail.scrollTop // 如果超过半屏 if (scrollTop > that.data.scrollHeight / 3.5) { that.setData({ isShowFloatMenu: true, animationFloatMenu: 'fadeIn' }) } else { that.setData({ isShowFloatMenu: false, animationFloatMenu: 'fadeOut' }) // setTimeout(() => {that.setData({visual: false})}, 1000) } }, /** * * 屏幕旋转事件 */ onResize(res) { res.size.windowWidth // 新的显示区域宽度 res.size.windowHeight // 新的显示区域高度 }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { return Constant.Share; }, })