Creating a Library Application using SAP AppGyver-...
Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
In the previous blog, I have explained how you can use Barcode scanner functionality to scan the barcode of any book to fetch their details using Google API.
In this blog, we will learn how we can enhance the app to create a real-time application which can be used in any Library to Issue/ Return books. This app will have capability to identify the details of any books with the help of barcode scan and anyone with a Library ID can get the book issued in their name or return the same.
Set Visibility of Action Button as : IF(appVars.variable1,true,false)
Set Visibility of Scan Button as : IF(appVars.variable1,false,true)
Set Visibility of parent Container as : IF(appVars.variable1,true,false)
Set Visibility of Image as : IF(appVars.variable1,true,false)
Under Flow logic of the Icon Refresh, set Variable1 as false
Create a project in Google Firebase
Add a Firestore Database as “Books”. Set the collection as books, document as books and add the below fields :
bookID, issueDate, libraryID, returnDate
Add an app of type Android from the Project Overview page.
Under AppGyver, navigate to Data and Add the android app configuration from the Firebase project under connectors.
Add Data Resource as books and add the fields from Firebase as new properties.
Select Global Canvas page, under App Variable logic flow add Initialize Firebase(Can be Installed from Flow Function Market). Connect it from App Launched Event.
Add a datastore “books” of type Google Firebase/Cloud Firestore
Navigate to Issue Page and change the title as “Issue Book”
Set the page background color under Style as “Warning”
Add another Tile under the above tile and set the content as “Book Details”
Add three Containers with Layout as Horizontal and add two Text fields in each.
Set First Text fields in respective Containers as Book Name, Book Author, Book ID
Map the Second text fields as App Variables “ bookName”, “bookAuthor”, “bookID”
Add a title below the container and set content as “Enter the below details:”
Add a container and then add two containers(Say C1 and C2) inside it. Set Layout as Horizontal
In C1 add two text fields and set content as “Enter Library ID”, “Select Issue Date”
In C2 add a Input Field, mapped to variable libraryID and Date Field(Can be downloaded from Component Market), map it to variable issueDate
Add a button and set the Label as Style Secondary Button
Click on the Issue button and create the below logic flow:
IF Condition: IF(IS_EMPTY(pageVars.libraryIDPV),true,false) || IF(IS_EMPTY(pageVars. issueDatePV),true,false)
Alert: Please enter the Library ID and Issue Date
Create Record:
Resource Name: books
Custom Object: issueDate, libraryID, bookID
Dialog : Dialog Message: “Do you want to issue the book?”
Dialog: “Book has been issued
Return to Homepage”
Navigate to Return Page and change the title as “Return Book”
Set the page background color under Style as “Warning”
Navigate to the Variable Window and create the below Page Variables:
issueDatePV : date/time text
libraryIDPV : text
Add Logic to the page as below:
Get Record:
Resource Name: books
Id:bookID
Set variables issueDate and libraryID to the values issueDate and libraryID from the database.
Add another Tile under the above tile and set the content as “Book Details”
Add four Containers with Layout as Horizontal and add two Text fields in each.
Set First Text fields in respective Containers as Book Name, Book Author, Book ID, Library ID
Map the Second text fields as App Variables “ bookName”, “bookAuthor”, “bookID”, ”libraryID”
Add a title below the container and set content as “Enter the below details:”
Add a container and then add two containers(Say C1 and C2) inside it. Set Layout as Horizontal
In C1 add two text fields and set content as “Issue Date”, “Select Return Date”
In C2 add an Input Field, mapped to variable issuedatePV and Date Field(Can be downloaded from Component Market), map it to variable returnDate
For issueDate mapping using formula as FORMAT_DATETIME_LOCAL(pageVars.issueDatePV,"DD.MM.YYYY")
Add a button and set the Label as Style Secondary Button
Click on the Return button and create the below logic flow:
IF Condition: IF(IS_EMPTY(appVars.returnDate),true,false)
If True: Dialog à Please select the Return Date
If False: IF Condition: DATETIME_IS_BEFORE(appVars.returnDate, appVars.issuedate)
If True: Dialog: Return date cannot be before the Issue date
Dialog : Dialog Message: “Do you want to issue the book?”
Dialog: “Book has been returned
Return to Homepage”
Demo Video:
Conclusion:
Creating applications with SAP AppGyver is very easy where instead of worrying about the how part, focus is on what is needed. From a logical thought process to creating a real-time enterprise ready app journey is something I have never witnessed in the past that too without a single line of code.
Welcome again to the world of LCNC(Low Code No Code) !!!!
I truly hope this blog can be useful for some of you. I would be happy to read your thoughts and comments, please leave it in the comment section below.
Also please do follow my profile for similar content.