Adding a new channel to the action dashboard
Glossary Item Box
General Information
A new edit page module has been implemented in bpm'online 7.8 — the action dashboard. The action dashboard is designed to display information about the current state of a record
This page element is described in the "Action dashboard" article.
The ways of adding the action dashboard to the section page are described in the "Adding an action panel" article.
ActionsDashboard channels are a way of communicating with a contact. A channel is created for every section in which it's connected to, for example, a case, contact or lead.
Case description
Add a new custom channel to the action dashboard of the contact edit page. The channel must have the same functionality as the call results channel (CallMessagePublisher channel).
Case execution algorithm
1. Add the CallsMessagePublisher source code schema
Open the system settings. Go to the [Configuration] section, and on the [Schema] tab, execute the [Add] > [Source code] menu command (Fig. 1).
Fig. 1. Added source code schemas
To create a schema, set the following settings (Fig. 2):
- The [Title] property — "Call messages logging publisher"
- The [Name] property — "CallsMessagePublisher"
Fig. 2. Added source code schemas
In the created schema, add the new CallsMessagePublisher inherited from the BaseMessagePublisher class to the Terrasoft.Configuration namespace. The BaseMessagePublisher class contains the basic logic to save an object in the database and the basic logic of event handlers. The inheritor class will contain the logic for a particular sender, for example, filling of columns of the Activity object and the subsequent sending of the message.
To implement the new CallsMessagePublisher class, you must add the following source code in the created schema.
using System.Collections.Generic; using Terrasoft.Core; namespace Terrasoft.Configuration { // The BaseMessagePublisher heir class. public class CallsMessagePublisher : BaseMessagePublisher { // Class constructor. public CallsMessagePublisher(UserConnection userConnection, Dictionary<string, string> entityFieldsData) : base(userConnection, entityFieldsData) { //The schema the CallsMessagePublisher works with. EntitySchemaName = "Activity"; } } }
Save and publish the schema.
2. Create the SectionActionsDashboard replacing client schema
Open the system settings. Go to the [Configuration] section, and on the [Schema] tab, execute the [Add] > [Replacing client module] menu command (Fig. 1). Set the SectionActionsDashboard schema of the ActionsDashboard package as the parent of the replacing client schema. Set the SectionActionsDashboard value as the title.
Read more about replacing schemas in the "Creating a custom client module schema" article.
NOTE If you want to add a channel to only one edit page, you must create a new module named [section_name]SectionActionsDashboard (e.g. BooksSectionActionsDashboard) and set SectionActionsDashboard as the parent schema. |
Specify the module which should be rendered in this channel on one of the tabs in the replacing schema diff property. The new channel will be visible on the edit pages of those sections, which are connected to SectionActionsDashboard. Set the operations of inserting the CallsMessageTab tab and message container in this property.
// diff: /**SCHEMA_DIFF*/[ // Adding the CallsMessageTab tab. { // operation type — insertion. "operation": "insert", // Tab name. "name": "CallsMessageTab", // Parent element name. "parentName": "Tabs", // Property name. "propertyName": "tabs", // Property configuration object. "values": { // Child elements array. "items": [] } }, // Adding message container. { "operation": "insert", "name": "CallsMessageTabContainer", "parentName": "CallsMessageTab", "propertyName": "items", "values": { // Element type — container. "itemType": this.Terrasoft.ViewItemType.CONTAINER, // Container CSS class "classes": { "wrapClassName": ["calls-message-content"] }, "items": [] } }, // Adding the CallsMessageModule module. { "operation": "insert", "name": "CallsMessageModule", "parentName": "CallsMessageTab", "propertyName": "items", "values": { // Tab module CSS class. "classes": { "wrapClassName": ["calls-message-module", "message-module"] }, // Element type — module. "itemType": this.Terrasoft.ViewItemType.MODULE, // Module name. "moduleName": "callsMessagePublisherModule", // Binding the method executed after the element has been rendered. "afterrender": { "bindTo": "onMessageModuleRendered" }, // Binding the method executed after the element has been rerendered. "afterrerender": { "bindTo": "onMessageModuleRendered" } } } ]/**SCHEMA_DIFF*/
You should also override the getSectionPublishers method that will add the new channel to the list of message publishers, and the getExtendedConfig method, in which the tab settings are configured.
For the getExtendedConfig method to run correctly, you must upload the channel icon and specify it in the ImageSrc parameter. The icons used in this example can be downloaded here.
You should also override the onGetRecordInfoForPublisher method and add the getContactEntityParameterValue method that defines the contact value from the edit page.
methods: { // Method sets the channel tab display settings in the action dashboard. getExtendedConfig: function() { // Parent method calling var config = this.callParent(arguments); var lczImages = resources.localizableImages; config.CallsMessageTab = { // Tab image. "ImageSrc": this.Terrasoft.ImageUrlBuilder.getUrl(lczImages.CallsMessageTabImage), // Marker value. "MarkerValue": "calls-message-tab", // Alignment. "Align": this.Terrasoft.Align.RIGHT, // Tag. "Tag": "Calls" }; return config; }, // Redefines the parent object and adds the contact value from the edit page // of the section that contains the action dashboard. onGetRecordInfoForPublisher: function() { var info = this.callParent(arguments); info.additionalInfo.contact = this.getContactEntityParameterValue(info.relationSchemaName); return info; }, // Defines the contact value from the section edit page // that contains the action dashboard. getContactEntityParameterValue: function(relationSchemaName) { var contact; if (relationSchemaName === "Contact") { var id = this.getMasterEntityParameterValue("Id"); var name = this.getMasterEntityParameterValue("Name"); if (id && name) { contact = {value: id, displayValue: name}; } } else { contact = this.getMasterEntityParameterValue("Contact"); } return contact; }, // Adds the created channel to the message publisher list. getSectionPublishers: function() { var publishers = this.callParent(arguments); publishers.push("Calls"); return publishers; } },
Save and publish the schema.
3. Create the CallsMessagePublisherModule module
The CallsMessagePublisherModule serves as container that renders the CallsMessagePublisherPage in the SectionActionsDashboard.
Open the system settings. Go to the [Configuration] section, and on the [Schema] tab, execute the [Add] > [Module] menu command (Fig. 1).
To create a module, configure the following settings (Fig. 2):
- The [Title] property — "Call messages logging publisher module"
- The [Name] property — "CallsMessagePublisherModule"
Add the following source code to the created module.
define("CallsMessagePublisherModule", ["BaseMessagePublisherModule"], function() { // Defining the class. Ext.define("Terrasoft.configuration.CallsMessagePublisherModule", { // Basic class. extend: "Terrasoft.BaseMessagePublisherModule", // Short class name. alternateClassName: "Terrasoft.CallsMessagePublisherModule", // Initialization of the page that will be rendered in this module. initSchemaName: function() { this.schemaName = "CallsMessagePublisherPage"; } }); // Returns the class object defined in the module. return Terrasoft.CallsMessagePublisherModule; });
Save the module.
4. Create the CallsMessagePublisherPage page
Open the system settings. Go to the [Configuration] section, and on the [Schema] tab, execute the [Add] > [Page view model schema] menu command (Fig. 1). Set the BaseMessagePublisherPage schema of the MessagePublisher package as the parent object for the created page. Set the "CallsMessagePublisherPage" value as the title and name.
In the source code page, specify the schema name of the object that will run along with the page (in this case, Activity), implement the logic of message publication and override the getServiceConfig method, in which you must set the class name from the configuration.
//Sets the class that will work with this page. getServiceConfig: function() { return { className: "Terrasoft.Configuration.CallsMessagePublisher" }; }
Since the implementation of the publication logic contains quite a large number of methods, attributes and properties, the full source code of the CallsMessagePublisherPage is attached below at the end of the article. The source code shows the implementation of the CallMessagePublisher channel that is used for logging incoming and outgoing calls.
As a result you will get the new channel in the SectionActionsDashboard (Fig. 3).
Fig. 3. An example of a custom CallsMessagePublisher channel in the SectionActionsDashboard of the [Contacts] section.
You can download the full source codes of the schemas and modules required to run this case here.