180 lines
No EOL
7.6 KiB
JavaScript
180 lines
No EOL
7.6 KiB
JavaScript
/*
|
|
This file is part of Ext JS 3.4
|
|
|
|
Copyright (c) 2011-2013 Sencha Inc
|
|
|
|
Contact: http://www.sencha.com/contact
|
|
|
|
GNU General Public License Usage
|
|
This file may be used under the terms of the GNU General Public License version 3.0 as
|
|
published by the Free Software Foundation and appearing in the file LICENSE included in the
|
|
packaging of this file.
|
|
|
|
Please review the following information to ensure the GNU General Public License version 3.0
|
|
requirements will be met: http://www.gnu.org/copyleft/gpl.html.
|
|
|
|
If you are unsure which license is appropriate for your use, please contact the sales department
|
|
at http://www.sencha.com/contact.
|
|
|
|
Build date: 2013-04-03 15:07:25
|
|
*/
|
|
Ext.onReady(function(){
|
|
|
|
Ext.QuickTips.init();
|
|
|
|
var xg = Ext.grid;
|
|
|
|
var reader = new Ext.data.JsonReader({
|
|
idProperty: 'taskId',
|
|
fields: [
|
|
{name: 'projectId', type: 'int'},
|
|
{name: 'project', type: 'string'},
|
|
{name: 'taskId', type: 'int'},
|
|
{name: 'description', type: 'string'},
|
|
{name: 'estimate', type: 'float'},
|
|
{name: 'rate', type: 'float'},
|
|
{name: 'cost', type: 'float'},
|
|
{name: 'due', type: 'date', dateFormat:'m/d/Y'}
|
|
]
|
|
|
|
});
|
|
|
|
// define a custom summary function
|
|
Ext.ux.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){
|
|
return v + (record.data.estimate * record.data.rate);
|
|
};
|
|
|
|
// utilize custom extension for Group Summary
|
|
var summary = new Ext.ux.grid.GroupSummary();
|
|
|
|
var grid = new xg.EditorGridPanel({
|
|
ds: new Ext.data.GroupingStore({
|
|
reader: reader,
|
|
// use local data
|
|
data: app.grid.dummyData,
|
|
sortInfo: {field: 'due', direction: 'ASC'},
|
|
groupField: 'project'
|
|
}),
|
|
columns: [
|
|
{
|
|
id: 'description',
|
|
header: 'Task',
|
|
width: 80,
|
|
sortable: true,
|
|
dataIndex: 'description',
|
|
summaryType: 'count',
|
|
hideable: false,
|
|
summaryRenderer: function(v, params, data){
|
|
return ((v === 0 || v > 1) ? '(' + v +' Tasks)' : '(1 Task)');
|
|
},
|
|
editor: new Ext.form.TextField({
|
|
allowBlank: false
|
|
})
|
|
},{
|
|
header: 'Project',
|
|
width: 20,
|
|
sortable: true,
|
|
dataIndex: 'project'
|
|
},{
|
|
header: 'Due Date',
|
|
width: 25,
|
|
sortable: true,
|
|
dataIndex: 'due',
|
|
summaryType: 'max',
|
|
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
|
|
editor: new Ext.form.DateField({
|
|
format: 'm/d/Y'
|
|
})
|
|
},{
|
|
header: 'Estimate',
|
|
width: 20,
|
|
sortable: true,
|
|
dataIndex: 'estimate',
|
|
summaryType: 'sum',
|
|
renderer : function(v){
|
|
return v +' hours';
|
|
},
|
|
editor: new Ext.form.NumberField({
|
|
allowBlank: false,
|
|
allowNegative: false,
|
|
style: 'text-align:left'
|
|
})
|
|
},{
|
|
header: 'Rate',
|
|
width: 20,
|
|
sortable: true,
|
|
renderer: Ext.util.Format.usMoney,
|
|
dataIndex: 'rate',
|
|
summaryType: 'average',
|
|
editor: new Ext.form.NumberField({
|
|
allowBlank: false,
|
|
allowNegative: false,
|
|
style: 'text-align:left'
|
|
})
|
|
},{
|
|
id: 'cost',
|
|
header: 'Cost',
|
|
width: 20,
|
|
sortable: false,
|
|
groupable: false,
|
|
renderer: function(v, params, record){
|
|
return Ext.util.Format.usMoney(record.data.estimate * record.data.rate);
|
|
},
|
|
dataIndex: 'cost',
|
|
summaryType: 'totalCost',
|
|
summaryRenderer: Ext.util.Format.usMoney
|
|
}
|
|
],
|
|
|
|
view: new Ext.grid.GroupingView({
|
|
forceFit: true,
|
|
showGroupName: false,
|
|
enableNoGroups: false,
|
|
enableGroupingMenu: false,
|
|
hideGroupedColumn: true
|
|
}),
|
|
|
|
plugins: summary,
|
|
|
|
tbar : [{
|
|
text: 'Toggle',
|
|
tooltip: 'Toggle the visibility of summary row',
|
|
handler: function(){summary.toggleSummaries();}
|
|
}],
|
|
|
|
frame: true,
|
|
width: 800,
|
|
height: 450,
|
|
clicksToEdit: 1,
|
|
collapsible: true,
|
|
animCollapse: false,
|
|
trackMouseOver: false,
|
|
//enableColumnMove: false,
|
|
title: 'Sponsored Projects',
|
|
iconCls: 'icon-grid',
|
|
renderTo: document.body
|
|
});
|
|
|
|
});
|
|
|
|
// set up namespace for application
|
|
Ext.ns('app.grid');
|
|
// store dummy data in the app namespace
|
|
app.grid.dummyData = [
|
|
{projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 112, description: 'Integrate 2.0 Forms with 2.0 Layouts', estimate: 6, rate: 150, due:'06/24/2007'},
|
|
{projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 113, description: 'Implement AnchorLayout', estimate: 4, rate: 150, due:'06/25/2007'},
|
|
{projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 114, description: 'Add support for multiple types of anchors', estimate: 4, rate: 150, due:'06/27/2007'},
|
|
{projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 115, description: 'Testing and debugging', estimate: 8, rate: 0, due:'06/29/2007'},
|
|
{projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 101, description: 'Add required rendering "hooks" to GridView', estimate: 6, rate: 100, due:'07/01/2007'},
|
|
{projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 102, description: 'Extend GridView and override rendering functions', estimate: 6, rate: 100, due:'07/03/2007'},
|
|
{projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 103, description: 'Extend Store with grouping functionality', estimate: 4, rate: 100, due:'07/04/2007'},
|
|
{projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 121, description: 'Default CSS Styling', estimate: 2, rate: 100, due:'07/05/2007'},
|
|
{projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 104, description: 'Testing and debugging', estimate: 6, rate: 100, due:'07/06/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 105, description: 'Ext Grid plugin integration', estimate: 4, rate: 125, due:'07/01/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 106, description: 'Summary creation during rendering phase', estimate: 4, rate: 125, due:'07/02/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 107, description: 'Dynamic summary updates in editor grids', estimate: 6, rate: 125, due:'07/05/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 108, description: 'Remote summary integration', estimate: 4, rate: 125, due:'07/05/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 109, description: 'Summary renderers and calculators', estimate: 4, rate: 125, due:'07/06/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 110, description: 'Integrate summaries with GroupingView', estimate: 10, rate: 125, due:'07/11/2007'},
|
|
{projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 111, description: 'Testing and debugging', estimate: 8, rate: 125, due:'07/15/2007'}
|
|
]; |