Quan

.vscode/settings.json

@@ -2,5 +2,6 @@
     "editor.formatOnSave": true,
     "oneDarkPro.italic": false,
     "prettier.tabWidth": 4,
-    "files.autoSave": "off"
+    "files.autoSave": "off",
+    "SAP HANA Project Explorer.bind.confirm automatic undeployment": false
 }

app/bills/README.md

@@ -0,0 +1,37 @@
+## Application Details
+|               |
+| ------------- |
+|**Generation Date and Time**<br>Mon Dec 18 2023 07:27:37 GMT+0000 (Coordinated Universal Time)|
+|**App Generator**<br>@sap/generator-fiori-freestyle|
+|**App Generator Version**<br>1.12.0|
+|**Generation Platform**<br>SAP Business Application Studio|
+|**Template Used**<br>3worklistodatav4|
+|**Service Type**<br>Local Cap|
+|**Service URL**<br>http://localhost:4004/bills/
+|**Module Name**<br>bills|
+|**Application Title**<br>Bills|
+|**Namespace**<br>ns|
+|**UI5 Theme**<br>sap_horizon|
+|**UI5 Version**<br>1.120.3|
+|**Enable Code Assist Libraries**<br>False|
+|**Enable TypeScript**<br>False|
+|**Add Eslint configuration**<br>False|
+|**Object collection**<br>Bills|
+|**Object collection key**<br>ID|
+|**Object ID**<br>ID|
+
+## bills
+
+bills
+
+### Starting the generated app
+
+-   This app has been generated using the SAP Fiori tools - App Generator, as part of the SAP Fiori tools suite.  In order to launch the generated app, simply start your CAP project and navigate to the following location in your browser:
+
+http://localhost:4004/bills/webapp/index.html
+
+#### Pre-requisites:
+
+1. Active NodeJS LTS (Long Term Support) version and associated supported NPM version.  (See https://nodejs.org)
+
+

app/fe_bill/annotations.cds → app/bills/annotations.cds

@@ -1 +1 @@
-using BillsManagement as service from '../../srv/bills-service';
+using BillsManagement as service from '../../srv/bills-service';

app/bills/package.json

@@ -0,0 +1,28 @@
+{
+    "name": "bills",
+    "version": "0.0.1",
+    "description": "bills",
+    "keywords": [
+        "ui5",
+        "openui5",
+        "sapui5"
+    ],
+    "main": "webapp/index.html",
+    "scripts": {
+        "deploy-config": "npx -p @sap/ux-ui5-tooling fiori add deploy-config cf",
+        "build:cf": "ui5 build preload --clean-dest --config ui5-deploy.yaml --include-task=generateCachebusterInfo"
+    },
+    "devDependencies": {
+        "@sap/ui5-builder-webide-extension": "^1.1.8",
+        "ui5-task-zipper": "^0.5.0",
+        "mbt": "^1.2.18",
+        "@ui5/cli": "^2.14.10"
+    },
+    "ui5": {
+        "dependencies": [
+            "@sap/ui5-builder-webide-extension",
+            "ui5-task-zipper",
+            "mbt"
+        ]
+    }
+}

app/bills/ui5-deploy.yaml

@@ -0,0 +1,25 @@
+# yaml-language-server: $schema=https://sap.github.io/ui5-tooling/schema/ui5.yaml.json
+specVersion: '2.4'
+metadata:
+  name: ns.bills
+type: application
+resources:
+  configuration:
+    propertiesFileSourceEncoding: UTF-8
+builder:
+  resources:
+    excludes:
+      - "/test/**"
+      - "/localService/**"
+  customTasks:
+  - name: webide-extension-task-updateManifestJson
+    afterTask: replaceVersion
+    configuration:
+      appFolder: webapp
+      destDir: dist
+  - name: ui5-task-zipper
+    afterTask: generateCachebusterInfo
+    configuration:
+      archiveName: nsbills
+      additionalFiles:
+      - xs-app.json

app/fe_bill/ui5.yaml → app/bills/ui5.yaml

@@ -1,4 +1,4 @@
 specVersion: "2.5"
 metadata:
-  name: febill
+  name: ns.bills
 type: application

app/bills/webapp/Component.js

@@ -0,0 +1,71 @@
+sap.ui.define([
+    "sap/ui/core/UIComponent",
+    "sap/ui/Device",
+    "./model/models",
+    "./controller/ErrorHandler"
+], function (UIComponent, Device, models, ErrorHandler) {
+    "use strict";
+
+    return UIComponent.extend("ns.bills.Component", {
+
+        metadata : {
+            manifest: "json"
+        },
+
+        /**
+         * The component is initialized by UI5 automatically during the startup of the app and calls the init method once.
+         * In this function, the device models are set and the router is initialized.
+         * @public
+         * @override
+         */
+        init : function () {
+            // call the base component's init function
+            UIComponent.prototype.init.apply(this, arguments);
+
+            // initialize the error handler with the component
+            this._oErrorHandler = new ErrorHandler(this);
+
+            // set the device model
+            this.setModel(models.createDeviceModel(), "device");
+
+            // create the views based on the url/hash
+            this.getRouter().initialize();
+        },
+
+        /**
+         * The component is destroyed by UI5 automatically.
+         * In this method, the ErrorHandler is destroyed.
+         * @public
+         * @override
+         */
+        destroy : function () {
+            this._oErrorHandler.destroy();
+            // call the base component's destroy function
+            UIComponent.prototype.destroy.apply(this, arguments);
+        },
+
+        /**
+         * This method can be called to determine whether the sapUiSizeCompact or sapUiSizeCozy
+         * design mode class should be set, which influences the size appearance of some controls.
+         * @public
+         * @return {string} css class, either 'sapUiSizeCompact' or 'sapUiSizeCozy' - or an empty string if no css class should be set
+         */
+        getContentDensityClass : function() {
+            if (this._sContentDensityClass === undefined) {
+                // check whether FLP has already set the content density class; do nothing in this case
+                // eslint-disable-next-line fiori-custom/sap-no-proprietary-browser-api, fiori-custom/sap-browser-api-warning
+                if (document.body.classList.contains("sapUiSizeCozy") || document.body.classList.contains("sapUiSizeCompact")) {
+                    this._sContentDensityClass = "";
+                } else if (!Device.support.touch) { // apply "compact" mode if touch is not supported
+                    this._sContentDensityClass = "sapUiSizeCompact";
+                } else {
+                    // "cozy" in case of touch support; default for most sap.m controls, but needed for desktop-first controls like sap.ui.table.Table
+                    this._sContentDensityClass = "sapUiSizeCozy";
+                }
+            }
+            return this._sContentDensityClass;
+        }
+
+    });
+
+});

app/bills/webapp/controller/App.controller.js

@@ -0,0 +1,14 @@
+sap.ui.define([
+    "./BaseController"
+], function (BaseController) {
+    "use strict";
+
+    return BaseController.extend("ns.bills.controller.App", {
+
+        onInit : function () {
+            // apply content density mode to root view
+            this.getView().addStyleClass(this.getOwnerComponent().getContentDensityClass());
+        }
+    });
+
+});

app/bills/webapp/controller/BaseController.js

@@ -0,0 +1,65 @@
+sap.ui.define([
+    "sap/ui/core/mvc/Controller",
+    "sap/ui/core/UIComponent",
+    "sap/m/library"
+], function (Controller, UIComponent, mobileLibrary) {
+    "use strict";
+
+    // shortcut for sap.m.URLHelper
+    var URLHelper = mobileLibrary.URLHelper;
+
+    return Controller.extend("ns.bills.controller.BaseController", {
+        /**
+         * Convenience method for accessing the router.
+         * @public
+         * @returns {sap.ui.core.routing.Router} the router for this component
+         */
+        getRouter : function () {
+            return UIComponent.getRouterFor(this);
+        },
+
+        /**
+         * Convenience method for getting the view model by name.
+         * @public
+         * @param {string} [sName] the model name
+         * @returns {sap.ui.model.Model} the model instance
+         */
+        getModel : function (sName) {
+            return this.getView().getModel(sName);
+        },
+
+        /**
+         * Convenience method for setting the view model.
+         * @public
+         * @param {sap.ui.model.Model} oModel the model instance
+         * @param {string} sName the model name
+         * @returns {sap.ui.mvc.View} the view instance
+         */
+        setModel : function (oModel, sName) {
+            return this.getView().setModel(oModel, sName);
+        },
+
+        /**
+         * Getter for the resource bundle.
+         * @public
+         * @returns {sap.ui.model.resource.ResourceModel} the resourceModel of the component
+         */
+        getResourceBundle : function () {
+            return this.getOwnerComponent().getModel("i18n").getResourceBundle();
+        },
+
+        /**
+         * Event handler when the share by E-Mail button has been clicked
+         * @public
+         */
+        onShareEmailPress : function () {
+            var oViewModel = (this.getModel("objectView") || this.getModel("worklistView"));
+            URLHelper.triggerEmail(
+                null,
+                oViewModel.getProperty("/shareSendEmailSubject"),
+                oViewModel.getProperty("/shareSendEmailMessage")
+            );
+        }
+    });
+
+});

app/bills/webapp/controller/ErrorHandler.js

@@ -0,0 +1,77 @@
+sap.ui.define([
+    "sap/ui/base/Object",
+    "sap/m/MessageBox",
+    "sap/ui/model/Filter",
+    "sap/ui/model/FilterOperator"
+], function (UI5Object, MessageBox, Filter, FilterOperator) {
+    "use strict";
+
+    return UI5Object.extend("ns.bills.controller.ErrorHandler", {
+
+        /**
+         * Handles application errors by automatically attaching to the model events and displaying errors when needed.
+         * @class
+         * @param {sap.ui.core.UIComponent} oComponent reference to the app's component
+         * @public
+         * @alias ns.bills.controller.ErrorHandler
+         */
+        constructor : function (oComponent) {
+            var oMessageManager = sap.ui.getCore().getMessageManager(),
+                oMessageModel = oMessageManager.getMessageModel(),
+                oResourceBundle = oComponent.getModel("i18n").getResourceBundle(),
+                sErrorText = oResourceBundle.getText("errorText"),
+                sMultipleErrors = oResourceBundle.getText("multipleErrorsText");
+
+            this._oComponent = oComponent;
+            this._bMessageOpen = false;
+
+            this.oMessageModelBinding = oMessageModel.bindList("/", undefined,
+                [], new Filter("technical", FilterOperator.EQ, true));
+
+            this.oMessageModelBinding.attachChange(function (oEvent) {
+                var aContexts = oEvent.getSource().getContexts(),
+                    aMessages = [],
+                    sErrorTitle;
+
+                if (this._bMessageOpen || !aContexts.length) {
+                    return;
+                }
+
+                // Extract and remove the technical messages
+                aContexts.forEach(function (oContext) {
+                    aMessages.push(oContext.getObject());
+                });
+                oMessageManager.removeMessages(aMessages);
+
+                // Due to batching there can be more than one technical message. However the UX
+                // guidelines say "display a single message in a message box" assuming that there
+                // will be only one at a time.
+                sErrorTitle = aMessages.length === 1 ? sErrorText : sMultipleErrors;
+                this._showServiceError(sErrorTitle, aMessages[0].message);
+            }, this);
+        },
+
+        /**
+         * Shows a {@link sap.m.MessageBox} when a service call has failed.
+         * Only the first error message will be displayed.
+         * @param {string} sErrorTitle A title for the error message
+         * @param {string} sDetails A technical error to be displayed on request
+         * @private
+         */
+        _showServiceError : function (sErrorTitle, sDetails) {
+            this._bMessageOpen = true;
+            MessageBox.error(
+                sErrorTitle,
+                {
+                    id : "serviceErrorMessageBox",
+                    details: sDetails,
+                    styleClass: this._oComponent.getContentDensityClass(),
+                    actions: [MessageBox.Action.CLOSE],
+                    onClose: function () {
+                        this._bMessageOpen = false;
+                    }.bind(this)
+                }
+            );
+        }
+    });
+});

app/bills/webapp/controller/NotFound.controller.js

@@ -0,0 +1,18 @@
+sap.ui.define([
+    "./BaseController"
+], function (BaseController) {
+    "use strict";
+
+    return BaseController.extend("ns.bills.controller.NotFound", {
+
+        /**
+         * Navigates to the worklist when the link is pressed
+         * @public
+         */
+        onLinkPressed : function () {
+            this.getRouter().navTo("worklist");
+        }
+
+    });
+
+});