extjs/examples/classic/neptune-components/app/view/grid/widget/Basic.js

   1 Ext.define('Neptune.view.grid.widget.Basic', function() {
   2     /**
   3      * Custom function used for column renderer
   4      * @param {Object} val
   5      */
   6     function change(val) {
   7         if (val > 0) {
   8             return '<span style="color:green;">' + val + '</span>';
   9         } else if (val < 0) {
  10             return '<span style="color:red;">' + val + '</span>';
  11         }
  12         return val;
  13     }
  14
  15     /**
  16      * Custom function used for column renderer
  17      * @param {Object} val
  18      */
  19     function pctChange(val) {
  20         if (val > 0) {
  21             return '<span style="color:green;">' + val + '%</span>';
  22         } else if (val < 0) {
  23             return '<span style="color:red;">' + val + '%</span>';
  24         }
  25         return val;
  26     }
  27
  28     return {
  29         extend: 'Ext.grid.Panel',
  30         xtype: 'basicGrid',
  31         store: 'Company',
  32         title: 'Basic Grid',
  33         plugins: {
  34             ptype: 'cellediting'
  35         },
  36         columns: [
  37             { text: 'Company', flex: 1, dataIndex: 'company', editor: 'textfield' },
  38             { text: 'Price', width: 75, sortable: true, formatter: 'usMoney', dataIndex: 'price', editor: 'numberfield' },
  39             { text: 'Change', width: 75, sortable: true, renderer: change, dataIndex: 'change', editor: 'numberfield' },
  40             { text: '% Change', width: 75, sortable: true, renderer: pctChange, dataIndex: 'pctChange', editor: 'numberfield' },
  41             { text: 'Last Updated', width: 85, sortable: true, formatter: 'date("m/d/Y")', dataIndex: 'lastChange', editor: 'datefield' },
  42             {
  43                 menuDisabled: true,
  44                 sortable: false,
  45                 xtype: 'actioncolumn',
  46                 width: 24,
  47                 items: [{
  48                     icon   : '../shared/icons/fam/delete.gif',
  49                     tooltip: 'Sell stock'
  50                 }]
  51             }
  52         ]
  53     };
  54 });