General Requirements
Screen format: Desktop, canvas resolution 1280×720 px (responsiveness in the future).
Design — clean, minimalist, with accents on green and gray shades for auxiliary elements.
All fields should be logically grouped to simplify perception and data entry.
The form should be convenient for working with a large number of fields, as tabular as possible, without overloading with cards.
Example of the current form in the application.
Fields of the "Order Data" block:
Order date (datepicker)
Order status (dropdown)
Amount (numeric field)
Currency (dropdown)
Buyer (input)
Email address (input)
Phone (input)
Responsible (dropdown)
Tracking code (input)
Exchange rate to USD (numeric field)
Amount in USD (numeric field)
Status date (datepicker)
"Related Files" Block
Button: + Add related files.
List of attached files (with icons: download/delete).
Fields of the "Products" block (Compact tabular view!):
No. (automatic numbering)
Product (dropdown)
Quantity (input number)
Unit of measure (dropdown)
Price (input number)
Currency (dropdown)
Amount (automatic calculation)
Cost price (auto from directory)
Category (dropdown)
Article (dropdown)
Type of operation (dropdown)
Business direction (dropdown)
Project (dropdown)
Department (dropdown)
PNL date (datepicker)
Seller (input)
Description (input)
Table functions:
Add row (+ Add product).
Delete product (🗑 icon).
Order Summary Block
Place below the table, highlight in bold.
Fields:
Total amount (automatically)
Total cost price (automatically)
Margin = Amount – Cost price (automatically)