Feature #4518
openVendor invoice upload & extract the data from the invoice & update into the stock
0%
Description
User Story: Upload Invoice File
As a user
I want to upload an invoice file (PNG, JPEG, or PDF)
So that the system can process it via an API and show me the response result on the UI
Acceptance Criteria
File Type Validation
The system should accept only files with extensions .png, .jpeg, .jpg, or .pdf.
If a user attempts to upload another file type, a validation error message should appear:
“Invalid file type. Please upload a PNG, JPEG, or PDF file.”
File Size Validation
The system should not allow files larger than 15MB.
If a file exceeds the limit, show a message:
“File size exceeds 15MB limit.”
File Upload
Once the valid file is selected, the user can click Submit to upload.
The file should be sent via API (e.g., POST /api/invoice/upload) using multipart/form-data.
Loading State
While the API call is in progress, show a loading spinner or progress indicator.
API Response Handling
On successful upload, display the response message or data returned by the API in the UI (e.g., status, extracted info, or confirmation message).
On API failure, show a user-friendly error message such as:
“Failed to upload invoice. Please try again later.”
Re-upload / Retry Option
User should be able to re-upload or retry if the previous attempt failed.
Developer Test Cases
Test Case Steps Expected Result
Upload valid PNG file Select a .png file < 15MB → Submit API called successfully, response displayed
Upload valid PDF file Select a .pdf file < 15MB → Submit API called successfully, response displayed
Upload invalid file type Select .docx or .txt → Submit Error message: “Invalid file type.”
Upload file > 15MB Select file 16MB → Submit Error message: “File size exceeds 15MB limit.”
API success Mock API returns 200 with data Display API response in UI
API failure Mock API returns 500 Show error: “Failed to upload invoice.”
Retry after failure Upload again after failure Should work normally
QA Test Cases
Scenario Expected Behavior
Verify UI shows allowed file types Upload button tooltip or note visible
Verify drag-and-drop (if supported) Drag file to upload area → accepted
Check loading indicator visibility Spinner shown during upload
Validate error handling for invalid format Correct error message displayed
Validate error handling for large file Correct error message displayed
Verify network error scenario API not reachable → error message shown
Verify retry option User can upload again after failure without page refresh
Verify response display API response properly formatted and visible on UI
Subtasks
Related issues
No data to display