Tải bản đầy đủ (.pdf) (146 trang)

Xây dựng website bán giày với reactjs và spring book

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (12.2 MB, 146 trang )

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT
THÀNH PHỐ HỒ CHÍ MINH

ĐỒ ÁN TỐT NGHIỆP
NGÀNH CƠNG NGHỆ THÔNG TIN

XÂY DỰNG WEBSITE BÁN GIÀY VỚI
REACTJS VÀ SPRING BOOT

GVHD: ThS. LÊ THỊ MINH CHÂU
SVTH : HOÀNG QUỐC VIỆT
NGUYỄN ĐẶNG KHÁNH VĂN

SKL010273

Tp. Hồ Chí Minh, tháng 6/2023


TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT
THÀNH PHỐ HỒ CHÍ MINH
KHOA ĐÀO TẠO CHẤT LƯỢNG CAO

KHÓA LUẬN TỐT NGHIỆP

TÊN ĐỀ TÀI
XÂY DỰNG WEBSITE BÁN GIÀY
VỚI REACTJS VÀ SPRING BOOT

GVHD: THS. LÊ THỊ MINH CHÂU
THÀNH VIÊN


HOÀNG QUỐC VIỆT

19110315

NGUYỄN ĐẶNG KHÁNH VĂN

19110312

TP. Hồ Chí Minh, tháng 06 năm 2023


CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc lập – Tự do – Hạnh phúc
-------Tp. Hồ Chí Minh, ngày 29 tháng 05 năm 2023

NHIỆM VỤ KHÓA LUẬN TỐT NGHIỆP
Họ và tên sinh viên: Hoàng Quốc Việt

MSSV: 19110315

Họ và tên sinh viên: Nguyễn Đặng Khánh Văn

MSSV: 19110312

Ngành: Công nghệ thông tin
Giảng viên hướng dẫn: ThS. Lê Thị Minh Châu
Ngày bắt đầu: 20/02/2023

Ngày nộp: 29/05/2023


1. Tên đề tài: Xây dựng website bán giày với ReactJS và Spring Boot
2. Nội dung thực hiện đề tài:
Xây dựng hệ thống có hai phần:
− Dành cho khách hàng: Là những người dùng (User) có nhu cầu mua giày.
− Dành cho người quản trị: Bao gồm hai đối tượng là Admin và Moderator.
Đề tài được phát triển từ Tiểu luận chuyên ngành.
− Nội dung đã được thực hiện ở Tiểu luận chuyên ngành:
o Phần giao diện:


Trang đăng nhập, trang đăng ký.



Giao diện user: Trang chủ, trang sản phẩm, trang chi tiết sản
phẩm, trang giỏ hàng, trang quản lý thông tin cá nhân, trang
xem đơn hàng đã đặt.



Giao diện quản trị: Trang quản lý khách hàng, trang quản lý tài
khoản, trang quản lý sản phẩm, trang quản lý danh mục, trang
quản lý đơn hàng.


o Phần chức năng:
Mô tả

Actor


Quản lý thông tin cá nhân
Thay đổi mật khẩu
Đăng ký tài khoản
Đăng nhập
Đăng xuất
Xem sản phẩm
Xem chi tiết sản phẩm
Xem sản phẩm trong giỏ hàng
User

Thêm sản phẩm trong giỏ hàng
Chỉnh sửa sản phẩm trong giỏ hàng
Xóa sản phẩm trong giỏ hàng
Đặt hàng
Xem đơn hàng đã đặt
Hủy đơn hàng
Thêm bình luận
Sửa bình luận
Xóa bình luận
Đăng nhập
Đăng xuất
Quản lý tài khoản
Quản lý thông tin khách hàng

Admin

Quản lý doanh mục
Quản lý đơn hàng
Quản lý size của mỗi sản phẩm
Quản lý hình ảnh của mỗi sản phẩm

Thêm bình luận


Sửa bình luận
Xóa bình luận
Đăng nhập
Đăng xuất
Quản lý thơng tin khách hàng
Quản lý doanh mục
Quản lý đơn hàng

Moderator

Quản lý size của mỗi sản phẩm
Quản lý hình ảnh của mỗi sản phẩm
Thêm bình luận
Sửa bình luận
Xóa bình luận

− Nội dung thêm mới:
o Phần giao diện:


Trang quên mật khẩu.



Giao diện user: trang đặt hàng, trang cảm ơn, trang xem hóa
đơn.




Giao diện quản trị: trang quản lý voucher, trang quản lý dòng
tiền thanh toán online Paypal, trang xem doanh thu theo ngày,
trang xem doanh thu theo tháng, trang xem doanh thu theo
năm.

o Phần chức năng:


Tích hợp AI gợi ý sản phẩm và ChatBot



Thêm chức năng thanh toán online bằng PayPal



Quên mật khẩu



Quản lý voucher



Quản lý dịng tiền thanh tốn online Paypal




Xem doanh thu theo ngày, theo tháng, theo năm (thống kê bằng
bảng và bằng đồ thị)


− Nội dung phát triển/chỉnh sửa:
o Phần giao diện:


Giao diện user: trang chủ, trang sản phẩm, trang chi tiết sản
phẩm, trang giỏ hàng, trang đơn hàng đã đặt. (chỉnh sửa bố cục
cho hài hòa hơn)



Giao diện quản trị: chỉnh sửa bố cục cho hài hòa hơn.

o Phần chức năng:
o User:


Xem sản phẩm: Thêm tìm kiếm theo tên sản phẩm; lọc theo giá
và size; phân trang.



Thêm sản phẩm vào giỏ hàng: thêm được nhiều cùng sản phẩm
khác size.




Đặt hàng: kiểm tra phần địa chỉ giao hàng, tính phí giao hàng,
tính thời gian giao hàng dự kiến; thêm voucher; gửi mail thông
tin đơn hàng và đường link xem hóa đơn khi đặt hàng công.

o Quản trị:


Quản lý đơn hàng: thêm chỉnh sửa trạng thái đơn hàng.

3. Sản phẩm:
− Website bán giày có đầy đủ các chức năng cơ bản, giao diện hợp lý đáp ứng
nhu cầu cho khách hàng và người quản trị.

TRƯỞNG NGÀNH

GIẢNG VIÊN HƯỚNG DẪN

(Ký với đầy đủ họ tên)

(Ký với đầy đủ họ tên)

2


CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc lập – Tự do – Hạnh phúc
-------Tp. Hồ Chí Minh, ngày 29 tháng 05 năm 2023

PHIẾU ĐÁNH GIÁ CỦA GIẢNG VIÊN HƯỚNG DẪN
Họ và tên sinh viên: Hoàng Quốc Việt


MSSV: 19110315

Họ và tên sinh viên: Nguyễn Đặng Khánh Văn

MSSV: 19110312

Ngành: Công nghệ thông tin
Tên đề tài: Xây dựng website bán giày với ReactJS và Spring Boot
Giảng viên hướng dẫn: ThS. Lê Thị Minh Châu
ĐÁNH GIÁ
1. Nội dung của sản phẩm:
......................................................................................................................................
......................................................................................................................................
......................................................................................................................................
2. Ưu điểm:
......................................................................................................................................
......................................................................................................................................
......................................................................................................................................
3. Nhược điểm:
......................................................................................................................................
4. Chấp thuận đề tài? (Chấp thuận hoặc từ chối)
......................................................................................................................................
5. Đánh giá tổng quan: (Xuất sắc, Tốt, Khá, Trung bình)
......................................................................................................................................
6. Điểm:……….(bằng chữ:........................................................................................)

Tp. Hồ Chí Minh, tháng 05 năm 2023
GIẢNG VIÊN HƯỚNG DẪN
(Ký với đầy đủ họ tên)



CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc lập – Tự do – Hạnh phúc
-------Tp. Hồ Chí Minh, ngày … tháng 06 năm 2023

PHIẾU ĐÁNH GIÁ CỦA GIẢNG VIÊN PHẢN BIỆN
Họ và tên sinh viên: Hoàng Quốc Việt

MSSV: 19110315

Họ và tên sinh viên: Nguyễn Đặng Khánh Văn

MSSV: 19110312

Ngành: Công nghệ thông tin
Tên đề tài: Xây dựng website bán giày với ReactJS và Spring Boot
Giảng viên phản biện: TS. Huỳnh Xuân Phụng
ĐÁNH GIÁ
1. Nội dung của sản phẩm:
......................................................................................................................................
......................................................................................................................................
......................................................................................................................................
2. Ưu điểm:
......................................................................................................................................
......................................................................................................................................
......................................................................................................................................
3. Nhược điểm:
......................................................................................................................................
4. Chấp thuận đề tài? (Chấp thuận hoặc từ chối)

......................................................................................................................................
5. Đánh giá tổng quan: (Xuất sắc, Tốt, Khá, Trung bình)
......................................................................................................................................
6. Điểm:……………….(bằng chữ:............................................................................)

Tp. Hồ Chí Minh, tháng 06 năm 2023
GIẢNG VIÊN PHẢN BIỆN
(Ký với đầy đủ họ tên)


Lời cảm ơn

LỜI CẢM ƠN
Lời nói đầu, nhóm báo cáo muốn gửi lời cảm ơn chân thành và sự tri ân sâu
sắc đối với các thầy cô của trường Đại học Sư Phạm Kỹ Thuật, đặc biệt là các thầy
cô khoa Công nghệ thông tin của trường đã tạo điều kiện cho nhóm em thực hiện
khóa luận tốt nghiệp.
Hơn hết, nhóm muốn gửi lời cảm ơn đặc biệt đến giảng viên hướng dẫn
ThS.Lê Thị Minh Châu, giảng viên khoa Công nghệ thông tin tại Trường đại học Sư
phạm kỹ thuật thành phố Hồ Chí Minh đã giúp đỡ, góp ý cho đề tài của nhóm để có
thể hồn thành trong khoảng thời gian quy định.
Do kinh nghiệm còn hạn chế nên bài báo cáo của nhóm khơng tránh khỏi sơ
suất và thiếu sót, nhóm báo cáo mong được nhận ý kiến đóng góp từ thầy, cơ để
nhóm em học thêm được nhiều kinh nghiệm và sẽ hồn thành tốt hơn.
Nhóm báo cáo xin chân thành cảm ơn!

i


Lời nói đầu


LỜI NĨI ĐẦU
Với mong muốn xây dựng một hệ thống bán giày trực tuyến. Chúng em đã
thực hiện đề tài “Xây dựng website bán giày với ReactJS và Spring Boot”.
Đề tài sử dụng nhiều công nghệ mới hiện nay như sử dụng ReactJS để phát
triển Front end, một thư viện được nhiều các công ty lớn trên thế giới sử dụng và có
một cộng đồng đơng. Cịn về back end, sử dụng Spring Boot, một extension từ
Spring Framework giúp cải thiện những nhược điểm mà Spring Framework còn tồn
động, giúp triển khai dự án nhanh hơn, mạnh mẽ và dễ quản lý hơn. Kết hợp hai
công nghệ này với nhau, tạo ra dự án cho một website kinh doanh.
Bài báo cáo bao gồm bảy chương, mô tả quá trình phát triển dự án, đi từ ý
tưởng cho đến làm thành ra sản phẩm. Các chương trong dự án bao gồm:
Chương 1: Tổng quan về đề tài
Chương 2: Cơ sở lý thuyết
Chương 3: Yêu cầu người dùng
Chương 4: Phân tích hệ thống
Chương 5: Thiết kế hệ thống
Chương 6: Cài đặt và kiểm thử
Chương 7: Tổng kết

ii


Mục lục

MỤC LỤC
NHIỆM VỤ KHÓA LUẬN TỐT NGHIỆP ..................................................................
PHIẾU ĐÁNH GIÁ CỦA GIẢNG VIÊN HƯỚNG DẪN ...........................................
PHIẾU ĐÁNH GIÁ CỦA GIẢNG VIÊN PHẢN BIỆN ..............................................
LỜI CẢM ƠN ............................................................................................................. i

LỜI NÓI ĐẦU ........................................................................................................... ii
MỤC LỤC ................................................................................................................ iiii
DANH SÁCH BẢNG .............................................................................................. vii
DANH SÁCH HÌNH ẢNH ....................................................................................... ix
CHƯƠNG 1: TỔNG QUAN VỀ ĐỀ TÀI ..................................................................1
1.1 Lý do chọn đề tài ...............................................................................................1
1.2 Mục tiêu đề tài ...................................................................................................1
1.3 Mô tả dự án ........................................................................................................2
1.3.1 Phạm vi dự án ..............................................................................................2
1.3.2 Các điều kiện ràng buộc ..............................................................................3
1.4 Tính thực tiễn .....................................................................................................3
1.5 Khảo sát website ................................................................................................4
1.5.1 Khảo sát website ........................................................4
1.5.2 Khảo sát website ........................................................9
1.5.3 Khảo sát website ..............................................13
1.5.4 So sánh về ba trang web đã khảo sát .........................................................17
CHƯƠNG 2: CƠ SỞ LÝ THUYẾT .........................................................................18
2.1 React JS............................................................................................................18
2.1.1 Giới thiệu về ReactJS ................................................................................18
2.1.2 Giới thiệu về Redux...................................................................................18
2.1.3 Các khái niệm cơ bản trong react ..............................................................20
2.2 Spring Boot ......................................................................................................21
2.3 Amazon Lex .....................................................................................................22
2.3.1 Xây dựng chatbot ......................................................................................22
2.3.2 Tìm hiểu về Amazon Lex và Lamda .........................................................22
2.4 Thuật toán gợi ý sản phẩm ...............................................................................25
iii


Mục lục


CHƯƠNG 3: YÊU CẦU NGƯỜI DÙNG ................................................................29
3.1 Yêu cầu nghiệp vụ ...........................................................................................29
3.2 Các phương pháp và cách tiếp cận ..................................................................29
3.3 Sản phẩm bàn giao cuối

29

CHƯƠNG 4: PHÂN TÍCH HỆ THỐNG ..................................................................31
4.1 Xác định vai trò actor trong lược đồ Use case .................................................31
4.2 Mơ tả vai trị của người dùng ...........................................................................31
4.2.1 Chi tiết vai trò actor ...................................................................................31
4.2.2 Chi tiết chức năng......................................................................................33
4.3 Lược đồ Use case .............................................................................................35
4.4 Đặc tả Use case ................................................................................................36
4.4.1 Đăng nhập..................................................................................................36
4.4.2 Đăng ký .....................................................................................................37
4.4.3 Quên mật khẩu...........................................................................................38
4.4.4 Quản lý tài khoản ......................................................................................39
4.4.5 Quản lý sản phẩm ......................................................................................40
4.4.6 Quản lý size của mỗi sản phẩm .................................................................42
4.4.7 Quản lý hình ảnh của mỗi sản phẩm .........................................................43
4.4.8 Quản lý đơn hàng ......................................................................................45
4.4.9 Xem sản phẩm ...........................................................................................46
4.4.10 Gợi ý sản phẩm ........................................................................................47
4.4.11 Quản lý thông tin cá nhân .......................................................................48
4.4.12 Thay đổi mật khẩu ...................................................................................49
4.4.13 Đặt hàng ..................................................................................................51
4.4.14 Xem đơn hàng đã đặt ...............................................................................52
4.4.15 Hủy đơn hàng ..........................................................................................53

4.4.16 Xem giỏ hàng ..........................................................................................54
4.4.17 Thêm sản phẩm vào giỏ hàng ..................................................................55
4.4.18 Sửa sản phẩm trong giỏ hàng ..................................................................56
4.4.19 Xóa sản phẩm trong giỏ hàng ..................................................................57
4.4.20 Thêm bình luận ........................................................................................58
4.4.21 Xóa bình luận ..........................................................................................59
iv


Mục lục

4.4.22 Xem doanh thu ........................................................................................60
4.4.23 Quản lý voucher ......................................................................................62
4.4.24 Quản lý giao dịch online .........................................................................63
4.4.25 Chatbot ....................................................................................................65
4.4.26 Quản lý danh mục....................................................................................66
4.5 Lược đồ Sequence

68

4.5.1 Đăng nhập..................................................................................................68
4.5.2 Đăng ký .....................................................................................................68
4.5.3 Quản lý tài khoản ......................................................................................69
4.5.4 Quản lý sản phẩm ......................................................................................70
4.5.5 Quản lý size của mỗi sản phẩm .................................................................71
4.5.6 Quản lý hình ảnh của mỗi sản phẩm .........................................................72
4.5.7 Quản lý đơn hàng ......................................................................................73
4.5.8 Xem sản phẩm ...........................................................................................73
4.5.9 Xem chi tiết sản phẩm ...............................................................................74
4.5.10 Quản lý thông tin cá nhân .......................................................................75

4.5.11 Thay đổi mật khẩu ...................................................................................76
4.5.12 Đặt hàng ..................................................................................................76
4.5.13 Xem thông tin đơn hàng đã đặt ...............................................................77
4.5.14 Hủy đơn hàng ..........................................................................................77
4.5.15 Xem giỏ hàng ..........................................................................................78
4.5.16 Thêm sản phẩm vào giỏ hàng ..................................................................78
4.5.17 Sửa sản phẩm trong giỏ hàng ..................................................................79
4.5.18 Xóa sản phẩm trong giỏ hàng ..................................................................79
4.5.19 Thêm bình luận ........................................................................................80
4.5.20 Xem doanh thu ........................................................................................80
4.5.21 Quản lý danh mục....................................................................................81
CHƯƠNG 5: THIẾT KẾ HỆ THỐNG
5.1 Thiết kế database

82
82

5.1.1 Lược đồ Logic ...........................................................................................82
5.1.2 Class Diagram ...........................................................................................83
v


Mục lục

5.2 Giao diện và thiết kế quy trình

87

5.2.1 Trang đăng nhập ........................................................................................87
5.2.2 Trang đăng đăng ký ...................................................................................87

5.2.3 Trang quên mật khẩu .................................................................................88
5.2.4 Trang thông tin cá nhân .............................................................................88
5.2.5 Trang sản phẩm .........................................................................................90
5.2.6 Trang chi tiết sản phẩm .............................................................................92
5.2.7 Trang giỏ hàng...........................................................................................94
5.2.8 Trang thanh toán ........................................................................................95
5.2.9 Trang lịch sử đặt hàng ...............................................................................96
5.2.10 Trang quản lý giao dịch paypal ...............................................................97
5.2.11 Trang xem doanh thu theo ngày ..............................................................98
5.2.12 Trang quản lý tài khoản ...........................................................................99
5.2.13 Trang quản lý sản phẩm ........................................................................100
5.2.14 Trang quản lý voucher ...........................................................................103
5.2.15 Trang quản lý đơn hàng .........................................................................105
CHƯƠNG 6: CÀI ĐẶT VÀ KIỂM THỬ ...............................................................107
6.1 Chuẩn bị .........................................................................................................107
6.1.1 Công cụ....................................................................................................107
6.1.2 Công nghệ................................................................................................107
6.2 Cài đặt ............................................................................................................107
6.3 Phương pháp và kỹ thuật kiểm thử

107

6.3.1 Kiểm thử hộp trắng..................................................................................107
6.3.2 Kiểm thử hộp đen ....................................................................................109
6.4 Sử dụng kiểm thử hộp trắng

110

6.4.1 Thêm sản phẩm vào giỏ hàng ..................................................................110
6.5 Bug Reports ...................................................................................................120

CHƯƠNG 7: TỔNG KẾT ......................................................................................122
7.1 Kết quả đạt được ............................................................................................122
7.2 Ưu điểm .........................................................................................................123
7.3 Nhược điểm ...................................................................................................123
7.4 Hướng phát triển ............................................................................................124
vi


Mục lục

TÀI LIỆU THAM KHẢO .......................................................................................125

vii


Danh sách bảng

DANH SÁCH BẢNG
Bảng 1: So sánh ba trang web đã khảo sát ................................................................17
Bảng 2: Xác định vai trò actor trong lược đồ Use Case............................................31
Bảng 3: Chi tiết vai trò actor .....................................................................................33
Bảng 4: Chi tiết chức năng ........................................................................................34
Bảng 5: Đặc tả đăng nhập .........................................................................................37
Bảng 6: Đặc tả đăng ký .............................................................................................38
Bảng 7: Đặc tả quên mật khẩu ..................................................................................39
Bảng 8: Đặc tả quản lý tài khoản ..............................................................................40
Bảng 9: Đặc tả quản lý sản phẩm ..............................................................................41
Bảng 10: Đặc tả quản lý size của mỗi sản phẩm .......................................................43
Bảng 11: Đặc tả quản lý hình ảnh của mỗi sản phẩm ...............................................44
Bảng 12: Đặc tả quản lý đơn hàng ............................................................................46

Bảng 13: Đặc tả xem sản phẩm .................................................................................47
Bảng 14: Đặc tả xem chi tiết sản phẩm .....................................................................48
Bảng 15: Đặc tả quản lý thông tin cá nhân ...............................................................49
Bảng 16: Đặc tả thay đổi mật khẩu ...........................................................................50
Bảng 17: Đặc tả đặt hàng ..........................................................................................52
Bảng 18: Đặc tả xem thông tin đơn hàng đã đặt ......................................................53
Bảng 19: Đặc tả hủy đơn hàng ..................................................................................54
Bảng 20: Đặc tả xem giỏ hàng ..................................................................................55
Bảng 21: Đặc tả thêm sản phẩm vào giỏ hàng ..........................................................56
Bảng 22: Đặc tả sửa sản phẩm trong giỏ hàng ..........................................................57
Bảng 23: Đặc tả xóa sản phẩm trong giỏ hàng .........................................................58
Bảng 24: Đặc tả thêm bình luận ................................................................................59
Bảng 25: Đặc tả xóa bình luận ..................................................................................60
Bảng 26: Đặc tả xem doanh thu ................................................................................62
Bảng 27: Đặc tả quản lý voucher ..............................................................................63
Bảng 28: Đặc tả quản lý giao dịch online .................................................................65
Bảng 29: Đặc tả chatbot ............................................................................................66
Bảng 30: Đặc tả quản lý danh mục ...........................................................................67
viii


Danh sách bảng

Bảng 31: Bảng accounts ............................................................................................83
Bảng 32: Bảng images ..............................................................................................84
Bảng 33: Bảng line_item_orders ...............................................................................84
Bảng 34: Bảng line_items .........................................................................................85
Bảng 35: Bảng product_infors ..................................................................................85
Bảng 36: Bảng products ............................................................................................85
Bảng 37: Bảng size....................................................................................................85

Bảng 38: Bảng users..................................................................................................86
Bảng 39: Bảng wish_lists ..........................................................................................86
Bảng 40: Test case thêm sản phẩm vào giỏ hàng ...................................................113
Bảng 41: Báo cáo lỗi quản lý khách hàng ...............................................................120
Bảng 42: Báo cáo lỗi quản lý sản phẩm ..................................................................121

ix


Danh sách hình ảnh

DANH SÁCH HÌNH ẢNH
Hình 1: Từ khóa tìm kiếm website ............................................4
Hình 2: Trang chủ website .........................................................4
Hình 3: Trang sản phẩm website ...............................................5
Hình 4: Trang tin tức website ....................................................5
Hình 5: Thanh footer website ....................................................5
Hình 6: Trang chi tiết sản phẩm website ...................................6
Hình 7: Thông báo thêm sản phẩm thành công website ............6
Hình 8: Trang giỏ hàng website .................................................7
Hình 9: Trang checkout website ................................................7
Hình 10: Trang đặt hàng website ...............................................8
Hình 11: Từ khóa tìm kiếm website ..........................................9
Hình 12: Trang chủ website ......................................................9
Hình 13: Sản phẩm bán chạy của website ...............................10
Hình 14: Chỗ đánh giá website ...............................................10
Hình 15: Thanh footer website ................................................11
Hình 16: Trang danh sách sản phẩm website ..........................11
Hình 17: Trang chi tiết sản phẩm website ...............................12
Hình 18: Trang giỏ hàng website ............................................12

Hình 19: Trang đặt hàng website .............................................13
Hình 20: Từ khóa tìm kiếm website ................................13
Hình 21: Trang chủ website ............................................14
Hình 22: Phần footer website ..........................................14
Hình 23: Trang danh sách sản phẩm website ..................15
Hình 24: Trang chi tiết sản phẩm website .......................15
Hình 25: Giỏ hàng website ..............................................16
Hình 26: Trang giỏ hàng website ....................................16
Hình 27: Nguyên lý hoạt động của redux [2]............................................................19
Hình 28: Tổng quát về hệ thống gợi ý [6] .................................................................25
Hình 29: Ví dụ về hệ thống gợi ý ..............................................................................26
Hình 30: Ví dụ về hệ thống gợi ý ..............................................................................26
x


Danh sách hình ảnh

Hình 31: Ví dụ về hệ thống gợi ý ..............................................................................26
Hình 32: Ví dụ về hệ thống gợi ý ..............................................................................26
Hình 33: Ví dụ về hệ thống gợi ý ..............................................................................27
Hình 34: Ví dụ về hệ thống gợi ý ..............................................................................27
Hình 35: Ví dụ về hệ thống gợi ý ..............................................................................28
Hình 36: Lược đồ Use case .......................................................................................35
Hình 37: Lược đồ sequence đăng nhập .....................................................................68
Hình 38: Lược đồ sequence đăng ký .........................................................................68
Hình 39: Lược đồ sequence quản lý tài khoản ..........................................................69
Hình 40: Lược đồ sequence quản lý sản phẩm .........................................................70
Hình 41: Lược đồ sequence quản lý size mỗi sản phẩm ...........................................71
Hình 42: Lược đồ sequence quản lý hình ảnh mỗi sản phẩm ...................................72
Hình 43: Lược đồ sequence quản lý đơn hàng ..........................................................73

Hình 44: Lược đồ sequence xem sản phẩm ..............................................................73
Hình 45: Lược đồ sequence xem chi tiết sản phẩm ..................................................74
Hình 46: Lược đồ sequence quản lý thơng tin cá nhân .............................................75
Hình 47: Lược đồ sequence thay đổi mật khẩu.........................................................76
Hình 48: Lược đồ sequence đặt hàng ........................................................................76
Hình 49: Lược đồ sequence xem thơng tin đơn hàng đã đặt.....................................77
Hình 50: Lược đồ sequence hủy đơn hàng................................................................77
Hình 51: Lược đồ sequence xem giỏ hàng ................................................................78
Hình 52: Lược đồ sequence thêm sản phẩm vào giỏ hàng .......................................78
Hình 53: Lược đồ sequence sửa sản phẩm trong giỏ hàng .......................................79
Hình 54: Lược đồ sequence xóa sản phẩm trong giỏ hàng .......................................79
Hình 55: Lược đồ sequence thêm bình luận .............................................................80
Hình 56: Lược đồ sequence xem doanh thu ..............................................................80
Hình 57: Lược đồ activity quản lý danh mục ...........................................................81
Hình 58: Lược đồ logic .............................................................................................82
Hình 59: Class Diagram ............................................................................................83
Hình 60: Giao diện trang đăng nhập .........................................................................87
Hình 61: Giao diện trang đăng ký .............................................................................87
Hình 62: Giao diện trang quên mật khẩu ..................................................................88
xi


Danh sách hình ảnh

Hình 63: Giao diện trang thơng tin cá nhân ..............................................................89
Hình 64: Giao diện trang thơng tin cá nhân khi thay đổi mật khẩu ..........................89
Hình 65: Giao diện trang sản phẩm ..........................................................................91
Hình 66: Giao diện trang chi tiết sản phẩm ..............................................................93
Hình 67: Giao diện trang giỏ hàng khi rỗng .............................................................94
Hình 68: Giao diện trang giỏ hàng khi có sản phẩm .................................................94

Hình 69: Giao diện trang thanh tốn .........................................................................95
Hình 70: Giao diện trang lịch sử đơn hàng khi chưa có đơn hàng ...........................96
Hình 71: Giao diện trang lịch sử đơn hàng khi có đơn hàng ....................................96
Hình 72: Giao diện trang quản lý giao dịch Paypal ..................................................97
Hình 73: Giao diện trang xem doanh thu theo ngày dạng bảng ................................98
Hình 74: Giao diện trang xem doanh thu theo ngày dạng đồ thị ..............................98
Hình 75: Giao diện trang quản lý tài khoản ..............................................................99
Hình 76: Modal xem thơng tin chiết và chỉnh sửa tài khoản ....................................99
Hình 77: Giao diện trang lý sản phẩm ....................................................................100
Hình 78: Modal thêm sản phẩm mới.......................................................................101
Hình 79: Modal xem chi tiết và chỉnh sửa thơng tin sản phẩm ..............................101
Hình 80: Modal quản lý size sản phẩm ...................................................................102
Hình 81: Modal quản lý hình ảnh sản phẩm ...........................................................103
Hình 82: Giao diện trang quản lý voucher ..............................................................103
Hình 83: Modal thêm voucher mới .........................................................................104
Hình 84: Modal xem chi tiết và chỉnh sửa thơng tin voucher .................................104
Hình 85: Giao diện trang quản lý đơn hàng ............................................................105
Hình 86: Modal xem chi tiết đơn hàng ...................................................................106
Hình 87: Các nút trong đồ thị dịng điều khiển .......................................................108
Hình 88: Cấu trúc điều kiện kiểm thử hộp trắng.....................................................108
Hình 89:Các nút đồ thị dịng dữ liệu .......................................................................109
Hình 90: Các cấu trúc điều kiện trong kiểm thử hộp đen .......................................109
Hình 91: Đoạn mã được dùng để kiểm thử .............................................................111
Hình 92: Đồ thị dịng điều khiển .............................................................................112
Hình 93: Đồ thị dịng dữ liệu chung........................................................................113
xii




×