Đơn đặt trước – Chi tiết đơn đặt trước

1. Các thành phần chung:

Thanh công cụ đầu trang
- Thêm nhiệm vụ: Hệ thống hiển thị popup tạo mới nhiệm vụ ( cụ thể tại mục dưới đây)
- Tìm kiếm: Tìm kiếm đơn hàng theo các tiêu chí khác nhau.
- Click nút : hiện ra 2 option là active trạng thái của đơn và sửa đơn đặt trước
- Excel, Máy in: Chức năng xuất dữ liệu ra file Excel hoặc in ấn.
- Tìm kiếm: Tìm kiếm đơn hàng theo các tiêu chí khác nhau.
- Nút cho phép ẩn các phần của nội dung bài viết theo: tiêu đề, danh mục, trạng thái, tổng số lượt xem, sắp xếp, nút menu. Điều này giúp người dùng tập trung vào nội dung họ đang quan tâm.
- Nút giúp lọc hóa đơn theo các trạng thái (quá hạn, chưa thanh toán,..)
Thanh công cụ cuối trang
- Phân trang (< >)Cho phép xem các trang dữ liệu khác nhau khi có nhiều đơn đặt trước.
- Dropdown số lượng hiển thị (10 ▼): Cho phép người dùng chọn số lượng mục hiển thị trên mỗi trang (10, 20, 50,…).
- Hiển thị số lượng dữ liệu (0-100 / 1000): Hiển thị tổng số mục hiện có và vị trí của dữ liệu hiện tại ).

2. Thông tin chi tiết:

Thông tin về hạng mục:
- Các cột thông tin: Tên hạng mục, số lượng, đơn giá, tổng (tổng giá tiền sau khi tính cả thuế)
- Những tệp tin: thể hiện ảnh người dùng thả vào trong phần nhập ảnh của đơn đặt trước
- Thêm hạng mục sản phẩm: Hiển thị popup nhập thông tin để thêm hạng mục
Phần Thông tin đơn đặt trước (Sidebar bên phải):
- Các dòng thông tin: ĐƠN ĐẶT TRƯỚC (SUBSCRIPTION) #9: ID, ngày thanh toán đầu tiên, tên khách hàng, loại đơn hàng, trạng thái đơn hàng,, nhãn, lặp lại mỗi, lời nhắc
- Khi ấn vào thêm lời nhắc: hệ thống hiện ra các ô nhập tiêu đề, ngày, thời gian, lặp lại để thêm lời nhắc riêng tư

3. Tất cả hóa đơn: Sau khi thêm đơn đặt trước thành công, hệ thống chuyển sang giao diện tất cả hóa đơn của đơn đặt trước vừa tạo:

Lưu ý: phần hóa đơn này chỉ có thể tạo tự động theo ô “repeat type” mà người dùng đã nhập tại giao diện thêm đơn đặt trước tại mục 1
Bảng dữ liệu
- Các cột dữ liệu: ID hóa đơn, ngày thanh toán, ngày đến hạn, tổng hóa đơn, khoản thanh toán đã nhận, trạng thái, đến hạn.
- Khi click chuột vào từng tiêu đề của cột thì cột đó sẽ tự động sắp xếp theo tiêu chí của cột

4. Những nhiệm vụ:

Bảng dữ liệu
- Các cột dữ liệu: ID hóa đơn, tiêu đề, ngày bắt đầu, thời hạn, đã giao cho, những người tham gia, trạng thái, nút menu
- Khi click chuột vào từng tiêu đề của cột thì cột đó sẽ tự động sắp xếp theo tiêu chí của cột
- Khi tích vào ô input thì chuyển trạng thái của nhiệm vụ sang hoàn thành

Thêm nhiệm vụ:
- Người dùng nhập các vào các ô input, cho phép tải ảnh và ghi âm thanh
- Nút lưu giúp lưu nhiệm vụ và chuyển sang giao diện chi tiết nhiệm vụ
- Nút X giúp đóng popup thêm nhiệm vụ