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