window.series = []; window.flag = true; // var xyFontColor = "#999"; //曲线XY轴默认字体颜色 // var boderColor = "#D2D5D9"; //曲线边框默认颜色 // if (userInfo != "") { //根据外层框架信息切换主题色 var theme = localStorage.getItem('configTheme'); xyFontColor = theme == 'dark' ? '#fff' : '#000'; boderColor = theme == 'dark' ? '#3a548a' : '#dcdfe6'; // } function getCollect() { $.ajax({ url: '/report/monitorBusiness/selectTrendCollection', dataType: 'json', type: 'get', success: function(res) { if (res.operateFlag) { for (var i = 0, str = ''; i < res.rows.length; i++) { var d = res.rows[i]; var v = JSON.parse(d.SNAME); for ( var j = 0, treeCode = '', sname = ''; j < v.length; j++ ) { var temp = v[j]; treeCode = treeCode + (!treeCode ? '' : ';') + temp.treeCode; sname = sname + (!sname ? '' : ';') + temp.sanme; } str += '
  • ' + d.NAME + '×
  • '; } $('#collectlist').html(str); } } }); } getCollect(); var propertyNode, allNodes; $.ajax({ url: '/report/emsBusiness/findStationLocationMS', type: 'get', data: { type: 2 }, dataType: 'json', success: function(res) { if (res.operateFlag) { var obj = dataOp(res.mapData.stationLocationMS, []); initTree(obj.all); propertyNode = obj.obj; allNodes = res.mapData.stationLocationMS.reduce(function(o, v, i) { o[v.treeCode] = v; return o; }, {}); initEcharts('chart'); // getDevice(obj.ids.join(';'), obj.all, function (param, treeData) { // // initTree(obj.all); // getProperty(param.join(';'), treeData, function (p, t) { // // var z=initTree(t); // }); // }); } } }); function getDevice(param, treeData, fn) { $.ajax({ url: '/report/emsBusiness/findDeviceMSByLocationCode', type: 'get', data: { locations: param }, dataType: 'json', success: function(res) { if (res.operateFlag) { var obj = dataOp(res.mapData.deviceMS); Array.prototype.push.apply(treeData, obj.all); fn(obj.ids, treeData); } } }); } function getProperty(param, treeData, fn) { $.ajax({ url: '/report/emsBusiness/findDevicePropertyMS', type: 'post', data: { devices: param }, dataType: 'json', success: function(res) { if (res.operateFlag) { var obj = dataOp(res.mapData.devicePropertyMS); Array.prototype.push.apply(treeData, obj.all); fn(obj.ids, treeData); } } }); } function dataOp(arr) { var result = [], ids = [], obj = {}; // var tree = $.fn.zTree.getZTreeObj('device_list'); for (var i = 0; i < arr.length; i++) { var d = arr[i]; ids.push(d.type == 1 ? d.id : d.code); if (d.type == 1) { d.treePCode = 'root'; } var _flag = isNaN(d.type) || d.type > 3; var _data = { treeCode: d.treeCode, treePCode: d.treePCode, code: d.sname || d.code, sname: d.sname || d.code, unitCode: d.unitCode, unitName: d.unitName, oid: d.id, name: d.name, type: !d.type ? 3 : d.type, nocheck: !_flag, isParent: !_flag, isHidden: false }; if (!_flag) { result.push(_data); } if (obj[d.treePCode] === undefined) { obj[d.treePCode] = { node: {}, child: [] }; // obj[d.treePCode].node = tree.getNodeByParam('treeCode', d.treePCode); } // tree.addNodes(obj[d.treePCode].node,-1,_data,true); obj[d.treePCode].child.push(_data); } // for (var k in obj) { // tree.addNodes(obj[k].node, -1, obj[k].child, true); // } return { ids: ids, all: result, obj: obj }; } var Timer; function gethis() { if (Timer) { clearTimeout(Timer); } Timer = setTimeout(function() { getData('treeCode'); }, 200); } function getrtdata(node) { var tree = $.fn.zTree.getZTreeObj('device_list'); var nodes = tree.getCheckedNodes(); var checkednodes = {}; var code = nodes.reduce(function(o, v, i) { // if (v.code !== node.code||(v.code == node.code&&node.check)) { if (o) { o = o + ';'; } checkednodes[v.sname] = v; checkednodes[v.code] = v; o = o + v.code; // } return o; }, ''); $.fn.checkednodes = checkednodes; if (wsb) { wsb.send({ code: code }); } // var param = {}; // param[node.type] = node.treeCode; // getHistoryData(param); } function initTree(data) { var setting = { data: { simpleData: { enable: true, idKey: 'treeCode', pIdKey: 'treePCode', rootPId: '' } }, view: { showLine: false, expandSpeed: 'fast', showIcon: false }, check: { enable: true, chkStyle: 'checkbox' }, callback: { onCheck: function(event, id, node) { $('#linedb').removeClass('cur'); //取消对比效果 var el = $('#collectlist').find('.cur'); //查询收藏中选中的项 if (el[0]) { //如果有就清空 el.removeClass('cur'); Commdata = {}; } var len = Object.keys(Commdata); if (node.checked && len.length >= 10) { var tree = $.fn.zTree.getZTreeObj('device_list'); layer.msg(langJson.itemTooMuch); tree.checkNode(node, false, true); return false; } //处理数据 if (!node.checked) { //如果是取消就设置选中 var ec = echarts.getInstanceByDom( document.getElementById('chart') ); var name = node.name + '[' + node.treeCode + ']'; setTimeout(function() { ec.dispatchAction({ type: 'legendSelect', name: name }); }, 16); delete Commdata[node.code]; } else { Commdata[node.code] = []; } codeData(node); tabelDom(node); }, onClick: function(event, id, node) { var tree = $.fn.zTree.getZTreeObj('device_list'); if (node.isParent) { // 有可能第一次展开时可能children还没渲染,用expandNode无法展开,需要手动点+号展开。 if (node.children === undefined) { $(event.target) .closest('li') .children('span:first-child') .trigger('click'); } else { tree.expandNode(node, true); } } else { tree.checkNode(node, undefined, false, true); } }, beforeExpand: function(id, node) { // getProperty(node.treeCode+';', [], function (p, t,obj) { // console.log(obj) // }); if ( node.isParent && node.children && node.children.length > 0 ) { return true; } var tree = $.fn.zTree.getZTreeObj('device_list'); var pnode = propertyNode[node.treeCode]; if (pnode === undefined) { pnode = {}; } tree.addNodes(node, 0, pnode.child, true); return true; } } }; var zTreeObj = $.fn.zTree.init($('#device_list'), setting, data); //删除在顶层显示,而不是顶层的数据 // zTreeObj.getNodes().map(function(v, i, a) { // if (v.type != 1) { // (function(v) { // setTimeout(function() { // zTreeObj.removeNode(v); // }, 20); // })(v); // } // }); // //删除没有子级的父级节点 // zTreeObj.getNodesByParam("isParent", true).map(function(v, i, a) { // if (zTreeObj.getNodesByParam("treePCode", v.treeCode).length == 0) { // (function(v) { // setTimeout(function() { // zTreeObj.removeNode(v); // }, 20); // })(v); // } // }); return zTreeObj; } function codeData(node) { if ($('.small.cur').attr('data-date') !== 'time') { gethis(); } else { //处理实时数据 if (!node.checked) { var ec = echarts.getInstanceByDom(document.getElementById('chart')); var option = ec.getOption(); //去除echart线 var name = node.name + '[' + node.treeCode + ']'; var temp = []; option.series.map(function(v, i, a) { if (v.name != name) { temp.push(v); } else { a.splice(i, 1); } }); ec.setOption(option, true); } } getrtdata(node); } function getXAxis(timestrap) { var date = !timestrap ? dayjs() : dayjs(timestrap); var xAxis = { color: xyFontColor, type: 'time', splitNumber: 10, splitLine: { show: false }, axisLine: { lineStyle: { color: boderColor } }, axisLabel: { color: xyFontColor } }; var cur = $('.small.cur').attr('data-date'); if (cur == 'time') { xAxis.max = date.endOf('minutes').valueOf(); xAxis.min = date .endOf('minutes') .subtract(10, 'minutes') .valueOf(); xAxis.axisLabel.formatter = function(time, index) { var t = dayjs(time).format('HH:mm:ss'); if (time === '') { return ''; } return t; }; } else { var param = getSelectedDate(); xAxis.min = param.start.valueOf(); xAxis.max = param.end.valueOf(); } return xAxis; } function getDefaultOption() { var xAxis = getXAxis(); return { title: { textAlign: 'left', textStyle: { color: xyFontColor } }, tooltip: { trigger: 'axis', appendToBody: true, confine: true }, grid: { left: 60, right: 30, top: 10, bottom: 34, show: true, containLabel: false, //是否包含坐标轴的刻度标签 /*backgroundColor:'#ccc',*/ borderColor: boderColor, borderWidth: 1 }, legend: { show: false }, dataZoom: { type: 'inside', filterModel: 'none', start: 0, end: 100, minSpan: 10 }, xAxis: xAxis, yAxis: [ { type: 'value', // min: function(value) { // return value.min > 0 ? 0 : value.min; // }, boundaryGap: ['20%', '20%'], scale: true, splitLine: { lineStyle: { color: boderColor } }, axisLine: { lineStyle: { color: boderColor } }, axisLabel: { color: xyFontColor, formatter: '{value}' } } ] }; } function initEcharts(id, flag) { var dom = document.getElementById(id); if (!dom) { return false; } if (window.ec) { echarts.dispose(dom); } if (flag) { return false; } var mec = echarts.init(dom, 'halloween' /*,ops*/); // var op = ; //点击弹出事件弹框 // mec.on('click', function (param) { // var bt = dayjs(param.data[0]), // fm = 'YYYY-MM-DD HH:mm:ss'; // var obj = { // startTime: bt.format(fm), // snames: param.seriesId, // endTime: '' // } // switch ($('.small.cur').attr('data-date')) { // case 'day': // obj.endTime = bt.add(5, 'minute').format(fm); // break; // case 'week': // obj.endTime = bt.add(30, 'minute').format(fm); // break; // case 'month': // obj.endTime = bt.add(2, 'hour').format(fm); // break; // case 'season': // obj.endTime = bt.add(6, 'hour').format(fm); // break; // case 'year': // obj.endTime = bt.add(1, 'day').format(fm); // break; // } // getEvent(obj); // $('#dialog').show(); // }); // var timer; //缩放事件 // mec.on('datazoom', function (event) { // if (timer) { // clearTimeout(timer); // } // var start = +new Date(2019, 0, 1, 0, 0, 0, 0); // timer = setTimeout(function () { // var end = dayjs(Math.round(start + (event.batch[0].end * 1000 * 3600 * 24 * 365 / 100))).format('YYYY-MM-DD HH:mm:ss'); // var sta = dayjs(Math.round(start + (event.batch[0].start * 1000 * 3600 * 24 * 365 / 100))).format('YYYY-MM-DD HH:mm:ss'); // }, 300) // }) mec.setOption(getDefaultOption(), true); window.ec = mec; window.onresize = function() { //ecahrts窗口自适应 window.ec.resize(); }; // window.series = mec.getOption().series; } function hisEchartSetOption(data, param) { var tree = $.fn.zTree.getZTreeObj('device_list'); if (tree) { var nodelist = tree.getCheckedNodes(true); for (var i = 0, obj = {}, nodearr = []; i < nodelist.length; i++) { var d = nodelist[i]; if (d.isParent) { continue; } obj[d.treeCode] = d; nodearr.push({ code: d.treeCode, name: d.name }); } } var defaultOption=getDefaultOption(); var series = [], yAxis = [ { type: 'value', show: true, position: 'left', scale: true, offset: 0, splitLine: { lineStyle: { color: boderColor } }, axisLine: { lineStyle: { color: boderColor } }, axisLabel: { color: xyFontColor, formatter: '{value}' } } ], xAxis = Object.assign({}, defaultOption.xAxis,{ type: 'time', splitNumber: 10, splitLine: { show: false }, axisLine: { lineStyle: { color: boderColor } }, axisLabel: { color: xyFontColor } }); for (var i = 0; i < nodearr.length; i++) { var k = nodearr[i].code; series.push({ name: nodearr[i].name + '[' + k + ']', id: k, yAxisIndex: 0, type: 'line', sampling: 'average', lineStyle: { normal: { width: 1 }, width: 1 }, symbol: 'roundRect', symbolSize: 1, showAllSymbol: false, data: data[k] === undefined ? [] : data[k].arr }); yAxis.push({ type: 'value', show: false, position: 'left', scale: true, offset: 0, axisLabel: { formatter: '{value}' } }); } var ec = echarts.getInstanceByDom(document.getElementById('chart')); var option = ec.getOption(); ec.clear(); var sj = ''; option.xAxis = xAxis; option.yAxis = yAxis; option.series = series; // sj='事件:' + data[p.seriesName].obj[p.value[0]].eventNum; option.tooltip = { trigger: 'axis', formatter: function(param) { for (var i = 0, str = ''; i < param.length; i++) { var p = param[i]; str += '' + p.marker + '' + obj[p.seriesId].name + '' + '' + langJson.value + ':' + p.value[1] + '' + sj + ''; } str = '

    ' + param[0].value[0] + '

    ' + str + '
    '; return str; } }; ec.setOption(option, true); } function setDefaultX(param) { var ec = echarts.getInstanceByDom(document.getElementById('chart')); ec.setOption({ xAxis: { max: param.startTime, min: param.endTime } }); } function getData() { var codes = getNode('treeCode'); if (!codes) { //清除ec数据 hisEchartSetOption(); return false; } var param = getSelectedDate(); if(isNaN(param.interval)){ return false } if (Object.keys(codes).length == 0) { param.snames = ''; } else { param.snames = JSON.stringify(codes); } //设置默认X轴 // setDefaultX(param) layer.load(1, { shade: [0.1, '#000'] }); $.ajax({ url: '/report/monitorBusiness/queryTrendDataFromInfuxdb', type: 'post', data: { startTime: param.startTime, endTime: param.endTime, interval: param.interval, snames: param.snames }, dataType: 'json', success: function(res) { curData = res.rows || []; layer.closeAll(); if (res.operateFlag == false) { layer.msg(langJson.err); return false; } // var _temp_ = [1, 10, 100]; var tree = $.fn.zTree.getZTreeObj('device_list'); for (var i = 0, obj = {}, _obj = {}; i < res.rows.length; i++) { var d = res.rows[i]; var node = tree.getNodeByParam('treeCode', d.sname); d.dateTime = d.dateTime.replace(/[\-]/g, '/'); if (obj[d.sname] === undefined) { obj[d.sname] = { arr: [], obj: {} // _random_: _temp_[Math.round(Math.random() * 10) % 3] }; } if (_obj[node.sname] === undefined) { _obj[node.sname] = { arr: [], obj: {} // _random_: _temp_[Math.round(Math.random() * 10) % 3] }; } if (isNaN(d.data) || d.data === '' || d.data === null) { //实际取值 d.data = ''; //模拟数据 // var numb = obj[d.sname]._random_; // d.data = Math.round(Math.random() * (numb * 100 - numb * 10) + (numb * 10)); } else { d.data = Number(d.data).toFixed(2); } obj[d.sname].arr.push([d.dateTime, d.data]); obj[d.sname].obj[d.dateTime] = d; _obj[node.sname].arr.push([d.dateTime, d.data]); _obj[node.sname].obj[d.dateTime] = d; } //设置曲线 try { hisEchartSetOption(obj, param); } catch (error) { console.error(error); } //设置表格的值 try { initTable(_obj); } catch (error) { console.error(error); } // 重置 try { $('#tbody') .find('tbody') .html(makeTbody(['dateTime', 'sname', 'data'])); } catch (error) { console.error(error); } }, complete: function() { layer.closeAll(); } }); } function tabelDom(node) { var color = [ '#ff7200', '#fff600', '#46d500', '#00ffba', '#00adf6', '#00f6ff', '#cc00ff', '#ffa200', '#35dc8b', '#006cff', '#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae', '#749f83', '#ca8822', '#bda29a', '#c4ccd3' ]; // if ($('.table').find('table')[0] && node && node.checked) { // var c = $('.table').find('tr').length - 1; // $('.table').find('table').append('' + // '' + node.unitName + ''); // return false; // } var tree = $.fn.zTree.getZTreeObj('device_list'); if (tree) { var nodelist = tree.getCheckedNodes(true); for (var i = 0, o = {}, nodearr = []; i < nodelist.length; i++) { var d = nodelist[i]; if (d.isParent) { continue; } o[d.code] = d; nodearr.push(d.code); } } var tdlist = [ '' + langJson.name + '' + langJson.color + '' + langJson.max + '' + langJson.min + '' + langJson.average + '' + langJson.unit + '' ]; for (var l = 0; l < nodearr.length; l++) { var k = nodearr[l]; str = '' + '' + o[k].unitName + ''; tdlist.push(str); } $('.table').html('' + tdlist.join('') + '
    '); } function initTable(obj) { var tdlist = {}; for (var l in obj) { var k = obj[l]; for ( var i = 0, max = '', min = '', sum = 0; i < obj[l].arr.length; i++ ) { var _d = obj[l].arr[i]; if (_d instanceof Array) { _d = _d[1]; } else { _d = _d.value[1]; } if (isNaN(_d) || _d === '' || _d === null) { continue; } else { _d = Number(_d); } if (max === '' || _d > max) { max = _d; } if (min === '' || _d < min) { min = _d; } sum = sum + _d; } max = isNaN(max) || max === null ? '' : max; min = isNaN(min) || min === null ? '' : min; tdlist[l] = { k: l, max: max, min: min, avg: Number((sum / obj[l].arr.length).toFixed(2)) }; } var key; $('.table td').each(function(i, e) { // var pindex=$(e).parent().index(); var sindex = $(e).index(); if (sindex === 0) { key = $(e) .find('input') .val(); } else if (sindex === 2) { $(e).html(tdlist[key] ? tdlist[key].max : ''); } else if (sindex === 3) { $(e).html(tdlist[key] ? tdlist[key].min : ''); } else if (sindex === 4) { $(e).html(tdlist[key] ? tdlist[key].avg : ''); } }); } function getSelectedDate() { var seasonList = [ { name: '第一季度', start: '01-01', end: '03-31' }, { name: '第二季度', start: '04-01', end: '06-30' }, { name: '第三季度', start: '07-01', end: '09-30' }, { name: '第四季度', start: '10-01', end: '12-31' } ]; var param = { curtime: $('#datetime').val(), interval: 5 // / 60 }; if (!param.curtime) { param.curtime = dayjs().format('YYYY-MM-DD'); } //interval=5/60,30/60,2,6,24 var cls = $('.small.cur').attr('data-date'); var _str = ' 00:00:00'; if (cls == 'week') { param.interval = 30 // 60; param.startTime = dayjs(param.curtime + _str) .startOf('week') .format('YYYY-MM-DD'); param.endTime = dayjs(param.curtime + _str) .endOf('week') .format('YYYY-MM-DD'); param.start = dayjs(param.curtime + _str).startOf('week'); param.end = param.start.add(1, 'week'); } else if (cls == 'month') { param.interval = 2*60; param.startTime = dayjs(param.curtime + _str) .startOf('month') .format('YYYY-MM-DD'); param.endTime = dayjs(param.curtime + _str) .endOf('month') .format('YYYY-MM-DD'); param.start = dayjs(param.curtime + _str).startOf('month'); param.end = param.start.add(1, 'month'); } else if (cls == 'season') { param.interval = 6*60; var seaYear = dayjs(param.curtime + _str).year(); for (var i = 0; i < seasonList.length; i++) { var v = seasonList[i]; if ( !dayjs(param.curtime + _str).isAfter( dayjs(seaYear + '-' + v.end + _str) ) ) { param.startTime = dayjs(seaYear + '-' + v.start + _str) .startOf('month') .format('YYYY-MM-DD'); param.endTime = dayjs(seaYear + '-' + v.end + _str) .endOf('month') .format('YYYY-MM-DD'); param.start = dayjs(seaYear + '-' + v.start + _str).startOf( 'month' ); param.end = param.start.add(3, 'month'); break; } } } else if (cls == 'year') { param.interval = 24*60; param.startTime = dayjs(param.curtime + _str) .startOf('year') .format('YYYY-MM-DD'); param.endTime = dayjs(param.curtime + _str) .endOf('year') .format('YYYY-MM-DD'); param.start = dayjs(param.curtime + _str).startOf('year'); param.end = param.start.add(1, 'year'); } else if (cls == 'day') { param.interval = 5 // 60; param.startTime = dayjs(param.curtime + _str).format('YYYY-MM-DD'); param.endTime = dayjs(param.curtime + _str).format('YYYY-MM-DD'); param.start = dayjs(param.curtime + _str); param.end = dayjs(param.curtime + _str).add(1, 'day'); } else if (cls == 'defined') { var start = $('#startDate').val(); var end = $('#endDate').val(); param.interval = $('#definedInterval').val(); param.startTime = dayjs(start + _str).format('YYYY-MM-DD'); param.endTime = dayjs(end + _str).format('YYYY-MM-DD'); param.start = dayjs(start + _str); param.end = dayjs(end + _str).add(1, 'day'); } return param; } function getNode(key) { var tree = $.fn.zTree.getZTreeObj('device_list'); var codes = {}; if (tree) { var nodelist = tree.getCheckedNodes(true); nodelist.length == 0 && (codes = false); for (var i = 0; i < nodelist.length; i++) { var d = nodelist[i]; if (d.isParent) { continue; } if (!codes[d.type]) { codes[d.type] = []; } codes[d.type].push(d[key]); } } return codes; } function getEvent(obj) { // obj.snames='qy1.dlq_a04;qy1.glkg_a04_1;qy1.jgxh_a01'; // obj.startTime='2019-01-01 01:40:00'; // obj.endTime='2019-01-19 01:40:00'; $('#page').initPage({ ajax: { url: '/report/monitorBusiness/queryEventMsFromInfuxdb', type: 'post', data: obj, dataType: 'json', success: function(res) { var head = [ { name: langJson.time, key: 'TIME_STAMP' }, { name: langJson.priority, key: 'PRIORITY_NAME' }, { name: langJson.location, key: 'LOCATION_ID_NAME' }, { name: langJson.almStatus, key: 'ALM_STATUS_NAME' }, { name: langJson.devType, key: 'DEV_TYPE_NAME' }, { name: langJson.content, key: 'CONTENT' } ]; createTable(head, res.rows); $('#dialog').show(); } }, resKey: { pageSize: 'rows', curPage: 'page', sumPage: 'records' }, pageSize: 1000, curPage: 1 }); } function createTable(head, rows) { for (var i = 0, hstr = '', barr = []; i < head.length; i++) { var _h = head[i]; hstr += '' + _h.name + ''; for (var r = 0; r < rows.length; r++) { var _d = rows[r]; if (i === 0) { barr[r] = ''; } barr[r] += '' + _d[_h.key] + ''; } } var table = $('#table'); table.find('thead').html('' + hstr + ''); table.find('tbody').html('' + barr.join('') + ''); } function makeTbody(keys) { var exception = []; $('.table') .find('input[type=checkbox]:not(:checked)') .each(function(i, e) { exception.push($(e).val()); }); var tree = $.fn.zTree.getZTreeObj('device_list').getCheckedNodes(true); var names = tree.reduce(function(o, v, i) { o[v.sname] = v.name; return o; }, {}); return curData.reduce(function(o, v, i) { if (!(exception.length > 0 && exception.indexOf(v.sname) !== -1)) { o += '' + keys.reduce(function(r, c) { if (c == 'sname') { r += '' + names[v[c]] + ''; } else { r += '' + v[c] + ''; } return r; }, '') + ''; } return o; }, ''); } function definedQuery(){ $('.small.cur').trigger('click'); } $(function() { $('#datetime').val(dayjs().format('YYYY-MM-DD')); $('#endDate').val(dayjs().format('YYYY-MM-DD')); $('#startDate').val( dayjs() .subtract(1, 'day') .format('YYYY-MM-DD') ); function initInterval(){ var options={ 5:{ interval:5, label:'五分钟', diffDays:1,// 间隔对应的最大相差天数 }, 10:{ interval:10, label:'十分钟', diffDays:3, }, 30:{ interval:30, label:'三十分钟', diffDays:7, }, 60:{ interval:60, label:'一小时', diffDays:15, }, 120:{ interval:120, label:'两小时', diffDays:31, }, 360:{ interval:360, label:'六小时', diffDays:92, }, 480:{ interval:480, label:'八小时', diffDays:122, }, 720:{ interval:720, label:'十二小时', diffDays:185, }, 1440:{ interval:1440, label:'一天', diffDays:366, }, } var intervalList=Object.keys(options).sort(function(a,b){return b-a}); var start = $('#startDate').val(); var end = $('#endDate').val(); var diffDays=Math.abs(dayjs(end).diff(dayjs(start),'day')); // 开始时间大于结束时间 if (dayjs(start).isAfter(dayjs(end))) { layer.msg('开始时间大于结束时间'); return false; } // 开始时间和结束时间相差1年以上 if(diffDays>options[intervalList[0]].diffDays){ layer.msg('开始时间和结束时间相差1年以上'); return false; } var optionsStr=''; for (var i = 0; i < intervalList.length; i++) { var intv = options[intervalList[i]]; if(diffDays<=intv.diffDays){ var optiv=options[intervalList[i+1]] var selected=optiv&&diffDays>optiv.diffDays; optionsStr=''+optionsStr }else{ break; } } $('.defined-interval').html(optionsStr); } $('.Wdate').on('click', function() { var option = { el: this, isShowClear: false, firstDayOfWeek: 1, dateFmt: 'yyyy-MM-dd', onpicked: function(date) { initInterval(); } }; WdatePicker(option); }); initInterval(); $('.show-chart').on('click', function() { $(this).hide(200); $('#chart_table').hide(200); $('.show-table').show(200); $('#chart').show(200); return false; }); $('.show-table').on('click', function() { $(this).hide(200); $('#chart').hide(200); $('.show-chart').show(200); $('#chart_table').show(200); return false; }); $('#collectlist').on('click', 'em.collectdelete', function() { var el = $(this); var id = el.parent().attr('data-id'); layer.confirm( langJson.deleteFavorite, { title: langJson.delete, skin: 'colldialog', btn: [langJson.confirm, langJson.cancel] }, function() { $.ajax({ url: '/report/monitorBusiness/deleteTrendCollectionList', data: { ids: id }, type: 'get', dataType: 'json', success: function(res) { if (res.operateFlag) { layer.closeAll(); layer.msg(langJson.delSuccess); el.parent().remove(); } } }); } ); return false; }); function addNodeFromParent(treeCode) { var tree = $.fn.zTree.getZTreeObj('device_list'); var node = null, code = [treeCode]; while (node === null) { var last = code[code.length - 1]; node = tree.getNodeByParam('treeCode', last); if (node === null) { code.push(allNodes[last].treePCode); } } for (var i = code.length - 1; i > 0; i--) { tree.addNodes(node, 0, propertyNode[code[i]].child, true); node = tree.getNodeByParam('treeCode', code[i]); } if (treeCode === node.treeCode) { return node; } else { return tree.getNodeByParam('treeCode', treeCode); } } $('#collectlist').on('dblclick', 'li', function() { var tree = $.fn.zTree.getZTreeObj('device_list'); tree.checkAllNodes(false); $('.table table').remove(); // initEcharts("chart"); Commdata = {}; var ec = echarts.getInstanceByDom(document.getElementById('chart')); var option = ec.getOption(); option.series = []; ec.setOption(option, true); var treeCode = $(this) .attr('data-treeCode') .split(';'); for (var i = 0; i < treeCode.length; i++) { var node = tree.getNodeByParam('treeCode', treeCode[i]); if (node === null) { node = addNodeFromParent(treeCode[i]); } tree.checkNode(node, true, true, true); var _p = node.getParentNode(); while (_p) { tree.expandNode(_p, true); _p = _p.getParentNode(); } } $(this) .parent() .find('.cur') .removeClass('cur'); $(this).addClass('cur'); }); $('#collect').on('click', function() { var checked = []; var tree = $.fn.zTree.getZTreeObj('device_list'); $('input[name=t_row]:checked').each(function(i, e) { var v = $(e).val(); var node = tree.getNodeByParam('code', v); checked.push({ treeCode: node.treeCode, sname: node.sname }); }); $('input[name=collectname]').val(''); if (checked.length == 0) { layer.msg(langJson.noSelect); } else { layer.open({ type: 1, title: langJson.collection, skin: 'colldialog', area: ['326px', '230px'], btn: [langJson.submit, langJson.cancel], content: $('#collectdialog'), yes: function() { var name = $('input[name=collectname]').val(); if (!name) { layer.msg(langJson.collectName); return false; } if (!name.match(/^[\u4e00-\u9fa5_a-zA-Z0-9]+$/)) { layer.msg(langJson.hasSpecial); return false; } var flag = true; $('#collectlist li').each(function(i, e) { var str = $(e) .find('span') .html(); if (str == name) { flag = false; return false; } }); if (!flag) { layer.msg(langJson.hasRepeat); return false; } $.ajax({ url: '/report/monitorBusiness/inserTrendCollection', data: { name: name, snames: JSON.stringify(checked) }, type: 'post', dataType: 'json', success: function(res) { if (res.operateFlag) { layer.closeAll(); layer.msg(langJson.collectSuc); getCollect(); } } }); } }); } }); $('#changecollect').on('click', 'a.btn', function() { if ($(this).hasClass('collectlist')) { $('#device_list').hide(); $('#device_list') .prev() .hide(); $('#collectlist').show(); } else { $('#collectlist').hide(); $('#device_list').show(); $('#device_list') .prev() .show(); } $(this) .parent() .find('.cur') .removeClass('cur'); $(this).addClass('cur'); }); $('#treeFilter').on('click', function() { var tree = $.fn.zTree.getZTreeObj('device_list'); var metaChar = '[\\[\\]\\\\^\\$\\.\\|\\?\\*\\+\\(\\)]'; var rexMeta = new RegExp(metaChar, 'gi'); var nodelist = tree.getNodes(); var txt = $('#filterText').val() || ''; if (txt === '') { var nodes = tree.getNodesByParam('isHidden', true); tree.showNodes(nodes); return false; } else { var nodes = tree.getNodesByParam('isHidden', false); tree.hideNodes(nodes); } txt = txt.replace(rexMeta, function(matchStr) { return '\\' + matchStr; }); var data = { nodelist: nodelist, result: [] }; function fliterNodes(nodes, str) { var nodelist = nodes.nodelist; var result = []; var list = []; if (nodelist instanceof Array && nodelist.length) { for (var i = 0; i < nodelist.length; i++) { var node = nodelist[i]; if (node.name.indexOf(str) !== -1) { result.push(node); } else if (node.children && node.children.length) { list = list.concat(node.children); } } return fliterNodes( { nodelist: list, result: result.concat(nodes.result) }, str ); } return nodes; } var showPids = {}; //记录处理过的treeCode,减少消耗 function getPNode(node) { var result = []; while (node !== null && node.treeCode) { if (showPids[node.treeCode] === undefined) { result.push(node); showPids[node.treeCode] = 1; node = node.getParentNode(); } else { break; } } // if(result.length>0&&showPids[node.treeCode]===undefined){result.push(node)} return result; } var result = fliterNodes(data, txt); var needShowNodes = []; for (var i = 0; i < result.result.length; i++) { var node = result.result[i]; // 获取父节点 var pnode = getPNode(node); //获取子节点 var child = tree.getNodesByFilter( function(n) { return true; }, false, node ); needShowNodes = needShowNodes.concat(pnode, child); } tree.showNodes(needShowNodes); }); $('.table').on('click', 'input[type=checkbox]', function() { var flag = $(this).is(':checked'); var val = $(this).val(); var text = $(this) .parent() .text(); // var name = text + "[" + val + "]"; var name = text; //判断是不是实时 if ($('button.small.cur').attr('data-date') !== 'time') { //截掉前面三个.的编码 val = val .split('.') .splice(3) .join('.') .replace('.value', ''); } name += '[' + val + ']'; //$("#tbody") // .find("tbody") // .html(makeTbody(["dateTime", "sname", "data"])); var ec = echarts.getInstanceByDom(document.getElementById('chart')); if (flag) { ec.dispatchAction({ type: 'legendSelect', name: name }); } else { ec.dispatchAction({ type: 'legendUnSelect', name: name }); } }); $('#btn_option').on('click', 'button', function() { var keys = Object.keys(Commdata); if (keys.length == 0) { layer.msg(langJson.nullItem); return false; } var cls = $(this).hasClass('prev-item'); var val = $('#datetime').val(); var format = $('.small.cur').attr('data-date'); if (format === 'time') { return false; } var m = dayjs(val).month(); if (m <= 2) { m = 2; } else if (m <= 5) { m = 5; } else if (m <= 8) { m = 8; } else if (m <= 11) { m = 11; } if (cls) { if (format === 'season') { $('#datetime').val( dayjs(val) .month(m) .subtract(3, 'month') .format('YYYY-MM-DD') ); } else { $('#datetime').val( dayjs(val) .subtract(1, format) .format('YYYY-MM-DD') ); } } else { if (format === 'season') { $('#datetime').val( dayjs(val) .month(m) .add(3, 'month') .format('YYYY-MM-DD') ); } else { $('#datetime').val( dayjs(val) .add(1, format) .format('YYYY-MM-DD') ); } } setTimeout(function() { getData(); }, 60); }); $('.small').on('click', function() { // echarts.dispose(document.getElementById('chart')); $('.show-chart').trigger('click'); $('#datetime').val(dayjs().format('YYYY-MM-DD')); var el = $('.small.cur'); var ele = $(this); var _name = $(this).attr('data-date'); el.removeClass('cur'); ele.addClass('cur'); initEcharts('chart'); if (_name === 'time') { $('#btn_option').hide(); $('#linedb').hide(); rtsetEchartOption(); return false; } switch (_name) { case 'day': $('#btn_option .prev-item').html(langJson.preDay); $('#btn_option .next-item').html(langJson.nextDay); break; case 'week': $('#btn_option .prev-item').html(langJson.preWeek); $('#btn_option .next-item').html(langJson.nextWeek); break; case 'month': $('#btn_option .prev-item').html(langJson.preMonth); $('#btn_option .next-item').html(langJson.nextMonth); break; case 'season': $('#btn_option .prev-item').html(langJson.preSeason); $('#btn_option .next-item').html(langJson.nextSeason); break; case 'year': $('#btn_option .prev-item').html(langJson.preYear); $('#btn_option .next-item').html(langJson.nextYear); break; } $('#btn_option').show(); $('#linedb').show(); if (_name === 'defined') { $('#definedDate').show(); $('#btn_option').hide(); } else { $('#definedDate').hide(); $('#btn_option').show(); } getData(); //重置表格选中状态 $('input[name=t_row]').each(function(i, e) { e.checked = true; }); }); $('#dialog').on('click', 'p.close em', function() { $('#dialog').hide(); }); $('#linedb').on('click', function() { var ec = echarts.getInstanceByDom(document.getElementById('chart')); var option = ec.getOption(); var series = []; for (var i = 0; i < option.series.length; i++) { var d = option.series[i]; if ($(this).hasClass('cur')) { d.yAxisIndex = 0; } else { d.yAxisIndex = i + 1; } d.lineStyle.width = 1; d.lineStyle.normal.width = 1; series.push(Object.assign({}, d)); } option.series = series; if ($(this).hasClass('cur')) { option.yAxis[0].max = null; option.yAxis[0].min = null; } else { option.yAxis[0].max = 100; option.yAxis[0].min = 0; } $(this).toggleClass('cur'); ec.setOption(option, true); }); initEcharts('chart'); }); function rtsetEchartOption(time) { if (!time) { time = window.restime; } if (window.flag && document.visibilityState != 'hidden') { var ec = echarts.getInstanceByDom(document.getElementById('chart')); //数据 var obj = JSON.parse(JSON.stringify(Commdata)); window.flag = false; var tabledata = {}; //echarts var option = ec.getOption(); var series = []; //zTree var tree = $.fn.zTree.getZTreeObj('device_list'); var nodes = tree.getCheckedNodes(); nodes.map(function(v) { series.push({ name: v.name + '[' + v.code + ']', id: v.code, yAxisIndex: 0, type: 'line', symbol: 'roundRect', symbolSize: 1, showAllSymbol: false, sampling: 'average', lineStyle: { width: 1, normal: { width: 1 } }, data: obj[v.code] }); tabledata[v.code] = { arr: obj[v.code] }; }); // for (var i = 0; i < series.length; i++) { // var d = series[i]; // d.yAxisIndex = 0; // if (obj[d.id] !== undefined) { // d.data = obj[d.id]; // delete obj[d.id]; // } // tabledata[d.id] = { // arr: d.data // }; // } // for (var k in obj) { // series.push({ // name: $.fn.checkednodes[k].name + "[" + k + "]", // id: k, // yAxisIndex: 0, // type: "line", // symbol: "roundRect", // symbolSize: 1, // showAllSymbol: false, // sampling: "average", // lineStyle: { // width: 1 // }, // data: obj[k] // }); // tabledata[k] = { // arr: obj[k] // }; // } option.series = series; option.tooltip = { trigger: 'axis', appendToBody: true, confine: true }; // Object.assign({},option.tooltip,{ // formatter: false // }); option.xAxis = getXAxis(time); ec.setOption(option, true); initTable(tabledata); window.flag = true; } } function setOption(option) { var ec = echarts.getInstanceByDom(document.getElementById('chart')); // ec.setOption( // { // xAxis: { // }, // tooltip: { // formatter: false // }, // series: series // }, // false // ); window.flag = true; }