Question
Output parameters from custom UI component based on a Classic UI page to Freedom UI page
16:13 Jan 17, 2025
Hi there
I implemeted custom UI component (OsmMapsModule) and injected it on Freedom Ui list page using this article Implement a custom UI component based on a Classic UI page | Creatio Academy
Now I need to get feedback from that component on the page to trigger some logic on Freedom UI, bu fail to do so. Here is my code.
define("ClvObjectMapModule", ["ClvObjectMapModuleResources", "@creatio-devkit/common", "Base7xViewElement", "MaskHelper", "ClvJsConsts", "ckeditor-base", "Leaflet", "css!Leaflet"], function(resources, sdk, Base7xViewElement, MaskHelper, ClvJsConsts) { /* Declare a "ClvObjectMapModule" class. */ class ClvObjectMapModule extends Base7xViewElement { _mapRecordClickedId; get mapRecordClickedId() { return this._mapRecordClickedId; } set mapRecordClickedId(value) { this._mapRecordClickedId = value; } ... // Here I make change and want it propagate to Freedom UI page. _clvOpenPage(config) { this.mapRecordClickedId = config.recordId; } } /* Register the component. */ customElements.define('clv-objectmap', ClvObjectMapModule); /* Register a component as a visual element. */ sdk.registerViewElement({ type: 'clv.ObjectMap', selector: 'clv-objectmap', inputs: { mapRecordClickedId: {} }, // This is not documented and I just guessed it might work like for example inputs work. outputs: { mapRecordClickedId: {} } }); return Terrasoft.ClvObjectMapModule; });
Like
1 comments
16:16 Jan 17, 2025
And here is code in Freedom UI
"MapRecordClickedId": { "modelConfig": {} }, ... { request: "crt.HandleViewModelAttributeChangeRequest", handler: async (request, next) => { // I want this handler to be triggered but it just does not when I make changes in custom component if (request.attributeName === "MapRecordClickedId" && sdk.isGuid(request.value)) { const handlerChain = sdk.HandlerChainService.instance; await handlerChain.process({ "type": 'crt.OpenPageRequest', "schemaName": "ClvObject_FormPage", "modelInitConfigs": [{ "recordId": request.value, "action": sdk.ModelInPageAction.Edit }], $context: request.$context }); } return next?.handle(request); } }, ... { "operation": "insert", "name": "ClvObjectMap", "values": { "type": "clv.ObjectMap", "mapRecordClickedId": "$MapRecordClickedId", "styles": { "width": "-webkit-fill-available" } }, "parentName": "ClvMapContainer", "propertyName": "items", "index": 0 }
Show all comments