• 发一个 ExtJS 4.2.0 的页面源码(规则比对公式 的设置页面)


    页面图:

    说明:

    1. 这是一个 规则比对公式 的设置页面。
    2. 双击规则行,则刷新规则项列表,双击规则项的行,则刷新项值列表。
    3. 规则 - rule ; 规则项 - ruleItem ; 项值 - ruleItemValue 。
    4. 三者均有查、增、改、删的功能。
    5. 待完善:删除时,应该同时删除下级内容。

    jsp 文件:

     1 <%@ page language="java" pageEncoding="UTF-8"%>
     2 
     3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     4 
     5 <%
     6 String pointNumbers = request.getParameter( "pointNumbers" ) ; 
     7     
     8     if ( pointNumbers == (null) || pointNumbers.equals("")){
     9         // 从 Session 中读取 。
    10         pointNumbers = "0" ;
    11     }
    12     
    13     
    14     
    15 %>
    16 
    17 <!-- 
    18 
    19     2013 0706 Livon
    20     - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
    21     @ 本页的访问地址: 
    22     http://localhost:8080/squadronMonitor/monitor/main.jsp?groupCode=category
    23 
    24 -->
    25 
    26 <html>
    27 <head>
    28 
    29     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    30     <meta http-equiv="Access-Control-Allow-Origin" content="*">
    31     
    32     <%@ include file="../inc/link_ExtJS.jsp" %>
    33     <%@ include file="../inc/css.jsp" %>
    34     
    35     <script type="text/javascript" >
    36         var parameters = {} ;    
    37         var strParam = '<%=pointNumbers %>' ;
    38         consoleLog( strParam ) ;
    39         parameters.pointNumbers = strParam.split(",")  ;
    40 
    41         consoleLog( parameters.pointNumbers ) ;
    42         
    43         consoleLog( parameters.pointNumbers[0] ) ;
    44         consoleLog( parameters.pointNumbers[1] ) ;
    45         consoleLog( parameters.pointNumbers[2] ) ;
    46         consoleLog( parameters.pointNumbers[3] ) ;
    47     </script>
    48     
    49     <script type="text/javascript" src="main.js" charset="UTF-8"></script>
    50      
    51     <title>规则管理页</title>
    52     
    53 </head>
    54 <body>
    55 
    56         <!-- loading ... -->
    57         
    58         
    59         <div id="surveil_point_info_picture_panel" class="x-hide-display" 
    60             style=" padding: 5px ; ">
    61             
    62             <a id="surveil_point_info_picture_1_a" href="" target="_blank">            
    63              <img id="surveil_point_info_picture_1" width="390" height="390" src=""/></a>
    64             <a id="surveil_point_info_picture_2_a" href="" target="_blank">        
    65              <img id="surveil_point_info_picture_2" width="390" height="390" src="" /></a>
    66         </div>
    67         
    68 
    69         <div id="chart_panel" style="height: 600px;"></div>
    70         <div id="chart_panel1" style="height: 600px;"></div>
    71         
    72         <div id="west" style="height: 600px;"></div>
    73         
    74         <div id="panel_车辆信息" style="padding: 5px;">
    75         
    76             <p>
    77                 车辆品牌 :中华<br />
    78                 车辆型号 :骏捷<br />
    79                 登记日期 :2013年3月30日<br />
    80                 车身颜色 :银白<br />
    81                 报废日期 :(未报废)
    82             </p>
    83         
    84         </div>
    85         
    86                 
    87         <div id="panel_帮助说明">
    88             <p>定义规则</p>
    89             <p style="color: gray ;">[ surveil_data/main.jsp ]</p>
    90         </div>
    91     
    92 </body>
    93 </html>
    View Code

    js 文件:

       1     /*
       2      * ================  规则管理  =======================
       3      */
       4 
       5 var url = {
       6         
       7         // 规则
       8         rule : {
       9             proxy : '../rule!selectList.action' ,    
      10             insertAction : '../rule!insert.action' ,
      11             updateAction : '../rule!update.action' ,
      12             deleteAction : '../rule!delete.action' ,
      13         } ,
      14         
      15         // 规则项
      16         ruleItem : {
      17             proxy       : '../ruleItem!selectList.action' ,    
      18             insertAction   : '../ruleItem!insert.action' ,
      19             updateAction : '../ruleItem!update.action' ,
      20             deleteAction  : '../ruleItem!delete.action' ,
      21         } ,
      22 
      23         // 项值
      24         ruleItemValue : {
      25             proxy       : '../ruleItemValue!selectList.action' ,    
      26             insertAction : '../ruleItemValue!insert.action' ,
      27             updateAction : '../ruleItemValue!update.action' ,
      28             deleteAction : '../ruleItemValue!delete.action' ,
      29         } ,
      30         
      31 } ; // url
      32 
      33 
      34 
      35 var common = {
      36 
      37     pageSize : {
      38         grid : 25 ,
      39         combo : 10                
      40     }            
      41     ,
      42     pagingToolBar : {
      43         displayMsg: '记录: {0} - {1} ,共 {2} 条',
      44         emptyMsg: '(无数据)'
      45     }
      46     ,
      47     columnWidth : {
      48         id : 40 , 
      49         number : 80 ,
      50         telephoneNumber : 120 ,
      51         mobilePhoneNumber : 120
      52     }
      53     ,
      54     exampleHtml : '<p>some html content.</p>'
      55     ,
      56     gridHeight : 240 
      57     ,
      58     
      59 }  
      60 ; // common
      61 
      62 var proxy = {
      63 
      64     extraParams : { 'bean.id' : 0 } , // extraParams
      65     actionMethods : { read : 'POST' } ,    
      66     reader : {
      67         type : 'json',
      68         root : 'rowList',
      69         totalProperty : 'rowsCount'
      70     } ,
      71     // 规则
      72     rule : {
      73         Proxy : null ,
      74         create : function(){
      75             this.Proxy = {
      76                 type : 'ajax',
      77                 url : url.rule.proxy ,
      78                 extraParams : proxy.extraParams ,
      79                 actionMethods : proxy.actionMethods ,
      80                 reader : proxy.reader
      81             } ;
      82         }
      83     } 
      84     ,
      85     // 规则项
      86     ruleItem : {
      87         Proxy : null ,
      88         create : function(){
      89             this.Proxy = {
      90                 type : 'ajax',
      91                 url : url.ruleItem.proxy ,
      92                 extraParams : proxy.extraParams ,
      93                 actionMethods : proxy.actionMethods ,
      94                 reader : proxy.reader
      95             } ;
      96         }
      97     } ,
      98     // 项值
      99     ruleItemValue : {
     100         Proxy : null ,
     101         create : function(){
     102             this.Proxy = {
     103                 type : 'ajax',
     104                 url : url.ruleItemValue.proxy ,
     105                 extraParams : proxy.extraParams ,
     106                 actionMethods : proxy.actionMethods ,
     107                 reader : proxy.reader
     108             } ;
     109         }
     110     } ,
     111     
     112     create : function(){
     113         this.rule.create() ;
     114         this.ruleItem.create() ;
     115         this.ruleItemValue.create() ;
     116     }    
     117 } ; // proxy
     118 
     119 proxy.create() ;
     120 
     121 
     122 
     123 var model = {
     124     // 规则    
     125     rule : {
     126         fields : [
     127                     {
     128                         name: 'id',
     129                         type: 'int'
     130                     },
     131                 {
     132                     name: 'rowNumber',
     133                     type: 'int'
     134                 },
     135                 {
     136                     name: 'number',
     137                     type: 'string'
     138                 },
     139                 {
     140                     name: 'name',
     141                     type: 'string'
     142                 }
     143         ] ,
     144         
     145         define : function() {
     146             Ext.define( 'ruleGridDataModel' , {
     147                 extend: 'Ext.data.Model'  ,
     148                 fields: this.fields
     149             } ) ;
     150         }
     151     } ,
     152     // 规则项
     153     ruleItem : {
     154         fields : [
     155                     {
     156                         name: 'id',
     157                         type: 'int'
     158                     },
     159                 {
     160                     name: 'rowNumber',
     161                     type: 'int'
     162                 },
     163                 {
     164                     name: 'fieldName',
     165                     type: 'string'
     166                 },
     167                 {
     168                     name: 'comment',
     169                     type: 'string'
     170                 }
     171         ] ,
     172         
     173         define : function() {
     174             Ext.define( 'ruleItemGridDataModel' , {
     175                 extend: 'Ext.data.Model'  ,
     176                 fields: this.fields
     177             } ) ;
     178         }
     179     } ,
     180     // 项值
     181     ruleItemValue : {
     182         fields : [
     183                     {
     184                         name: 'id',
     185                         type: 'int'
     186                     },
     187             {
     188                 name: 'rowNumber',
     189                 type: 'int'
     190             },
     191             {
     192                 name: 'comparisonType',
     193                 type: 'string'
     194             },
     195             {
     196                 name: 'itemValue',
     197                 type: 'string'
     198             },
     199             {
     200                 name: 'valueMinimum',
     201                 type: 'string'
     202             },
     203             {
     204                 name: 'valueMaximum',
     205                 type: 'string'
     206             }
     207         ] ,
     208         
     209         define : function() {
     210             Ext.define( 'ruleItemValueGridDataModel' , {
     211                 extend: 'Ext.data.Model'  ,
     212                 fields: this.fields
     213             } ) ;
     214         }
     215     } ,
     216     
     217     define : function() {        
     218         this.rule.define() ;
     219         this.ruleItem.define() ;
     220         this.ruleItemValue.define() ;        
     221     } // define
     222     
     223 } // model 
     224 ;
     225 
     226 model.define() ;
     227 
     228 
     229 
     230 
     231 var store = {
     232         
     233         rule : {
     234             Store : null ,
     235             create : function(){
     236 
     237                 this.Store = Ext.create('Ext.data.Store', {
     238                     pageSize : common.pageSize.grid ,
     239                     model : 'ruleGridDataModel',
     240                     proxy : proxy.rule.Proxy
     241                 }) ;
     242             }
     243         } ,
     244         
     245         ruleItem : {
     246             Store : null ,
     247             create : function(){
     248 
     249                 this.Store = Ext.create('Ext.data.Store', {
     250                     pageSize : common.pageSize.grid ,
     251                     model : 'ruleItemGridDataModel',
     252                     proxy : proxy.ruleItem.Proxy
     253                 }) ;
     254             }
     255         } ,
     256         
     257         ruleItemValue : {
     258             Store : null ,
     259             create : function(){
     260 
     261                 this.Store = Ext.create('Ext.data.Store', {
     262                     pageSize : common.pageSize.grid ,
     263                     model : 'ruleItemValueGridDataModel',
     264                     proxy : proxy.ruleItemValue.Proxy
     265                 }) ;
     266             }
     267         } ,
     268     
     269     // create
     270     create : function(){
     271 
     272         this.rule.create();
     273         this.ruleItem.create();
     274         this.ruleItemValue.create() ;
     275         
     276     } // create
     277     ,
     278     load : function(){
     279         this.rule.Store.load() ;    
     280     } // load
     281     
     282 }  // store
     283 ;
     284 
     285 store.create() ;
     286 
     287 
     288 
     289 var toolBar = {
     290         
     291         rule : {
     292             grid : {        
     293                 toolBar : {
     294                     xtype: 'toolbar',
     295                     items : [ {
     296                         text:'添加新记录',
     297                         tooltip: '点击后,在弹出的窗口中添加新记录。',
     298                         iconCls:'add',
     299                         handler: function(){ fn.rule.insert() ; }                    
     300                     } ,
     301                     {
     302                         text:'修改',
     303                         tooltip: '点击后,在弹出的窗口中修改所选择的第一条记录。',
     304                         iconCls:'add',
     305                         handler: function(){ fn.rule.update() ; }                    
     306                     } ,
     307                     {
     308                         text:'删除',
     309                         tooltip: '点击后,经确认,将删除所选择的记录,且不可恢复!',
     310                         iconCls:'add',
     311                         handler:  function(){ fn.rule.del() ; }                    
     312                     } 
     313                           ]
     314                 } ,
     315                 pagingToolBar : null ,                
     316                 createPagingToolBar : function(){                    
     317                     this.pagingToolBar = Ext.create('Ext.PagingToolbar', {
     318                         store: store.rule.Store ,
     319                         displayInfo: true,
     320                         displayMsg: common.pagingToolBar.displayMsg ,
     321                         emptyMsg: common.pagingToolBar.emptyMsg
     322                     });     
     323                 }
     324             }
     325             ,
     326             form : {
     327                 toolBar : {} ,
     328             }
     329             ,
     330         } ,
     331         
     332         ruleItem : {
     333             grid : {            
     334                 toolBar : {
     335                     xtype: 'toolbar',
     336                     items : [ {
     337                         text:'添加新记录',
     338                         tooltip: '点击后,在弹出的窗口中添加新记录。',
     339                         iconCls:'add',
     340                         handler:  function(){ fn.ruleItem.insert() ; }                    
     341                     } ,
     342                     {
     343                         text:'修改',
     344                         tooltip: '点击后,在弹出的窗口中修改所选择的第一条记录。',
     345                         iconCls:'add',
     346                         handler:  function(){ fn.ruleItem.update() ; }        
     347                     } ,
     348                     {
     349                         text:'删除',
     350                         tooltip: '点击后,经确认,将删除所选择的记录,且不可恢复!',
     351                         iconCls:'add',
     352                         handler:   function(){ fn.ruleItem.del() ; }        
     353                     } 
     354                           ]
     355                 } ,
     356                 pagingToolBar : null ,                
     357                 createPagingToolBar : function(){                    
     358                     this.pagingToolBar = Ext.create('Ext.PagingToolbar', {
     359                         store: store.ruleItem.Store ,
     360                         displayInfo: true,
     361                         displayMsg: common.pagingToolBar.displayMsg ,
     362                         emptyMsg: common.pagingToolBar.emptyMsg
     363                     });     
     364                 }
     365             }
     366         } ,
     367         
     368         ruleItemValue : {
     369             grid : {            
     370                 toolBar : {
     371                     xtype: 'toolbar',
     372                     items : [ {
     373                         text:'添加新记录',
     374                         tooltip: '点击后,在弹出的窗口中添加新记录。',
     375                         iconCls:'add',
     376                         handler:  function(){ fn.ruleItemValue.insert() ; }            
     377                     } ,
     378                     {
     379                         text:'修改',
     380                         tooltip: '点击后,在弹出的窗口中修改所选择的第一条记录。',
     381                         iconCls:'add',
     382                         handler:  function(){ fn.ruleItemValue.update() ; }    
     383                     } ,
     384                     {
     385                         text:'删除',
     386                         tooltip: '点击后,经确认,将删除所选择的记录,且不可恢复!',
     387                         iconCls:'add',
     388                         handler:   function(){ fn.ruleItemValue.del() ; }    
     389                     } 
     390                           ]
     391                 } ,
     392                 pagingToolBar : null ,                
     393                 createPagingToolBar : function(){                    
     394                     this.pagingToolBar = Ext.create('Ext.PagingToolbar', {
     395                         store: store.ruleItemValue.Store ,
     396                         displayInfo: true,
     397                         displayMsg: common.pagingToolBar.displayMsg ,
     398                         emptyMsg: common.pagingToolBar.emptyMsg
     399                     });     
     400                 }
     401             }
     402         } ,
     403     createPagingToolBar : function(){       
     404         this.rule.grid.createPagingToolBar() ;
     405         this.ruleItem.grid.createPagingToolBar() ;
     406         this.ruleItemValue.grid.createPagingToolBar() ;
     407     }
     408     
     409 } // toolBar
     410 ;
     411 
     412 toolBar.createPagingToolBar( ) ;
     413 
     414 
     415 var grid = {
     416         
     417         rule : {
     418             Grid : null ,
     419             onCellClick : function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts ) {
     420         
     421             }
     422             ,
     423             onCellDblClick : function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts ) {
     424                 var id = record.getData().id ;
     425                 if ( id > 0 ){
     426                     fn.ruleItemReload( id );
     427                     fn.ruleItemValueReload( 0 );
     428                 }        
     429             }
     430             ,
     431             
     432             columns : [
     433 
     434                                {
     435                                    text     : '行号',
     436                                    width    : common.columnWidth.id ,
     437                                    // flex     : 1,
     438                                    //sortable : true,
     439                                    //renderer : time_render ,
     440                                    dataIndex: 'rowNumber'
     441                                } ,
     442 
     443                                    {
     444                                        text     : '编号',
     445                                        width    : common.columnWidth.number ,
     446                                        //renderer : time_render ,
     447                                        dataIndex: 'number'
     448                                    },
     449 
     450                                    {
     451                                        text     : '名称',
     452                                        // width    : 70,
     453                                     flex     : 1,
     454                                        //renderer : time_render ,
     455                                        dataIndex: 'name'
     456                                    },
     457                     ] ,
     458             create : function(){
     459                 
     460                 this.Grid = Ext.create('Ext.grid.Panel', {
     461 
     462                     title: '规则',
     463                     // height: common.gridHeight ,
     464                     // id : 'grid' ,
     465                     region: 'west',
     466                     flex: 1,
     467                     store: store.rule.Store  ,
     468                     stateful: true ,
     469                     // collapsible: true ,
     470                     multiSelect: true ,
     471                     stateId: 'stateGrid' ,
     472                     selModel: Ext.create('Ext.selection.CheckboxModel')  ,
     473                     autoScroll: true ,
     474                     dockedItems: [
     475                                  toolBar.rule.grid.toolBar
     476                     ], // end of dockedItems
     477                     
     478                     columns: this.columns ,
     479                     viewConfig: grid.viewConfig ,
     480                     bbar : toolBar.rule.grid.pagingToolBar            
     481                     
     482                 }); // ruleGrid
     483             }
     484         } 
     485         ,
     486         
     487         ruleItem : {
     488             Grid : null ,
     489             onCellClick : function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts ) {
     490         
     491             }
     492             ,
     493             onCellDblClick : function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts ) {
     494                 var id = record.getData().id ;
     495                 if ( id > 0 ){
     496                     fn.ruleItemValueReload( id ) ;
     497                 }        
     498             }
     499             ,
     500             
     501             columns : [
     502 
     503                        {
     504                            text     : '行号',
     505                            width    : common.columnWidth.id ,
     506                            // flex     : 1,
     507                            //sortable : true,
     508                            //renderer : time_render ,
     509                            dataIndex: 'rowNumber'
     510                        } ,
     511 
     512                            {
     513                                text     : '字段名称',
     514                                width    : 100 ,
     515                                //renderer : time_render ,
     516                                dataIndex: 'fieldName'
     517                            },
     518 
     519                            {
     520                                text     : '备注',
     521                                // width    : 70,
     522                             flex     : 1,
     523                                //renderer : time_render ,
     524                                dataIndex: 'comment'
     525                            },
     526                     ] 
     527                     ,
     528                     create : function(){
     529                         this.Grid = Ext.create('Ext.grid.Panel', {
     530 
     531                             title: '规则项',
     532                             // height: common.gridHeight ,
     533                             // id : 'grid' ,
     534                             region: 'center',
     535                             flex: 1,
     536                             store: store.ruleItem.Store  ,
     537                             stateful: true ,
     538                             // collapsible: true ,
     539                             multiSelect: true ,
     540                             stateId: 'stateGrid' ,
     541                             selModel: Ext.create('Ext.selection.CheckboxModel')  ,
     542                             autoScroll: true ,
     543                             dockedItems: [
     544                                          toolBar.ruleItem.grid.toolBar
     545                             ], // end of dockedItems
     546                             
     547                             columns: this.columns ,
     548                             viewConfig: grid.viewConfig ,
     549                             bbar : toolBar.ruleItem.grid.pagingToolBar            
     550                             
     551                         }); // ruleGrid
     552                     }
     553         } 
     554         ,
     555         
     556         ruleItemValue : {
     557             Grid : null ,
     558             onCellClick : function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts ) {
     559         
     560             }
     561             ,
     562             onCellDblClick : function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts ) {
     563                 form.ruleItemValue.fillUpdateform() ;
     564                 win.ruleItemValue.updateWindow.show() ;
     565             }
     566             ,
     567             
     568             columns : [
     569 
     570                        {
     571                            text     : '行号',
     572                            width    : common.columnWidth.id ,
     573                            // flex     : 1,
     574                            //sortable : true,
     575                            //renderer : time_render ,
     576                            dataIndex: 'rowNumber'
     577                        } ,
     578 
     579                            {
     580                                text     : '比对类型',
     581                                width    : 70,
     582                                //renderer : time_render ,
     583                                dataIndex: 'comparisonType'
     584                            },
     585 
     586                            {
     587                                text     : '值',
     588                                width    : 70,
     589                             // flex     : 1,
     590                                //renderer : time_render ,
     591                                dataIndex: 'itemValue'
     592                            },
     593 
     594                            {
     595                                text     : '最小值',
     596                                width    : 70,
     597                             // flex     : 1,
     598                                //renderer : time_render ,
     599                                dataIndex: 'valueMinimum'
     600                            },
     601 
     602                            {
     603                                text     : '最大值',
     604                                width    : 70,
     605                             // flex     : 1,
     606                                //renderer : time_render ,
     607                                dataIndex: 'valueMaximum'
     608                            }
     609                     ] 
     610                     ,
     611             create : function(){
     612                 this.Grid = Ext.create('Ext.grid.Panel', {
     613 
     614                     title: '项值',
     615                     // height: common.gridHeight ,
     616                     // id : 'grid' ,
     617                     region: 'east',
     618                     flex: 1,
     619                     store: store.ruleItemValue.Store  ,
     620                     stateful: true ,
     621                     // collapsible: true ,
     622                     multiSelect: true ,
     623                     stateId: 'stateGrid' ,
     624                     selModel: Ext.create('Ext.selection.CheckboxModel')  ,
     625                     autoScroll: true ,
     626                     dockedItems: [
     627                                  toolBar.ruleItemValue.grid.toolBar
     628                     ], // end of dockedItems
     629                     
     630                     columns: this.columns ,
     631                     viewConfig: grid.viewConfig ,
     632                     bbar : toolBar.ruleItemValue.grid.pagingToolBar 
     633                     
     634                 }); // ruleGrid
     635             }
     636         } 
     637         ,
     638 
     639     viewConfig: {
     640         stripeRows: true,
     641         enableTextSelection: true ,
     642         listeners: {
     643             refresh: function( gridview ) {                
     644             }
     645         }
     646     }
     647     ,
     648     
     649     create : function(){
     650         
     651         this.rule.create() ;
     652         this.ruleItem.create() ;
     653         this.ruleItemValue.create() ;
     654         
     655     }
     656 } // grid
     657 ;
     658 
     659 grid.create() ;
     660 
     661 
     662 var form = {
     663         
     664         rule : {
     665             insertForm : null ,
     666             updateForm : null ,
     667             items : [
     668                      {
     669                              xtype: 'textfield',
     670                      name: 'bean.id',
     671                      hidden: true
     672                  } ,
     673                  {
     674                      xtype: 'textfield',
     675                      fieldLabel: '编号',
     676                      name: 'bean.number'
     677                  } ,
     678                  {
     679                      xtype: 'textfield',
     680                      fieldLabel: '名称',
     681                      name: 'bean.name'
     682                  } ] ,
     683             
     684             fillUpdateForm : function(){
     685 
     686 
     687                 var msg = '' ;
     688                 
     689                 var rows = grid.rule.Grid.getSelectionModel().getSelection();   
     690                         for( var i = 0; i < rows.length; i++){   
     691                             msg = msg + rows[i].get('name') + '
    ';   
     692                         }   
     693                         
     694                 consoleLog( rows ) ;
     695                         
     696                  if ( rows.length < 1) {
     697                      msg = msg + '尚未选择!' ;
     698                  } else {
     699                      
     700                      var f = this.updateForm.form ;
     701                         
     702                         f.setValues( { 'bean.id' : rows[0].get('id') } );   
     703                         f.setValues( { 'bean.number' : rows[0].get('number') } );   
     704                         f.setValues( { 'bean.name' : rows[0].get('name') } );   
     705                      
     706                  } ;
     707             }
     708             ,
     709             createInsertForm : function(){
     710                 
     711                 this.insertForm = Ext.create('Ext.form.Panel', {
     712                     
     713                     title: '' ,
     714                     // renderTo: 'newFormContainer',
     715                     bodyPadding: 5,
     716                     //  350,
     717                     // margin : '5 0 5 0' ,
     718                     border: 0,
     719                     shadow: false ,
     720 
     721                     // Any configuration items here will be automatically passed along to
     722                     // the Ext.form.Basic instance when it gets created.
     723 
     724                     // The form will submit an AJAX request to this URL when submitted
     725                     url: url.rule.insertAction ,
     726                     
     727 
     728                     // inline buttons
     729                     dockedItems: [
     730                     {
     731                         xtype: 'toolbar',
     732                         items: [
     733                                 {
     734                             text:'确认',
     735                             tooltip:'单击提交,将产生一条新记录。',
     736                             iconCls:'add' ,
     737 
     738                             handler: function() {
     739                                 // The getForm() method returns the Ext.form.Basic instance:
     740                                 var form = this.up('form').getForm() ;
     741                                 
     742                                 if ( form.isValid() ) {
     743                                     // Submit the Ajax request and handle the response
     744                                     form.submit({
     745                                         success: function( form, action ) {
     746                                             consoleLog( action ) ;
     747                                             Ext.Msg.alert('添加成功!', '记录已经添加。' );
     748                                             
     749                                             // newRecord.window.close();
     750                                             win.rule.insertWindow.close() ;
     751                                             
     752                                             form.reset();
     753                                             // gridPagingToolbar.doRefresh() ;
     754                                             toolBar.rule.grid.pagingToolBar.doRefresh() ;
     755                                             
     756                                         },
     757                                         failure: function(form, action) {
     758                                             Ext.Msg.alert("提示", "方法调用失败" );  
     759                                         }
     760                                     });
     761                                 }
     762                             }
     763                         
     764                         },'-',{
     765                             itemId: 'resetButton',
     766                             text:'重置',
     767                             tooltip:'Remove the selected item',
     768                             iconCls:'remove'
     769                             // disabled: true
     770                             ,
     771                             handler: function() {                                
     772                                 fn.resetForm( this.up('form').getForm() ) ;
     773                             } // handler
     774                         }
     775                         , 
     776 
     777                         {
     778                     text:'隐藏这个窗口',
     779                     tooltip:'单击提交,将产生一条新记录。',
     780                     iconCls:'add' ,
     781 
     782                     handler: function() {
     783                         win.rule.insertWindow.hide() ;
     784                     }
     785                 
     786                 }
     787                         
     788                         ]
     789                     }],
     790                     
     791                      layout: 'anchor',
     792                      defaults: {
     793                          anchor: '100%'
     794                      },
     795 
     796                     items: form.rule.items
     797                     
     798                 }); // Ext.create
     799             } ,
     800             
     801             createUpdateForm : function(){
     802                 
     803                 
     804                 this.updateForm = Ext.create('Ext.form.Panel', {
     805                     
     806                     title: '' ,
     807                     // renderTo: 'newFormContainer',
     808                     bodyPadding: 5,
     809                      350,
     810                     //margin : '5 0 5 0' ,
     811                     border: 0,
     812                     shadow: false ,
     813 
     814                     url: url.rule.updateAction ,                
     815 
     816                     dockedItems: [
     817                     {
     818                         xtype: 'toolbar',
     819                         items: [
     820                                 {
     821                             text:'确认',
     822                             tooltip:'单击提交,将执行修改操作。',
     823                             iconCls:'edit' ,
     824 
     825                             handler: function() {
     826                                 var form = this.up('form').getForm();
     827                                 
     828                                 if ( form.isValid() ) {
     829                                     form.submit({
     830                                         success: function( form, action ) {
     831 
     832                                             Ext.Msg.show({
     833                                                 title: '修改成功',
     834                                                 msg: '修改操作成功',
     835                                                  500,
     836                                                 buttons: Ext.Msg.OKCANCEL,
     837                                                 // multiline: true,
     838                                                 fn: function( btn, text ){
     839                                                     if ( btn == 'ok') {                                                             
     840                                                         win.rule.updateWindow.close( ) ;
     841                                                         toolBar.rule.grid.pagingToolBar.doRefresh() ;
     842                                                     }                                                
     843                                                 },
     844                                                 // animateTarget: 'addAddressBtn',
     845                                                 icon: Ext.window.MessageBox.INFO
     846                                             });
     847                                             
     848                                             
     849                                         },
     850                                         failure: function(form, action) {
     851                                             // Ext.Msg.alert('Failed', action.result ? action.result.message : 'No response');
     852                                             Ext.Msg.alert("提示", "方法调用失败" );  
     853                                         }
     854                                     });
     855                                 }
     856                             }
     857                         
     858                         },'-',{
     859                             itemId: 'resetButton',
     860                             text:'重置',
     861                             tooltip:'Remove the selected item',
     862                             iconCls:'remove' ,
     863                             handler: function() {
     864                                 fn.resetForm( this.up('form').getForm() ) ;                                
     865                             } // handler
     866                         }
     867                         , 
     868 
     869                         {
     870                     text:'隐藏这个窗口',
     871                     tooltip:'单击提交,将产生一条新记录。',
     872                     iconCls:'add' ,
     873 
     874                     handler: function() {
     875                         win.rule.updateWindow.hide() ;
     876                     }
     877                 
     878                 }
     879                         
     880                         ]
     881                     }],
     882 
     883                     items: form.rule.items
     884                     
     885                 }); // Ext.create            
     886                 
     887             } ,
     888         } 
     889         ,
     890         
     891         ruleItem : {
     892             insertForm : null ,
     893             updateForm : null ,
     894             items : [
     895                      {
     896                              xtype: 'textfield',
     897                      name: 'bean.id',
     898                      hidden: true
     899                  } ,
     900                  {
     901                          xtype: 'textfield',
     902                  name: 'bean.ruleId',
     903                  hidden: true
     904              } ,
     905              
     906              {
     907                     xtype : 'combo',
     908                     fieldLabel : '字段',
     909                     // id : 'warningLevel',
     910                     store :[['licenseNumber','号牌号码'],['pointNumber','卡口编号']],
     911                     // 100,
     912                     // value:'',
     913                     triggerAction: "all",
     914                     mode: "local",
     915                     allowBlank:false,
     916                      name: 'bean.fieldName'
     917                 }
     918              ,
     919          {
     920              xtype: 'textfield',
     921              fieldLabel: '备注',
     922              name: 'bean.comment'
     923          } ] ,
     924             
     925             fillUpdateForm : function(){
     926 
     927                 var msg = '' ;
     928                 
     929                 var rows = grid.ruleItem.Grid.getSelectionModel().getSelection();   
     930                         for( var i = 0; i < rows.length; i++){   
     931                             msg = msg + rows[i].get('name') + '
    ';   
     932                         }   
     933                         
     934                 consoleLog( rows ) ;
     935                         
     936                  if ( rows.length < 1) {
     937                      msg = msg + '尚未选择!' ;
     938                  } else {
     939                      
     940                      var f = this.updateForm.form ;
     941                         
     942                         f.setValues( { 'bean.id' : rows[0].get('id') } );   
     943                         f.setValues( { 'bean.fieldName' : rows[0].get('fieldName') } );   
     944                         f.setValues( { 'bean.comment' : rows[0].get('comment') } );   
     945                      
     946                  } ;
     947             }
     948             ,
     949             createInsertForm : function(){
     950 
     951                 this.insertForm = Ext.create('Ext.form.Panel', {
     952                     
     953                     title: '' ,
     954                     bodyPadding: 5,
     955                     border: 0,
     956                     shadow: false ,
     957                     url: url.ruleItem.insertAction ,
     958                     // inline buttons
     959                     dockedItems: [
     960                     {
     961                         xtype: 'toolbar',
     962                         items: [
     963                                 {
     964                             text:'确认',
     965                             tooltip:'单击提交,将产生一条新记录。',
     966                             iconCls:'add' ,
     967 
     968                             handler: function() {
     969                                 // The getForm() method returns the Ext.form.Basic instance:
     970                                 var form = this.up('form').getForm();
     971                                 
     972                                 if ( form.isValid() ) {
     973                                     // Submit the Ajax request and handle the response
     974                                     form.submit({
     975                                         success: function( form, action ) {
     976                                             consoleLog( action ) ;
     977                                             Ext.Msg.alert('添加成功!', '记录已经添加。' );
     978                                             
     979                                             // newRecord.window.close();
     980                                             win.ruleItem.insertWindow.close() ;
     981                                             
     982                                             form.reset();
     983                                             // gridPagingToolbar.doRefresh() ;
     984                                             toolBar.ruleItem.grid.pagingToolBar.doRefresh() ;
     985                                             
     986                                         },
     987                                         failure: function(form, action) {
     988                                             Ext.Msg.alert("提示", "方法调用失败" ) ;  
     989                                         }
     990                                     });
     991                                 }
     992                             }
     993                         
     994                         },'-',{
     995                             itemId: 'resetButton',
     996                             text:'重置',
     997                             tooltip:'Remove the selected item',
     998                             iconCls:'remove'
     999                             // disabled: true
    1000                             ,
    1001                             handler: function() {
    1002                                 var form = this.up('form').getForm();
    1003                                 fn.resetForm(form) ;                                
    1004                             } // handler
    1005                         }
    1006                         , 
    1007 
    1008                         {
    1009                     text:'隐藏这个窗口',
    1010                     tooltip:'单击提交,将产生一条新记录。',
    1011                     iconCls:'add' ,
    1012 
    1013                     handler: function() {
    1014                         win.ruleItem.insertWindow.hide() ;
    1015                     }
    1016                 
    1017                 }
    1018                         
    1019                         ]
    1020                     }],
    1021                     
    1022                      layout: 'anchor',
    1023                      defaults: {
    1024                          anchor: '100%'
    1025                      },
    1026 
    1027                     items: this.items
    1028                     
    1029                 }); // Ext.create
    1030             } ,
    1031             
    1032             createUpdateForm : function(){
    1033                 
    1034                 
    1035                 this.updateForm = Ext.create('Ext.form.Panel', {
    1036                     
    1037                     title: '' ,
    1038                     // renderTo: 'newFormContainer',
    1039                     bodyPadding: 5,
    1040                      350,
    1041                     //margin : '5 0 5 0' ,
    1042                     border: 0,
    1043                     shadow: false ,
    1044 
    1045                     url: url.ruleItem.updateAction ,                
    1046 
    1047                     dockedItems: [
    1048                     {
    1049                         xtype: 'toolbar',
    1050                         items: [
    1051                                 {
    1052                             text:'确认',
    1053                             tooltip:'单击提交,将执行修改操作。',
    1054                             iconCls:'edit' ,
    1055 
    1056                             handler: function() {
    1057                                 var form = this.up('form').getForm();
    1058                                 
    1059                                 if ( form.isValid() ) {
    1060                                     form.submit({
    1061                                         success: function( form, action ) {
    1062 
    1063                                             Ext.Msg.show({
    1064                                                 title: '修改成功',
    1065                                                 msg: '修改操作成功',
    1066                                                  500,
    1067                                                 buttons: Ext.Msg.OKCANCEL,
    1068                                                 // multiline: true,
    1069                                                 fn: function( btn, text ){
    1070                                                     if ( btn == 'ok') {                                                             
    1071                                                         win.ruleItem.updateWindow.close( ) ;
    1072                                                         toolBar.ruleItem.grid.pagingToolBar.doRefresh() ;
    1073                                                     }                                                
    1074                                                 },
    1075                                                 // animateTarget: 'addAddressBtn',
    1076                                                 icon: Ext.window.MessageBox.INFO
    1077                                             });
    1078                                             
    1079                                             
    1080                                         },
    1081                                         failure: function(form, action) {
    1082                                             // Ext.Msg.alert('Failed', action.result ? action.result.message : 'No response');
    1083                                             Ext.Msg.alert("提示", "方法调用失败" );  
    1084                                         }
    1085                                     });
    1086                                 }
    1087                             }
    1088                         
    1089                         },'-',{
    1090                             itemId: 'resetButton',
    1091                             text:'重置',
    1092                             tooltip:'Remove the selected item',
    1093                             iconCls:'remove'
    1094                             // disabled: true
    1095                             ,
    1096                             handler: function() {
    1097                                 var form = this.up('form').getForm();
    1098                                 fn.resetForm(form) ;                                
    1099                             } // handler
    1100                         }
    1101                         , 
    1102 
    1103                         {
    1104                     text:'隐藏这个窗口',
    1105                     tooltip:'单击提交,将产生一条新记录。',
    1106                     iconCls:'add' ,
    1107 
    1108                     handler: function() {
    1109                         win.ruleItem.updateWindow.hide() ;
    1110                     }
    1111                 
    1112                 }
    1113                         
    1114                         ]
    1115                     }],
    1116 
    1117                     items: this.items
    1118                     
    1119                 }); // Ext.create            
    1120                 
    1121             } ,
    1122 
    1123         } 
    1124         ,
    1125 
    1126         
    1127         ruleItemValue : {
    1128             insertForm : null ,
    1129             updateForm : null ,
    1130             items : [
    1131                      {
    1132                              xtype: 'textfield',
    1133                      name: 'bean.id',
    1134                      hidden: true
    1135                  } ,
    1136                  {
    1137                          xtype: 'textfield',
    1138                  name: 'bean.ruleItemId',
    1139                  hidden: true
    1140              } ,
    1141              
    1142              {
    1143                     xtype : 'combo',
    1144                     fieldLabel : '比对类型',
    1145                     // id : 'warningLevel',
    1146                     store :[['等于','等于'],['区间','区间']],
    1147                     // 100,
    1148                     // value:'',
    1149                     triggerAction: "all",
    1150                     mode: "local",
    1151                     allowBlank:false,
    1152                      name: 'bean.comparisonType'
    1153                 }
    1154              ,
    1155      {
    1156          xtype: 'textfield',
    1157          fieldLabel: '值',
    1158          name: 'bean.itemValue'
    1159      } ,
    1160      {
    1161          xtype: 'textfield',
    1162          fieldLabel: '最小值',
    1163          name: 'bean.valueMinimum'
    1164      } ,
    1165      {
    1166          xtype: 'textfield',
    1167          fieldLabel: '最大值',
    1168          name: 'bean.valueMaximum'
    1169      } ,
    1170      {
    1171          xtype: 'textfield',
    1172          fieldLabel: '备注',
    1173          name: 'bean.comment'
    1174      } ] ,
    1175             
    1176             fillUpdateform : function(){
    1177 
    1178 
    1179                 var msg = '' ;
    1180                 
    1181                 var rows = grid.ruleItemValue.Grid.getSelectionModel().getSelection();   
    1182                         for( var i = 0; i < rows.length; i++){   
    1183                             msg = msg + rows[i].get('name') + '
    ';   
    1184                         }   
    1185                         
    1186                 consoleLog( rows ) ;
    1187                         
    1188                  if ( rows.length < 1) {
    1189                      msg = msg + '尚未选择!' ;
    1190                  } else {
    1191                      
    1192                      var f = this.updateForm.form ;
    1193                         
    1194                         f.setValues( { 'bean.id' : rows[0].get('id') } );   
    1195                         f.setValues( { 'bean.comparisonType' : rows[0].get('comparisonType') } );   
    1196                         f.setValues( { 'bean.itemValue' : rows[0].get('itemValue') } );   
    1197                         f.setValues( { 'bean.valueMinimum' : rows[0].get('valueMinimum') } );   
    1198                         f.setValues( { 'bean.valueMaximum' : rows[0].get('valueMaximum') } );   
    1199                         f.setValues( { 'bean.comment' : rows[0].get('comment') } );   
    1200                      
    1201                  } ;
    1202             }
    1203             ,
    1204 
    1205 
    1206             createInsertForm : function(){
    1207 
    1208                 this.insertForm = Ext.create('Ext.form.Panel', {
    1209                     
    1210                     title: '' ,
    1211                     bodyPadding: 5,
    1212                     border: 0,
    1213                     shadow: false ,
    1214                     url: url.ruleItemValue.insertAction ,
    1215                     
    1216 
    1217                     // inline buttons
    1218                     dockedItems: [
    1219                     {
    1220                         xtype: 'toolbar',
    1221                         items: [
    1222                                 {
    1223                             text:'确认',
    1224                             tooltip:'单击提交,将产生一条新记录。',
    1225                             iconCls:'add' ,
    1226 
    1227                             handler: function() {
    1228                                 // The getForm() method returns the Ext.form.Basic instance:
    1229                                 var form = this.up('form').getForm();
    1230                                 
    1231                                 if ( form.isValid() ) {
    1232                                     // Submit the Ajax request and handle the response
    1233                                     form.submit({
    1234                                         success: function( form, action ) {
    1235                                             consoleLog( action ) ;
    1236                                             Ext.Msg.alert('添加成功!', '记录已经添加。' );
    1237                                             
    1238                                             // newRecord.window.close();
    1239                                             win.ruleItemValue.insertWindow.close() ;
    1240                                             
    1241                                             form.reset();
    1242                                             // gridPagingToolbar.doRefresh() ;
    1243                                             toolBar.ruleItemValue.grid.pagingToolBar.doRefresh() ;
    1244                                             
    1245                                         },
    1246                                         failure: function(form, action) {
    1247                                             Ext.Msg.alert("提示", "方法调用失败" ) ;  
    1248                                         }
    1249                                     });
    1250                                 }
    1251                             }
    1252                         
    1253                         },'-',{
    1254                             itemId: 'resetButton',
    1255                             text:'重置',
    1256                             tooltip:'Remove the selected item',
    1257                             iconCls:'remove'
    1258                             // disabled: true
    1259                             ,
    1260                             handler: function() {
    1261                                 fn.resetForm() ;
    1262                             } // handler
    1263                         }
    1264                         , 
    1265 
    1266                         {
    1267                     text:'隐藏这个窗口',
    1268                     tooltip:'单击提交,将产生一条新记录。',
    1269                     iconCls:'add' ,
    1270 
    1271                     handler: function() {
    1272                         win.ruleItemValue.insertWindow.hide() ;
    1273                     }
    1274                 
    1275                 }
    1276                         
    1277                         ]
    1278                     }],
    1279                     
    1280                      layout: 'anchor',
    1281                      defaults: {
    1282                          anchor: '100%'
    1283                      },
    1284 
    1285                     items: this.items
    1286                     
    1287                 }); // Ext.create
    1288             } ,
    1289             
    1290             createUpdateForm : function(){
    1291                 
    1292                 
    1293                 this.updateForm = Ext.create('Ext.form.Panel', {
    1294                     
    1295                     title: '' ,
    1296                     // renderTo: 'newFormContainer',
    1297                     bodyPadding: 5,
    1298                      350,
    1299                     //margin : '5 0 5 0' ,
    1300                     border: 0,
    1301                     shadow: false ,
    1302 
    1303                     url: url.ruleItemValue.updateAction ,                
    1304 
    1305                     dockedItems: [
    1306                     {
    1307                         xtype: 'toolbar',
    1308                         items: [
    1309                                 {
    1310                             text:'确认',
    1311                             tooltip:'单击提交,将执行修改操作。',
    1312                             iconCls:'edit' ,
    1313 
    1314                             handler: function() {
    1315                                 var form = this.up('form').getForm();
    1316                                 
    1317                                 if ( form.isValid() ) {
    1318                                     form.submit({
    1319                                         success: function( form, action ) {
    1320 
    1321                                             Ext.Msg.show({
    1322                                                 title: '修改成功',
    1323                                                 msg: '修改操作成功',
    1324                                                  500,
    1325                                                 buttons: Ext.Msg.OKCANCEL,
    1326                                                 // multiline: true,
    1327                                                 fn: function( btn, text ){
    1328                                                     if ( btn == 'ok') {                                                             
    1329                                                         win.ruleItemValue.updateWindow.close( ) ;
    1330                                                         toolBar.ruleItemValue.grid.pagingToolBar.doRefresh() ;
    1331                                                     }                                                
    1332                                                 },
    1333                                                 // animateTarget: 'addAddressBtn',
    1334                                                 icon: Ext.window.MessageBox.INFO
    1335                                             });
    1336                                             
    1337                                             
    1338                                         },
    1339                                         failure: function(form, action) {
    1340                                             // Ext.Msg.alert('Failed', action.result ? action.result.message : 'No response');
    1341                                             Ext.Msg.alert("提示", "方法调用失败" );  
    1342                                         }
    1343                                     });
    1344                                 }
    1345                             }
    1346                         
    1347                         },'-',{
    1348                             itemId: 'resetButton',
    1349                             text:'重置',
    1350                             tooltip:'Remove the selected item',
    1351                             iconCls:'remove'
    1352                             // disabled: true
    1353                             ,
    1354                             handler: function() {
    1355                                 fn.resetForm( this.up('form').getForm() ) ;
    1356                             } // handler
    1357                         }
    1358                         , 
    1359 
    1360                         {
    1361                     text:'隐藏这个窗口',
    1362                     tooltip:'单击提交,将产生一条新记录。',
    1363                     iconCls:'add' ,
    1364 
    1365                     handler: function() {
    1366                         win.ruleItemValue.updateWindow.hide() ;
    1367                     }
    1368                 
    1369                 }
    1370                         
    1371                         ]
    1372                     }],
    1373 
    1374                     items: this.items
    1375                     
    1376                 }); // Ext.create            
    1377                 
    1378             } ,
    1379 
    1380             
    1381         } 
    1382         ,
    1383                 
    1384          create : function(){
    1385 
    1386              this.rule.createInsertForm() ;
    1387              this.rule.createUpdateForm() ;
    1388              this.ruleItem.createInsertForm() ;
    1389              this.ruleItem.createUpdateForm() ;
    1390              this.ruleItemValue.createInsertForm() ;
    1391              this.ruleItemValue.createUpdateForm() ;
    1392              
    1393          } // create
    1394 } // form
    1395 ;
    1396 
    1397 form.create() ;
    1398 
    1399 
    1400 var viewport = {
    1401     
    1402     viewport : null ,
    1403     
    1404     north : {
    1405         
    1406         region: 'north',
    1407         xtype: 'box',
    1408         margin: '5 0 5 0',
    1409         padding: 5,
    1410         html: '<b ><span id="groupNameSpan"></span>规则管理页面 </b><span id="surveil_point_device_number" style="color: gray;"> </span>'
    1411     
    1412     } 
    1413     , // north
    1414     
    1415     // center : grid.surveilGrid ,
    1416     center : {
    1417         region: 'center' ,
    1418         layout: {
    1419             type: 'border',
    1420             padding: 0
    1421         },
    1422         border : 0 ,
    1423         autoScroll: true ,
    1424         defaults: {
    1425             padding: 1
    1426         } ,
    1427 //        defaults: {
    1428 //            layout: 'anchor',
    1429 //            defaults: {
    1430 //                anchor: '100%'
    1431 //            }
    1432 //        } ,
    1433         items: [ grid.rule.Grid, grid.ruleItem.Grid, grid.ruleItemValue.Grid ] ,
    1434         
    1435     } 
    1436     , // center
    1437     
    1438     east :     {
    1439         region: 'east',
    1440         autoScroll:true,
    1441         collapsible: true,
    1442         collapsed: true ,
    1443         floatable: true,
    1444         split: true,
    1445          390 ,
    1446         minWidth: 120,
    1447         minHeight: 140,
    1448         title: '右边栏' ,
    1449         layout: {
    1450             type: 'vbox' ,
    1451             padding: 5 ,
    1452             align: 'stretch'
    1453         } ,
    1454         items: [    
    1455                               
    1456                 {
    1457                     title: '帮助说明',
    1458                     collapsible: true,
    1459                     collapsed: false,
    1460                     contentEl: 'panel_帮助说明',
    1461                     //margin: '5 5 5 5',
    1462                     //bodyPadding: '5 5 5 5' ,
    1463                     bodyPadding: 5 ,
    1464                 }        
    1465         
    1466         ]
    1467     } ,
    1468     
    1469     create : function(){
    1470         
    1471         // grid.create() ;
    1472         
    1473         this.viewport = Ext.create('Ext.Viewport', {
    1474             
    1475             layout: {
    1476                 type: 'border',
    1477                 padding: 0
    1478             },
    1479             defaults: {
    1480                 split: true
    1481             },
    1482             
    1483              items:[
    1484                     
    1485                     this.north ,                      
    1486                     // grid.surveilGrid , // center
    1487                     this.center ,
    1488                     this.east 
    1489                  
    1490                  ],
    1491          }); // i.viewport.viewport 
    1492         
    1493     } // create
    1494 } // viewport
    1495 ;
    1496 
    1497 
    1498 
    1499 var win = {
    1500     
    1501     configs : {
    1502         
    1503             height: 500,
    1504              800,        
    1505             // autoScroll : true ,
    1506             layout: 'fit',            // 内部元素布局方式{absolute accordion anchor border card column fit form table}
    1507             maximizable: true,          //是否可以最大化
    1508             // minimizable: true,          //是否可以最小化
    1509             closable: true,            // 是否可以关闭
    1510             closeAction: 'hide',        //窗口关闭的方式:hide/close
    1511             modal: false,                //是否为模态窗口
    1512             resizable: true           //是否可以改变窗口大小
    1513     } ,
    1514 
    1515     rule : {
    1516         insertWindow : null ,
    1517         updateWindow : null ,
    1518         createInsert : function(){
    1519 
    1520             win.configs.title =  '添加规则' ;
    1521             win.configs.items = [ form.rule.insertForm ] ;
    1522             this.insertWindow = Ext.create( 'Ext.window.Window', win.configs ) ;
    1523         } ,
    1524         createUpdate : function(){
    1525             
    1526             win.configs.title =  '修改规则' ;
    1527             win.configs.items = [ form.rule.updateForm ] ;
    1528             this.updateWindow = Ext.create( 'Ext.window.Window', win.configs ) ;
    1529         } ,
    1530     } ,
    1531     
    1532     ruleItem : {
    1533         insertWindow : null ,
    1534         updateWindow : null ,
    1535         createInsert : function(){
    1536 
    1537             win.configs.title =  '添加规则项' ;
    1538             win.configs.items = [ form.ruleItem.insertForm ] ;
    1539             this.insertWindow = Ext.create( 'Ext.window.Window', win.configs ) ;
    1540         } ,
    1541         createUpdate : function(){
    1542 
    1543             win.configs.title =  '修改规则项' ;
    1544             win.configs.items = [ form.ruleItem.updateForm ] ;
    1545             this.updateWindow = Ext.create( 'Ext.window.Window', win.configs ) ;
    1546         } ,
    1547     } ,
    1548     
    1549     ruleItemValue : {
    1550         insertWindow : null ,
    1551         updateWindow : null ,
    1552         createInsert : function(){
    1553 
    1554             win.configs.title =  '添加项值' ;
    1555             win.configs.items = [ form.ruleItemValue.insertForm ] ;
    1556             this.insertWindow = Ext.create( 'Ext.window.Window', win.configs ) ;
    1557         } ,
    1558         createUpdate : function(){
    1559 
    1560             win.configs.title =  '修改项值' ;
    1561             win.configs.items = [ form.ruleItemValue.updateForm ] ;
    1562             this.updateWindow = Ext.create( 'Ext.window.Window', win.configs ) ;
    1563         } ,
    1564     } ,
    1565     
    1566     create : function() {
    1567 
    1568         this.rule.createInsert() ;
    1569         this.rule.createUpdate() ;
    1570         this.ruleItem.createInsert() ;
    1571         this.ruleItem.createUpdate() ;
    1572         this.ruleItemValue.createInsert() ;
    1573         this.ruleItemValue.createUpdate() ;
    1574         
    1575     }
    1576     
    1577 } // window
    1578 ;
    1579 
    1580 win.create() ;
    1581 
    1582 
    1583 var task = {
    1584 
    1585         run : function() {
    1586 
    1587             setTimeout( function(){ 
    1588                 store.surveilGrid[0].load() ;
    1589                 fn.pictureReload( 0 );
    1590                 }, 0 ) ;
    1591             setTimeout( function(){ store.matchGrid[0].load() ; }, 3000 ) ;
    1592             setTimeout( function(){ store.uploadGrid[0].load() ; }, 6000 ) ;
    1593             
    1594             setTimeout( function(){ store.surveilGrid[1].load() ; fn.pictureReload( 1 );}, 9000 ) ;
    1595             setTimeout( function(){ store.matchGrid[1].load() ; }, 12000 ) ;
    1596             setTimeout( function(){ store.uploadGrid[1].load() ; }, 15000 ) ;
    1597             
    1598             setTimeout( function(){ store.surveilGrid[2].load() ; fn.pictureReload( 2 );}, 18000 ) ;
    1599             setTimeout( function(){ store.matchGrid[2].load() ; }, 21000 ) ;
    1600             setTimeout( function(){ store.uploadGrid[2].load() ; }, 24000 ) ;
    1601             
    1602             
    1603         },
    1604         interval : 27000
    1605         // interval : function(){ return Ext.fly('config_interval_seconds').value ; }
    1606         // 1 second
    1607 
    1608     };
    1609 
    1610 
    1611 var fn = {
    1612         
    1613         rule : {
    1614             
    1615             insert : function(){
    1616                 win.rule.insertWindow.show( ) ;
    1617             } ,
    1618             
    1619             update : function(){
    1620                 
    1621                 var rows = grid.rule.Grid.getSelectionModel().getSelection() ;   
    1622              
    1623                  if ( rows.length < 1) {
    1624                      Ext.Msg.alert("信息提示","请选择需要修改的数据!");
    1625                  } else {
    1626                     // consoleLog( rows ) ;
    1627                     form.rule.fillUpdateForm() ;
    1628                     win.rule.updateWindow.show() ;
    1629                  }
    1630             } ,
    1631             
    1632             del : function(){
    1633 
    1634                 
    1635                 var rows = grid.rule.Grid.getSelectionModel().getSelection();   
    1636                         
    1637                  if ( rows.length < 1) {
    1638 //                     msg = msg + '尚未选择!' ;
    1639                      Ext.Msg.alert("信息提示","请选择需要删除的数据!");
    1640                  } else {
    1641                      
    1642 
    1643                         Ext.Msg.show({
    1644                             title: '请您确认',
    1645                             msg: '确定要删除吗?确定请按“OK”键,且不可恢复 !',
    1646                              500,
    1647                             buttons: Ext.Msg.OKCANCEL,
    1648                             // multiline: true,
    1649                             fn: function( btn, text ){
    1650                                 if ( btn == 'ok') {
    1651                                 consoleLog( btn ) ;
    1652                                 var ids = '0' ;
    1653                                  for( var i = 0; i < rows.length; i++){   
    1654                                         ids = ids + ',' + rows[i].get('id') ;
    1655                                     }  ;
    1656                                     consoleLog( ids ) ;
    1657                                     
    1658                                     Ext.Ajax.request({
    1659                                         url: url.rule.deleteAction ,
    1660                                         method: 'POST' ,
    1661                                         params: {
    1662                                             'bean.ids' : ids
    1663                                         },
    1664                                         success: function(response){
    1665                                             consoleLog( response.responseText ) ;
    1666                                             // process server response here
    1667 
    1668                                             toolBar.rule.grid.pagingToolBar.doRefresh() ;
    1669                                             
    1670                                         }
    1671                                     }); // request
    1672                                 }
    1673                             }, // fn
    1674                             // animateTarget: 'addAddressBtn',
    1675                             icon: Ext.window.MessageBox.INFO
    1676                         }); // Msg.show()
    1677                      
    1678                  } ;
    1679             }
    1680         } ,
    1681         
    1682         ruleItem :{
    1683             insert : function() {
    1684                 
    1685                 var p = store.ruleItem.Store.proxy.extraParams ;                        
    1686                 var ruleId = p['bean.ruleId'] ;
    1687 
    1688                  if ( typeof( ruleId ) == 'undefined' || ruleId < 1) {
    1689                      Ext.Msg.alert('错误', '请您先在左侧的列表中选择一条规则,以产生数据关联!' );
    1690                  } else {                     
    1691                      var f = form.ruleItem.insertForm.form ;                        
    1692                      f.setValues( { 'bean.ruleId' : ruleId } );
    1693                      win.ruleItem.insertWindow.show() ;
    1694                  } ;
    1695             } ,
    1696             update : function() {
    1697                 
    1698                 var rows = grid.ruleItem.Grid.getSelectionModel().getSelection();   
    1699              
    1700                  if ( rows.length < 1) {
    1701                      Ext.Msg.alert("信息提示","请选择需要修改的数据!");
    1702                  } else {
    1703                     form.ruleItem.fillUpdateForm() ;
    1704                     win.ruleItem.updateWindow.show() ;
    1705                  }
    1706             } ,
    1707             del : function() {
    1708                 
    1709                 var rows = grid.ruleItem.Grid.getSelectionModel().getSelection();   
    1710                         
    1711                  if ( rows.length < 1) {
    1712 //                     msg = msg + '尚未选择!' ;
    1713                      Ext.Msg.alert("信息提示","请选择需要删除的数据!");
    1714                  } else {
    1715 
    1716                         Ext.Msg.show({
    1717                             title: '请您确认',
    1718                             msg: '确定要删除吗?确定请按“OK”键,且不可恢复 !',
    1719                              500,
    1720                             buttons: Ext.Msg.OKCANCEL,
    1721                             // multiline: true,
    1722                             fn: function( btn, text ){
    1723                                 if ( btn == 'ok') {
    1724                                 consoleLog( btn ) ;
    1725                                 var ids = '0' ;
    1726                                  for( var i = 0; i < rows.length; i++){   
    1727                                         ids = ids + ',' + rows[i].get('id') ;
    1728                                     }  ;
    1729                                     consoleLog( ids ) ;
    1730                                     
    1731                                     Ext.Ajax.request({
    1732                                         url: url.ruleItem.deleteAction ,
    1733                                         method: 'POST' ,
    1734                                         params: {
    1735                                             'bean.ids' : ids
    1736                                         },
    1737                                         success: function(response){
    1738                                             toolBar.ruleItem.grid.pagingToolBar.doRefresh() ;
    1739                                         }
    1740                                     }); // request
    1741                                 }
    1742                             }, // fn
    1743                             // animateTarget: 'addAddressBtn',
    1744                             icon: Ext.window.MessageBox.INFO
    1745                         }); // Msg.show()
    1746                      
    1747                  } ;
    1748             }
    1749         } ,
    1750         
    1751         ruleItemValue :{
    1752             insert : function() {
    1753                 
    1754                 var p = store.ruleItemValue.Store.proxy.extraParams ;                        
    1755                 var ruleItemId = p['bean.ruleItemId'] ;
    1756 
    1757                  if ( typeof( ruleItemId ) == 'undefined' || ruleItemId < 1) {
    1758                      Ext.Msg.alert('错误', '请您先在左侧的列表中选择一条规则,以产生数据关联!' );
    1759                  } else {                     
    1760                      var f = form.ruleItemValue.insertForm.form ;                        
    1761                      f.setValues( { 'bean.ruleItemId' : ruleItemId } );
    1762                      win.ruleItemValue.insertWindow.show() ;
    1763                  } ;
    1764             } ,
    1765             update : function() {
    1766                 
    1767                 var rows = grid.ruleItemValue.Grid.getSelectionModel().getSelection();   
    1768              
    1769                  if ( rows.length < 1) {
    1770                      Ext.Msg.alert("信息提示","请选择需要修改的数据!");
    1771                  } else {
    1772                     form.ruleItemValue.fillUpdateform() ;
    1773                     win.ruleItemValue.updateWindow.show() ;
    1774                  }
    1775             } ,
    1776             del : function() {
    1777                 
    1778                 var rows = grid.ruleItemValue.Grid.getSelectionModel().getSelection();   
    1779                         
    1780                  if ( rows.length < 1) {
    1781 //                     msg = msg + '尚未选择!' ;
    1782                      Ext.Msg.alert("信息提示","请选择需要删除的数据!");
    1783                  } else {
    1784                      
    1785 
    1786                         Ext.Msg.show({
    1787                             title: '请您确认',
    1788                             msg: '确定要删除吗?确定请按“OK”键,且不可恢复 !',
    1789                              500,
    1790                             buttons: Ext.Msg.OKCANCEL,
    1791                             // multiline: true,
    1792                             fn: function( btn, text ){
    1793                                 if ( btn == 'ok') {
    1794                                 consoleLog( btn ) ;
    1795                                 var ids = '0' ;
    1796                                  for( var i = 0; i < rows.length; i++){   
    1797                                         ids = ids + ',' + rows[i].get('id') ;
    1798                                     }  ;
    1799                                     consoleLog( ids ) ;
    1800                                     
    1801                                     Ext.Ajax.request({
    1802                                         url: url.ruleItemValue.deleteAction ,
    1803                                         method: 'POST' ,
    1804                                         params: {
    1805                                             'bean.ids' : ids
    1806                                         },
    1807                                         success: function(response){
    1808                                             consoleLog( response.responseText ) ;
    1809                                             // process server response here
    1810 
    1811                                             toolBar.ruleItemValue.grid.pagingToolBar.doRefresh() ;
    1812                                             
    1813                                         }
    1814                                     }); // request
    1815                                 }
    1816                             }, // fn
    1817                             // animateTarget: 'addAddressBtn',
    1818                             icon: Ext.window.MessageBox.INFO
    1819                         }); // Msg.show()
    1820                      
    1821                  } ;
    1822             }
    1823         } ,
    1824         
    1825     showRuleUpdateWindow : function( record ){        
    1826         fn.ruleItemReload( record.getData().id ) ;
    1827         fn.ruleItemValueReload( 0 ) ;        
    1828     }
    1829     ,
    1830 
    1831     
    1832     ruleItemReload : function( i ){
    1833         
    1834         store.ruleItem.Store.proxy.extraParams = {
    1835                 'bean.ruleId' : i ,
    1836         } ;        
    1837         store.ruleItem.Store.load() ;
    1838         
    1839     }
    1840     ,        
    1841     ruleItemValueReload : function( i ){
    1842         
    1843         store.ruleItemValue.Store.proxy.extraParams = {
    1844                 'bean.ruleItemId' : i ,
    1845         } ;
    1846         store.ruleItemValue.Store.load( ) ;
    1847         
    1848     }
    1849     ,
    1850     resetForm: function( form ) {            
    1851         
    1852         // http://localhost:8080/ExtJS/docs/index.html#!/api/Ext.window.MessageBox-method-show
    1853         Ext.Msg.show({
    1854             title: '请您确认',
    1855             msg: '确定要重置表单吗? 选择“OK”后,所有填写内容将被清空,且不可恢复 !',
    1856              500,
    1857             buttons: Ext.Msg.OKCANCEL,
    1858             // multiline: true,
    1859             fn: function( btn, text ){
    1860                 if ( btn == 'ok') form.reset() ;
    1861                 consoleLog( btn ) ;
    1862             },
    1863             // animateTarget: 'addAddressBtn',
    1864             icon: Ext.window.MessageBox.INFO
    1865         });
    1866         
    1867     } // handler
    1868         
    1869 }
    1870 ;
    1871 
    1872 var listener = {
    1873         init: function(){
    1874             // 
    1875             grid.rule.Grid.on({
    1876                 'cellclick'       : grid.rule.onCellClick ,
    1877                 'celldblclick' : grid.rule.onCellDblClick
    1878             })
    1879             ;            
    1880             grid.ruleItem.Grid.on({
    1881                 'cellclick'       : grid.ruleItem.onCellClick ,
    1882                 'celldblclick' : grid.ruleItem.onCellDblClick
    1883             })
    1884             ;        
    1885             grid.ruleItemValue.Grid.on({
    1886                 'cellclick'       : grid.ruleItemValue.onCellClick ,
    1887                 'celldblclick' : grid.ruleItemValue.onCellDblClick
    1888             })
    1889             ;
    1890         }
    1891 } 
    1892 ;
    1893 
    1894 
    1895 var start = function(){
    1896     
    1897 
    1898     var bd = Ext.getBody( ) ;
    1899     var loadingText = bd.createChild({tag: 'h2', html: 'Form 1 - Very Simple'});
    1900 
    1901     // Ext.tip.QuickTipManager.init() ;
    1902     
    1903     viewport.create() ;
    1904 
    1905     store.rule.Store.load() ;
    1906     
    1907     
    1908     // store.ruleItemGrid.load() ;
    1909     
    1910     // Ext.TaskManager.start( task );    
    1911     
    1912     loadingText.remove() ;
    1913     
    1914     listener.init() ;
    1915     
    1916 } ; // start
    1917 
    1918 
    1919 
    1920 
    1921 Ext.onReady( function () {
    1922     start() ;
    1923 });
    View Code

    最后还是惯例,来张片片:

  • 相关阅读:
    promise实现(未实现微任务)
    fastclick猜的原理
    js进制
    如何造一个好的组件库【有空就更新】
    BEM的命名
    unicode、utf-32、utf-8、utf-16
    getElementsByTagName、getElementsByClassName与querySelectorAll的区别
    为什么vue中没有事件委托/事件代理的概念
    vscode注释param
    复制dom
  • 原文地址:https://www.cnblogs.com/livon/p/3213636.html
Copyright © 2020-2023  润新知