Ext项目中应用_日志页2

Ext.onReady(function(){
 Ext.BLANK_IMAGE_URL = './images/default/s.gif'
 // 定义记录集
  var dataFormate = Ext.data.Record.create([ {
   name : "uuid",
   type : "int"
  }, {
   name : "logdate",
   type : "date",
   dateFormat:'Y-m-d'
  }, {
   name : "userid"
  }, {
   name : "username"
  }, {
   name : "url"
  }, {
   name : "parameter"
  }, {
   name : "method"
  }]);

  // 定义数据集对象
  var dataStore = new Ext.data.Store( {
   reader : new Ext.data.XmlReader( {
    totalProperty : "results",
    record : "BaseUserLog",
    id : 'uuid',
    root : "list"
   }, dataFormate),
   proxy : new Ext.data.HttpProxy( {
    url : "/bfk/baseuserlogqueryAction.action"
   })
 })
 dataStore.load({params:{start:0,limit:30}});
 //定义表格的列
 var cm = new Ext.grid.ColumnModel([
  new Ext.grid.RowNumberer(),
  {
   header:'编号',dataIndex:'uuid',sortable:true 
     
  },{
   header:'用户ID',dataIndex:'userid',sortable:true 
   
  },{
   header:'用户名称',dataIndex:'username',sortable:true
   
  },{
   header:'url',dataIndex:'url',sortable:true
   
  },{
   header:'参数',dataIndex:'parameter',sortable:true
   
  },{
   header:'请求方式',dataIndex:'method',sortable:true
   
  },{
   header:'日期',dataIndex:'logdate',sortable:true,
   renderer:Ext.util.Format.dateRenderer('Y年m月d日')   
  }
 ]);
 
 //提示按钮自动隐藏
 function delayMsg(){
      var txt = Ext.Msg.getDialog().buttons[0].getText();  
   var s = 3;  
   Ext.TaskMgr.start({  
   run:function(){  
     if(s<=0){  
      Ext.Msg.hide();  
      return false;  
     }else{  
      Ext.Msg.getDialog().buttons[0].setText(txt+'('+s+')');  
      s--;  
     }  
   },  
   scope: this,  
   interval: 1000 
   });    
 }
 
 //定义表格分页工具条
 var pageToolbar = new Ext.PagingToolbar({
  store: dataStore,
  displayMsg: '&nbsp;&nbsp;总共【<b><font color=red>{2}</font></b>】条:当前第<span class="spec">{0}</span>条～第<b><span class="spec">{1}</span>条',
  emptyMsg: '没有信息',
  beforePageText: '页',
  firstText: '首页',
  prevText: '前一页',
  nextText: '后一页',
  lastText: '最后页',
  refreshText: '刷新',
  pageSize:30,
  displayInfo: true,
  items: ['&nbsp;&nbsp;&nbsp;&nbsp;每页显示数', new Ext.form.ComboBox({
   store: new Ext.data.SimpleStore({
   fields: ['pageid', 'pagename'],
   data: [[5, 5],[10, 10], [15, 15], [20, 20], [30, 30], [50, 50], [80, 80], [100, 100],[150, 150],[200, 200],[300, 300]]
   }),
   width: 50,displayField: 'pagename',typeAhead: true,mode: 'local',value:30,triggerAction: 'all',selectOnFocus: true,
   listeners: {
   change: {
   fn: function(box, newValue, oldValue){
    change_PageSize(newValue);
   }
   }
   }
  })]
 });
 
 //改变每页显示的数
 function change_PageSize(newValue){
      pageToolbar['pageSize']=parseInt(newValue);
      dataStore.reload({ params : { start : 0, limit : newValue} });
 };
 
 //定义工具栏
 var tbar = new Ext.Toolbar({
  defaults:{xtype:'datefield',style:{margin:'0,15,0,15'}},
  items:[{xtype: 'tbfill'},{xtype: 'tbseparator'},
   '起始时间：',
   {
    id:'startDate' ,editable:false,format:'Y-m-d',
    listeners:{
     'select':function(datafield, date){
      var endDate = Ext.getCmp('endDate').getValue();      
      Ext.getCmp('endDate').setMinValue(date);
      if(endDate != ''){
       Ext.getCmp('delBtn').enable();
      }
     }
    }
   },
   '结束时间：',
   {
    id:'endDate',editable:false,format:'Y-m-d',
    listeners:{
     'select':function(datafield, date){
      //alert(date);
      var startDate = Ext.getCmp('startDate').getValue();
      Ext.getCmp('startDate').setMaxValue(date);
      if(startDate != ''){
       Ext.getCmp('delBtn').enable();
      }
     }
    }
   },
   {
    xtype:'button',text:'删除',id: 'delBtn', iconCls: 'icon-user-delete',
    disabled:true,
    handler:function(){
     Ext.Ajax.request({
      url:'/bfk/baseuserlogdeleteByTimeAction.action',
      params:{'bqm.startDate':Ext.getCmp('startDate').getValue(),'bqm.endDate':Ext.getCmp('endDate').getValue()},
      success:function(response,options){
       var resText = Ext.util.JSON.decode(response.responseText);
       if(resText.success){
        Ext.Msg.alert('提示','删除成功');
        delayMsg();
        resetDel();
       }else{
        //从服务端返回描述
        Ext.Msg.alert('错误',resText.msg);
        delayMsg();
        resetDel();
       }
       
      },
      failure : function(response,options){
       Ext.Msg.alert('错误',"删除失败");
       delayMsg();
       resetDel();
      }
     });
    }
   }
  ]});
 //删除日期后重新加载数据
 var resetDel = function(){
  //清空数据
  Ext.getCmp('startDate').setValue('');
  Ext.getCmp('endDate').setValue('');
  Ext.getCmp('delBtn').disable();
  //重新加载数据
  dataStore.reload({params:{start:0,limit:pageToolbar.pageSize}});
 }
 //定义表格
 var grid = new Ext.grid.GridPanel({
  loadMask:true,
  viewConfig:{
   columnsText:"显示列",
   sortAscText:"升序",
   sortDescText:"降序",
   forceFit:true
  },
  store: dataStore,
  stripeRows:true,
  cm:cm,
  bbar:pageToolbar,
  tbar:tbar
 });
 
 //查询form
 var queryForm = new Ext.FormPanel({
     layout:'form',
     
     frame: true,
   items:[
    new Ext.form.FieldSet({
     
                 title: '根据以下条件查询：',
                 autoHeight: true,
                 labelAlign: 'right',
                 defaults: {xtype:"textfield",width:120},
                 frame:true,
                
                 items:[
      {
       id:"userid",
       fieldLabel:"用户id",
       xtype:"textfield"
       
      },
      
      {
       id:"username",
       fieldLabel:"用户名称"
      },
      
      {
       id:"url",
       fieldLabel:"url"
      },
      
      new Ext.form.ComboBox({
       id:"method",
       fieldLabel:"请求方式",
       editable: false,
          typeAhead: true,
          triggerAction: 'all',
          lazyRender:true,
          mode: 'local',
          store: new Ext.data.ArrayStore({
              id: 0,
              fields: [
                  'id',
                  'displayText'
              ],
              data: [['GET', 'GET'], ['POST', 'POST']]
          }),
          valueField: 'id',
          displayField: 'displayText'
      }),
      
      {
       id:"logdate",
       name:"bqm.logdate",
       fieldLabel:"日期",
       xtype:'datefield',
       format:'Y-m-d',
       editable:false      
          
       
      }
                 ],
                  buttons: [{
                text: '查询',
                buttonAlign:'center',
                handler:function(){
                 
                 dataStore.baseParams = dataStore.baseParams || {};
                 dataStore.baseParams['bqm.userid']=Ext.getCmp('userid').getValue();
                 dataStore.baseParams['bqm.username']=Ext.getCmp('username').getValue();
                 dataStore.baseParams['bqm.url']=Ext.getCmp('url').getValue();
                 dataStore.baseParams['bqm.method']=Ext.getCmp('method').getValue();
                 dataStore.baseParams['bqm.logdate']=Ext.getCmp('logdate').getValue();
                 dataStore.reload({params:{start:0,limit:pageToolbar.pageSize}});
                 
                }
            },{
                text: '重置',
                handler:function(){
                 queryForm.form.reset();
                 dataStore.baseParams = dataStore.baseParams || {};
                 dataStore.baseParams['bqm.userid']=Ext.getCmp('userid').getValue();
                 dataStore.baseParams['bqm.username']=Ext.getCmp('username').getValue();
                 dataStore.baseParams['bqm.url']=Ext.getCmp('url').getValue();
                 dataStore.baseParams['bqm.method']=Ext.getCmp('method').getValue();
                 dataStore.baseParams['bqm.logdate']=Ext.getCmp('logdate').getValue();
                 dataStore.reload({params:{start:0,limit:pageToolbar.pageSize}});
                }
            }]
    })
   ]
 });
 
 //布局
 var viewport = new Ext.Viewport({
      layout:'border',
     
      items:[{
        region: 'north',
           html:'',
           height:60,
        baseCls:"x-plain"
       },{
        title:'数据展示',
        region: 'center',
        layout:'fit',
           items:[grid]
       },{
        title:'查询',
        layout:'fit',
        autoScroll:true,
        region:'east',
        width:300,
        split:true,
        html:'',
        collapsible:true,
        items:[
         queryForm         
        ]
       },{
        title:'<br>',
        region:'south',
        height:0
       }]
  })
});