Màn hình xem giỏ hàng

Một phần của tài liệu BÁO cáo PBL5 đồ án CÔNG NGHỆ PHẦN mềm đề tài WEBSITE bán QUẦN áo (Trang 26 - 43)

2. DANH SÁCH PHÂN CÔNG NHIỆM VỤ

5.1.6 Màn hình xem giỏ hàng

Hình 21: Màn hình xem giỏ hàng

Giao diện Xem chi tiết giỏ hàng

Mô tả Cho phép user xem chi tiết giỏ hàng mà mình đã chọn quần áo

Truy cập Click vào button xem giỏ hàng

Nội dung giao diện

Thành phần Kiểu Dữ liệu Mô tả

STT Text Text số thứ tự Hiện số thứ tự của

sản phẩm

Tên sản phẩm Text Text tên sản phẩm Hiện tên của từng loại quần áo

Tăng giảm số

lượng Button Button tăng giảm Trường dùng đểtăng giảm số lượng quần áo đặt mua

tiền của từng loại quần áo

Xóa Button Button xóa Trường xóa 1 sản

phẩm quần áo đã chọn khỏi giỏ hàng

Tổng tiền Text Text tổng tiền Hiện tổng tiền của

giỏ hàng

Xóa tồn bộ Button Button xóa tồn bộ Trường dùng để

xóa tồn bộ giỏ hàng

Đặt mua Button Button đặt mua Dùng để đặt mua

những quần áo có trong giỏ hàng chuyển tới trang thanh tốn

Các hành động trong giao diện

Hành động Mơ tả Thành cơng Lỗi

Xóa 1 sản phẩm

Khi user click vào button xóa, quần áo tương ứng sẽ bị xóa khỏi giỏ hàng Xóa được sản phẩm ra khỏi giỏ hàng Không bắt lỗi sự kiện này

Xóa tồn bộ Khi user click vào button xóa tồn bộ, toàn bộ quần áo trong giỏ hàng sẽ bị xóa đi, hiển thị “Khơng có sản phẩm trong giỏ hàng”

Xóa được tồn bộ quần áo ra khỏi giỏ hàng

Khơng bắt lỗi sự kiện này

Đặt mua giỏ hàng

Khi user click vào button đặt mua, sẽ chuyển tới trang thanh tốn để mua đơn hàng

Chuyển thành cơng đến trang thanh tốn

Khơng bắt lỗi sự kiện này

5.1.7 Màn hình thanh tốn

Hình 22: Màn hình thanh tốn

Giao diện Thanh tốn

Mơ tả Cho phép user xác nhận mua đơn hàng

Truy cập Trang thanh toán hiển thị khi click button đặt mua ở giỏ hàng

Nội dung giao diện

Thành phần Kiểu Dữ liệu Mô tả

Họ tên TextBox – String(100) Text họ tên Trường dành cho nhập họ tên

Email TextBox – String(100) Text email Trường dành cho nhập email

Số điện thoại TextBox – String(100) Test số điện thoại Trường nhập số điện thoại

Địa chỉ TextBox – String(100) Test địa chỉ Trường để nhập địa chỉ

Lời nhắn TextBox – String(100) Test lời nhắn Trường để nhập lời nhắn

Các hành động trong giao diện

Hành động Mô tả Thành công Lỗi

Submit Nếu bạn là user đã đăng nhập vào website, các thông tin họ tên, email, số điện thoại, địa chỉ sẽ được điền sẵn, click submit đặt hàng thành công, hiển thị thông báo:”Đặt hàng thành công, chúng tôi sẽ liên hệ với bạn để giao hàng”. Nếu bạn là khách, bạn phải điền đầy đủ thông tin để submit, nếu không sẽ hiện thông báo “Thông tin không được bỏ trống

Quay lại màn hình giỏ hàng

Hiện thông báo: “Thông tin không được bỏ trống”

Bảng 10: Mô tả chức năng xác nhận đơn hàng

5.2 Admin

5.2.1. Đăng nhập

Giao diện Đăng nhập

Mô tả Cho phép admin đăng nhập vào hệ thống

Truy cập Lúc mới vào trang đăng nhập admin Nội dung giao diện

Thành phần Kiểu Dữ liệu Mô tả

Username TextBox – String(100) Dữ liệu trích xuất từ CSDL

Trường dành cho

admin nhập

username Password TextBox – String(100) Dữ liệu trích xuất

từ CSDL

Trường dành cho

admin nhập

password

Login Button Button Login Đăng nhập vào hệ

thống Forgot

Password

Button Button forgot

password

Lấy lại mật khẩu nếu quên

Các hành động trong giao diện

Hành động Mô tả Thành công Lỗi

Login Khi admin kích nút login, hệ thống sẽ kiểm tra username với

Vào màn chính của Tab hệ thống.

Hiện thơng báo: “Sai tài khoản hoặc mật khẩu”

có tồn tại trong hệ thống hay khơng, nếu có thì cho user đăng nhập vào hệ thống, nếu khơng thì hiển thị thơng báo “Vui lịng kiểm tra lại tài khoản và mật khẩu!”.

Khi không nhập tài khoản hoặc mật khẩu thì hiển thị thơng báo “Email, mật khẩu không được bỏ trống”. Khi việc đăng nhập được thực hiện thành công, hệ thống sẽ kiểm tra xem tài khoản thuộc Vai trò (Role) nào. Sau đó hiện lên một Thông báo với nội dung: “Xin chào Nhân viên / Quản lý.”

Hiện thông báo: “Email, mật khẩu không được bỏ trống”.

Forgot password

5.2.2. Màn hình chính

Hình 24: Giao diện trang chủ web admin

Màn hình Màn hình chính

Mơ tả Màn hình hiển thị các chức năng chính của hệ thống, các số liệu sơ lược về shop bán hàng như số đơn hàng mới, khách hàng mới, lượt xem shop

Truy cập màn

hình Người dùng đăng nhập thành cơng sẽ hiển thị ra màn hình chính Nội dung màn hình

Mục Loại Dữ liệu Mô tả

Xin chào + tên

người dùng Nút Nút: Xin chào + tên người dùng

Nút “Xin chào + tên người dùng” dùng để chỉnh sửa thông tin cá nhân của bản thân người đang login

Đăng xuất Nút Nút: Đăng xuất - dùng để trở về màn hình Nút “Đăng xuất” đăng nhập

Trang chủ Nút Nút: Trang chủ - dùng để chuyển tiếp đến Nút “Trang chủ” màn hình chính

Danh mục Nút Nút: Danh mục - dùng để hiển thị,Nút “Danh mục” thêm, sửa, xoá các danh mục trong hệ thống.

Sản phẩm Nút Nút: Sản phẩm - dùng để hiển thị, thêm, Nút “Sản phẩm” sửa, xóa thơng tin các sản phẩm có trong hệ thống

Slider Nút Nút: Slider - để hiển thị, thêm, sửa, Nút “Slider” dùng xóa các slider có trong hệ thống

Đơn đặt hàng Nút Nút: Đơn đặt hàng - hàng” dùng để xem chi Nút “Đơn đặt tiết thông tin các đơn đặt hàng và xác nhận đơn hàng( Có thể xóa đơn hàng của khách hàng)

Khách hàng Nút Nút: Khách hàng - hiển thị thông tin chi tiết Nút “Khách hàng” của khách hàng và đơn hàng của khách hàng (nếu có). Có thể xóa khách hàng.

Nhân viên Nút Nút: Nhân viên - cho phép quản lý xem, Nút “Nhân viên” thêm, sửa, xóa nhân viên hoặc quản lý khác

Thao tác trên màn hình

Tên thao tác Mơ tả Thành công Thất bại

Điều khiển Cung cấp các chức năng của ứng dụng để người dùng có thể lựa chọn

Truy cập được chức năng đã chọn

Thơng báo lỗi: “Có lỗi khơng xác định xảy ra”

Bảng 12: Mô tả chức năng trang chủ web admin

5.2.3. Quản lý danh mục

Hình 25: Giao diện quản lý danh mục

Tên Use Case Quản lý danh mục

Use Case ID UC-01

High Level Requirement Ref

Thông tin danh mục được trích xuất từ CSDL và hiển thị lên màn hình. Nhân viên và quản lý đều có thể xem và thêm, sửa, xóa thơng tin danh mục

Tác nhân Nhân viên, quản lý

Mô tả Chức năng này cho phép xem và thêm, sửa, xóa thơng tin danh mục

Kích hoạt NA

Điều kiện tiên

quyết Người dùng đăng nhập thành công và chọn nút “Danh mục” Xử lý hậu kỳ

Nội dung màn hình

Mục Loại Dữ liệu Mơ tả

ID Table Dữ liệu trích xuất

từ CSDL.

Hiển thị ID danh mục

Tên danh mục Table Dữ liệu được trích xuất từ CSDL.

Hiển thị tên danh mục

Parent ID Table Dữ liệu được trích xuất từ CSDL.

Hiển thị Parent ID của danh mục

Thứ tự Table Dữ liệu được

trích xuất từ CSDL.

Hiển thị thứ tự danh mục

Thao tác trên màn hình

Tên thao tác Mơ tả Thành cơng Thất bại

Thêm mới Nút Thêm một danh

mục mới vào CSDL

Sửa Nút Sửa thơng tin

danh mục

Xóa Nút Xóa một danh

mục

Bảng 13: Mô tả chức năng thêm danh mục sản phẩm

5.2.4. Quản lý sản phẩm

Hình 26: Giao diện quản lý sản phẩm

Use Case ID UC-02

High Level Requirement Ref

Thông tin sản phẩm được trích xuất từ CSDL và hiển thị lên màn hình, có thể thêm, sửa, xóa thơng tin sản phẩm.

Tác nhân Nhân viên, quản lý

Mô tả Chức năng này cho phép xem và thêm, sửa, xóa thơng tin sản phẩm

Kích hoạt NA

Điều kiện tiên

quyết Quản lý đăng nhập thành công và chọn nút “Sản phẩm” Xử lý hậu kỳ

Nội dung màn hình

Mục Loại Dữ liệu Mơ tả

ID Table Dữ liệu được trích

xuất từ CSDL.

Hiển thị ID sản phẩm

Tên sản phẩm Table Dữ liệu được trích

xuất từ CSDL. Hiển thị tên sản phẩm Danh mục Table Dữ liệu được trích

xuất từ CSDL.

Hiển thị danh mục của sản phẩm

xuất từ CSDL.

Hành động Table Gồm hai button chỉnh sửa và xóa danh mục

Thao tác trên màn hình

Tên thao tác Mơ tả Thành công Thất bại

Thêm Nút Thêm một sản

phẩm mới vào CSDL

Sửa Nút Sửa thơng tin sản

phẩm

Xóa Nút Xóa một sản phẩm

Bảng 14: Mơ tả chức năng thêm sản phẩm

Tên Use

Case Quản lý slider

Use Case ID UC-03

High Level Requirement Ref

Thơng tin slider được trích xuất từ CSDL và hiển thị lên màn hình. Nhân viên và quản lý đều có thể xem và thêm, sửa, xố slider.

Tác nhân Nhân viên, quản lý

Mô tả Chức năng này cho phép xem và thêm, sửa, xóa thơng tin slider

Kích hoạt NA

Điều kiện

tiên quyết Người dùng đăng nhập thành công và chọn nút “Slider” Xử lý hậu kỳ

Nội dung màn hình

Mục Loại Dữ liệu Mơ tả

Tên slider Table Dữ liệu được trích xuất từ bảng.

Hiển thị tên slider

Hình ảnh Table Dữ liệu được trích

xuất từ bảng. Hiển thị hình ảnh của slider

Liên kết Table Dữ liệu được trích

xuất từ bảng.

Thứ tự Table Dữ liệu được trích xuất từ bảng.

Hiển thị thứ tự của slider

Hành động Table Gồm hai button chỉnh sửa và xóa slider

Thao tác trên màn hình

Tên thao tác Mô tả Thành công Thất bại

Thêm Nút Thêm một

slider mới vào CSDL

Không bắt lỗi sự kiện này

Sửa Nút Sửa thơng tin

slider Khơng bắt lỗisự kiện này

Xóa Nút Xóa một slider Khơng bắt lỗi

sự kiện này

Bảng 15: Mơ tả chức năng quản lý slider

Tên Use Case Quản lý đơn đặt hàng

Use Case ID UC-04

High Level Requirement Ref

Thông tin đơn đặt hàng được trích xuất từ CSDL và hiển thị lên màn hình. Nhân viên và quản lý đều có thể xem và thêm, sửa, xóa thơng tin đơn đặt hàng.

Tác nhân Nhân viên, quản lý

Mô tả Chức năng này cho phép xem và thêm, sửa, xóa thơng tin đơn đặt hàng

Kích hoạt NA

Điều kiện tiên

quyết Quản lý đăng nhập thành công và chọn nút “Đơn đặt hàng” Xử lí hậu kỳ

Nội dung màn hình

Mục Loại Dữ liệu Mơ tả

STT Table Dữ liệu được trích

xuất từ CSDL.

Hiển thị số thứ tự của đơn hàng

Tên khách hàng Table Dữ liệu được trích

xuất từ CSDL. Hiển thị tên khách hàng đã đặt hàng Ngày đặt Table Dữ liệu được trích

xuất từ CSDL.

Số ĐT Table Dữ liệu được trích xuất từ CSDL.

Hiển thị số điện thoại của khách hàng đã đặt hàng

Giá tiền Table Dữ liệu được trích xuất từ CSDL.

Hiển thị giá tiền của sản phẩm đã đặt hàng

Trạng thái Table Dữ liệu được trích xuất từ CSDL.

Hiển thị trạng thái để quản lý hoặc nhân viên xác nhận đơn hàng

Hành động Table Gồm hai button xem chi tiết và xóa đơn hàng

Thao tác trên màn hình

Tên thao tác Mô tả Thành công Thất bại

Chi tiết đơn

hàng Nút Chi tiết thông tin của đơn hàng Không bắt lỗisự kiện này

Xóa Nút Xóa một đơn

hàng Khơng bắt lỗisự kiện này

Một phần của tài liệu BÁO cáo PBL5 đồ án CÔNG NGHỆ PHẦN mềm đề tài WEBSITE bán QUẦN áo (Trang 26 - 43)

Tải bản đầy đủ (PDF)

(49 trang)