/*! * SAPUI5 * Copyright (c) 2025 SAP SE or an SAP affiliate company. All rights reserved. */ import Button, { Button$PressEvent } from "sap/m/Button"; import { $ButtonSettings } from "sap/m/Button"; import { MetadataOptions } from "sap/ui/base/ManagedObject"; import SearchModel from "../../SearchModel"; import UIEvents, { IUiEventParametersShowResultDetail } from "../../UIEvents"; import i18n from "../../i18n"; import Device from "sap/ui/Device"; export interface $SearchShowDetailButtonSettings extends $ButtonSettings { visualisation?: string; } /** * Navigate to detail of a result item * */ /** * Constructs a new SearchShowDetailButton to display a button to navigate to the detail of a result item. * * @param {string} [sId] ID for the new control, generated automatically if no ID is given * * @class * * This is the SAPUI5 search show detail button control to navigate to the detail of a result item. * Use in combination with control SearchCompositeControl by the Enterprise Search Team. * The master detail mode of the result view must be activated (see config property 'resultviewMasterDetailMode'). * Place this button on custom result grid view tiles (see config property 'customGridView'). * The press event of this button will fire the event 'showResultDetail' (see sap.esh.search.ui.controls.SearchCompositeControl). * * @extends sap.m.Button * * @author SAP SE * @version 1.150.1 * * @see https://help.sap.com/viewer/691cb949c1034198800afde3e5be6570/2.0.08/en-US/ce86ef2fd97610149eaaaa0244ca4d36.html SAP HANA Search Developer Guide * @see https://help.sap.com/docs/SAP_S4HANA_ON-PREMISE/90b263323d0a4976bcda415e6bd20ea4/d93d53ef27074bbf9a4849c4a4c3e360.html Enterprise Search in SAP S/4HANA * * * @constructor * @public * @alias sap.esh.search.ui.controls.resultview.SearchShowDetailButton * @since 1.141.0 * @name sap.esh.search.ui.controls.resultview.SearchShowDetailButton * */ /** * @namespace sap.esh.search.ui.controls */ export default class SearchShowDetailButton extends Button { static readonly metadata: MetadataOptions = { library: "sap.esh.search.ui.controls.resultview", properties: { visualisation: { type: "string", defaultValue: "button", // "arrow", "button" or "navigation" }, }, aggregations: {}, }; constructor(sId?: string, settings?: $SearchShowDetailButtonSettings) { super(sId, settings); if (settings?.visualisation) { this.setVisualisation(settings.visualisation); } else { this.setVisualisation("button"); } } setVisualisation(sVisualisation: string): void { this.setProperty("visualisation", sVisualisation); if (sVisualisation === "arrow") { this.setIcon("sap-icon://slim-arrow-right"); } else if (sVisualisation === "button") { this.setIcon("sap-icon://slim-arrow-right"); this.setText(i18n.getText("showDetails")); } else if (sVisualisation === "navigation") { this.setIcon(""); this.setText(i18n.getText("showDetails")); } this.setTooltip(i18n.getText("showDetails_tooltip")); this.bindProperty("visible", { path: "/config/resultviewMasterDetailMode", formatter: (resultviewMasterDetailMode: boolean): boolean => { const oModel = this.getModel() as SearchModel; // master detail mode // not on phones or when in value-help mode return ( resultviewMasterDetailMode && !oModel.config.optimizeForValueHelp && !Device.system.phone ); }, }); this.attachPress((oEvent: Button$PressEvent): void => { const oModel = this.getModel() as SearchModel; // notify subscribers let resultItemKey: string; if (oEvent.getSource().getBindingContext()) { // internal search model resultItemKey = oEvent.getSource().getBindingContext().getProperty("key"); } else { // public search model resultItemKey = oEvent.getSource().getBindingContext("publicSearchModel").getProperty("key"); } oModel.notifySubscribers(UIEvents.ESHShowResultDetail, { originalEvent: oEvent, resultItemKey: resultItemKey, } as IUiEventParametersShowResultDetail); }); } static renderer = { apiVersion: 2, }; }