Enables employees to add expenses - the process of onboarding the end-users. Add Expenses card is available on the home screen for defined user roles having the EXPENSE PROCESSING permission.

Link → {base url}/mgramseva/home/addExpense

Clicking the Add Expense Record tile/card on the home screen navigates the user to the Add Expenses screen. The user enters the required details to add the expenses for the vendors.

If a user logs in for the first time then a walkthrough is populated following the same logic as in the home screen.

Clicking on the Submit button navigates the user to the Expenditure Added Successful acknowledgement screen.

Logic Implemented For Date Validation And File Attachments

File Attachments

This feature allows the user to take a picture or choose a single file. The Image Picker plugin is used to implement this.

Whenever this application is used on mobile, it prompts the user with two options - Camera and File Picker. If the application is opened on desktop or laptop browsers, the camera option is not available. The user has to select an image from the folder.

The maximum supported file size is 5 MB.

Date Validation

For validating the form we use the Form widget. Once the user selects a bill date the Bill Pay option is enabled. Otherwise, the auto-validation process is enabled. Based on the bill date, the party selection date is enabled. If the user selects the party selection date first, the bill date can be selected only after entering the party date. Whenever the bill paid option is true, the paid date field is enabled and mandatory. The date selection range allows date input only after the bill date and before the current date.

File Path

Primary Files -

Note: All fields are validated on Submit apart from the Mobile number which gets validated on change.

API Details

Stack

1 → Home Screen. + Add Expense Screen

Pop → Home Screen

Widgets utilised from the Library

Enables employees to modify/edit the expenses based on the status of the payment.

Link → {base url}/mgramseva/home/searchExpense/result/updateExpense

Update Expenses card is visible on the home screen for defined user roles that have EXPENSE PROCESSING permission. Clicking on the Update Expenditure card in the expense search results screen navigates the user to the Edit Expense Bills screen.

Users can edit the previously populated expense details for the vendors.

Clicking on the Submit button navigates the users to the Modified Expenditure Success screen.

Logic Implemented For Paid Or Unpaid Bills

Use Case 1: When the status is “Unpaid”

Allows modification of all the details except the Bill ID. Users can Mark the Bill as “Cancelled” by checking on the option.

Use Case 2: When the status is “Paid”

Cannot modify any details. But the users can Mark the Bill as “Cancelled” by checking the option.

File Path

Primary Files -

Field Validations

API Details

Stack

1 → Home Screen. + Search Expense Screen + Expense Results Screen + Edit Expense Bills Screen

Pop → Expense Results Screen

Widgets utilised from the Library

Users are redirected to this screen by selecting the Update Expense card on the home screen.

Update Expenses card is available on the home screen for defined roles that have EXPENSE PROCESSING permission.

Link → {base url}/mgramseva/home/searchExpense

User Interaction On Screen

• Users can search the expense bills with the Vendor Name / Type of Expense / Bill ID ( Search with any one of these criteria )

• Click on Search navigates the user to the expense results screen which lists the expenditure bills matching the search criteria.

File Path

Primary Files:

Field Validations

API Details

Stack

1 → Home Screen. + Search Expense Bills Screen

Pop → Home Screen

Widgets utilised from the Library