git.roojs.org Git - Pman.Builder/blob - Pman.Builder.Wizard.js

   1 /**
   2  * Code for wizards
   3  *
   4  * properties are
   5  * [Roo.grid.grid] << convert a cfg into a table.
   6  * [Roo.grid.grid-edit] << create a config from a tree.
   7  *
   8  *
   9  * My initial idea was to parse the existing nodes, to generate the cfg.
  10  * -- this is far too complicated..
  11  * -- let's go back to the idea of storing the config on the relivant nodes.
  12  * -- The downside is that if you modify the children, then the wizard will
  13  *    not know about those columns. etc..
  14  *
  15  *
  16  *
  17  */
  18
  19
  20 Pman.Builder.Wizard = {
  21
  22     typemap : {
  23         'bool' : 'boolean',
  24
  25         'date' : 'date',
  26         'datetime' : 'date',
  27         'time' : 'string', //bogus
  28
  29         'int' : 'int',
  30         'int4' : 'int',
  31         'bigint' : 'int',
  32         'tinyint' : 'int',
  33         'smallint' : 'int',
  34         'timestamp' : 'number',
  35
  36         'double' : 'float',
  37         'decimal' : 'float',
  38         'float' : 'float',
  39
  40         'char' : 'string',
  41         'varchar' : 'string',
  42         'text' : 'string',
  43         'longtext' : 'string',
  44         'tinytext' : 'string',
  45         'mediumtext' : 'string',
  46         'enum' : 'string',
  47
  48         'blob' : 'string'
  49     },
  50     /**
  51      * auto builders..
  52      * @param {Object} cfg the configuration
  53      * @param {Object} old the previous def...
  54      *  - table
  55      *  - cols_ex : [ name, name]
  56      *  - cols : [
  57      *      { column : name
  58      *        ctype : ctype,
  59      *        desc : desc
  60      *      }
  61      *   ]
  62      * // usage:
  63       - gen config - prior to editing
  64         -- builds up 'cfg'
  65      *
  66      */
  67    'Roo.GridPanel' : function(cfg, old)
  68     {
  69
  70         var _t = this;
  71         old = old || {};
  72
  73         var gi = _t['Roo.grid.Grid'](cfg);
  74         gi['*prop'] = 'grid';
  75
  76         return {
  77             '|xns' : 'Roo',
  78             xtype : "GridPanel",
  79             '.builderCfg' : Roo.encode(cfg),
  80             title : cfg.table,
  81             fitToframe : true,
  82             fitContainer : true,
  83             tableName: cfg.table,
  84             background: true,
  85             region : 'center',
  86             listeners : {
  87                 "|activate": "function() {\n    _this.panel = this;\n    if (_this.grid) {\n        _this.grid.footer.onClick('first');\n    }\n}"
  88             },
  89             items: [ gi ]
  90
  91         };
  92     },
  93
  94     'Roo.grid.Grid' : function(cfg, old)
  95     {
  96
  97         var _t = this;
  98         old = old || {};
  99
 100
 101
 102         var colmodel = []
 103         Roo.each(cfg.cols, function(cc) {
 104             colmodel.push( _t['Roo.grid.ColumnModel'](cc) );
 105         })
 106
 107         var dataSource = _t['Roo.data.Store'](cfg);
 108         dataSource['*prop'] = 'dataSource';
 109
 110         return  {
 111             "xtype": "Grid",
 112             '.builderCfg' :  Roo.encode(cfg),
 113             "autoExpandColumn": cfg.cols_ex[0],
 114             "loadMask": true,
 115             "listeners": {
 116                 "|render": "function() \n" +
 117                     "{\n" +
 118                     "    _this.grid = this; \n" +
 119                     "    //_this.dialog = Pman.Dialog.FILL_IN\n" +
 120                     "    if (_this.panel.active) {\n" +
 121                     "       this.footer.onClick('first');\n" +
 122                     "    }\n" +
 123                     "}",
 124                 "|rowdblclick": "function (_self, rowIndex, e)\n" +
 125                     "{\n" +
 126                     "    if (!_this.dialog) return;\n" +
 127                     "    _this.dialog.show( this.getDataSource().getAt(rowIndex), function() {\n" +
 128                     "        _this.grid.footer.onClick('first');\n" +
 129                     "    }); \n" +
 130                     "}\n"
 131             },
 132             "|xns": "Roo.grid",
 133
 134             "items": [
 135                 dataSource,
 136                 {
 137                     "*prop": "footer",
 138                     "xtype": "PagingToolbar",
 139                     "pageSize": 25,
 140                     "displayInfo": true,
 141                     "displayMsg": "Displaying " + cfg.table + "{0} - {1} of {2}",
 142                     "emptyMsg": "No " + cfg.table + " found",
 143                     "|xns": "Roo"
 144                 },
 145                 {
 146                     "*prop": "toolbar",
 147                     "xtype": "Toolbar",
 148                     "|xns": "Roo",
 149                     "items": [
 150                         {
 151                             "text": "Add",
 152                             "xtype": "Button",
 153                             "cls": "x-btn-text-icon",
 154                             "|icon": "Roo.rootURL + 'images/default/dd/drop-add.gif'",
 155                             "listeners": {
 156                                 "|click": "function()\n"+
 157                                     "{\n"+
 158                                     "    if (!_this.dialog) return;\n" +
 159                                     "    _this.dialog.show( { id : 0 } , function() {\n"+
 160                                     "        _this.grid.footer.onClick('first');\n"+
 161                                     "   }); \n"+
 162                                     "}\n"
 163                             },
 164                             "|xns": "Roo.Toolbar"
 165                         },
 166                         {
 167                             "text": "Edit",
 168                             "xtype": "Button",
 169                             "cls": "x-btn-text-icon",
 170                             "|icon": "Roo.rootURL + 'images/default/tree/leaf.gif'",
 171                             "listeners": {
 172                                 "|click": "function()\n"+
 173                                     "{\n"+
 174                                     "    var s = _this.grid.getSelectionModel().getSelections();\n"+
 175                                     "    if (!s.length || (s.length > 1))  {\n"+
 176                                     "        Roo.MessageBox.alert(\"Error\", s.length ? \"Select only one Row\" : \"Select a Row\");\n"+
 177                                     "        return;\n"+
 178                                     "    }\n"+
 179                                     "    if (!_this.dialog) return;\n" +
 180                                     "    _this.dialog.show(s[0].data, function() {\n"+
 181                                     "        _this.grid.footer.onClick('first');\n"+
 182                                     "    }); \n"+
 183                                     "    \n"+
 184                                     "}\n"
 185
 186                             },
 187                             "|xns": "Roo.Toolbar"
 188                         },
 189                         {
 190                             "text": "Delete",
 191                             "cls": "x-btn-text-icon",
 192                             "|icon": "rootURL + '/Pman/templates/images/trash.gif'",
 193                             "xtype": "Button",
 194                             "listeners": {
 195                                 "|click": "function()\n"+
 196                                     "{\n"+
 197                                     "     Pman.genericDelete(_this, '" + cfg.table + "'); \n"+
 198                                     "}\n"+
 199                                     "        "
 200                             },
 201                             "|xns": "Roo.Toolbar"
 202                         }
 203                     ]
 204                 }, // end toolbar
 205             ].concat( colmodel)
 206         };
 207     },
 208
 209
 210     'Roo.data.Store' : function(cfg, old)
 211     {
 212         var _t = this;
 213         old = old || false;
 214
 215
 216
 217         var jreader = _t['Roo.data.JsonReader'](cfg);
 218         return  {
 219
 220             "xtype": "Store",
 221             "|xns": "Roo.data",
 222              '.builderCfg' :  Roo.encode(cfg),
 223              remoteSort : true,
 224             '|sortInfo' : "{ field : '" +  cfg.cols_ex[0]  +  "', direction: 'ASC' }",
 225             "items": [
 226                 {
 227                     "*prop": "proxy",
 228                     "xtype": "HttpProxy",
 229                     "method": "GET",
 230                     "|url": "baseURL + '/Roo/" +cfg.table + ".php'",
 231                     "|xns": "Roo.data"
 232                 },
 233                 jreader
 234             ]
 235         };
 236
 237     },
 238
 239
 240     'Roo.data.JsonReader' : function(cfg, old)
 241     {
 242         // simple version to start with..
 243
 244
 245
 246
 247         var _t = this;
 248         old = old || false;
 249
 250         var fields = [];
 251
 252         Roo.each(cfg.cols, function(cc) {
 253             var ty = typeof(_t.typemap[cc.ctype]) == 'undefined' ? 'string' : _t.typemap[cc.ctype];
 254             if (cc.ctype == 'string' ) {
 255                 fields.push(cc.column);
 256                 return;
 257             }
 258             fields.push({ name : cc.column, type : _t.typemap[cc.ctype]} );
 259         });
 260
 261
 262        return {
 263
 264             '|xns' : 'Roo.data',
 265             xtype : "JsonReader",
 266             totalProperty : "total",
 267             root : "data",
 268             '.builderCfg' :  Roo.encode(cfg),
 269             '*prop' : "reader",
 270             id : 'id', // maybe no..
 271
 272             '|fields' :  JSON.stringify(fields, null,4).replace(/"/g,"'")
 273         };
 274     },
 275
 276
 277     'Roo.grid.ColumnModel' : function(rcfg, old)
 278     {
 279         // simple version to start with..
 280         var ty = typeof(this.typemap[rcfg.ctype]) == 'undefined' ? 'string' : this.typemap[rcfg.ctype];
 281
 282         // some special kludges..
 283         // remove table prefix..
 284
 285         var desc = rcfg.columnshort;
 286         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 287             desc = desc.substring(rcfg.table.length+1);
 288         }
 289         desc = desc.replace(/_id$/, '');
 290
 291         if (!desc.length) {
 292             desc = rcfg.column;
 293         }
 294
 295
 296
 297         return {
 298             "xtype": "ColumnModel",
 299             '.builderCfg' : Roo.encode(rcfg),
 300             "header": rcfg.desc.length ? rcfg.desc : desc,
 301             "width":  ty == 'string' ? 200 : 75,
 302             "dataIndex": rcfg.column,
 303             "|renderer": ty != 'date' ?
 304                     "function(v) { return String.format('{0}', v); }" :
 305                     "function(v) { return String.format('{0}', v ? v.format('d/M/Y') : ''); }" , // special for date
 306             "|xns": "Roo.grid",
 307             "*prop": "colModel[]"
 308         };
 309     },
 310
 311
 312
 313     'Roo.LayoutDialog' : function(rcfg, old)
 314     {
 315         // simple version to start with..
 316         var _t = this;
 317
 318         var frmCfg =    _t['Roo.form.Form'](rcfg, old);
 319
 320         // loop through the cols..
 321         // we need a 'display column' for each of these.
 322         // we could also have a 'renderer'...
 323
 324
 325
 326
 327         var formHeight = (frmCfg.items.length * 25) + 80; // work out from number of form ites..
 328
 329         return {
 330             xtype : 'LayoutDialog',
 331             "|xns": "Roo",
 332             '.builderCfg' : Roo.encode(rcfg),
 333
 334             closable : false,
 335             collapsible: false,
 336             modal : true,
 337             height : formHeight,
 338             resizable: true,
 339             title: "Edit / Create " + rcfg.table,
 340             width: 500,
 341
 342
 343             items  : [
 344                 {
 345                     "|xns": "Roo",
 346                     "xtype": "LayoutRegion",
 347                     "*prop": "center"
 348                 },
 349                 {
 350                     "region": "center",
 351                     "xtype": "ContentPanel",
 352                     "|xns": "Roo",
 353                     "items": [
 354                         frmCfg
 355                     ]
 356                 },
 357                  {
 358                     "listeners": {
 359                         "click": "function (_self, e)\n{\n    _this.dialog.hide();\n}"
 360                     },
 361                     "*prop": "buttons[]",
 362                     "text": "Cancel",
 363                     "xtype": "Button",
 364                     "|xns": "Roo"
 365                 },
 366                 {
 367                     "listeners": {
 368                         "click": "function (_self, e)\n{\n    // do some checks?\n     \n    \n    _this.dialog.el.mask(\"Saving\");\n    _this.form.doAction(\"submit\");\n\n}"
 369                     },
 370                     "*prop": "buttons[]",
 371                     "text": "Save",
 372                     "xtype": "Button",
 373                     "|xns": "Roo"
 374                 }
 375             ]
 376         };
 377     },
 378     'Roo.form.Form' : function(rcfg, old)
 379     {
 380         // simple version to start with..
 381         var _t = this;
 382
 383         var formElements = [];
 384
 385         var fcombo = function(cn) {
 386             var cret = '';
 387
 388             Roo.each(rcfg.cols_ex, function(n) {
 389
 390                 Roo.log(
 391                         ['match' , n , 'to', cn, n.substring(0,cn.length) ].join(' ')
 392                     );
 393                 if (n.substring(0,cn.length) == cn) {
 394                     cret = n;
 395                     return false;
 396                 }
 397                 return true;
 398             });
 399             Roo.log("RETURN: " + cret);
 400             return cret;
 401         }
 402
 403         Roo.each(rcfg.cols, function(cc) {
 404
 405             var ty = typeof(_t.typemap[cc.ctype]) == 'undefined' ? 'string' : _t.typemap[cc.ctype];
 406
 407             if (ty == 'string' ) {
 408                 formElements.push( _t['Roo.form.TextField'](cc, {}));
 409                 return;
 410             }
 411             if (ty  == 'date' ) {
 412                 formElements.push( _t['Roo.form.DateField'](cc, {}));
 413                 return;
 414             }
 415             if (ty  == 'float' ) {
 416                 formElements.push( _t['Roo.form.NumberField'](cc, {}));
 417                 return;
 418             }
 419             if (ty  == 'int' ) {
 420                 cc.display = fcombo(cc.column);
 421                 if (cc.deps && cc.display.length) {
 422                    formElements.push( _t['Roo.form.ComboBox'](cc, {}));
 423                     return;
 424                 }
 425                 formElements.push( _t['Roo.form.NumberField'](cc, {}));
 426                 return;
 427             }
 428
 429
 430         });
 431
 432
 433
 434         return {
 435             xtype : "Form",
 436             '|xns' : 'Roo.form',
 437             listeners : {
 438                 "|actioncomplete" : "function(_self,action)\n"+
 439                     "{\n"+
 440                     "    if (action.type == 'setdata') {\n"+
 441                     "       //this.load({ method: 'GET', params: { '_id' : _this.data.id }});\n"+
 442                     "       return;\n"+
 443                     "    }\n"+
 444                     "    if (action.type == 'load') {\n"+
 445                     "        return;\n"+
 446                     "    }\n"+
 447                     "    if (action.type =='submit') {\n"+
 448                     "    \n"+
 449                     "        _this.dialog.hide();\n"+
 450                     "    \n"+
 451                     "         if (_this.callback) {\n"+
 452                     "            _this.callback.call(_this, _this.form.getValues());\n"+
 453                     "         }\n"+
 454                     "         _this.form.reset();\n"+
 455                     "         return;\n"+
 456                     "    }\n"+
 457                     "}\n",
 458
 459                 "|rendered" : "function (form)\n"+
 460                     "{\n"+
 461                     "    _this.form= form;\n"+
 462                     "}\n"
 463             },
 464             method : "POST",
 465             style : "margin:10px;",
 466             "|url" : "baseURL + '/Roo/" + rcfg.table + ".php'",
 467             items : formElements
 468         };
 469
 470     },
 471     'Roo.form.TextField' : function(rcfg, old)
 472     {
 473         var desc = rcfg.columnshort;
 474         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 475             desc = desc.substring(rcfg.table.length+1);
 476         }
 477         desc = desc.replace(/_id$/, '');
 478
 479         if (!desc.length) {
 480             desc = rcfg.column;
 481         }
 482
 483         return {
 484             xtype : 'TextField',
 485             '|xns' : 'Roo.form',
 486             fieldLabel : desc,
 487             name : rcfg.column,
 488             width : 200
 489         };
 490
 491
 492     },
 493
 494     'Roo.form.NumberField' : function(rcfg, old)
 495     {
 496         var desc = rcfg.columnshort;
 497         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 498             desc = desc.substring(rcfg.table.length+1);
 499         }
 500         desc = desc.replace(/_id$/, '');
 501
 502         if (!desc.length) {
 503             desc = rcfg.column;
 504         }
 505
 506         return {
 507             xtype : 'NumberField',
 508             '|xns' : 'Roo.form',
 509             fieldLabel : desc,
 510             name : rcfg.column,
 511             width : 100,
 512             align : 'right'
 513         };
 514
 515     },
 516
 517      'Roo.form.DateField' : function(rcfg, old)
 518     {
 519         var desc = rcfg.columnshort;
 520         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 521             desc = desc.substring(rcfg.table.length+1);
 522         }
 523         desc = desc.replace(/_id$/, '');
 524
 525         if (!desc.length) {
 526             desc = rcfg.column;
 527         }
 528
 529         return {
 530             xtype : 'NumberField',
 531             '|xns' : 'Roo.form',
 532             fieldLabel : desc,
 533             name : rcfg.column,
 534             width : 100,
 535             format : 'Y-m-d'
 536         };
 537
 538     },
 539
 540     'Roo.form.ComboBox' : function(rcfg, old)
 541     {
 542         /*
 543          * We need:
 544          *   localtable:
 545          *      the column
 546          *      table name.
 547          *   remote table:
 548          *      table name
 549          *      column 'it maps to'
 550          *      title column
 551          *
 552          *
 553          *
 554          */
 555
 556
 557
 558
 559         var desc = rcfg.columnshort;
 560         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 561             desc = desc.substring(rcfg.table.length+1);
 562         }
 563         desc = desc.replace(/_id$/, '');
 564
 565         if (!desc.length) {
 566             desc = rcfg.column;
 567         }
 568
 569         // set the display column (from the remote table)
 570         var display = rcfg.display;
 571         Roo.each(rcfg.deps, function(dn) {
 572             if (dn.column == rcfg.display) {
 573                 display = dn.columnshort;
 574             }
 575
 576         });
 577
 578         var table = rcfg.deps[0].table;
 579
 580         // a reader...( basic as we do meta queries to get the real one..)
 581
 582         var combofields = [
 583             { name : rcfg.maps_to, type : 'int' },
 584             display
 585         ];
 586
 587
 588         return {
 589             '|xns' : 'Roo.form',
 590             xtype: 'ComboBox',
 591
 592             allowBlank : false,
 593             editable : false,
 594             emptyText : 'Select ' + table,
 595             forceSelection : true,
 596             listWidth : 400,
 597             loadingText: 'Searching...',
 598             minChars : 2,
 599             pageSize : 20,
 600             qtip: 'Select ' + table,
 601             selectOnFocus: true,
 602             triggerAction : 'all',
 603             typeAhead: true,
 604
 605             width: 300,
 606
 607             tpl : '<div class="x-grid-cell-text x-btn button"><b>{'+ display + '}</b> </div>',
 608             queryParam : 'query['+display+']',
 609             fieldLabel : desc,
 610
 611             // from remote..
 612             valueField : rcfg.maps_to,
 613             displayField : display,
 614
 615             // from our table..
 616             hiddenName : rcfg.column,
 617             name : rcfg.column + '_' + display,
 618
 619             items : [
 620                 {
 621                     '*prop' : 'store',
 622                     '|xns' : 'Roo.data',
 623                     '|sortInfo' : '{ direction : \'ASC\', field: \'' + display  +'\' }',
 624                     xtype : 'Store',
 625
 626                     remoteSort : true,
 627
 628                     listeners : {
 629                         '|beforeload' : 'function (_self, o)' +
 630                         "{\n" +
 631                         "    o.params = o.params || {};\n" +
 632                         "    // set more here\n" +
 633                         "}\n"
 634                     },
 635                     items : [
 636                         {
 637                             '*prop' : 'proxy',
 638                             'xtype' : 'HttpProxy',
 639                             'method' : 'GET',
 640                             '|xns' : 'Roo.data',
 641                             '|url' : "baseURL + '/Roo/" + table + ".php'"
 642                         },
 643
 644                         {
 645                             '*prop' : 'reader',
 646                             'xtype' : 'JsonReader',
 647                             '|xns' : 'Roo.data',
 648                             'id' : rcfg.maps_to,
 649                             'root' : 'data',
 650                             'totalProperty' : 'total',
 651                             '|fields' : JSON.stringify(combofields)
 652
 653                         }
 654                     ]
 655                 }
 656             ]
 657         };
 658
 659     }
 660
 661
 662 }