feat: add events to button (#130)

* test: link button in workflow

* feat: add events to button

* chore: add readme

.github/workflows/wdi5-test.yml

@@ -53,6 +53,10 @@ jobs:
           npm i -g npm@latest
           npm --version
 
+      - name: link excel button
+        run: |
+          cd packages/ui5-cc-excelUpload-Button && npm link && cd ../..
+
       - name: get port
         run: |
           TESTAPPPORT=$(node ./dev/get-port.js ${{ matrix.scenario }} ${{ matrix.ui5version }})

README.md

@@ -0,0 +1,41 @@
+# UI5 `ui5-cc-excelupload`
+
+This is a monorepo for the UI5 Component `ui5-cc-excelupload`, the Button `ui5-cc-excelupload-button` and the generator to easy integrate the component into your app.
+
+> :warning: **This control is still in beta**: Core functionality is given, but bugs may still occur and APIs may change!
+
+A UI5 Module to integrate a Excel Upload for Fiori Element Apps.  
+This control simply enables the mass upload of data, independent of the backend, OData version and Fiori scenario.  
+This is made possible by reading the Excel file and using the standard APIs.  
+The control will submit not the file, but just the data from the Excel File.  
+The integration of the control is designed to be as simple as possible and, in the best case, requires no configuration.
+
+The aim is to support as many Fiori Scenarios and UI5 Versions as possibile.  
+See here for all currently [supported Versions](https://marianfoo.github.io/ui5-cc-excelUpload/pages/SupportVersions/).
+
+![Excel Upload Dialog](/images/ExcelUploadDialog.png "Excel Upload Dialog")
+
+## Live Demo
+
+It is possible to try this out directly at:  
+https://excelupload.marianzeis.de/
+
+The app is an OData V4 app with UI5 version 1.108 and a CAP backend.  
+The data is reset every hour on the hour.
+
+
+## Getting Started
+
+You can find the official documentation here:
+
+https://marianfoo.github.io/ui5-cc-excelUpload/
+
+## Development
+
+You find the documentation for the development here:
+
+https://marianfoo.github.io/ui5-cc-excelUpload/pages/Development/GettingStarted/
+
+## Changelog `ui5-cc-excelupload`
+
+See [CHANGELOG.md]([CHANGELOG.md](https://github.com/marianfoo/ui5-cc-excelUpload/blob/main/packages/ui5-cc-excelUpload/CHANGELOG.md))

examples/packages/ordersv2freestylenondraft/webapp/controller/Detail.controller.js

@@ -193,26 +193,32 @@ sap.ui.define(["./BaseController", "sap/ui/model/json/JSONModel", "../model/form
 			this.getView().setBusy(false);
 		},
 
-		openExcelUploadButton: async function (oEvent) {
-			this.getView().setBusyIndicatorDelay(0);
-			this.getView().setBusy(true);
-			if (!this.excelUploadButton) {
-				this.excelUploadButton = await this.getView()
-					.getController()
-					.getOwnerComponent()
-					.createComponent({
-						usage: "excelUpload",
-						async: true,
-						componentData: {
-							context: this,
-							context: this,
-							activateDraft: false,
-							tableId: "container-ui.v2.ordersv2freestyle---detail--lineItemsList"
-						}
-					});
+		checkBeforeRead(oEvent) {
+			const sheetData = oEvent.getParameter("sheetData");
+			let errorArray = [];
+			for (const [index, row] of sheetData.entries()) {
+				//check for invalid price
+				if (row.UnitPrice) {
+					if (row.UnitPrice > 100) {
+						const error = {
+							title: "Price to high (max 100)",
+							row: index + 2,
+							group: true
+						};
+						errorArray.push(error);
+					}
+				}
 			}
-			this.excelUploadButton.openExcelUploadDialog();
-			this.getView().setBusy(false);
+			oEvent.getSource().addToErrorsResults(errorArray);
+		},
+
+		changeBeforeCreate(oEvent) {
+			let payload = oEvent.getParameter("payload");
+			// round number from 12,56 to 12,6
+			if (payload.price) {
+				payload.price = Number(payload.price.toFixed(1));
+			}
+			oEvent.getSource().setPayload(payload);
 		},
 
 		_onMetadataLoaded: function () {

examples/packages/ordersv2freestylenondraft/webapp/view/Detail.view.xml

@@ -9,7 +9,7 @@
     </semantic:headerContent>
     <semantic:titleCustomTextActions>
       <Button text="Excel Upload Code" press="openExcelUpload" />
-      <excel:ExcelUpload text="Excel Upload Button" tableId="container-todo---detail--lineItemsList"/>
+      <excel:ExcelUpload id="excelUploadButton" text="Excel Upload Button" tableId="container-todo---detail--lineItemsList" changeBeforeCreate="changeBeforeCreate" checkBeforeRead="checkBeforeRead"/>
     </semantic:titleCustomTextActions>
     <semantic:content>
       <Table

examples/packages/ordersv2freestylenondraftopenui5/webapp/controller/Detail.controller.js

@@ -220,28 +220,6 @@ sap.ui.define(["./BaseController", "sap/ui/model/json/JSONModel", "../model/form
 			this.getView().setBusy(false);
 		},
 
-		openExcelUploadButton: async function (oEvent) {
-			this.getView().setBusyIndicatorDelay(0);
-			this.getView().setBusy(true);
-			if (!this.excelUploadButton) {
-				this.excelUploadButton = await this.getView()
-					.getController()
-					.getOwnerComponent()
-					.createComponent({
-						usage: "excelUpload",
-						async: true,
-						componentData: {
-							context: this,
-							context: this,
-							activateDraft: false,
-							tableId: "container-ui.v2.ordersv2freestyle---detail--lineItemsList"
-						}
-					});
-			}
-			this.excelUploadButton.openExcelUploadDialog();
-			this.getView().setBusy(false);
-		},
-
 		_onMetadataLoaded: function () {
 			// Store original busy indicator delay for the detail view
 			var iOriginalViewBusyDelay = this.getView().getBusyIndicatorDelay(),

examples/packages/ordersv2freestylenondraftopenui5/webapp/view/Detail.view.xml

@@ -8,8 +8,8 @@
       <ObjectNumber />
     </semantic:headerContent>
     <semantic:titleCustomTextActions>
-      <Button text="Excel Upload Code" press="openExcelUpload" />
-      <excel:ExcelUpload text="Excel Upload Button" tableId="container-todo---detail--lineItemsList"/>
+      <Button id="test" text="Excel Upload Code" press="openExcelUpload" />
+      <excel:ExcelUpload id="excelUploadButton" text="Excel Upload Button" tableId="container-todo---detail--lineItemsList"/>
     </semantic:titleCustomTextActions>
     <semantic:content>
       <Table

packages/ui5-cc-excelUpload-Button/ExcelUpload.js

@@ -6,9 +6,6 @@ sap.ui.define(["sap/m/Button"], (Button /*, marked */) => {
 					type: "string",
 					defaultValue: "Template.xlsx"
 				},
-				context: {
-					type: "object"
-				},
 				columns: {
 					type: "string[]"
 				},
@@ -35,8 +32,16 @@ sap.ui.define(["sap/m/Button"], (Button /*, marked */) => {
 				}
 			},
 			events: {
-				press: function (e) {
-					//alert("clicked")
+				checkBeforeRead: {
+					parameters: {
+						sheetData: { type: "object" },
+						errorResults: { type: "object" }
+					}
+				},
+				changeBeforeCreate: {
+					parameters: {
+						payload: { type: "object" }
+					}
 				}
 			}
 		},
@@ -80,11 +85,23 @@ sap.ui.define(["sap/m/Button"], (Button /*, marked */) => {
 					}
 				})
 			}
+			oControl.excelUpload.attachCheckBeforeRead(function (oEvent) {
+				this.fireEvent("checkBeforeRead", { sheetData: oEvent.getParameter("sheetData") })
+			}, oControl)
+			oControl.excelUpload.attachChangeBeforeCreate(function (oEvent) {
+				this.fireEvent("changeBeforeCreate", { payload: oEvent.getParameter("payload") })
+			}, oControl)
 		},
 		press: function (event) {
-			console.log("test")
 			this.excelUpload.openExcelUploadDialog()
 		},
+
+		addToErrorsResults: function (errorArray) {
+			this.excelUpload.addToErrorsResults(errorArray)
+		},
+		setPayload: function (payload) {
+			this.excelUpload.setPayload(payload)
+		},
 		_getViewControllerOfControl(oControl) {
 			var oView = null
 			while (oControl && !(oControl instanceof sap.ui.core.mvc.View)) {