@sapui5/sap.ushell_abap 1.153.0 → 1.154.0

package/src/main/js/sap/ushell_abap/components/tiles/applauncher/Configuration.controller.js

@@ -0,0 +1,114 @@
+// Copyright (c) 2009-2026 SAP SE, All Rights Reserved
+
+sap.ui.define([
+    "sap/ui/core/mvc/Controller",
+    "sap/ushell/components/tiles/utils",
+    "sap/ui/core/ListItem"
+], (Controller, tileUtils, ListItem) => {
+    "use strict";
+
+    return Controller.extend("sap.ushell_abap.components.tiles.applauncher.Configuration", {
+        // checks given inputs
+        onConfigurationInputChange: function (oControlEvent) {
+            tileUtils.checkInput(this.getView(), oControlEvent);
+        },
+        // default semantic objects for static applauncher: blank
+        aDefaultObjects: [{ obj: "", name: "" }],
+        onInit: function () {
+            const oView = this.getView();
+            const oTargetUrl = oView.byId("targetUrl");
+            const oSemanticObjectSelector = oView.byId("navigation_semantic_objectInput");
+            const oActionSelector = oView.byId("navigation_semantic_actionInput");
+            const oResourceModel = tileUtils.getResourceBundleModel();
+
+            oView.setModel(oResourceModel, "i18n");
+            const oBundle = tileUtils.getResourceBundle();
+            // set view name for identification in utils
+            oView.setViewName("sap.ushell_abap.components.tiles.applauncher.Configuration");
+            tileUtils.createSemanticObjectModel(this, oSemanticObjectSelector, this.aDefaultObjects);
+            tileUtils.createActionModel(this, oActionSelector);
+
+            // make sure that the chose object is written back to the configuration
+            oSemanticObjectSelector.attachChange((oControlEvent) => {
+                const sValue = oControlEvent.getSource().getValue();
+                oView.getModel().setProperty("/config/navigation_semantic_object", sValue);
+            });
+
+            // toggle editable property of targetURL input field depending on navigation_use_semantic_object
+            function targetUrlVisibilityFormatter (bUseLaunchpad) {
+                return !bUseLaunchpad;
+            }
+            oTargetUrl.bindProperty("enabled", {
+                formatter: targetUrlVisibilityFormatter,
+                path: "/config/navigation_use_semantic_object"
+            });
+            // Adding list items URL and Intent to the Target Type in Tile Actions section
+            let oItem = new ListItem({ key: "URL", text: oBundle.getText("configuration.tile_actions.table.target_type.url") });
+            oView.byId("targetTypeCB").addItem(oItem);
+            oItem = new ListItem({ key: "INT", text: oBundle.getText("configuration.tile_actions.table.target_type.intent") });
+            oView.byId("targetTypeCB").addItem(oItem);
+        },
+
+        onAfterRendering: function () {
+            tileUtils.updateMessageStripForOriginalLanguage(this.getView());
+        },
+
+        // forward semantic object value helper request to utils
+        onValueHelpRequest: function (oEvent) {
+            // Third parameter is to differentiate whether it's Tile Actions icon field or general icon field. If it's true, then it's tile actions icon field, else general icon field.
+            tileUtils.objectSelectOnValueHelpRequest(this, oEvent, false);
+        },
+        // forward semantic action value helper request to utils
+        onActionValueHelpRequest: function (oEvent) {
+            // Third parameter is to differentiate whether it's Tile Actions icon field or general icon field. If it's true, then it's tile actions icon field, else general icon field.
+            tileUtils.actionSelectOnValueHelpRequest(this, oEvent, false);
+        },
+        // change handler for check box
+        onCheckBoxChange: function (oEvent) {
+            const oView = this.getView();
+            const oSemanticObjectSelector = oView.byId("navigation_semantic_objectInput");
+            const oModel = oSemanticObjectSelector.getModel();
+            const value = oEvent.getSource().getSelected();
+            oModel.setProperty("/enabled", value);
+            tileUtils.checkInput(this.getView(), oEvent);
+        },
+        // forward icon value help request to utils
+        onIconValueHelpRequest: function (oEvent) {
+            // Third parameter is to differentiate whether it's Tile Actions icon field or general icon field. If it's true, then it's tile actions icon field, else general icon field.
+            tileUtils.iconSelectOnValueHelpRequest(this, oEvent, false);
+        },
+        // forward icon close request to utils
+        onSelectIconClose: function () {
+            tileUtils.onSelectIconClose(this.getView());
+        },
+        // forward icon ok to utils
+        onSelectIconOk: function () {
+            tileUtils.onSelectIconOk(this.getView());
+        },
+        // This function applies table logic for the Action according to the Target Type:
+        // if Taregt Type is URL, then Action field should be disabled else if it's Intent, then the Action field should be enabled.
+        handleTargetTypeChange: function (oTargetTypeComboBox) {
+            tileUtils.onTargetTypeChange(oTargetTypeComboBox);
+        },
+
+        // forward tile actions semantic object value helper request to utils
+        onTileActionValueHelp: function (oEvent) {
+            // Third parameter is to differentiate whether it's Tile Actions icon field or general icon field. If it's true, then it's tile actions icon field, else general icon field.
+            tileUtils.objectSelectOnValueHelpRequest(this, oEvent, true);
+        },
+
+        // forward icon value help request to utils
+        onTileActionIconValueHelp: function (oEvent) {
+            // Third parameter is to differentiate whether it's Tile Actions icon field or general icon field. If it's true, then it's tile actions icon field, else general icon field.
+            tileUtils.iconSelectOnValueHelpRequest(this, oEvent, true);
+        },
+        // adds new row in the tile actions table
+        addRow: function () {
+            tileUtils.addTileActionsRow(this.getView());
+        },
+        // delets row in the tile actions table
+        deleteRow: function () {
+            tileUtils.deleteTileActionsRow(this.getView());
+        }
+    });
+});

package/src/main/js/sap/ushell_abap/components/tiles/applauncher/Configuration.view.xml

@@ -0,0 +1,208 @@
+<mvc:View
+    xmlns="sap.m"
+    xmlns:core="sap.ui.core"
+    xmlns:mvc="sap.ui.core.mvc"
+    xmlns:form="sap.ui.layout.form"
+    xmlns:layout="sap.ui.layout"
+    xmlns:table="sap.ui.table"
+    xmlns:rowmodes="sap.ui.table.rowmodes"
+    controllerName="sap.ushell_abap.components.tiles.applauncher.Configuration">
+    <MessageStrip id="messageStrip" showIcon="true" showCloseButton="false" visible="false" class="sapUiResponsiveMargin" />
+    <MessageStrip
+        type="Warning"
+        enableFormattedText="true"
+        showIcon="true"
+        showCloseButton="false"
+        class="sapUiResponsiveMargin"
+        visible="{= !!${/config/deprecation_text}}"
+        text="{/config/deprecation_text}" />
+    <form:SimpleForm id="configuration" maxContainerCols="2" editable="true">
+        <form:content>
+            <core:Title id="categoryCommon" text="{i18n>configuration.category.general}" />
+            <Label text="{i18n>configuration.display_title_text}" />
+            <Input
+                id="titleInput"
+                value="{/config/display_title_text}"
+                enabled="{/config/editable}"
+                width="100%"
+                tooltip="{i18n>configuration.display_title_text.tooltip}"
+                editable="{/config/isLocaleSuitable}" />
+            <Label text="{i18n>configuration.display_subtitle_text}" />
+            <Input
+                id="subtitleInput"
+                value="{/config/display_subtitle_text}"
+                enabled="{/config/editable}"
+                width="100%"
+                tooltip="{i18n>configuration.display_subtitle_text.tooltip}"
+                editable="{/config/isLocaleSuitable}" />
+            <Label text="{i18n>configuration.keywords}" />
+            <Input
+                id="keywordsInput"
+                value="{/config/display_search_keywords}"
+                enabled="{/config/editable}"
+                width="100%"
+                tooltip="{i18n>configuration.keywords.tooltip}"
+                editable="{/config/isLocaleSuitable}" />
+            <Label text="{i18n>configuration.display_icon_url}" />
+            <Input
+                id="iconInput"
+                value="{/config/display_icon_url}"
+                enabled="{/config/editable}"
+                placeholder="sap-icon://inbox"
+                tooltip="{i18n>configuration.display_icon_url.tooltip}"
+                liveChange=".onConfigurationInputChange"
+                valueHelpRequest=".onIconValueHelpRequest"
+                showValueHelp="true" />
+            <Label text="{i18n>configuration.display_info_text}" />
+            <Input
+                id="infoInput"
+                value="{/config/display_info_text}"
+                enabled="{/config/editable}"
+                width="100%"
+                tooltip="{i18n>configuration.display_info_text.tooltip}"
+                editable="{/config/isLocaleSuitable}" />
+            <core:Title id="categoryNavigation" text="{i18n>configuration.category.navigation}" />
+            <Label text="{i18n>configuration.navigation_use_semantic_object}" />
+            <CheckBox
+                id="useLpdCheckbox"
+                selected="{/config/navigation_use_semantic_object}"
+                tooltip="{i18n>configuration.navigation_use_semantic_object.tooltip}"
+                select=".onCheckBoxChange"
+                enabled="{/config/editable}" />
+            <Label text="{i18n>configuration.semantic_object}" />
+            <Input
+                id="navigation_semantic_objectInput"
+                width="100%"
+                tooltip="{i18n>configuration.semantic_object.tooltip}"
+                maxLength="30"
+                liveChange=".onConfigurationInputChange"
+                valueHelpRequest=".onValueHelpRequest"
+                showValueHelp="true"
+                showSuggestion="true"
+                enabled="{= ${/enabled} &amp;&amp; ${/config/editable}}"
+                value="{/value}" />
+            <Label text="{i18n>configuration.navigation_semantic_action}" />
+            <Input
+                id="navigation_semantic_actionInput"
+                value="{/config/navigation_semantic_action}"
+                width="100%"
+                enabled="{= ${/config/navigation_use_semantic_object} &amp;&amp; ${/config/editable}}"
+                maxLength="50"
+                valueHelpRequest=".onActionValueHelpRequest"
+                showValueHelp="true"
+                showSuggestion="true"
+                tooltip="{i18n>configuration.navigation_semantic_action.tooltip}"
+                liveChange=".onConfigurationInputChange" />
+            <Label text="{i18n>configuration.navigation_semantic_parameters}" />
+            <Input
+                id="navigation_semantic_parametersInput"
+                value="{/config/navigation_semantic_parameters}"
+                width="100%"
+                enabled="{= ${/config/navigation_use_semantic_object} &amp;&amp; ${/config/editable}}"
+                tooltip="{i18n>configuration.navigation_semantic_parameters.tooltip}" />
+            <Label text="{i18n>configuration.navigation_target_url}" />
+            <Input
+                id="targetUrl"
+                value="{/config/navigation_target_url}"
+                type="Url"
+                width="100%"
+                tooltip="{i18n>configuration.navigation_target_url.tooltip}" />
+            <Label />
+            <core:Title id="categoryTileActions" text="{i18n>configuration.category.tile_actions}" />
+            <table:Table
+                id="tileActions"
+                rows="{/config/tile_actions_rows}"
+                selectionBehavior="Row"
+                selectionMode="MultiToggle"
+                enableColumnReordering="false">
+                <table:rowMode>
+                    <rowmodes:Fixed rowCount="3" rowContentHeight="30"/>
+                </table:rowMode>
+                <table:Column id="menuItem" width="80px" tooltip="{i18n>configuration.tile_actions.table.menu_item_tooltip}">
+                    <Label text="{i18n>configuration.tile_actions.table.menu_item}" />
+                    <table:template>
+                        <Input value="{menu_title}" editable="{editable}" valueState="{valueState}" />
+                    </table:template>
+                </table:Column>
+                <table:Column id="targetType" width="85px" tooltip="{i18n>configuration.tile_actions.table.target_type_tooltip}">
+                    <Label text="{i18n>configuration.tile_actions.table.target_type}" />
+                    <table:template>
+                        <ComboBox
+                            id="targetTypeCB"
+                            value="{target_type}"
+                            editable="{editable}"
+                            change=".handleTargetTypeChange" />
+                    </table:template>
+                </table:Column>
+                <table:Column
+                    id="navigationTarget"
+                    width="162px"
+                    tooltip="{i18n>configuration.tile_actions.table.navigation_target_tooltip}">
+                    <Label text="{i18n>configuration.tile_actions.table.navigation_target}" />
+                    <table:template>
+                        <Input
+                            liveChange=".onConfigurationInputChange"
+                            valueHelpRequest=".onTileActionValueHelp"
+                            showValueHelp="{isTargetTypeIntent}"
+                            showSuggestion="{isTargetTypeIntent}"
+                            value="{navigation_target}"
+                            editable="{editable}" />
+                    </table:template>
+                </table:Column>
+                <table:Column id="action" width="85px" tooltip="{i18n>configuration.tile_actions.table.action_tooltip}">
+                    <Label text="{i18n>configuration.tile_actions.table.action}" />
+                    <table:template>
+                        <Input value="{action}" enabled="{isTargetTypeIntent}" editable="{editable}" />
+                    </table:template>
+                </table:Column>
+                <table:Column id="icon" width="110px" tooltip="{i18n>configuration.tile_actions.table.icon_tooltip}">
+                    <Label text="{i18n>configuration.tile_actions.table.icon}" />
+                    <table:template>
+                        <Input
+                            value="{icon}"
+                            placeholder="sap-icon://inbox"
+                            editable="{editable}"
+                            valueStateText="{iconValueStateText}"
+                            valueState="{iconValueState}"
+                            liveChange=".onConfigurationInputChange"
+                            valueHelpRequest=".onTileActionIconValueHelp"
+                            showValueHelp="true" />
+                    </table:template>
+                </table:Column>
+            </table:Table>
+            <Label />
+            <HBox alignItems="End" justifyContent="End">
+                <Button
+                    id="addRow"
+                    text="{i18n>configuration.tile_actions.table.add}"
+                    enabled="{/config/editable}"
+                    tooltip="{i18n>configuration.tile_actions.table.add_tooltip}"
+                    press=".addRow"
+                    width="100px" />
+                <Button
+                    id="deleteRow"
+                    text="{i18n>configuration.tile_actions.table.remove}"
+                    enabled="{/config/editable}"
+                    tooltip="{i18n>configuration.tile_actions.table.remove_tooltip}"
+                    press=".deleteRow"
+                    width="100px" />
+            </HBox>
+        </form:content>
+    </form:SimpleForm>
+    <HBox visible="false">
+        <Dialog
+            id="selectIconDialog"
+            beginButton="ok"
+            endButton="cancel"
+            title="{i18n>configuration.select_icon}"
+            class="sapContrastPlus">
+            <content>
+                <layout:ResponsiveFlowLayout id="icons" />
+                <HBox visible="true">
+                    <Button id="ok" enabled="{/config/ok.enabled}" text="{i18n>configuration.ok}" />
+                    <Button id="cancel" text="{i18n>configuration.cancel}" press=".onSelectIconClose" />
+                </HBox>
+            </content>
+        </Dialog>
+    </HBox>
+</mvc:View>