Building Screen Widgets

While ASM ships with numerous widgets, you can also create your own and put them Nano, Core and on the portal.

The widget can be found in Screen Designer and is configured with the following string properties.

The example below uses the Person screen, but these widgets can be placed on any screen in ASM if you modify the properties - See the API documentation for more information.

Adding a Widget to your Screen - Widget Properties

When you first add a widget to the screen it will appear as a solid grey box that spans all columns. You cannot resize the columns.

After you have added your widget:

  1. Highlight the widget so it has the focus

  2. Set the Widget id to "data-grid"

  3. Enter your widget properties (see known issues and examples below).

These fields are case sensitive. They must be all lower case without spaces unless specified otherwise.

API Data Grid Query Builder

You can build a string using the following interface:

https://[server]/[system]/modules/alemba.web.widgets/?widgetid=data-grid

  • Replace [server]/[system] with your specific system URL.

  • You will need some knowledge of the API to modify the string properties by screen/entity.

Sample Widget Library

ASM Self Service Portal System Widgets

Filters need to use escaped characters and encoded for the URL.

Global Search Widget - Properties

Widget ID: global-search

Widget Props: {"entities":"13,25,33","term":"iphone","limit":"3"}

entities: 6,4,25,33,13

6 = Call 4 = Request 25 = Service Action 33 = Service Bundle 13 = Knowledge

term: sets a default value in the search box

limit: limits the maximum number of results returned

Request Details Screens

Show Child Requests of a Parent Request

Widget ID: data-grid

{"entityType":"request","columns":"Ref,Status:RequestStatus.Name,Template:Template.Name,Person:Ext_RscrPersonSearch2.Name,CreatedDate","headers":"Ref,LoggedDate,Status,Type,NewStarter","sorting":"off","pageFilters":[{"id":"REQUEST_NO","apiId":"Number1"}],"orderBy":"","sortBy":""}

List Stakeholders of the Request

Widget ID: data-grid

{"entityType":"configuration-item","columns":"Ref,Asset:Target.Name,Type:Target.InfraEntityType.Name","headers":",Asset,Type","filters":"","autoheight":"true",
"columnsresize":"true","sorting":"on","pageFilters":"[{\"id\":\"REF\",\"apiId\":\"Holder.Ref\"}]","orderBy":"Target.InfraEntityType.Name","sortBy":"Target.Name"}

List all Assets where User is a Stakeholder

Widget ID: data-grid

{"entityType": "configuration-item", "columns": "Ref, Name, Type:InfraEntityType.Name, Manufacturer:Manufacturer.Name, ModelType:ModelType.Name", "headers": ",Title, Type, Manufacturer, Model", "filters": "", "sorting": "off", "pageFilters": "[{\"id\":\"REQUESTOR_REF\",\"apiId\":\"User\"}]", "orderBy": "", "sortBy": ""}

List all Assets where nthe User is the Owner

Widget ID: data-grid

{"entityType": "configuration-item", "columns": "Ref, Name, Type:InfraEntityType.Name, Manufacturer:Manufacturer.Name, ModelType:ModelType.Name", "headers": ",Title, Type, Manufacturer, Model", "filters": "", "sorting": "off", "pageFilters": "[{\"id\":\"REQUESTOR_REF\",\"apiId\":\"User\"}]", "orderBy": "", "sortBy": ""}

Task Screens

Config Items where User is a Stakeholder

Widget ID: data-grid

{"entityType":"person-to-asset-stakeholder-link","columns":"Asset:Target.Name,Type:Target.InfraEntityType.Name","headers": ",User of, Type","sorting":"off","pageFilters":"[{\"id\":\"REF\",\"apiId\":\"Holder.Ref\"}]","orderBy":"Target.InfraEntityType.Name","sortBy":"Type"}

Config items belonging to a user

Widget ID: data-grid

{"entityType": "configuration-item", "navigationEntityType":"asset","columns": "Ref:Target.Ref, Type:InfraEntityType.Name, Manufacturer:Manufacturer.Name, ModelType:ModelType.Name", "headers": ",Title, Type, Manufacturer, Model", "filters": "", "sorting": "off", "pageFilters": "[{\"id\":\"REQUEST:REQUESTOR_REF\",\"apiId\":\"User\"}]", "orderBy": "", "sortBy": ""}

Incident Details Screen

Show User's Resources

Widget ID: data-grid

{"entityType": "configuration-item", "columns": "Ref,Title,Type:InfraEntityType.Name,Status:PhysicalStatus.Name,Desc:Description", "headers": ",Title,CMDB Type,Status,Description", "filters": "Status%20%3D%3D%20%22A%22%20%26%26%20User.Ref%20!%3D%200", "sorting": "on", "pageFilters": "[{"id":"USER_REF","apiId":"User.Ref"}]", "orderBy": "Title%20asc", "sortBy": ""}
Portal HomePage

Show all Assets of a Specific CMDB Item Type Where User is a Stakeholder

Widget ID: data-grid

{"entityType": "person-to-asset-stakeholder-link","columns": "Ref:Target.Ref,Title:Target.Title,Type:Target.InfraEntityType.Name,Name:Target.User.Name,Org:Target.Organization.Name,Description:Target.Description",
   "headers": "Ref,Title,CIType,Person,Organisation,Description",
   "filters": "Holder%3D%3D%40UserId%26%26%28LinkType.Name%3D%22Practice%20Manager%22%7C%7CLinkType.Name%3D%22Registered%20Manager%22%29",
   "sorting": "On",
   "pageFilters": "[{\"id\":\"ITEM_REF\",\"apiId\":\"Asset.Ref\"}]",
   "orderBy": "Ref",
   "sortBy": "Ref"
}

All Calls Awaiting Your Action

Widget ID: data-grid

{"entityType":"call","columns":"Ref,CreatedDate,ShortDescription,Product:ConfigurationItem.Name,Status:CallStatus.Name","headers":"No.,Date Raised,Description,Product,Status","sorting":"on","filters":"UserId%20%3D%3D%20%40UserId%26%26(OpenStatus=1%7C%7COpenStatus=2%7C%7COpenStatus=3)%26%26CallStatus.IsAwaitingAction=1"}

Calls Awaiting Closure Confirmation

If you have 2 part closure enabled and are waititng for the custoer to confirm call can be closed

Widget ID: data-grid

{"entityType":"call","columns":"Ref,CreatedDate,ShortDescription,Product:ConfigurationItem.Name,Status:CallStatus.Name","headers":"No.,Date Raised,Description,Product,Status","sorting":"on","filters":"UserId%20%3D%3D%20%40UserId%26%26(OpenStatus=1%7C%7COpenStatus=2%7C%7COpenStatus=3)%26%26CallStatus.IsAwaitingAction=1"}

Change Requests for the Next 7 Days

Widget ID: data-grid

{"entityType":"request","columns":"Ref,Req_Title:Name,Req_Risk:Risk.Name,Req_Priority:Priority.Name,Req_Status:RequestStatus.Name,ImpStart:ImplementationStartDate,ImpEnd:ImplementationEndDate,Req_Desc:ShortDescription","headers":"No.,Title,Risk,Priority,Status,Start Date,End Date,Description","sorting":"on","filters":"WorkflowProfile%3D%3D0%26%26OpenStatus%3E0%26%26TemplateType%3D%3D0%26%26ImplementationStartDate%3E%40Now%26%26ImplementationStartDate%3C%3D%40NowOffset%287%3B0%3B0%29%26%26ImplementationEndDate%21%3Dnull","orderBy":"ImplementationStartDate%20Asc","sortBy":"ImplementationStartDate"}
Notes:
•Workflow Profile : 0 (Change Management)
•Implementation Start Date > @Now and <= @NowOffset by 7 days
•Implementation End Date is not Null

Change Requests for the Next 7-14 Days

Widget ID: data-grid

{"entityType":"request","columns":"Ref,Req_Title:Name,Req_Risk:Risk.Name,Req_Priority:Priority.Name,Req_Status:RequestStatus.Name,ImpStart:ImplementationStartDate,ImpEnd:ImplementationEndDate,Req_Desc:ShortDescription","headers":"No.,Title,Risk,Priority,Status,Start Date,End Date,Description","sorting":"on","filters":"WorkflowProfile%3D%3D0%26%26OpenStatus%3E0%26%26TemplateType%3D%3D0%26%26ImplementationStartDate%3E%40NowOffset%287%3B0%3B0%29%26%26ImplementationStartDate%3C%3D%40NowOffset%2814%3B0%3B0%29%26%26ImplementationEndDate%21%3Dnull","orderBy":"ImplementationStartDate%20Asc","sortBy":"ImplementationStartDate"}
Notes:
•Workflow Profile : 0 (Change Management)
•Implementation Start Date > @NowOffset by 7 days and <= @NowOffset by 14 days
•Implementation End Date is not Null

Change Requests for the Next 14-28 Days

Widget ID: data-grid

{"entityType":"request","columns":"Ref,Req_Title:Name,Req_Risk:Risk.Name,Req_Priority:Priority.Name,Req_Status:RequestStatus.Name,ImpStart:ImplementationStartDate,ImpEnd:ImplementationEndDate,Req_Desc:ShortDescription","headers":"No.,Title,Risk,Priority,Status,Start Date,End Date,Description","sorting":"on","filters":"WorkflowProfile%3D%3D0%26%26OpenStatus%3E0%26%26TemplateType%3D%3D0%26%26ImplementationStartDate%3E%40NowOffset%2814%3B0%3B0%29%26%26ImplementationStartDate%3C%3D%40NowOffset%2828%3B0%3B0%29%26%26ImplementationEndDate%21%3Dnull","orderBy":"ImplementationStartDate%20Asc","sortBy":"ImplementationStartDate"}
Notes:
•Workflow Profile : 0 (Change Management)
•Implementation Start Date > @NowOffset by 14 days and <= @NowOffset by 28 days
•Implementation End Date is not Null

Stakeholders of a Service

Widget ID: data-grid

{"entityType": "person-to-asset-stakeholder-link","columns": "HolderName:Holder.Name,LinkTypeName:LinkType.Name","headers": "Stakeholder, Role Type","filters": "!%40IsDeleted","sorting": "off","pageFilters": "[{\"id\":\"ITEM_REF\",\"apiId\":\"Target.Ref\"}]","orderBy": "Holder.Name","sortBy": "Holder.Name"}

Requests Logged for Others

Widget ID: data-grid

{"entityType":"request","columns":"Ref,CreatedDate,User:RequestedBy.FriendlyName,Status:RequestStatus.Name,Title:Name,Desc:ShortDescription","headers":"No.,Date Raised,Requested For,Status,Title,Description","sorting":"on","filters":"%40IsLoggedByMe%26%26!%40IsLoggedForMe%26%26SystemStatus%3E0%26%26OpenStatus","orderBy":"CreatedDate%20Desc","sortBy":"CreatedDate"}

Note: Requests logged by User but submitted for another User (ie modified the User field in the Submission screen), not including un-submitted requests.

Calls Logged for Others

Widget ID: data-grid

{"entityType":"call","columns":"Ref,CreatedDate,User:User.FriendlyName,Status:CallStatus.Name,Desc:ShortDescription","headers":"No.,Date Raised,Logged For,Status,Description","sorting":"on","filters":"%40IsLoggedByMe%26%26!%40IsLoggedForMe%26%26SystemStatus%3E0%26%26OpenStatus","orderBy":"CreatedDate%20Desc","sortBy":"CreatedDate"}

Note: Calls logged by User but submitted for another User (ie modified the User field in the Call Submission screen), not including un-submitted Calls.

My Organizations Calls

Widget ID: data-grid

{"entityType":"call","columns":"Ref,CreatedDate,User:User.FriendlyName,Status:CallStatus.Name,Desc:ShortDescription","headers":"No.,Date Raised,Logged By,Status,Description","sorting":"on","filters":"OrganizationId%20%3D%3D%20%40OrganizationId%26%26OpenStatus","orderBy":"CreatedDate%20Desc","sortBy":"CreatedDate"}

Show the calls awaiting your action and any that are open/resolved open/unresolved

Widget ID: data-grid

{"entityType":"call","navigationEntityType":"call","Ref:Target.Ref",columns":"Ref,CreatedDate,ShortDescription,Product:ConfigurationItem.Name,Status:CallStatus.Name","headers":"No.,Date Raised,Description,Product,Status","sorting":"on","filters":"UserId%20%3D%3D%20%40UserId%26%26(OpenStatus=1%7C%7COpenStatus=2%7C%7COpenStatus=3)%26%26CallStatus.IsAwaitingAction=1"}
Person Screens

Calls Outstanding for a User

Widget ID: data-grid

{"entityType":"call","columns":"Ref,CreatedDate,Status:CallStatus.Name,ProblemDesc:Description", "headers":"Ref,Logged Date,Status,Description","sorting":"on", "filters":"OpenStatus == 1", "pageFilters": "[{\"id\":\"REF\",\"apiId\":\"User.Ref\"}]" }

Users Assigned Software where the person is a stakeholder

Widget ID: data-grid

{"entityType":"person-to-asset-stakeholder-link","navigationEntityType":"asset","columns":"Ref:Target.Ref,Asset:Target.Name,ModelType:Target.ModelType.Name,Type:Target.InfraEntityType.Name","headers":"Assigned Applications,Module,Type","filters":"!@IsDeleted","sorting":"on","pageFilters": "[{\"id\":\"REF\",\"apiId\":\"Holder.Ref\"}]","orderBy":"Target.InfraEntityType.Name","sortBy":"Model"}

Users Assigned Assets/Configuration Items

Widget ID: data-grid

{"entityType":"configuration-item","navigationEntityType":"asset","columns":"Ref,Name,Type:InfraEntityType.Name,Manufacturer:Manufacturer.Name,ModelType:ModelType.Name","headers":",Assigned Assets,Type,Manufacturer,Model","filters":"!@IsDeleted","sorting":"off","pageFilters":"[{\"id\":\"REF\",\"apiId\":\"User\"}]","orderBy":"","sortBy":""}

Known Issues

Screen Designer

Even though you will see a resize option in screen designer, for widgets, this option is not viable.

API Data Query Grid Builder Syntax Error

There is a Known Issue with syntax where if you use the API data-grid query builder, and then use the "copy code" button in 10.6.7, it puts in the incorrect syntax (Slashes and spaces) into the code breaking the widget on lower versions. It also stops any widgets showing on the page.

Example:

Copied Code: "pageFilters": "[{\"id\":\"REF\",\"apiId\":\"Holder.Ref\"}]",

Should be

"pageFilters":[{"id":"REF","apiId":"Holder.Ref"}],

Script Error when Clicking a row in Widget Results

There is a known issue with widgets wherein you will need to add the following to the widget properties to make the data in the widget "clickable":

"navigationEntityType": "asset"

Ref:Target.Ref

Example:

{ "entityType": "person-to-asset-stakeholder-link",

"navigationEntityType": "asset", "columns": "Ref:Target.Ref,Asset:Target.Name,Type:Target.InfraEntityType.Name", "headers": ",Asset,Type", "filters": "!@IsDeleted", "sorting": "off", "pageFilters": "[{\"id\":\"REQUESTOR_REF\",\"apiId\":\"Holder.Ref\"}]", "orderBy": "Target.InfraEntityType.Name", "sortBy": "Type" }

Results Show Deleted Field Values

There is a known issue where the query results may return deleted field values and records since the query will pull everything. To counter this, add the following to your widget properties:

Status=='A'&&Target.Status=='A'

Failed to Open Tasks

The widgets don't handle opening tasks due to mismatch between the entity type (base-task) and the review url (task). This is a issue in portal as well. If you are on-prem, and you need a quick fix, you can make the below change in InNavigation.js (Cloud client will need to contact Alemba Support):

function HandleWidgetNavigation(data/*: {viewType: 'details'|'cti'|'search', entityType: 'call'|'request'|string, entityId?: number, telephoneNo?: string, filters?: {UserId:number}*/) {
    switch (data.viewType) {
        case 'details':
/*Alemba custom - Fix for task widget starts*/
    {
      if(data.entityType === "base-task")
      {
        eWrapperEvent('review' + "task" + data.entityId);
      }
      else
    /*Alemba custom - Fix for task widget Ends*/      
            eWrapperEvent('review' + data.entityType + data.entityId);
            break;
/*Alemba custom - Fix for task widget Starts*/  
    }
    /*Alemba custom - Fix for task widget Ends*/
        case 'cti':
            return OpenMMA(101, data.telephoneNo, null);
        case 'search':
            var Builder = new DrilldownXmlBuilder();
            Builder.AddQDValue("USER_REF", CallRootTypeRef, data.filters.UserId, "cti user", true);
            Builder.AddRefValue("PARTITION", CallRootTypeRef, wrapper.CurrentPartition, true);
            Builder.AddRefValue("OPEN_FLAG", CallRootTypeRef, "1,2,3", true);
            var DrilldownXml = Builder.ToXml();
            return CallSearch(DrilldownXml, "", false, "LoggingUserId=" + data.filters.UserId);
        default:
            throw new Error("navigation type not supported");
    }
}

Last updated