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' : 'date', // for postgres... it's a date!??
  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).data, 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         if (rcfg.title && rcfg.title.length) {
 295             desc = rcfg.title;
 296         }
 297
 298
 299         return {
 300             "xtype": "ColumnModel",
 301             '.builderCfg' : Roo.encode(rcfg),
 302             "header":   desc,
 303             "width":  ty == 'string' ? 200 : 75,
 304             "dataIndex": rcfg.column,
 305             "|renderer": ty != 'date' ?
 306                     "function(v) { return String.format('{0}', v); }" :
 307                     "function(v) { return String.format('{0}', v ? v.format('d/M/Y') : ''); }" , // special for date
 308             "|xns": "Roo.grid",
 309             "*prop": "colModel[]"
 310         };
 311     },
 312
 313
 314
 315     'Roo.LayoutDialog' : function(rcfg, old)
 316     {
 317         // simple version to start with..
 318         var _t = this;
 319
 320         var frmCfg =    _t['Roo.form.Form'](rcfg, old);
 321
 322         // loop through the cols..
 323         // we need a 'display column' for each of these.
 324         // we could also have a 'renderer'...
 325
 326
 327
 328
 329         var formHeight = (frmCfg.items.length * 25) + 100; // work out from number of form ites..
 330
 331         return {
 332             xtype : 'LayoutDialog',
 333             "|xns": "Roo",
 334             '.builderCfg' : Roo.encode(rcfg),
 335
 336             closable : false,
 337             collapsible: false,
 338             modal : true,
 339             height : formHeight,
 340             resizable: true,
 341             title: "Edit / Create " + rcfg.table,
 342             width: 500,
 343
 344
 345             items  : [
 346                 {
 347                     "|xns": "Roo",
 348                     "xtype": "LayoutRegion",
 349                     "*prop": "center"
 350                 },
 351                 {
 352                     "region": "center",
 353                     "xtype": "ContentPanel",
 354                     "|xns": "Roo",
 355                     "items": [
 356                         frmCfg
 357                     ]
 358                 },
 359                  {
 360                     "listeners": {
 361                         "click": "function (_self, e)\n{\n    _this.dialog.hide();\n}"
 362                     },
 363                     "*prop": "buttons[]",
 364                     "text": "Cancel",
 365                     "xtype": "Button",
 366                     "|xns": "Roo"
 367                 },
 368                 {
 369                     "listeners": {
 370                         "click": "function (_self, e)\n{\n    // do some checks?\n     \n    \n    _this.dialog.el.mask(\"Saving\");\n    _this.form.doAction(\"submit\");\n\n}"
 371                     },
 372                     "*prop": "buttons[]",
 373                     "text": "Save",
 374                     "xtype": "Button",
 375                     "|xns": "Roo"
 376                 }
 377             ]
 378         };
 379     },
 380     'Roo.form.Form' : function(rcfg, old)
 381     {
 382         // simple version to start with..
 383         var _t = this;
 384
 385         var formElements = [];
 386
 387         var fcombo = function(cn) {
 388             var cret = '';
 389
 390             Roo.each(rcfg.cols_ex, function(n) {
 391
 392                 Roo.log(
 393                         ['match' , n , 'to', cn, n.substring(0,cn.length) ].join(' ')
 394                     );
 395                 if (n.substring(0,cn.length) == cn) {
 396                     cret = n;
 397                     return false;
 398                 }
 399                 return true;
 400             });
 401             Roo.log("RETURN: " + cret);
 402             return cret;
 403         }
 404
 405         Roo.each(rcfg.cols, function(cc) {
 406
 407             var ty = typeof(_t.typemap[cc.ctype]) == 'undefined' ? 'string' : _t.typemap[cc.ctype];
 408
 409             if (ty == 'string' ) {
 410                 formElements.push( _t['Roo.form.TextField'](cc, {}));
 411                 return;
 412             }
 413             if (ty  == 'date' ) {
 414                 formElements.push( _t['Roo.form.DateField'](cc, {}));
 415                 return;
 416             }
 417             if (ty  == 'float' ) {
 418                 formElements.push( _t['Roo.form.NumberField'](cc, {}));
 419                 return;
 420             }
 421             if (ty  == 'int' ) {
 422                 cc.display = fcombo(cc.column);
 423                 if (cc.deps && cc.display.length) {
 424                    formElements.push( _t['Roo.form.ComboBox'](cc, {}));
 425                     return;
 426                 }
 427                 formElements.push( _t['Roo.form.NumberField'](cc, {}));
 428                 return;
 429             }
 430
 431
 432         });
 433
 434
 435
 436         return {
 437             xtype : "Form",
 438             '|xns' : 'Roo.form',
 439             listeners : {
 440                 "|actioncomplete" : "function(_self,action)\n"+
 441                     "{\n"+
 442                     "    if (action.type == 'setdata') {\n"+
 443                     "       //this.load({ method: 'GET', params: { '_id' : _this.data.id }});\n"+
 444                     "       return;\n"+
 445                     "    }\n"+
 446                     "    if (action.type == 'load') {\n"+
 447                     "        return;\n"+
 448                     "    }\n"+
 449                     "    if (action.type =='submit') {\n"+
 450                     "    \n"+
 451                     "        _this.dialog.hide();\n"+
 452                     "    \n"+
 453                     "         if (_this.callback) {\n"+
 454                     "            _this.callback.call(_this, _this.form.getValues());\n"+
 455                     "         }\n"+
 456                     "         _this.form.reset();\n"+
 457                     "         return;\n"+
 458                     "    }\n"+
 459                     "}\n",
 460
 461                 "|rendered" : "function (form)\n"+
 462                     "{\n"+
 463                     "    _this.form= form;\n"+
 464                     "}\n"
 465             },
 466             method : "POST",
 467             style : "margin:10px;",
 468             "|url" : "baseURL + '/Roo/" + rcfg.table + ".php'",
 469             items : formElements
 470         };
 471
 472     },
 473     'Roo.form.TextField' : function(rcfg, old)
 474     {
 475         var desc = rcfg.columnshort;
 476         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 477             desc = desc.substring(rcfg.table.length+1);
 478         }
 479         desc = desc.replace(/_id$/, '');
 480
 481         if (!desc.length) {
 482             desc = rcfg.column;
 483         }
 484         if (rcfg.title && rcfg.title.length) {
 485             desc = rcfg.title;
 486         }
 487
 488         return {
 489             xtype : 'TextField',
 490             '|xns' : 'Roo.form',
 491             fieldLabel : desc,
 492             name : rcfg.column,
 493             width : 300
 494         };
 495
 496
 497     },
 498
 499     'Roo.form.NumberField' : function(rcfg, old)
 500     {
 501         var desc = rcfg.columnshort;
 502         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 503             desc = desc.substring(rcfg.table.length+1);
 504         }
 505         desc = desc.replace(/_id$/, '');
 506
 507         if (!desc.length) {
 508             desc = rcfg.column;
 509         }
 510         if (rcfg.title && rcfg.title.length) {
 511             desc = rcfg.title;
 512         }
 513         return {
 514             xtype : 'NumberField',
 515             '|xns' : 'Roo.form',
 516             fieldLabel : desc,
 517             name : rcfg.column,
 518             width : 100,
 519             align : 'right'
 520         };
 521
 522     },
 523
 524      'Roo.form.DateField' : function(rcfg, old)
 525     {
 526         var desc = rcfg.columnshort;
 527         if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 528             desc = desc.substring(rcfg.table.length+1);
 529         }
 530         desc = desc.replace(/_id$/, '');
 531
 532         if (!desc.length) {
 533             desc = rcfg.column;
 534         }
 535         if (rcfg.title && rcfg.title.length) {
 536             desc = rcfg.title;
 537         }
 538         return {
 539             xtype : 'NumberField',
 540             '|xns' : 'Roo.form',
 541             fieldLabel : desc,
 542             name : rcfg.column,
 543             width : 100,
 544             format : 'Y-m-d'
 545         };
 546
 547     },
 548
 549     'Roo.form.ComboBox' : function(in_rcfg, old)
 550     {
 551         /*
 552          * We need:
 553          *   localtable:
 554          *      the column
 555          *      table name.
 556          *   remote table:
 557          *      table name
 558          *      column 'it maps to'
 559          *      title column
 560          *
 561          *
 562          *
 563          */
 564         var rcfg = in_rcfg;
 565         var table , desc, display, idcol, hiddenName, name;
 566
 567         // rcfg can be one of two things: (from a form)
 568         // or direct..
 569         if (rcfg.cols) {
 570             display = rcfg.cols_ex[0];
 571
 572
 573             table = rcfg.table;
 574
 575             var ix = rcfg.cols[0].columnshort == display ? 0 : 1;
 576
 577             idcol =  rcfg.cols[ ix ? 0 : 1 ].columnshort;
 578
 579             desc = rcfg.cols[ix].title;
 580             if (!desc.length) {
 581                 desc = rcfg.cols[ix].column;
 582                 if (desc.substring(0, table.length+1) == table+'_') {
 583                     desc = desc.substring(table.length+1);
 584                 }
 585                 desc = desc.replace(/_id$/, '');
 586                 if (!desc.length) {
 587                     desc = rcfg.cols[0].column;
 588                 }
 589             }
 590             combofields = [
 591                 { name : idcol, type : 'int' },
 592                 display
 593             ];
 594             hiddenName = idcol;
 595             name = display;
 596
 597         } else {
 598
 599
 600
 601             desc = rcfg.columnshort;
 602             if (desc.substring(0, rcfg.table.length+1) == rcfg.table+'_') {
 603                 desc = desc.substring(rcfg.table.length+1);
 604             }
 605             desc = desc.replace(/_id$/, '');
 606
 607             if (!desc.length) {
 608                 desc = rcfg.column;
 609             }
 610             if (rcfg.title && rcfg.title.length) {
 611                 desc = rcfg.title;
 612             }
 613             // set the display column (from the remote table)
 614             display = rcfg.display;
 615             Roo.each(rcfg.deps, function(dn) {
 616                 if (dn.column == rcfg.display) {
 617                     display = dn.columnshort;
 618                 }
 619
 620             });
 621
 622             table = rcfg.deps[0].table;
 623             idcol =  rcfg.maps_to;
 624             hiddenName  = rcfg.column;
 625             name = rcfg.column + '_' + display;
 626
 627         }
 628         // a reader...( basic as we do meta queries to get the real one..)
 629         var combofields = [
 630                 { name : idcol , type : 'int' },
 631                 display
 632             ];
 633
 634
 635         return {
 636             '|xns' : 'Roo.form',
 637             xtype: 'ComboBox',
 638
 639             allowBlank : false,
 640             editable : false,
 641             emptyText : 'Select ' + table,
 642             forceSelection : true,
 643             listWidth : 400,
 644             loadingText: 'Searching...',
 645             minChars : 2,
 646             pageSize : 20,
 647             qtip: 'Select ' + table,
 648             selectOnFocus: true,
 649             triggerAction : 'all',
 650             typeAhead: true,
 651
 652             width: 300,
 653
 654             tpl : '<div class="x-grid-cell-text x-btn button"><b>{'+ display + '}</b> </div>',
 655             queryParam : 'query['+display+']',
 656             fieldLabel : desc,
 657
 658             // from remote..
 659             valueField : idcol,
 660             displayField : display,
 661
 662             // from our table..
 663             hiddenName : hiddenName,
 664             name : name,
 665
 666             items : [
 667                 {
 668                     '*prop' : 'store',
 669                     '|xns' : 'Roo.data',
 670                     '|sortInfo' : '{ direction : \'ASC\', field: \'' + display  +'\' }',
 671                     xtype : 'Store',
 672
 673                     remoteSort : true,
 674
 675                     listeners : {
 676                         '|beforeload' : 'function (_self, o)' +
 677                         "{\n" +
 678                         "    o.params = o.params || {};\n" +
 679                         "    // set more here\n" +
 680                         "}\n"
 681                     },
 682                     items : [
 683                         {
 684                             '*prop' : 'proxy',
 685                             'xtype' : 'HttpProxy',
 686                             'method' : 'GET',
 687                             '|xns' : 'Roo.data',
 688                             '|url' : "baseURL + '/Roo/" + table + ".php'"
 689                         },
 690
 691                         {
 692                             '*prop' : 'reader',
 693                             'xtype' : 'JsonReader',
 694                             '|xns' : 'Roo.data',
 695                             'id' : idcol,
 696                             'root' : 'data',
 697                             'totalProperty' : 'total',
 698                             '|fields' : JSON.stringify(combofields)
 699
 700                         }
 701                     ]
 702                 }
 703             ]
 704         };
 705
 706     }
 707
 708
 709 }