Show cool things you have done with our products


Post by pheneus »

Image
hi i want this on image, resources name on right panel
my code is
var url				=	'https://127.0.0.1/Geodedicca';
Ext.ns('App');


Ext.Loader.setConfig({ 
    enabled: true, 
    disableCaching : true,
    paths : {
        'MyApp' : 'Gantt/js'
    }
});
Ext.require([
            'Gnt.panel.Gantt',
            {

                plugins             : [
                    Ext.create("Gnt.plugin.DependencyEditor", {
                        hideOnBlur  : true
                    })
                ]
            },
		    'MyApp.DemoGanttPanel',
		    'Gnt.column.StartDate',
		    'Gnt.column.EndDate',
		    'Gnt.column.Duration',
		    'Gnt.column.PercentDone',
		    'Gnt.column.ResourceAssignment' ,
		    'Sch.plugin.TreeCellEditing',
		    'Gnt.widget.AssignmentCellEditor',
		    'Gnt.column.ResourceAssignment',
		    'Gnt.model.Assignment'
]);
Ext.onReady(function() {
    Ext.QuickTips.init();
    Ext.define('MyTaskModel', {
        extend : 'Gnt.model.Task',

        clsField : 'TaskType',
        fields : [
            { name : 'TaskType', type : 'string' },
            { name : 'leaf', type: 'bool'}
        ]
    });

    Ext.define('MyTaskStore', {
        extend: 'Gnt.data.TaskStore',
        autoload: true,
        autoSync: true,
        model: 'MyTaskModel'
    });

    var taskStore = Ext.create('MyTaskStore', {
        proxy : {
            type : 'ajax',
            method: 'POST',
            reader: {
                type : 'json'
            }, 
            api: {
                read: url+'/extAplication/connector/?task-read',
                create: url+'/extAplication/connector/?task-create',
                destroy: url+'/extAplication/connector/?task-destroy',
                update: url+'/extAplication/connector/?task-update'
            },
            writer : {
                type : 'json',
                root: 'data',
                encode: true,
                writeAllFields: true,
                listful : true,
                allowSingle: false              
            }
        }
    });

    var resourceStore = Ext.create("Gnt.data.ResourceStore", {
        model : 'Gnt.model.Resource'
    });
    var dependencyStore = Ext.create("Gnt.data.DependencyStore", {
        autoLoad: true,
        autoSync: true,
        proxy: {
            type : 'ajax',
            method: 'POST',
            api: {
                read: url+'/extAplication/connector/?dependencyStore-read',
                create: url+'/extAplication/connector/?dependencyStore-create',
                destroy: url+'/extAplication/connector/?dependencyStore-destroy',
                update: url+'/extAplication/connector/?dependencyStore-update'
            },
            reader: {
                type : 'json'
            },                
            writer : {
              type : 'json',
              root: 'data',
              encode: true,
              writeAllFields: true,
              allowSingle: true                
            }
        }
    });

    var assignmentStore = Ext.create("Gnt.data.AssignmentStore", {
        model: 'Gnt.model.Assignment',
        autoLoad: true,
        autoSync: true,
        resourceStore: resourceStore,
        proxy : {
            method: 'POST',
            type : 'ajax',
            api: {
                read : url+'/extAplication/connector/?assignmentStore-read',
                create: url+'/extAplication/connector/?assignmentStore-create',
                destroy: url+'/extAplication/connector/?assignmentStore-destroy',
                update: url+'/extAplication/connector/?assignmentStore-update'                    
            },
            reader : {
                type : 'json',
                root : 'assignments'
            },
            writer : {
                type : 'json',
                root: 'data',
                encode: true,
                writeAllFields: true,
                listful : true,
                allowSingle: true              
            }                
        },
        listeners : {
            load : function() {
                resourceStore.loadData(this.proxy.reader.jsonData.resources);
            }
        }
    });        
    var assignmentEditor = Ext.create('Gnt.widget.AssignmentCellEditor', {
        assignmentStore : assignmentStore,
        resourceStore : resourceStore
    });

    var g = Ext.create("MyApp.DemoGanttPanel", {
        renderTo        : Ext.getBody(),
        width           : 1120,
        height          : 768,
        selModel        : new Ext.selection.TreeModel({ ignoreRightMouseSelection : false, mode     : 'MULTI'}),
        taskStore       : taskStore,
        dependencyStore : dependencyStore,
        assignmentStore : assignmentStore,
        resourceStore   : resourceStore,
        columnLines     : true,
        startDate       : Sch.util.Date.add(new Date(), Sch.util.Date.MONTH, -2), 
        endDate         : Sch.util.Date.add(new Date(), Sch.util.Date.MONTH, 3),
        viewPreset      : 'weekAndDayLetter',
        leftLabelField : {
            dataIndex : 'Name',
            editor : { xtype : 'textfield' }
        },
        rightLabelField : {
        	
            dataIndex : 'Name',
            renderer : function(value, record) {
                return 'Uloha#' + value;
            }
            
        },
        eventRenderer : function(task) {
            if (assignmentStore.findExact('TaskId', task.data.Id) >= 0) {
                return {
                    ctcls : 'resources-assigned'
                };
            }
        },
        tbar : [{
            icon : 'add.png',
            text : 'Add task programmatically to "Ext 4.x branch"',
            handler : function() {
                var task = taskStore.getRootNode().findChild('Name', 'Ext 4.x branch', true);

                if (task) {
                    task.appendChild(new taskStore.model({
                            Name: 'Woo, added dynamically!',
                            leaf : true,
                            PercentDone: 30
                        })
                    );
                }
            }
        },
        '->',
        {
            icon : 'add.png',
            text : 'Add task to "Sencha releases"',
            handler : function() {
                var task = taskStore.getRootNode().findChild('Name', 'Sencha Releases');
                
                if (task) {
                    task.insertChild(0, new taskStore.model({
                            Name: 'Added as first child!',
                            leaf : true,
                            PercentDone: 60,
                            StartDate : new Date(2010, 0, 6),
                            EndDate : new Date(2010, 0, 8)
                        })
                    );
                }
            }
        }],
        columns : [
            new Gnt.column.WBS({
                hidden : false
            }),
            {
                xtype : 'treecolumn',
                header: 'Tasks',
                sortable: true,
                dataIndex: 'Name',
                width: 200,
                field: {
                    allowBlank: false
                },
                renderer : function(v, meta, r) {
                    if (!r.data.leaf) meta.tdCls = 'sch-gantt-parent-cell';

                    return v;
                }
            },            
            {
                xtype : 'startdatecolumn'
            },
            {
                xtype : 'enddatecolumn'
            },                
            {
                xtype : 'durationcolumn'
            },
            {
                xtype : 'percentdonecolumn',
                width : 50
            },
            {
                header : 'Assigned Resources', 
                width:150, 
                editor : assignmentEditor,
                xtype : 'resourceassignmentcolumn'
            }
        ]           
    });
});

Post by jakub »

As Mats suggested on our chat, you must utilize the label renderer and `getResources` method. Modifying our resources assignment example :
        rightLabelField : {
            renderer : function(value, record) {
                //get resources of the task
                var resources = record.getResources(),
                    names = [];

                for(var i=0, l=resources.length; i<l; i++){
                    var res = resources[i];
                    
                    if(res){
                        names.push(res.getName());
                    }
                }
                //return the string with resources names
                return names.join(', ');
            }
        }
JavaScript/Angular/ExtJS consulting - kuba@virtualdesign.pl

Post Reply