data/PVETable.js

   1 // just a test - not usable now
   2
   3 Ext.define('PVE.Table', {
   4     extend: 'Ext.Component',
   5
   6     alias: 'widget.pvetable',
   7
   8     onRender: function() {
   9         var me = this;
  10
  11         Ext.applyIf(me.renderData, {
  12             id: me.getId(),
  13             title: me.title,
  14             columns: me.columns
  15         });
  16
  17         var rows = [];
  18         me.store.each(function(record) {
  19             rows.push(record.data);
  20         });
  21
  22
  23         me.renderData.rows = rows;
  24         me.callParent(arguments);
  25     },
  26
  27     metaRowTpl: '<tr>' +
  28         '<tpl for="columns">' +
  29         '<td>{{dataIndex}}</td>' +
  30         '</tpl>'+
  31         '</tr>',
  32
  33      metaRenderTpl: '<h1>{title}</h1>' +
  34         '<table border="1" cellspacing="0" cellpadding="0">' +
  35         '<tr><tpl for="columns">' +
  36         '<th><div id="{parent.id}-th-resize{#}" style="background-color:red;">{header}</div></th>' +
  37         '</tpl></tr>'+
  38         '{[this.openRows()]}' +
  39         '{row}'+
  40         '{[this.closeRows()]}' +
  41         '</table>',
  42
  43     initComponent : function() {
  44         var me = this;
  45
  46         Ext.Array.each(me.columns, function(col, i) {
  47             if (!col.width)
  48                 col.width = 100;
  49             if (!col.minWidth || (col.minWidth < 10))
  50                 col.minWidth = 10;
  51             if (col.width < col.minWidth)
  52                 col.width = col.minWidth;
  53         });
  54
  55         var metaRowTpl = Ext.create('Ext.XTemplate', me.metaRowTpl);
  56         me.row = metaRowTpl.applyTemplate(me);
  57
  58         var metaTpl = Ext.create('Ext.XTemplate', me.metaRenderTpl, {
  59             openRows: function() {
  60                 return '<tpl for="rows">';
  61             },
  62
  63             closeRows: function() {
  64                 return '</tpl>';
  65             }
  66         });
  67         var tpl = metaTpl.applyTemplate(me);
  68
  69         //console.log("TEST1 " + tpl);
  70
  71         Ext.apply(me, {
  72             renderTpl: tpl
  73         });
  74
  75         me.callParent();
  76
  77         // only works with FF
  78         me.on('afterrender', function() {
  79             Ext.Array.each(me.columns, function(col, i) {
  80                 var myid = me.getId() + '-th-resize' + (i+1);
  81                 var rz = Ext.create('Ext.resizer.Resizer', {
  82                     el: myid,
  83                     handles: 'e',
  84                     minWidth: col.minWidth,
  85                     transparent: true,
  86                     listeners: {
  87                         resize: function(t, width, height) {
  88                             var target = t.getTarget();
  89                             var parent = target.parent();
  90                             parent.setWidth(width);
  91                             t.el.setWidth(parent.getWidth()-1);
  92                         }
  93                     }
  94                 });
  95                 rz.resizeTo(col.width);
  96             });
  97         });
  98     }
  99 });