Recently, while working on an Expense Claim application in Power Apps, I noticed one common problem faced by employees and finance teams.
Whenever users submitted an expense claim, they had to manually enter all invoice details, such as:
- Vendor name
- Invoice date
- Tax amount
- Total amount
- Bank details
- Invoice line items
Even though all these details were already available inside the invoice PDF or image, users still had to type everything manually. This process was time-consuming and sometimes led to typing errors or incorrect data entry.
The client wanted a smarter solution.
They asked:
“Can users simply upload the invoice and let the system automatically fill most of the fields?”
That is when I built this Invoice Processing solution using Power Apps, Power Automate, AI Builder, and SharePoint.
In this solution, the user uploads an invoice file, such as a PDF or image, then clicks the Process Invoice button. Power Automate automatically extracts the invoice details using AI Builder and sends the extracted data back to Power Apps.
The best part is that users no longer need to manually enter all invoice details. Most of the fields are automatically populated from the uploaded invoice. Users can simply review the extracted information, make changes if needed, and then save the final data into SharePoint lists.
This not only improves the user experience but also reduces manual effort and helps prevent data entry errors.
Business Requirement
The main requirement is:
A user should be able to upload an invoice file in Power Apps. The invoice can be a PDF, JPG, JPEG, PNG, or GIF file. After clicking the Process Invoice button, Power Automate should extract all invoice details using AI Builder and return them to Power Apps.
The user should then be able to:
- View extracted invoice fields
- Modify extracted values if needed
- Add or edit invoice line items
- Save the final data into SharePoint
Another important aspect of this solution is that the entire application is built with a responsive layout in Power Apps. I used responsive containers, dynamic width and height formulas, and flexible layouts so that the application works properly across desktop, tablet, and mobile devices.
SharePoint Lists Used in This Solution
For this solution, I created two SharePoint lists:
- Extracted Invoice Data
- Invoice Items
1. Extracted Invoice Data SharePoint List
This is the main SharePoint list where invoice header-level details are stored.
| Column Name | Data Type |
|---|---|
| Title | Single line of text |
| Invoice Date | Date and Time |
| Due Date | Date and Time |
| Vendor Name | Single line of text |
| Vendor Address | Multiple lines of text |
| Customer Name | Single line of text |
| Customer Address | Multiple lines of text |
| Subtotal | Single line of text |
| Tax Amount | Single line of text |
| Tax Percentage | Single line of text |
| Total Amount | Single line of text |
| Currency | Single line of text |
| Item Count | Single line of text |
| Bank Name | Single line of text |
| Account Number | Single line of text |
| IFSC Code | Single line of text |
| UPI ID | Single line of text |
The Title column can store the invoice number or a generated invoice reference number.
2. Invoice Items SharePoint List
This list stores the line item details extracted from the invoice.
| Column Name | Data Type |
|---|---|
| Title | Single line of text |
| Name | Single line of text |
| Quantity | Single line of text |
| Rate | Single line of text |
| Amount | Single line of text |
The Title column can be used to store the invoice number or invoice reference ID, so that each item can be connected with the main invoice record.