Homelab, Linux, JS & ABAP (~˘▾˘)~
 

[CAP] Using a Tree in SAPUI5 Freestyle app

The following Links helped me implementing the tree functionality:

https://sapui5.hana.ondemand.com/#/entity/sap.m.Tree/sample/sap.m.sample.TreeOData

https://answers.sap.com/questions/13192367/sap-cds-how-to-add-hierarchy-annotations-saphierar.html

Define the data model in data-model.cds

entity Node {
    key NodeID         : Integer;
        HierarchyLevel : Integer;
        ParentNodeID   : Integer;
        Description    : String;
        drillState     : String;
}

Create testdata in my.test-Node.csv

NodeID;HierarchyLevel;ParentNodeID;drillState;Description  
1;0;null;"expanded";"1"
2;0;null;"expanded";"2"
3;0;null;"expanded";"3"
4;1;1;"leaf";"1.1"
5;1;1;"expanded";"1.2"
6;2;5;"leaf";"1.2.1"
7;2;5;"leaf";"1.2.2"

and deploy the testdata to your local sql db

cds deploy --to sqlite:db/test.db

Service Definition in test-service.cds

using my.test as db from '../db/data-model';

service testService {
     entity Nodes as projection on db.Node;
}

add the Tree controll to your Fiori UI view Tree.view.xml

		<Tree
		    id="Tree"
		    items="{path: '/Nodes',
				    parameters : {
		                countMode: 'Inline',
                        numberOfExpandedLevels: 3, 
                        treeAnnotationProperties: { 
                                                    hierarchyLevelFor : 'HierarchyLevel', 
                                                    hierarchyNodeFor : 'NodeID', 
                                                    hierarchyParentNodeFor : 'ParentNodeID', 
                                                    hierarchyDrillStateFor : 'drillState' 
                                                    }
		            }
            }">
			<StandardTreeItem title="{Description}"/>
		</Tree>

The output should be similar to this:

[SAPUI5] Filter on Model read

this.getModel().read("/Object", {
                filters: [
                    new Filter({
                        path: "firstName",
                        operator: FilterOperator.EQ,
                        value1: "Max"
                    }),
                    new Filter({
                        path: "lastName",
                        operator: FilterOperator.EQ,
                        value1: "Mustermann"
                    })
                ],
                success: oData => { },
                error: err => { }
});

[SAPUI5] Binding with filter on XML View

https://sapui5.hana.ondemand.com/sdk/#/topic/5338bd1f9afb45fb8b2af957c3530e8f.html

There are two ways to use a filter.

Option 1:

items="{
				path: '/myItems',
				parameters : {
				  $filter : 'itemName eq \'myItemName\'',
				  $orderby : 'createdAt desc'
				},
}">

Option 2:

items="{
				path: '/myItems',
				parameters : {
				  $orderby : 'createdAt desc'
				},
				filters : {                                     
				  path : 'itemName ',
				  operator : 'EQ',
				  value1 : 'myItemName'
				},
}">

[SAPUI5] Toogle Dark mode from Shell Header

There are several different types of buttons you can add to the Shell Header: https://sapui5.hana.ondemand.com/sdk/#/api/sap.ushell.renderers.fiori2.Renderer%23methods/Summary
For my test I choose the “addHeaderEndItem” Button. Add the fowlloing logic in the Component.js file to create the button and the logic for switching the theme:

		_addHeaderButton: function () {
			const oRenderer = sap.ushell.Container.getRenderer("fiori2");
			oRenderer.addHeaderEndItem("sap.ushell.ui.shell.ShellHeadItem", {
				id: "toogleTheme",
				icon: "sap-icon://circle-task-2",
				visible: "{device>/orientation/landscape}",
				tooltip: "Switch Theme",
				press: (oEvent) => {
					const toogleButton = oEvent.getSource();
					if (toogleButton.getIcon() === "sap-icon://circle-task-2") {
						sap.ui.getCore().applyTheme("sap_fiori_3_dark");
						toogleButton.setIcon("sap-icon://circle-task");
					} else {
						sap.ui.getCore().applyTheme("sap_fiori_3");
						toogleButton.setIcon("sap-icon://circle-task-2");
					}
				}
			}, true);
		},

Afterwars you need call the method in the init() function of the component. No reload the app and you will find the new button in the top right corner. Pressing will switch the theme to dark or back to light theme.

[SAPUI5] Message Box

https://experience.sap.com/fiori-design-web/message-box/
https://sapui5.hana.ondemand.com/#/entity/sap.m.MessageBox
https://sapui5.hana.ondemand.com/#/api/sap.m.MessageBox

			onRemoveItem: function (oEvent) {
				const sPath = oEvent.getSource().getParent().getBindingContext().getPath()
				const oModel = this.getView().getModel()
				MessageBox.confirm(
					this.getModel("i18n").getProperty("MessageBoxText"), 
					{
						actions: [MessageBox.Action.YES, MessageBox.Action.NO],
						emphasizedAction: MessageBox.Action.YES,
						onClose: sAnswer => {
							if (sAnswer === MessageBox.Action.YES) oModel.remove(sPath)
						}
					}
				)
			},

[CAP] Add SQLite DB for development

# install SQLite
npm i sqlite3 -D 

# create db, save configuration in package.json, stores mock data into db
cds deploy --to sqlite:db/my-app.db

# test cds deploy command with --dry. Displays ever table and view it creates
cds deploy --to sqlite:db/my-app.db --dry

# get and overview of your tables with .tables
sqlite3 db/my-app.db .tables

# open and view newly created db
sqlite3 db/my-app.db -cmd .dump

# and select single field with
SELECT field FROM mytable WHERE mykeyfield= "00505601194D1EE9B7BFC518B85";

# update a field with
UPDATE mytable SET field = "test" WHERE mykeyfield= "00505601194D1EE9B7BFC518B85";

[ABAP] Provide values of a domain in a dropdown list on selection screen

  
  PARAMETER p_test TYPE c OBLIGATORY AS LISTBOX VISIBLE LENGTH 32 DEFAULT 1.

  INITIALIZATION.

  cl_reca_ddic_doma=>get_values( EXPORTING id_name   = 'Z_MYDOMAIN'
                                 IMPORTING et_values = DATA(lt_rsdomaval) ).

  CALL FUNCTION 'VRM_SET_VALUES'
    EXPORTING
      id     = 'P_TEST'
      values = VALUE vrm_values( FOR dvalue IN lt_rsdomaval ( key  = dvalue-domvalue_l 
                                                              text = dvalue-ddtext ) ).