Skip to main content
Version: 8.1

Hide the feature on a page due to insufficient access permissions

Level: intermediate
Example

Hide the Excel data import button on the record page of the custom Rights Service section if the user lacks permission to import Excel data.

1. Set up the page UI​

  1. Create a custom Rights Service app based on the Records & business processes template. To do this, follow the guide in the user documentation: Create a custom app.

  2. Open the Rights Service form page page in the working area of the Rights Service app page.

  3. Delete the Name field the Rights Service form page page includes by default.

  4. Add a button that starts Excel data import.

    1. Add a Button type component to the toolbar of the Freedom UI Designer.

    2. Click in the action panel of the Freedom UI Designer and fill out the button properties in the setup area.

      • Set Title to "Excel data import."
      • Select "Primary" in the Style property.

  5. Click in the action panel of the Freedom UI Designer. After you save the page settings, Creatio opens the source code of the Freedom UI page.

2. Hide the feature if the user lacks permission to access it​

Configure the business logic in the Client Module Designer. For this example, hide the feature if the user lacks permission to access it

  1. Enable the sdk.RightsService that checks access permissions. To do this, add @creatio-devkit/common to the AMD module as a dependency.

    AMD module dependencies
    /* Declare the AMD module. */
    define("UsrAppRightsService_FormPage", /**SCHEMA_DEPS*/["@creatio-devkit/common"] /**SCHEMA_DEPS*/, function/**SCHEMA_ARGS*/(sdk)/**SCHEMA_ARGS*/ {
            ...
        };
    });

  2. Add the CanImportFromExcel attribute that stores the user's access permission data to the viewModelConfigDiff schema section.

    viewModelConfigDiff schema section
    viewModelConfigDiff: /**SCHEMA_VIEW_MODEL_CONFIG*/{
        "attributes": {
            ...,
            /* The attribute that stores the user's access permission data. */
            "CanImportFromExcel": {}
        }
    }/**SCHEMA_VIEW_MODEL_CONFIG*/,

  3. Bind the visible property of the ExcelDataImportButton element to the CanImportFromExcel model attribute in the viewConfigDiff schema section. The visible property flags the button as visible.

    viewConfigDiff schema section
    viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[
        {
            "operation": "insert",
            "name": "ExcelDataImportButton",
            "values": {
                ...,
                /* The property that flags the button as visible. Bound to the CanImportFromExcel attribute. */
                "visible": "$CanImportFromExcel"
            },
            ...
        }
    ]/**SCHEMA_VIEW_CONFIG_DIFF*/,

  4. Add a custom implementation of the crt.HandlerViewModelInitRequest system query handler to the handlers schema section. Execute the handler when Creatio initializes the View model.

    1. Create an instance of the service that checks access permissions from @creatio-devkit/common.
    2. Retrieve data about the user's access permission to the CanImportFromExcel system operation.
    3. Specify the data in the CanImportFromExcel attribute.
    handlers schema section
    handlers: /**SCHEMA_HANDLERS*/[
        {
            request: "crt.HandleViewModelInitRequest",
            /* The custom implementation of the system query handler. */
            handler: async (request, next) => {
                /* Create an instance of the service that checks access permissions from @creatio-devkit/common. */
                const rightService = new sdk.RightsService();
                /* Retrieve data about the user's access permission to the CanImportFromExcel system operation. */
                const canImportFromExcel = await rightService.getCanExecuteOperation('CanImportFromExcel');
                /* Specify the data in the CanImportFromExcel attribute. */
                request.$context.CanImportFromExcel = canImportFromExcel;
                /* Call the next handler if it exists and return its result. */
                return next?.handle(request);
            },
        }
    ] /**SCHEMA_HANDLERS*/,

  5. Click Save on the Client Module Designer's toolbar.

Outcome of the example​

To view the outcome of the example without the access permission:

  1. Log in to the app as a user who lacks the permission to import data from Excel. For example, create a new user or revoke the permission from an existing user. To add a user, follow the guide in the user documentation: Add users. To set up access permissions, follow the guide in the user documentation: System operation permissions. The Excel import (CanImportFromExcel code) system operation manages Excel data import.
  2. Open the Rights Service app page and click Run app.
  3. Click New on the Rights Service app toolbar.

As a result, Creatio will hide the Excel data import button that starts Excel data import on the Rights Service app page.

To view the outcome of the example with the access permission:

  1. Refresh the Rights Service app page.
  2. Click New on the Rights Service app toolbar.

As a result, Creatio will display the Excel data import button that starts Excel data import on the Rights Service app page.

Source codes​

UsrAppRightsService_FormPage
/* Declare the AMD module. */
define("UsrAppRightsService_FormPage", /**SCHEMA_DEPS*/["@creatio-devkit/common"] /**SCHEMA_DEPS*/, function/**SCHEMA_ARGS*/(sdk)/**SCHEMA_ARGS*/ {
    return {
        viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[
            {
                "operation": "insert",
                "name": "ExcelDataImportButton",
                "values": {
                    "type": "crt.Button",
                    "caption": "#ResourceString(ExcelDataImportButton_caption)#",
                    "color": "primary",
                    "disabled": false,
                    "clicked": {
                        "request": "crt.RunBusinessProcessRequest"
                    },
                    /* The property that flags the button as visible. Bound to the CanImportFromExcel attribute. */
                    "visible": "$CanImportFromExcel"
                },
                "parentName": "ActionButtonsContainer",
                "propertyName": "items",
                "index": 3
            }
        ]/**SCHEMA_VIEW_CONFIG_DIFF*/,
        viewModelConfigDiff: /**SCHEMA_VIEW_MODEL_CONFIG*/{
            "attributes": {
                "Id": {
                    "modelConfigDiff": {
                        "path": "PDS.Id"
                    }
                },
                /* The attribute that stores the user's access permission data. */
                "CanImportFromExcel": {}
            }
        }/**SCHEMA_VIEW_MODEL_CONFIG*/,
        modelConfigDiff: /**SCHEMA_MODEL_CONFIG*/{
            "dataSources": {
                "PDS": {
                    "type": "crt.EntityDataSource",
                    "config": {
                        "entitySchemaName": "UsrAppRightsService"
                    }
                }
            }
        }/**SCHEMA_MODEL_CONFIG*/,
        handlers: /**SCHEMA_HANDLERS*/[
            {
                request: "crt.HandleViewModelInitRequest",
                /* The custom implementation of the system query handler. */
                handler: async (request, next) => {
                    /* Create an instance of the service that checks access permissions from @creatio-devkit/common. */
                    const rightService = new sdk.RightsService();
                    /* Retrieve data about the user's access permission to the CanImportFromExcel system operation. */
                    const canImportFromExcel = await rightService.getCanExecuteOperation('CanImportFromExcel');
                    /* Specify the data in the CanImportFromExcel attribute. */
                    request.$context.CanImportFromExcel = canImportFromExcel;
                    /* Call the next handler if it exists and return its result. */
                    return next?.handle(request);
                },
            }
        ] /**SCHEMA_HANDLERS*/,
        converters: /**SCHEMA_CONVERTERS*/{}/**SCHEMA_CONVERTERS*/,
        validators: /**SCHEMA_VALIDATORS*/{}/**SCHEMA_VALIDATORS*/
    };
});

Resources​

Package with example implementation