Hi Team,
I am using DCM in my section each stage in the DCM represents a candidate stage. I have a requirement where I need to display(progress bar) at which stage the candidate was in the main section.
My Section page :
I need the current stage field as a progress bar .like lead stage column in the below screenshot.
Can you please tell the procedure how to do this.
Hoping for a positive reply.
Regards
manikanta.
Like
Dear Manikanta,
For implementing this functionality you would need to do the following steps:
1) Make sure that the object you want to have as a progress bar (your stages object) has a number column named UsrStageNumber which would determine the progress stage (Similar to the one in lead stages http://prntscr.com/o9vzav).
2) Implement all needed methods and dependencies similarly to the ones in LeadSectionV2 schema in package core Lead. (the example of the code would be below)
3) If you don't have 5 stages you would need to implement your own control similarly to the BaseProgressBarModule and use it in your section.
Here is the example of the code for the Account section:
define("AccountSectionV2", ["AccountSectionV2Resources", "terrasoft", "ControlGridModule", "BaseProgressBarModule",
"EntityHelper", "css!BaseProgressBarModule"], function(resources, Terrasoft) {
return {
entitySchemaName: "Account",
diff: /**SCHEMA_DIFF*/[
{
"operation": "remove",
"name": "DataGrid"
},
{
"operation": "insert",
"name": "DataGrid",
"parentName": "DataGridContainer",
"propertyName": "items",
"values": {
"itemType": Terrasoft.ViewItemType.GRID,
"type": {"bindTo": "GridType"},
"listedZebra": true,
"activeRow": {"bindTo": "ActiveRow"},
"collection": {"bindTo": "GridData"},
"isEmpty": {"bindTo": "IsGridEmpty"},
"isLoading": {"bindTo": "IsGridLoading"},
"multiSelect": {"bindTo": "MultiSelect"},
"primaryColumnName": "Id",
"selectedRows": {"bindTo": "SelectedRows"},
"sortColumn": {"bindTo": "sortColumn"},
"sortColumnDirection": {"bindTo": "GridSortDirection"},
"sortColumnIndex": {"bindTo": "SortColumnIndex"},
"selectRow": {"bindTo": "rowSelected"},
"linkClick": {"bindTo": "linkClicked"},
"needLoadData": {"bindTo": "needLoadData"},
"activeRowAction": {"bindTo": "onActiveRowAction"},
"activeRowActions": [],
"className": "Terrasoft.ControlGrid",
"controlColumnName": "UsrAccStage",
"applyControlConfig": {"bindTo": "applyControlConfig"},
"getEmptyMessageConfig": {"bindTo": "prepareEmptyGridMessageConfig"}
}
}
]/**SCHEMA_DIFF*/,
methods: {
getGridDataColumns: function() {
var gridDataColumns = this.callParent(arguments);
gridDataColumns.UsrAccStage = gridDataColumns.UsrAccStage || {path: "UsrAccStage"};
gridDataColumns["UsrAccStage.UsrStageNumber"] =
gridDataColumns["UsrAccStage.UsrStageNumber"] || {path: "UsrAccStage.UsrStageNumber"};
return gridDataColumns;
},
applyControlConfig: function(control) {
control.config = {
className: "Terrasoft.BaseProgressBar",
value: {
"bindTo": "UsrAccStage",
"bindConfig": {"converter": "getUsrAccStageValue"}
},
width: "158px"
};
},
getUsrAccStage: function(id) {
var activeRow;
if (id) {
var gridData = this.getGridData();
activeRow = gridData.get(id);
} else {
activeRow = this.getActiveRow();
}
if (!activeRow) {
return null;
}
var accStage = activeRow.get("UsrAccStage");
return (accStage) ? accStage.value : null;
},
addColumnLink: function(item) {
item.getUsrAccStageValue = function(accStage) {
if (!accStage) {
return null;
} else {
return {
value: this.get("UsrAccStage.UsrStageNumber"),
displayValue: accStage.displayValue
};
}
};
return this.callParent(arguments);
}
}
};
}
);
Best regards,
Dennis
Dennis Hudson,
Thank you, Dennis,
I tried the below code on Account section, I'm able to see the progress bar on the section view. But when I select a record, i.e., on active row the operations "Open", "Copy", "Delete" are not visible.
What code should I add to enable the same?
Hoping for a positive reply.
manikanta,
You can add buttons back replacing existing diff block with this:
diff: /**SCHEMA_DIFF*/[
/*{
"operation": "remove",
"name": "DataGrid"
},*/
{
"operation": "merge",
"name": "DataGrid",
"parentName": "DataGridContainer",
"propertyName": "items",
"values": {
"itemType": Terrasoft.ViewItemType.GRID,
"type": {"bindTo": "GridType"},
"listedZebra": true,
"activeRow": {"bindTo": "ActiveRow"},
"collection": {"bindTo": "GridData"},
"isEmpty": {"bindTo": "IsGridEmpty"},
"isLoading": {"bindTo": "IsGridLoading"},
"multiSelect": {"bindTo": "MultiSelect"},
"primaryColumnName": "Id",
"selectedRows": {"bindTo": "SelectedRows"},
"sortColumn": {"bindTo": "sortColumn"},
"sortColumnDirection": {"bindTo": "GridSortDirection"},
"sortColumnIndex": {"bindTo": "SortColumnIndex"},
"selectRow": {"bindTo": "rowSelected"},
"linkClick": {"bindTo": "linkClicked"},
"needLoadData": {"bindTo": "needLoadData"},
"activeRowAction": {"bindTo": "onActiveRowAction"},
"className": "Terrasoft.ControlGrid",
"controlColumnName": "UsrAccountStages",
"applyControlConfig": {"bindTo": "applyControlConfig"},
"getEmptyMessageConfig": {"bindTo": "prepareEmptyGridMessageConfig"}
}
}
]
Best regards,
Dennis