Pman.Tab.PersonList.js
[Pman.Core] / Pman.Tab.PersonList.js
1 //<script type="text/javascript">
2
3 /**
4  * 
5  * generic person list - used by perms. and staff lists.
6  * 
7  */
8
9
10
11 Pman.Tab.PersonList = function(config)
12 {
13     Ext.apply(this, config);
14 }
15
16 Pman.Tab.PersonList.prototype = {
17     
18     //--- things that should be set!!!!
19     id : '',  // should be set to something!
20     type : 0, // means!! = 0 = Groups (perms) 1= teams - loose grouping..
21     title : false,
22     hiddenColumns: false,  // lsit of cols to hide..
23     itemDisplayName : false, /// eg "Staff Employees / Contacts etc."
24     permName : 'Core.Person', // or 'Core.Staff'
25     getLeftSelections : function() { return []; },
26     hideDelete : false,
27     
28     // beforeload handler... -- override on extended versions..
29     beforeload: function(t, o) {
30         //console.log(o.params);
31         // teams!?!
32         alert('person list not configured');
33         return false;
34         var tms = _this.getLeftSelections();
35         
36         if (tms.length) {
37             o.params['query[in_group]'] = tms[0].data.id;
38         }
39         o.params['query[name]'] = this.searchBox.getValue();
40         o.params['query[type]'] = this.type; // group type..
41         o.params['query[person_internal_only_all]'] = 1;
42         o.params['query[person_inactive]'] = this.showInActive ? 0  : 1;
43         
44     },
45     
46     columns : function()
47     {
48         alert('person list not configured');
49         return false;
50         return [
51             this.c_name(),
52             this.c_office_id_name(),
53             this.c_role(),
54             this.c_phone(),
55             this.c_fax(),
56             this.c_email(),
57             this.c_active()
58         ]
59     },
60     
61     dialog: function () {
62         alert('person list not configured');
63         return false;
64         return Pman.Dialog.PersonStaff;
65     },
66     bulkAdd : function() {
67         //return Pman.Dialog.PersonBulkAdd
68         return false;
69     },
70     newDefaults : function() {
71         alert('person list not configured');
72         return false;
73         return {
74             
75             id : 0,
76             company_id : Pman.Login.authUser.company_id,
77             company_id_name : Pman.Login.authUser.company_id_name,
78             company_id_address : Pman.Login.authUser.company_id_address,
79             company_id_tel : Pman.Login.authUser.company_id_tel,
80             company_id_fax : Pman.Login.authUser.company_id_fax
81         };
82     },
83          
84     
85     
86     /// --- end extendable bits...
87     
88     
89     parentLayout : false,
90     showInActive : 0,  // toggle var for hiding and showing active staff..
91     grid : false,
92     panel : false,
93     toolbar : false,
94     paging:  false,
95     tab: false,
96     
97     
98     refreshWestPanel : function() /// used wher???
99     {
100         var actpan = this.parentLayout.getRegion('west').getActivePanel();
101         if (actpan && actpan.controller) {
102             actpan.controller.paging.onClick('refresh');
103             return;
104         }
105         // depreciated..    
106     
107         if (!actpan || !actpan.id) {
108             return;
109         }
110         Pman.Tab[actpan.id].refresh();
111     },
112     
113     refresh: function(){
114         if (!this.paging) {
115             this.delayedCreate();
116         }
117         this.paging.onClick('refresh');
118     },
119     
120     loadFirst: function(){
121         if (!this.paging) {
122             this.delayedCreate();
123         }
124         this.paging.onClick('first');
125     },  
126     
127     
128     
129     add : function(parentLayout, region) {
130         
131         var _this = this;
132         if (this.tab) {
133             parentLayout.getRegion(region).showPanel(this.panel);
134             return;
135         }
136         this.parentLayout = parentLayout;
137         
138         this.layout = new Ext.BorderLayout(
139             parentLayout.getEl().createChild({tag:'div'}),
140             {
141                
142                 center: {
143                     autoScroll:true,
144                     hideTabs: true
145                 }
146             }
147         );
148
149
150
151         this.tab = parentLayout.add(region,  new Ext.NestedLayoutPanel(
152             this.layout, {title: this.title, background: true, controller : this}));
153
154         this.tab.on('activate', function() {
155             _this.delayedCreate();
156            // _this.paging.onClick('refresh');
157         });
158     },
159     delayedCreate : function () 
160      
161     {
162         var _this = this;
163         if (this.grid) {
164             return;
165         }
166         
167         var refreshPager = function() {
168             _this.refresh();
169         }
170         this.layout.beginUpdate();
171         
172         var frm = this.layout.getRegion('center').getEl().createChild({tag:'div'});
173         //this.grid = new Ext.grid.EditorGrid(frm,  {
174         this.grid = new Ext.grid.Grid(frm,  {
175                 ddGroup: 'groupDD',
176                 //enableDrag: true,
177                 enableDrag: true,
178                 id: this.id + '-grid',
179                 ds:   new Ext.data.Store({
180                     // load using HTTP
181                     proxy: new Ext.data.HttpProxy({
182                         url: baseURL + '/Roo/Person.html',
183                         method: 'GET'
184                     }),
185                     reader: Pman.Readers.Person,
186                     remoteSort: true,
187                     listeners : {
188                         
189                         beforeload: function(t, o) {
190                             //console.log(o.params);
191                             // teams!?!
192                             return _this.beforeload(t,o);
193                              
194                             
195                         },
196                         loadexception : Pman.loadException
197                     
198                     },
199                     sortInfo: {
200                         field: 'name', direction: 'ASC'
201                     }
202                 }),
203                 cm: new Ext.grid.ColumnModel(
204                     this.columns()
205                 ),
206                 autoExpandColumn: _this.id + '-name' , // fixme!!!!
207                 clicksToEdit : 1,
208                 
209                 loadMask: true,
210
211                 listeners : {
212                     rowdblclick : function(g, ri, e) {
213                         var s = g.getDataSource().getAt(ri).data;
214                         if (_this.dialog() && Pman.hasPerm(_this.permName, 'E')) {
215                             _this.dialog().show(s,refreshPager);
216                         }
217                         
218                         
219                     },
220                     cellclick : function (_self, rowIndex, columnIndex, e)
221                     {
222                         var di = this.colModel.getDataIndex(colIndex);
223                         if (di != 'active') {
224                             return;
225                         }
226                          
227                         var rec = _this.grid.ds.getAt(rowIndex);
228                         
229                         rec.set('active', rec.data.active ? 0 : 1);
230                         rec.commit();
231                          
232                         
233                         
234                     }
235                     
236                 }
237                  
238                  
239         });
240         this.panel  = this.layout.add('center',  new Ext.GridPanel(this.grid , {
241                 fitToframe: true,
242                 fitContainer: true, 
243                 id: this.id, 
244                 title: this.title || "Staff", 
245                 controller : this 
246             })
247         );
248         this.grid.render();
249         
250         if (this.hiddenColumns) {
251             var cm = this.grid.getColumnModel();
252             Roo.each(this.hiddenColumns, function(c) {
253                 cm.setHidden(cm.getIndexByDataIndex(c), true);
254             });
255         }
256         
257
258         
259         var gridFoot = this.grid.getView().getFooterPanel(true);
260         this.paging = new Ext.PagingToolbar(gridFoot, this.grid.getDataSource(), {
261             pageSize: 25,
262             displayInfo: true,
263             displayMsg: "Displaying " + (this.itemDisplayName || "Staff") + " {0} - {1} of {2}",
264             emptyMsg: "No " + (this.itemDisplayName || "Staff") + " found"
265         });
266         var grid = this.grid;
267  
268     
269         this.toolbar = new Ext.Toolbar(this.grid.getView().getHeaderPanel(true));
270         
271         var tb = this.toolbar;
272         
273         
274         if (this.parentLayout.getRegion('west') && this.parentLayout.getRegion('west').panels.length) {
275                 
276             this.paging.add( 
277                 '<b><i><font color="red">'+ 
278                     (this.type ?
279                         "Drag person to add or remove from group" :
280                         "Drag person to add or remove from team"
281                     ) +
282                 '</font></i></b>'
283             );
284         }
285         
286         var _this = this;
287         if (this.permName == 'Core.Staff') {
288                 
289             this.paging.add( '-',
290                 {
291                     text: "Show old staff",
292                     pressed: false,
293                     enableToggle: true,
294                     toggleHandler: function(btn,pressed) {
295                         _this.showInActive = (pressed ? 1 : 0);
296                         btn.setText(pressed ? "Hide old staff": "Show old staff" );
297                         refreshPager();
298                     }
299                 }, 
300                 
301                
302                 '-'
303             );
304         }
305         
306      
307         this.searchBox = new Ext.form.TextField({
308             name: 'search',
309             width:135,
310             listeners : {
311                 specialkey : function(f,e)
312                 {
313                     
314                     if (e.getKey() == 13) {
315                         
316                         refreshPager();
317                     } 
318                    
319                 
320                 }
321             }
322          
323         });
324         var dg = _this.dialog();
325         tb.add(
326             {
327                 text: "Add",
328                 cls: 'x-btn-text-icon',
329                 icon: Ext.rootURL + 'images/default/dd/drop-add.gif',
330                 hidden :  !dg || (_this.newDefaults() === false) || !Pman.hasPerm(this.permName, 'A'),  
331                 handler : function(){
332                     dg.show(  _this.newDefaults(), refreshPager );  
333                 }
334             }, 
335              { ///... for contacts stuff...
336                 text: "Bulk Add",
337                 cls: 'x-btn-text-icon',
338                 icon: Ext.rootURL + 'images/default/dd/drop-add.gif',
339                 hidden : !this.bulkAdd() || !Pman.hasPerm(this.permName, 'A'),    
340                 handler : function(){
341                     
342                    // Pman.Dialog.PersonBulkAdd.show( {  id : 0 }, refreshPager ); 
343                    _this.bulkAdd().show( {  id : 0 }, refreshPager ); 
344                 }
345             },
346
347             {
348                 text: "Edit",
349                 cls: 'x-btn-text-icon',
350                 icon: Ext.rootURL + 'images/default/tree/leaf.gif',
351                 hidden : !dg || !Pman.hasPerm(this.permName, 'E'),    
352                 handler : function(){
353                     var s = grid.getSelectionModel().getSelections();
354                     if (!s.length || (s.length > 1))  {
355                         Ext.MessageBox.alert("Error", s.length ? "Select only one Row" : "Select a Row");
356                         return;
357                     }
358                     dg.show( s[0].data,refreshPager);
359                  }
360             }, 
361             {
362                 text: "Toogle Active",
363                 cls: 'x-btn-text-icon',
364                 icon:   rootURL + '/Pman/templates/images/trash.gif',
365                 hidden : (this.permName != 'Core.Staff') || !Pman.hasPerm(this.permName, 'E'),   // SPECIFIC TO STAFF!!!!!!
366                 handler : function(){
367                  
368                     var s = grid.getSelectionModel().getSelections();
369                     if (!s.length  )  {
370                         Ext.MessageBox.alert("Error",  "Select People Row");
371                         return;
372                     }
373                     var r = [];
374                     for(var i = 0; i < s.length; i++) {
375                         r.push(s[i].data.id);
376                     }
377                 
378                 
379                 
380                     grid.getView().mainWrap.mask("Sending");
381
382                     
383                     Ext.Ajax.request({
384                         url: baseURL + '/Roo/Person.html',
385                         method: 'GET',
386                         params: {
387                             _toggleActive : r.join(',')
388                         },
389                         success: function(resp) {
390                             var res = Pman.processResponse(resp);
391                             grid.getView().mainWrap.unmask();
392                             if (!res.success) {
393                                 Ext.MessageBox.alert("Error", res.errorMsg ? res.errorMsg  : "Error Sending");
394                                 return;
395                             }
396                             refreshPager();
397                             
398                         },
399                         failure: function(act) {
400                             grid.getView().mainWrap.unmask();
401                             Ext.MessageBox.alert("Error", "Error Sending");
402                         }
403                         
404                     });
405                 }
406                 
407             }, 
408             {
409                 text: "Delete",
410                 cls: 'x-btn-text-icon',
411                 hidden : (this.permName == 'Core.Staff') ||  !Pman.hasPerm('Core.Person', 'D') || this.hideDelete,    
412                 icon: rootURL + '/Pman/templates/images/trash.gif',
413                 handler : function(){
414                     Pman.genericDelete(_this, 'Person'); 
415                 }
416             } ,
417
418            
419             '-',
420             'Search: ',
421              
422             this.searchBox,
423         
424             {
425                 
426                
427                 icon: rootURL + '/Pman/templates/images/search.gif', // icons can also be specified inline
428                 cls: 'x-btn-icon',
429                 qtip: "Search",
430                 handler : function () { 
431                     _this.grid.getSelectionModel().clearSelections();
432
433                     refreshPager();
434                 }
435             },   
436              {
437                 
438                
439                 icon: rootURL + '/Pman/templates/images/edit-clear.gif', // icons can also be specified inline
440                 cls: 'x-btn-icon',
441                 qtip: "Reset Search",
442                 handler : function () {
443                     _this.searchBox.setValue('');
444                     _this.grid.getSelectionModel().clearSelections();
445
446                     refreshPager();
447                 }
448             }
449             
450
451         );
452         
453             
454         //this.toolbar = tb;
455         // add stuff to toolbar?
456         //this.innerLayout.endUpdate();
457          this.layout.endUpdate();
458
459         
460         
461     },
462     /*
463     show: function (parentLayout, region)
464     {
465         this.add(parentLayout, region);
466         this.grid.getDataSource().load({
467             params: {
468                 start:0, 
469                 limit:25
470             }
471         });
472
473     },
474     */
475     
476     c_project_id_code : function(cfg) {
477         cfg = cfg || {};
478         return Roo.apply({               
479             header : "Project",
480             dataIndex : 'project_id_code',
481             sortable : false,
482             width : 70,
483             renderer : function(v,x,r) {
484                 return String.format('<span qtip="{0}">{1}</span>', 
485                     r.data.action_type,
486                     v);
487             }
488         },cfg);
489     },
490
491     
492     
493     
494     c_name : function(cfg) {
495         cfg = cfg || {};
496         return Roo.apply({
497             id : this.id + '-name',
498             header : "Name",
499             dataIndex : 'name',
500             sortable : true,
501             width : 150  
502         }, cfg);
503     },
504      c_company_id_comptype : function(cfg) {
505         cfg = cfg || {};
506         return Roo.apply({
507             header : "Company Type",
508             dataIndex : 'company_id_comptype',
509             sortable : true,
510             width : 70
511         }, cfg);
512     },
513     
514     c_company_id_name : function(cfg) {
515         cfg = cfg || {};
516         return Roo.apply({
517             header : "Company / Office",
518             dataIndex : 'company_id_name',
519             sortable : true,
520             width : 150,
521             renderer: function(v,x,r) {
522                 return String.format('{0}{1}{2}', 
523                     v,
524                     r.data.office_id ? ' / ' : '',
525                     r.data.office_id_name);
526             }
527
528         }, cfg);
529     },
530     
531     c_office_id_name : function(cfg) {
532         cfg = cfg || {};
533         return Roo.apply({
534             header : "Office / Dept.",
535             dataIndex : 'office_id_name',
536             sortable : true,
537             width : 150  
538         }, cfg);
539         
540     },
541     c_role : function(cfg) {
542         cfg = cfg || {};
543         return Roo.apply({
544             header : "Role / Position",
545             dataIndex : 'role',
546             sortable : true,
547             width : 100
548         }, cfg);
549         
550     },
551     c_phone : function(cfg) {
552         cfg = cfg || {};
553         return Roo.apply({
554             header : "Phone",
555             dataIndex : 'phone',
556             sortable : true,
557             width : 70
558         }, cfg);
559         
560     },
561     c_fax : function(cfg) {
562         cfg = cfg || {};
563         return Roo.apply({
564             header : "Fax",
565             dataIndex : 'fax',
566             sortable : true,
567             width : 70
568         }, cfg);
569         
570     },
571     c_email : function(cfg) {
572         cfg = cfg || {};
573         return Roo.apply({
574             header : "Email",
575             dataIndex : 'email',
576             sortable : true,
577             width : 150,
578             renderer : function (v) {
579                 return (v.length && v.indexOf('@') > 0 ) ? 
580                     String.format('<a href="mailto:{0}">{0}</a>',v) : v;
581             }
582         }, cfg);
583         
584     },
585     c_active : function(cfg) {
586         cfg = cfg || {};
587         return Roo.apply({
588             header : "Active",
589             dataIndex : 'active',
590             sortable : true,
591             width : 50,
592             renderer : function(v) {
593                 // work out what the column is..
594                 
595                 var state = v> 0 ?  '-checked' : '';
596
597                 return '<img class="x-grid-check-icon' + state + '" src="' + Ext.BLANK_IMAGE_URL + '"/>';
598                 
599                 
600             }
601
602         }, cfg);
603         
604     }
605      
606     
607     
608 };
609 // need two version of this 
610 // (one can be used as edit + ProjectDirectory ADD)
611 // - the other one needs selection combos's for company / office
612
613