/** * */ Ext.Loader.setConfig({ enabled: true }); Ext.Loader.setPath('Ext.ux', '../../res/extjs/examples/ux'); Ext.require([ 'Ext.grid.*', 'Ext.data.*', 'Ext.ux.RowExpander', 'Ext.selection.CheckboxModel' ]); var myStore=null; var StatusStore; var baseUrl; var company_code; var theme; var ConfirmStore var pieWidth; var showAlarm=null; var pieMask; var V_LOGINNAME='',V_PASSWORD=''; var maxHeight = 10000; var maxWidth = 10000; var myMask; var sm = Ext.create('Ext.selection.CheckboxModel'); Ext.define('VWaterOption',{ extend: 'Ext.data.Model', fields: [ { name:"ordIdx", type:'int' }, { name:'data_time', type:'string'}, { name:'company_code', type:'string' }, { name:'company', type:'string' }, { name:'name', type:'string' }, { name:'point_code', type:'string' }, { name:'point_data', type:'string' }, { name:'dwtype', type:'int' }, { name:'device_id', type:'string' } ] }); Ext.define('CompanyComboStore',{ extend:'Ext.data.Model', fields: [ {name:'owner_name', type:'string'}, {name:'owner_id',type:'string'} ] }); var drawDevices = function(){ // alert('get device info'); if(StatusStore.length>0){ var current_device_id=''; var device_count=0; var fire_device_count=0; var water_device_count=0; var rtu_device_count=0; var other_device_count=0; var fire_device_out=0; var water_device_out=0; var rtu_device_out=0; var other_device_out=0; var fire_device_alarm=0; var water_device_alarm=0; var rtu_device_alarm=0; var other_device_alarm=0; var fire_device_normal=0; var water_device_normal=0; var rtu_device_normal=0; var other_device_normal=0; var total_normal=0; var mark_array = new Array(); for(var i=0;i0)){ for(var j=0;j
监控总数:'+water_device_count+'
在线总数:'+(water_device_count-water_device_out)+'
离线线总数:'+water_device_out+'
在线率:',water_device_count,(water_device_count-water_device_out),themecolor); draw_cycle_icon('waterPie2','状态正常

在线总数:'+(water_device_count-water_device_out)+'
正常总数:'+water_device_normal+'
告警总数:'+water_device_alarm+'
正常率:',(water_device_count-water_device_out),water_device_normal,themecolor); } } var draw_confirm = function(){ var themecolor = ((theme=='')||(theme=='access'))?'#ffffff':'#000000'; } var draw_cycle_icon = function(icon_id,name, total, num, themecolor){ var mColor= '#34abf5';//[ '#DDDF0D','#f66167', '#34abf5'] var percent = 100; if(total>0) percent = Number(((num*100)/total).toString().match(/^\d+(?:\.\d{0,2})?/)); if(percent<60) mColor = '#f66167'; else if(percent<80) mColor = '#DDDF0D'; $("#"+icon_id+"Title").html('

'+name+percent+'%'); Highcharts.chart(icon_id,{ chart: { type: 'solidgauge', height: '85%', backgroundColor: 'rgba(0,0,0,0)', reflow:true, marginTop:0 }, title:{ text:percent+'%', floating:true, y:pieWidth/3, style:{fontSize:'14px',color:themecolor,fontWeight:'bold'} }, exporting: { enabled: false }, credits: { enabled: false }, tooltip: { enabled: false }, pane: { startAngle: -90, endAngle: 180, background: [{ outerRadius: '90%', innerRadius: '60%', backgroundColor: 'rgba(0,0,0,0)', borderWidth: 0 }] }, yAxis: { min: 0, max: 100, lineWidth: 0, tickPositions: [] }, plotOptions: { solidgauge: { dataLabels: { enabled: false }, stickyTracking: false, rounded: true, warp: false } }, series:[{ name:'', data:[{ color: Highcharts.Color(mColor) .setOpacity(0.2) .get(), radius: '90%', innerRadius: '60%', y: 100 },{ color: Highcharts.Color(mColor) .setOpacity(0.6) .get(), radius: '90%', innerRadius: '60%', y: percent }] }] }); if((theme=='access')||(theme=='')){ $('#'+icon_id).addClass('shadow_black'); }else{ $('#'+icon_id).addClass('shadow_white'); } } var draw_confirm = function(){ // $("#WaterPiePanel_title_string").html(ConfirmStore[0].company+'.'+ConfirmStore[0].name+'.水系统监控设备电池电量情况'); var data_0 = new Array(); var data_1 = new Array(); var d_time = new Array(); var tmp_0 = null, tmp_1 = null, tmp_t = null; var themecolor = ((theme=='')||(theme=='access'))?'#ffffff':'#000000'; if(ConfirmStore==null) return; for(var i=0;i0){ $("#operation_num_1").html(data_0[0]); $("#operation_num_2").html(data_1[0]); $("#operation_num_3").html(d_time[0]); var mColor1= '#34abf5';//[ '#DDDF0D','#f66167', '#34abf5'] if(data_0[0]<60) mColor1 = '#f66167'; else if(data_0[0]<80) mColor1 = '#DDDF0D'; var mColor2= '#34abf5';//[ '#DDDF0D','#f66167', '#34abf5'] if(data_1[0]<3) mColor2 = '#f66167'; else if(data_1[0]<4) mColor2 = '#DDDF0D'; Highcharts.getOptions().colors = Highcharts.map([mColor2,mColor2,mColor1,mColor1], function (color) { return { radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 }, stops: [ [0, color], [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken ] }; }); Highcharts.chart('operation_pie',{ chart: { type: 'solidgauge', height: '100%', backgroundColor: 'rgba(0,0,0,0)', animation: false }, title:{ text:'电量:'+data_0[0]+'
信号:'+data_1[0], floating:true, y:80, style:{fontSize:'16px',color:themecolor,fontWeight:'bold'} }, exporting: { enabled: false }, credits: { enabled: false }, tooltip: { enabled: false }, pane: { startAngle: 0, background: [{ outerRadius: '110%', innerRadius: '55%', backgroundColor: 'rgba(0,0,0,0)', borderWidth: 0 }] }, yAxis: { min: 0, max: 100, lineWidth: 0, tickPositions: [] }, plotOptions: { solidgauge: { dataLabels: { enabled: false }, linecap: 'square', stickyTracking: false, rounded: false, warp: false }, series:{ animation: false } }, series:[{ name:name, data:[{ color: Highcharts.Color(mColor2) .setOpacity(0.2) .get(), radius: '110%', innerRadius: '70%', y: 100 },{ color: (Highcharts.theme && Highcharts.theme.contrastTextColor), radius: '110%', innerRadius: '70%', y: data_1[0]*20 },{ color: Highcharts.Color(mColor1) .setOpacity(0.2) .get(), radius: '50%', innerRadius: '0%', y: 100 },{ color: (Highcharts.theme && Highcharts.theme.contrastTextColor), radius: '50%', innerRadius: '0%', y: data_0[0] }] }] }); Highcharts.getOptions().colors = Highcharts.map(['#f66167', '#34abf5'], function (color) { return { linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 }, stops: [ [0, color], [1, Highcharts.Color(color).setOpacity(0).get('rgb')] // darken ] }; }); Highcharts.chart('operation_area',{ chart:{ type:'line', // zoomType: 'x', zoomType: 'xy', backgroundColor: 'rgba(0,0,0,0)' }, // color:['#f66167', '#34abf5'], title:{ // text:(companyName==null)?'水系统监控告警处理情况跟踪':companyName+'.水系统监控告警处理情况跟踪', text:'水系统设备工况跟踪', float:true, style:{fontSize:'14px',color:themecolor,fontWeight:'bold'}, enabled:false }, legend:{ // enabled:false, floating:true, x:410, y:-230, itemStyle:{fontSize:'12px',color:themecolor,fontWeight:'bold'} }, exporting: { enabled: false }, credits: { enabled: false }, xAxis:[{ categories:d_time, labels:{ enabled:false }, crosshair: true }], yAxis:[{ title:{ text:'剩余电量', style:{fontSize:'10px',color:themecolor,fontWeight:'bold'} }, gridLineColor:'rgba(0,0,0,0.2)', labels:{ format:'{value} %', style:{fontSize:'10px',color:themecolor,fontWeight:'bold'} }, max:110, min:0 },{ title:{ text:'无线信号', style:{fontSize:'10px',color:themecolor,fontWeight:'bold'} }, gridLineColor:'rgba(0,0,0,0.2)', labels:{ format:'{value} ', style:{fontSize:'10px',color:themecolor,fontWeight:'bold'} }, max:6, min:0, opposite:true }], tooltip:{ shared:true }, series:[ { name:'无线信号', type: 'line', yAxis: 1, data:data_1, lineWidth:1, tooltip:{ valueSuffix: ' ' } },{ name:'剩余电量', type: 'line', data:data_0, lineWidth:1, tooltip:{ valueSuffix: ' %' }, fillColor: { linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 }, stops: [ [0, '#34abf5'], [1, Highcharts.Color('#34abf5').setOpacity(0.0).get('rgba')] ] } } ] }); } } var show_datapie = function(record){ if(myStore==null) return; var themecolor = ((theme=='')||(theme=='access'))?'#ffffff':'#000000'; var nrow = myStore.getCount(); var device_id = record.get('device_id'); for(var i=0;i' var unchkIcon = '' var countPerPage = 20; var chkBoolean = function(flag) { if(flag) return chkIcon; return unchkIcon; } var queryJson = new Object(); queryJson.V_LOGINNAME = V_LOGINNAME; // queryJson.V_PASSWORD = V_PASSWORD; queryJson.dwtype = '2'; queryJson.point_code = '2' if((company_code!=null)&&(company_code!='null')&&(company_code.length>0)) queryJson.company_code = company_code; myStore = Ext.create('Ext.data.Store', { model: 'VWaterOption', pageSize: countPerPage, proxy: { type: 'ajax', actionMethods: { create : 'POST', read : 'POST', // by default GET update : 'POST', destroy: 'POST' }, url: baseUrl+'iot/data/view/getSyncStatusVList', reader: { type: 'json', root: 'RESULT', totalProperty: 'totalCount' }, extraParams:{ queryJson:Ext.JSON.encode(queryJson) } }, sorters:[{ property:'company_code', direction:'ASC' }], remoteSort: true }); var CompanyStory = Ext.create('Ext.data.Store',{ model: 'CompanyComboStore', proxy: { type: 'ajax', actionMethods: { create : 'POST', read : 'POST', // by default GET update : 'POST', destroy: 'POST' }, url: baseUrl+'iot/company/view/getNameList', reader: { type: 'json', root: 'RESULT', totalProperty: 'totalCount' }, extraParams:{ queryJson:Ext.JSON.encode(queryJson) } } }); var ClztStory = Ext.create('Ext.data.Store',{ fields:['abbr','name'], data:[ {'abbr':0,'name':'未处理'}, {'abbr':1,'name':'已处理'} ] }); var FilterForm = Ext.create('Ext.form.Panel', { id: 'VWaterOptionFilterForm', labelWidth: 55, defaultType: 'textfield', bodyPadding: 15, items: [{ xtype:'combo', fieldLabel:'单位名称', id: 'ff_company_code', name:'ff_company_code', displayField : 'owner_name', valueField : 'owner_id', editable : false, width:330, store:CompanyStory // },{ // xtype:'combo', // fieldLabel:'处理状态', // id: 'ff_clzt', // name: 'ff_clzt', // displayField : 'name', // valueField : 'abbr', // editable : false, // width:330, // store:ClztStory }], buttons: [{ text: '筛选', iconCls:'ok_btn', handler: function() { var form = this.up('form').getForm(); if (form.isValid()) { var query = new Object(); // var tmp = Ext.getCmp('ff_company_code'); query.dwtype = '2'; query.point_code = '2' if(Ext.getCmp('ff_company_code').getValue().length>0){ query.company_code = Ext.getCmp('ff_company_code').getValue(); $("#company_code").val(query.company_code); company_code = query.company_code; $("#WaterPiePanel_title_string").html(Ext.getCmp('ff_company_code').getRawValue( )+'.水系统设备列表'); }else{ $("#company_code").val(''); $("#WaterPiePanel_title_string").html('水系统设备列表'); company_code = null; } // query.clzt = Ext.getCmp('ff_clzt').getValue()==null?"":Ext.getCmp('ff_clzt').getValue(); // query.V_LOGINNAME = V_LOGINNAME; // query.V_PASSWORD = V_PASSWORD; query.COMMSTATUS = 'NO'; var jsonstr = Ext.JSON.encode(query); myStore.getProxy().extraParams = { queryJson : jsonstr }; Ext.getCmp('VWaterOptionListPageToolbar1').moveFirst(); Ext.getCmp('ff_company_code').setValue(''); // Ext.getCmp('ff_clzt').setValue(''); Ext.getCmp('VWaterOptionFilterWin').hide(); getCurrentData(); } } },{ text: '关闭', iconCls: 'cancel_btn', handler: function() { Ext.getCmp('VWaterOptionFilterWin').hide(); } }] }); var filterwin = function() { Ext.create('Ext.window.Window',{ id: 'VWaterOptionFilterWin', title: '水系统设备筛选', height: 210, width: 400, layout: 'fit', items: FilterForm, closable:false, modal:true, closeAction: 'hide' }).show(); CompanyStory.reload(); } var radiogroup = new Ext.create('Ext.form.RadioGroup',{ fieldLabel:'误报', id:'uf_r_clwb', width:300, items:[{ name:'uf_r_clwb', inputValue:'1', boxLabel:'是' },{ name:'uf_r_clwb', inputValue:'0', boxLabel:'否', checked:true }] }); var radiogroup2 = new Ext.create('Ext.form.RadioGroup',{ fieldLabel:'处理范围', id:'uf_r_clfw', width:300, items:[{ name:'uf_r_clfw', inputValue:'1', boxLabel:'批量' },{ name:'uf_r_clfw', inputValue:'0', boxLabel:'单一', checked:true }] }); var clear_modify_form = function(){ Ext.getCmp('uf_company_name').setValue(''); Ext.getCmp('uf_name').setValue(''); Ext.getCmp('uf_device_code').setValue(''); Ext.getCmp('uf_id').setValue(''); Ext.getCmp('uf_status').setValue(''); Ext.getCmp('uf_fullname').setValue(''); Ext.getCmp('uf_clwb').setValue(''); Ext.getCmp('uf_clr').setValue(''); Ext.getCmp('uf_clsj').setValue(''); Ext.getCmp('uf_clnr').setValue(''); } var fireInfoForm = Ext.create('Ext.form.Panel', { id: 'waterInfoForm', labelWidth: 55, url: baseUrl+'iot/alarm/view/updateSj', defaultType: 'textfield', bodyPadding: 15, items: [{ fieldLabel:'单位名称', id: 'uf_company_name', name: 'uf_company_name', anchor:'90%' },{ fieldLabel:'监控设备', id:'uf_name', name:'uf_name', anchor:'100%' },{ fieldLabel:'设备编号', id:'uf_device_code', name:'uf_device_code', hidden: true },{ fieldLabel:'记录编号', id:'uf_id', name:'uf_id', hidden: true },{ fieldLabel:'设备编号', id:'uf_status', name:'uf_status', hidden: true },{ fieldLabel:'报告信息', id: 'uf_fullname', name:'uf_fullname', xtype: 'textareafield', maxLength: 250, cols:4, anchor:'100%' },{ fieldLabel:'误报', id: 'uf_clwb', name:'uf_clwb', maxLength: 200, anchor:'65%' },radiogroup,radiogroup2,{ fieldLabel:'处理人', id: 'uf_clr', name:'uf_clr', maxLength: 120, anchor:'65%' },{ fieldLabel:'处理时间', id: 'uf_clsj', name:'uf_clsj', maxLength: 200, anchor:'80%' },{ fieldLabel:'处理内容', id: 'uf_clnr', name:'uf_clnr', xtype: 'textareafield', maxLength: 250, cols:4, anchor:'100%' },{ id:'fm_queryJson', name:'queryJson', hidden:true }], buttons: [{ text: '处理', id:'confirmBtn', iconCls:'ok_btn', handler: function() { var form = this.up('form').getForm(); if (form.isValid()) { var queryJson = new Object(); // queryJson.V_LOGINNAME = V_LOGINNAME; // queryJson.V_PASSWORD = V_PASSWORD; queryJson.id = Ext.getCmp('uf_id').getValue(); queryJson.status = Ext.getCmp('uf_status').getValue(); queryJson.name = Ext.getCmp('uf_name').getValue(); queryJson.device_code = Ext.getCmp('uf_device_code').getValue(); queryJson.confirmAll = Ext.getCmp('uf_r_clfw').getChecked()[0].boxLabel=='单一'?'0':'1'; queryJson.clwb = Ext.getCmp('uf_r_clwb').getChecked()[0].boxLabel=='否'?'0':'1'; queryJson.clnr = Ext.getCmp('uf_clnr').getValue(); var jsonstr = Ext.JSON.encode(queryJson); Ext.getCmp('fm_queryJson').setValue(jsonstr); form.submit({ method:'post', success: function(form, action) { Ext.Msg.alert('操作成功', '已确认'+action.result.activerow+'条记录', function(btn,txt){ clear_modify_form(); myStore.reload(); getCurrentData(); }); }, failure: function(form, action) { Ext.Msg.alert('操作失败', action.Msg , function(btn,txt){ clear_modify_form(); myStore.reload(); getCurrentData(); }); } }); this.up('window').close(); } } },{ text: '关闭', iconCls: 'cancel_btn', handler: function() { this.up('window').close(); } }] }); var vWaterInfoWin = Ext.create('Ext.window.Window',{ id:'VWaterInfoWin', title:'详细信息: ', width:400, layout:'fit', closable:false, modal:true, closeAction:'hide', items:fireInfoForm }); var showFireInfoWin = function(record){ vWaterInfoWin.show(); $("#VInfoWin_Title").html(record.get('data')); Ext.getCmp('uf_company_name').setValue(record.get('company_name')); Ext.getCmp('uf_name').setValue(record.get('name')); Ext.getCmp('uf_device_code').setValue(record.get('device_code')); Ext.getCmp('uf_fullname').setValue(record.get('fullname')); Ext.getCmp('uf_clr').setValue(record.get('clr_name')); Ext.getCmp('uf_clsj').setValue(record.get('clsj')); Ext.getCmp('uf_clnr').setValue(record.get('clnr')); Ext.getCmp('uf_id').setValue(record.get('id')); Ext.getCmp('uf_clwb').setValue(record.get('clwb')=='1'?'误报':'告警'); Ext.getCmp('uf_status').setValue(record.get('status')); if(record.get('clzt')=='已处理'){ Ext.getCmp('uf_clwb').setVisible(true); Ext.getCmp('uf_r_clwb').setVisible(false); Ext.getCmp('uf_r_clfw').setVisible(false); Ext.getCmp('confirmBtn').setVisible(false); Ext.getCmp('uf_clr').setVisible(true); Ext.getCmp('uf_clsj').setVisible(true); }else{ Ext.getCmp('uf_clwb').setVisible(false); Ext.getCmp('uf_r_clwb').setVisible(true); Ext.getCmp('uf_r_clfw').setVisible(true); Ext.getCmp('confirmBtn').setVisible(true); Ext.getCmp('uf_clr').setVisible(false); Ext.getCmp('uf_clsj').setVisible(false); } } var WaterOptionPanel = Ext.create('Ext.grid.Panel', { header :{ height:0, border:'0px solid #000000' }, titleCollapse:true, id: 'VWaterOptionListPanel', region:'center', store: myStore, columns: [ { header: '序号', dataIndex: 'ordIdx',width:50, menuDisabled:true }, { header: '单位名称', dataIndex: 'company',width:240, menuDisabled:true }, { header: '设备名称', dataIndex: 'name', width:1000, menuDisabled:true }, { header: '剩余电量', dataIndex: 'point_data', width:100, menuDisabled:true }, { header: '报告时间', dataIndex: 'data_time', width:160, menuDisabled:true } ], columnLines: true, height: maxHeight, width: '100%', tbar: new Ext.create('Ext.toolbar.Toolbar',{ items:[{ html:'水系统设备列表' },'->',{ xtype: 'button', iconCls:'back_btn', text: '返回', listeners: { click: function(){ window.parent.document.location=baseUrl+'view/frontpage/map.jsp?&theme='+theme+'&company_code='+company_code; } } },'-', { xtype: 'button', iconCls:'filter_btn', text: '筛选', listeners: { click: filterwin } },'-'] }), bbar: new Ext.PagingToolbar({ store: myStore, id:'VWaterOptionListPageToolbar1', displayInfo: true, pageSize: countPerPage, prependButtons: true, displayMsg : '显示第 {0}条到 {1}条记录,总共 {2}条', emptyMsg : "没有记录", firstText: '第一页', prevText: '前一页', nextText: '后一页', lastText: '最后一页', refreshText: '刷新' }), frame: true, border:false, iconCls: 'icon-grid', listeners:{ 'celldblclick' : function(grid, td, cellIndex, record, tr, rowIndex, e, eOpts){ show_datapie(record); // getCurrentData(); } } }); var piebar = Ext.create('Ext.panel.Panel',{ id:'FirePiePanel', width:'100%', height:498, region:'north', layout:'border', defaults:{ border:false }, html:'
水系统设备工况
电量
信号
时间
设备工况
' }); pieMask = new Ext.LoadMask(piebar,{msg:"Loading..."}); myMask = new Ext.LoadMask(document.body,{msg:"Loading..."}); new Ext.create('Ext.panel.Panel',{ width:'100%', id: 'WaterAlarmPanel', layout:'border', items:[ WaterOptionPanel,piebar ], renderTo: Ext.getBody() }); pieMask.show(); myStore.addListener('load',function(store,record,opts){ pieMask.show(); WaterOptionPanel.getSelectionModel().select(0,true); getCurrentData(); }); myStore.reload(); $(window).resize(function(){ body_resize(); }); body_resize(); });