(Đồ án hcmute) xây dựng web quản lý cửa hàng thời trang sử dụng asp net core và angular
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 (9.57 MB, 162 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 WEB QUẢN LÝ CỬA HÀNG THỜI TRANG
SỬ DỤNG ASP.NET CORE VÀ ANGULAR
GVHD: ThS. NGUYỄN MINH ĐẠO
SVTH: BÙI NGỌC LÂM
NGUYỄN VIỆT LONG
S K L0 1 0 6 8 9
Tp. Hồ Chí Minh, 2022
BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP. HCM
KHOA ĐÀO TẠO CHẤT LƯỢNG CAO
BÁO CÁO KHÓA LUẬN TỐT NGHIỆP
ĐỀ TÀI
XÂY DỰNG WEB QUẢN LÝ CỬA HÀNG
THỜI TRANG SỬ DỤNG ASP.NET CORE
VÀ ANGULAR
GVHD: Thạc sĩ Nguyễn Minh Đạo
Nhóm SVTH:
Bùi Ngọc Lâm
18110140
Nguyễn Việt Long
17110177
BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP. HCM
KHOA ĐÀO TẠO CHẤT LƯỢNG CAO
BÁO CÁO KHÓA LUẬN TỐT NGHIỆP
ĐỀ TÀI
XÂY DỰNG WEB QUẢN LÝ CỬA HÀNG
THỜI TRANG SỬ DỤNG ASP.NET CORE
VÀ ANGULAR
GVHD: Thạc sĩ Nguyễn Minh Đạo
Nhóm SVTH:
Bùi Ngọc Lâm
18110140
Nguyễn Việt Long
17110177
ĐH SƯ PHẠM KỸ THUẬT TP. HCM
CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
KHOA ĐÀO TẠO CLC
Độc lập – Tự do – Hạnh Phúc
*******
*******
PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN
Họ và tên Sinh viên 1: Bùi Ngọc Lâm
MSSV 1: 18110140
Họ và tên Sinh viên 2: Nguyễn Việt Long
MSSV 2: 17110177
Ngành: Công nghệ Thông tin
Tên đề tài: Xây dựng Web quản lí cửa hàng thời trang sử dụng ASP.NET CORE và
Angular
Họ và tên Giáo viên hướng dẫn: Thạc sĩ Nguyễn Minh Đạo
NHẬN XÉT
1. Về nội dung đề tài & khối lượng thực hiện:
...........................................................................................................................................
...........................................................................................................................................
2. Ưu điểm:
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
3. Khuyết điểm:
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
4. Đề nghị cho bảo vệ hay không? ...................................................................................
5. Đánh giá loại: ................................................................................................................
6. Điểm: ............................................................................................................................
Tp. Hồ Chí Minh, ngày 27 tháng 10 năm 2022
Giáo viên hướng dẫn
(Ký & ghi rõ họ tên)
ĐH SƯ PHẠM KỸ THUẬT TP. HCM
CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
KHOA ĐÀO TẠO CLC
Độc lập – Tự do – Hạnh Phúc
*******
*******
PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN
Họ và tên Sinh viên 1: Bùi Ngọc Lâm
MSSV 1: 18110140
Họ và tên Sinh viên 2: Nguyễn Việt Long
MSSV 2: 17110177
Ngành: Công nghệ Thông tin
Tên đề tài: Xây dựng Web quản lí cửa hàng thời trang sử dụng ASP.NET CORE và
Angular
Họ và tên Giáo viên phản biện: Lê Văn Vinh
NHẬN XÉT
1. Về nội dung đề tài & khối lượng thực hiện:
...........................................................................................................................................
...........................................................................................................................................
2. Ưu điểm:
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
3. Khuyết điểm:
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
4. Đề nghị cho bảo vệ hay không? ...................................................................................
5. Đánh giá loại: ................................................................................................................
6. Điểm: ............................................................................................................................
Tp. Hồ Chí Minh, ngày
tháng
Giáo viên phản biện
(Ký & ghi rõ họ tên)
năm 2021
MỤC LỤC
MỤC LỤC ....................................................................................................................... 1
DANH SÁCH HÌNH ẢNH ............................................................................................. 3
DANH SÁCH BẢNG BIỂU ........................................................................................... 9
DANH SÁCH TỪ VIẾT TẮT ...................................................................................... 12
LỜI CẢM ƠN................................................................................................................ 13
LỜI GIỚI THIỆU .......................................................................................................... 14
PHẦN MỞ ĐẦU ........................................................................................................... 15
1. TÍNH CẤP THIẾT CỦA ĐỀ TÀI ......................................................................... 15
2. ĐỐI TƯỢNG NGHIÊN CỨU ............................................................................... 16
3. PHẠM VI NGHIÊN CỨU .................................................................................... 16
4. PHÂN TÍCH CÁC ỨNG DỤNG CĨ LIÊN QUAN ............................................. 16
5. KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC ...................................................................... 17
6. Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN ........................................................... 17
CHƯƠNG 1 CƠ SỞ LÍ THUYẾT ................................................................................ 18
1.1 ANGULAR.......................................................................................................... 18
1.2 SQL SERVER ..................................................................................................... 22
1.3 ASP .NET CORE ................................................................................................ 23
1.4 DELOY................................................................................................................ 24
CHƯƠNG 2 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU ...................... 26
2.1 KHẢO SÁT HIỆN TRẠNG ................................................................................ 26
2.2 XÁC ĐỊNH YÊU CẦU ....................................................................................... 28
2.3 MƠ HÌNH HĨA U CẦU ............................................................................... 38
CHƯƠNG 3 THIẾT KẾ PHẦN MỀM ......................................................................... 55
3.1 TỔNG QUAN HỆ THỐNG ................................................................................ 55
3.2 LƯỢC ĐỒ LỚP ................................................................................................... 55
3.3 LƯỢC ĐỒ TUẦN TỰ......................................................................................... 56
3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU ............................................................................. 81
3.5 THIẾT KẾ CHỨC NĂNG (BACKEND SWAGGER) ...................................... 96
3.6 THIẾT KẾ GIAO DIỆN .................................................................................... 102
1
CHƯƠNG 4 CÀI ĐẶT VÀ KIỂM THỬ .................................................................... 136
4.1 CÀI ĐẶT ........................................................................................................... 136
4.2 KIỂM THỬ ....................................................................................................... 140
CHƯƠNG 5 PHẦN KẾT LUẬN ................................................................................ 153
5.1 KẾT QUẢ ĐẠT ĐƯỢC .................................................................................... 153
5.2 CHƯƠNG TRÌNH ĐÃ LÀM ĐƯỢC ............................................................... 153
5.3 ƯU VÀ NHƯỢC ĐIỂM ỨNG DỤNG ............................................................. 153
5.4 HƯỚNG PHÁT TRIỂN .................................................................................... 154
Tài liệu tham khảo ....................................................................................................... 155
Link source code.......................................................................................................... 156
2
DANH SÁCH HÌNH ẢNH
Hình 1.1.3.1 Các tính năng cốt lõi của Angular...................................................................... 19
Hình 2.1.1.1 Hình ảnh trang shopee.vn .................................................................................. 26
Hình 2.1.2.1 Hình ảnh trang thecosmo.vn ............................................................................. 27
Hình 2.1.3.1 Hình ảnh trang juno.vn ..................................................................................... 27
Hình 2.1.4.1 Hình ảnh trang marc.com.vn ............................................................................. 28
Hình 2.3.1.1 Usecase cho khách hàng .................................................................................... 38
Hình 2.3.1.2 Usecase cho quản lý ........................................................................................... 39
Hình 3.1.1.1 Thiết kế tổng quan hệ thống............................................................................... 55
Hình 3.2.1.1 Hình ảnh lược đồ lớp ......................................................................................... 56
Hình 3.3.1.1 Lược đồ tuần tự chức năng đăng kí ................................................................... 56
Hình 3.3.2.1 Lược đồ tuần tự chức năng đăng nhập ............................................................... 57
Hình 3.3.3.1 Lược đồ tuần tự chức năng quên mật khẩu ........................................................ 58
Hình 3.3.4.1 Lược đồ tuần tự chức năng thêm sản phẩm vào giỏ hàng ................................. 58
Hình 3.3.5.1 Lược đồ tuần tự chức năng thanh tốn............................................................... 60
Hình 3.3.6.1 Lược đồ tuần tự chức năng chỉnh sửa số lượng sản phẩm trong giỏ hàng ........ 61
Hình 3.3.7.1 Lược đồ tuần tự chức năng xóa sản phẩm trong giỏ hàng ................................. 61
Hình 3.3.8.1 Lược đồ tuần tự chức năng cập nhật thơng tin ................................................... 62
Hình 3.3.9.1 Lược đồ tuần tự chức năng xem sản phẩm ........................................................ 62
Hình 3.3.10.1 Lược đồ tuần tự chức năng xem đơn hàng....................................................... 63
Hình 3.3.11.1 Lược đồ tuần tự chức năng hủy đơn hàng ....................................................... 63
Hình 3.3.12.1 Lược đồ tuần tự chức năng xem thơng báo ...................................................... 64
Hình 3.3.13.1 Lược đồ tuần tự chức năng đổi mật khẩu ........................................................ 64
3
Hình 3.3.14.1 Lược đồ chức năng thêm địa chỉ khách hàng ................................................. 65
Hình 3.3.15.1 Lược đồ tuần tự chỉnh sửa địa chỉ khách hàng ................................................ 65
Hình 3.3.16.1 Lược đồ tuần tự xóa địa chỉ khách hàng .......................................................... 66
Hình 3.3.17.1 Lược đồ tuần tự thêm vai trị............................................................................ 66
Hình 3.3.18.1 Lược đồ tuần tự xóa vai trị .............................................................................. 67
Hình 3.3.19.1 Lược đồ tuần tự chức năng chỉnh sửa vai trị .................................................. 67
Hình 3.3.20.1 Lược đồ tuần tự chức năng tìm kiếm vai trị .................................................... 68
Hình 3.3.21.1 Lược đồ tuần tự chức năng thêm nhân viên ..................................................... 68
Hình 3.3.22.1 Lược đồ tuần tự chức năng chỉnh sửa thơng tin nhân viên .............................. 69
Hình 3.3.23.1 Lược đồ tuần tự chức năng xóa nhân viên ....................................................... 69
Hình 3.3.24.1 Lược đồ tuần tự chức năng tìm kiếm nhân viên .............................................. 70
Hình 3.3.25.1 Lược đồ tuần tự chức năng quản lí lương ........................................................ 70
Hình 3.3.26.1 Lược đồ tuần tự chức năng tìm kiếm khách hàng ............................................ 71
Hình 3.3.27.1 Lược đồ tuần tự chức năng xem thông tin khách hàng .................................... 71
Hình 3.3.28.1 Lược đồ tuần tự chức năng xóa khách hàng .................................................... 72
Hình 3.3.29.1 Lược đồ tuần tự chức năng thêm sản phẩm ..................................................... 72
Hình 3.3.30.1 Lược đồ tuần tự chức năng tìm kiếm sản phẩm ............................................... 73
Hình 3.3.31.1 Lược đồ tuần tự chức năng xem thơng tin sản phẩm ....................................... 73
Hình 3.3.32.1 Lược đồ tuần tự chức năng chỉnh sửa thơng tin sản phẩm .............................. 74
Hình 3.3.33.1 Lược đồ tuần tự chức năng thêm ảnh sản phẩm .............................................. 74
Hình 3.3.34.1 Lược đồ tuần tự chức năng xóa sản phẩm ....................................................... 75
Hình 3.3.35.1 Lược đồ tuần tự chức năng tìm kiếm loại sản phẩm ........................................ 75
Hình 3.3.36.1 Lược đồ tuần tự chức năng thêm loại sản phẩm .............................................. 76
Hình 3.3.37.1 Lược đồ tuần tự chức năng xem loại sản phẩm ............................................... 76
Hình 3.3.38.1 Lược đồ tuần tự chức năng chỉnh sửa loại sản phẩm ....................................... 77
4
Hình 3.3.39.1 Lược đồ tuần tự chức năng xóa loại sản phẩm ................................................ 77
Hình 3.3.40.1 Lược đồ tuần tự chức năng tìm kiếm voucher ................................................. 78
Hình 3.3.41.1 Lược đồ tuần tự chức năng thêm voucher ....................................................... 78
Hình 3.3.42.1 Lược đồ tuần tự chức năng chỉnh voucher ....................................................... 79
Hình 3.3.43.1 Lược đồ tuần tự chức năng xóa voucher .......................................................... 79
Hình 3.3.44.1 Lược đồ tuần tự chức năng xem thông tin voucher ......................................... 80
Hình 3.3.45.1 Lược đồ tuần tự chức năng xác nhận đơn hàng ............................................... 80
Hình 3.4.1.1 Lược đồ ERD ..................................................................................................... 81
Hình 3.4.1.2 Lược đồ diagram cơ sơ dữ liệu .......................................................................... 81
Hình 3.5.1.1 Thiết kế chức năng địa chỉ ................................................................................ 96
Hình 3.5.2.1 Thiết kế chức năng quản trị viên ........................................................................ 96
Hình 3.5.3.1 Thiết kế chức năng giỏ hàng .............................................................................. 97
Hình 3.5.4.1 Thiết kế chức năng giỏ hàng .............................................................................. 97
Hình 3.5.5.1 Thiết kế chức năng thơng tin shop ..................................................................... 97
Hình 3.5.6.1 Thiết kế chức năng thơng báo ............................................................................ 98
Hình 3.5.7.1 Thiết kế chức năng đặt hàng .............................................................................. 99
Hình 3.5.8.1 Thiết kế chức năng chi tiết đặt hàng .................................................................. 99
Hình 3.5.9.1 Thiết kế chức năng sản phẩm............................................................................. 99
Hình 3.5.10.1 Thiết kế chức năng người dùng ..................................................................... 100
Hình 3.5.11.1 Thiết kế chức năng nhân viên ........................................................................ 100
Hình 3.5.12.1 Thiết kế chức năng lương nhân viên .............................................................. 100
Hình 3.5.13.1 Thiết kế chức năng số liệu thống kê .............................................................. 101
Hình 3.5.14.1 Thiết kế chức năng trạng thái đơn hàng ......................................................... 101
Hình 3.5.15.1 Thiết kế chức năng giao dịch ......................................................................... 101
Hình 3.5.16.1 Thiết kế chức năng người dùng ..................................................................... 102
5
Hình 3.5.17.1 Thiết kế chức năng voucher ........................................................................... 102
Hình 3.6.1.1 Hình ảnh giao diện trang chủ ........................................................................... 103
Hình 3.6.1.2 Hình ảnh giao diện danh sách sản phẩm .......................................................... 104
Hình 3.6.1.3 Hình ảnh giao diện thơng tin cửa hàng ............................................................ 104
Hình 3.6.1.4 Hình ảnh giao diện thơng tin cửa hàng ............................................................ 105
Hình 3.6.1.5 Hình ảnh giao diện đăng nhập ......................................................................... 105
Hình 3.6.1.6 Hình ảnh giao diện đăng kí .............................................................................. 106
Hình 3.6.1.7 Hình ảnh giao diện quên mật khẩu .................................................................. 106
Hình 3.6.1.8 Hình ảnh giao diện chi tiết sản phẩm ............................................................... 107
Hình 3.6.1.9 Hình ảnh giao diện giỏ hàng ............................................................................ 107
Hình 3.6.1.10 Hình ảnh giao diện thanh tốn ....................................................................... 108
Hình 3.6.1.11 Hình ảnh giao diện thay đổi địa chỉ giao hàng............................................... 108
Hình 3.6.1.12 Hình ảnh giao diện thêm một địa chỉ mới để nhận hàng ............................... 109
Hình 3.6.1.13 Hình ảnh giao diện thay đổi hình thức thanh tốn ......................................... 109
Hình 3.6.1.14 Hình ảnh giao diện thơng tin khách hàng ...................................................... 110
Hình 3.6.1.15 Hình ảnh giao diện quản lí đơn hàng ............................................................. 110
Hình 3.6.1.16 Hình ảnh giao diện thơng báo ........................................................................ 111
Hình 3.6.2.1 Hình ảnh giao diện quản lí vai trị .................................................................... 111
Hình 3.6.2.2 Hình ảnh giao diện thêm vai trị ....................................................................... 112
Hình 3.6.2.3 Hình ảnh giao diện chỉnh sửa vai trị ............................................................... 112
Hình 3.6.2.4 Hình ảnh giao diện xóa vai trị ......................................................................... 113
Hình 3.6.2.5 Hình ảnh giao diện quản lí thơng tin khách hàng ............................................ 113
Hình 3.6.2.6 Hình ảnh giao diện chỉnh sửa thơng tin khách hàng ........................................ 114
Hình 3.6.2.7 Hình ảnh giao diện xóa khách hàng ................................................................. 114
Hình 3.6.2.8 Hình ảnh giao diện quản lí nhân viên .............................................................. 115
6
Hình 3.6.2.9 Hình ảnh giao diện thêm nhân viên mới .......................................................... 116
Hình 3.6.2.10 Hình ảnh giao diện xóa nhân viên.................................................................. 117
Hình 3.6.2.11 Hình ảnh giao diện chỉnh sửa nhân viên ........................................................ 117
Hình 3.6.2.12 Hình ảnh giao diện quản lí lương nhân viên .................................................. 118
Hình 3.6.2.13 Hình ảnh giao diện quản lí sản phẩm ............................................................. 118
Hình 3.6.2.14 Hình ảnh giao diện thêm sản phẩm ................................................................ 119
Hình 3.6.2.15 Hình ảnh giao diện xóa sản phẩm .................................................................. 120
Hình 3.6.2.16 Hình ảnh giao diện chỉnh sửa thơng tin sản phẩm ......................................... 121
Hình 3.6.2.17 Hình ảnh giao diện thêm, chỉnh sửa, xóa hình ảnh sản phẩm ........................ 122
Hình 3.6.2.18 Hình ảnh giao diện xem thơng tin sản phẩm.................................................. 123
Hình 3.6.1.19 Hình ảnh giao diện quản lí loại sản phẩm ...................................................... 123
Hình 3.6.2.20 Hình ảnh giao diện thêm loại sản phẩm ......................................................... 124
Hình 3.6.2.21 Hình ảnh giao diện xóa loại sản phẩm ........................................................... 125
Hình 3.6.2.22 Hình ảnh giao diện chỉnh sửa thông tin loại sản phẩm .................................. 125
Hình 3.6.2.23 Hình ảnh giao diện xem thơng tin loại sản phẩm........................................... 126
Hình 3.6.2.24 Hình ảnh giao diện quản lí voucher ............................................................... 126
Hình 3.6.2.25 Hình ảnh giao diện thêm voucher .................................................................. 127
Hình 3.6.2.26 Hình ảnh giao diện xóa voucher .................................................................... 128
Hình 3.6.2.27 Hình ảnh giao diện chỉnh sửa thơng tin voucher ........................................... 129
Hình 3.6.2.28 Hình ảnh giao diện xem thơng tin voucher .................................................... 129
Hình 3.6.2.29 Hình ảnh giao diện quản lí đơn đặt hàng ....................................................... 130
Hình 3.6.2.30 Hình ảnh giao diện xem thơng tin đơn đặt ..................................................... 130
Hình 3.6.2.31 Hình ảnh giao diện xác nhận đơn đặt ............................................................. 131
Hình 3.6.2.32 Hình ảnh giao diện hủy đơn đặt ..................................................................... 132
Hình 3.6.2.33 Hình ảnh giao diện thống kê doanh thu ......................................................... 133
7
Hình 3.6.2.34 Hình ảnh giao diện thống kê chi phí .............................................................. 133
Hình 3.6.2.35 Hình ảnh giao diện thống kê đơn hàng .......................................................... 134
Hình 3.6.2.37 Hình ảnh giao diện thống kê sản phẩm .......................................................... 135
Hình 3.6.2.38 Hình ảnh giao diện quản lí thơng tin tài khoản .............................................. 135
Hình 4.1.1 File cấu hình Back-end ....................................................................................... 136
Hình 4.1.2 Khởi chạy Back-end............................................................................................ 137
Hình 4.1.3 Swagger hỗ trợ sẵn trong ASP.NET Core 6.0 .................................................... 138
Hình 4.1.4 Gọi API lấy địa chỉ cửa hàng .............................................................................. 138
Hình 4.1.5 Cài đặt thư viện Front-end .................................................................................. 139
Hình 4.1.6 Khởi chạy Front-end ........................................................................................... 139
Hình 4.1.7 Chạy thành cơng Front-end ................................................................................. 140
Hình 4.2.2.1 Kết quả kiểm thử TC_DN_01 .......................................................................... 143
Hình 4.2.2.2 Kết quả kiểm thử TC_DN_02 .......................................................................... 143
Hình 4.4.2.3 Kết quả kiểm thử TC_DN_03 .......................................................................... 144
Hình 4.4.2.4 Kết quả kiểm thử test case TC_DK_01 ........................................................... 147
Hình 4.4.2.5 Kết quả test case TC_DK_02 ........................................................................... 147
Hình 4.4.2.6 Kết quả test case TC_DN_03 ........................................................................... 148
Hình 4.4.2.7 Kết quả testcase TC_TLSP_01 ........................................................................ 150
Hình 4.4.2.8 Kết quả testcase TC_TLSP_02 ........................................................................ 151
Hình 4.4.2.9 Kết quả testcase TC_XLSP_01 ........................................................................ 152
8
DANH SÁCH BẢNG BIỂU
Bảng 2.2.1.1 Yêu cầu chức năng xem tìm kiếm sản phẩm ..................................................... 29
Bảng 2.2.1.2 Yêu cầu chức năng xác thực người dùng .......................................................... 30
Bảng 2.2.1.3 Yêu cầu chức năng quản lý giỏ hàng................................................................. 30
Bảng 2.2.1.4 Yêu cầu chức năng thanh toán ........................................................................... 31
Bảng 2.2.1.5 Yêu cầu chức năng quản lí vai trị ..................................................................... 32
Bảng 2.2.1.6 u cầu chức năng quản lí nhân viên của người quản trị ................................ 32
Bảng 2.2.1.7 Yêu cầu chức năng quản lí khách hàng ............................................................. 33
Bảng 2.2.1.8 Yêu cầu chức năng quản lí đơn hàng ................................................................ 34
Bảng 2.2.1.9 Yêu cầu chức năng quản lí loại sản phẩm ......................................................... 34
Bảng 2.2.1.10 Yêu cầu chức năng quản lí sản phẩm .............................................................. 35
Bảng 2.2.1.11 Yêu cầu chức năng quản lí đơn đặt ................................................................. 35
Bảng 2.2.1.12 Yêu cầu chức năng quản lí voucher ................................................................ 36
Bảng 2.2.1.13 Yêu cầu chức năng thống kê ........................................................................... 36
Bảng 2.2.1.14 Yêu cầu chức năng xác thực người dùng ........................................................ 37
Bảng 2.2.1.15 Yêu cầu chức năng cập nhật thông tin , mật khẩu ........................................... 37
Bảng 2.3.2.1 Usecase đăng ký tài khoản người dùng ............................................................. 39
Bảng 2.3.2.2 Usecase đăng nhập tài khoản người dùng ......................................................... 40
Bảng 2.3.2.3 Usecase đăng xuất tài khoản.............................................................................. 40
Bảng 2.3.2.4 Usecase quên mật khẩu người dùng .................................................................. 41
Bảng 2.3.2.5 Usecase cập nhật thông tin ................................................................................ 41
Bảng 2.3.2.6 Usecase đổi mật khẩu người dùng ..................................................................... 42
Bảng 2.3.2.7 Usecase đặt hàng ............................................................................................... 42
9
Bảng 2.3.2.8 Usecase quản lí giỏ hàng ................................................................................... 43
Bảng 2.3.2.9 Usecase quản lí đơn hàng người dùng ............................................................... 44
Bảng 2.3.2.10 Usecase quản lí thơng báo người dùng ............................................................ 44
Bảng 2.3.2.11 Usecase quản lý sản phẩm ............................................................................... 45
Bảng 2.3.2.12 Usecase quản lý nhân viên .............................................................................. 46
Bảng 2.3.2.13 Usecase quản lý khách hàng ............................................................................ 47
Bảng 2.3.2.14 Usecase thống kê báo cáo ................................................................................ 48
Bảng 2.3.2.15 Usecase quản lý đơn hàng ............................................................................... 48
Bảng 2.3.2.16 Usecase quản lý loại sản phẩm ........................................................................ 49
Bảng 2.3.2.17 Usecase quản lý voucher ................................................................................. 50
Bảng 2.3.2.18 Usecase quản lý vai trò .................................................................................... 51
Bảng 2.3.2.19 Usecase quản lý vai trò .................................................................................... 52
Bảng 2.3.2.20 Usecase đăng nhập tài khoản người quản trị ................................................... 52
Bảng 2.3.2.21 Usecase quên mật khẩu người quản trị hoặc nhân viên .................................. 53
Bảng 2.3.2.22 Usecase cập nhật thông tin .............................................................................. 53
Bảng 2.3.2.23 Usecase đăng xuất tài khoản............................................................................ 54
Bảng 3.4.2.1 Chi tiết dữ liệu bảng địa chỉ người dùng ........................................................... 82
Bảng 3.4.2.2 Chi tiết dữ liệu bảng người quản trị .................................................................. 82
Bảng 3.4.2.3 Chi tiết dữ liệu bảng giỏ hàng ........................................................................... 83
Bảng 3.4.2.4 Chi tiết dữ liệu bảng loại sản phẩm ................................................................... 84
Bảng 3.4.2.5 Chi tiết dữ liệu bảng chi phí nhập sản phẩm ..................................................... 85
Bảng 3.4.2.6 Chi tiết dữ liệu bảng chi phí voucher ................................................................ 85
Bảng 3.4.2.7 Chi tiết dữ liệu bảng hình ảnh sản phẩm ........................................................... 86
Bảng 3.4.2.8 Chi tiết dữ liệu bảng chi tiết đơn hàng .............................................................. 86
Bảng 3.4.2.9 Chi tiết dữ liệu bảng thông báo ......................................................................... 87
10
Bảng 3.4.2.10 Chi tiết dữ liệu bảng chi tiết đơn hàng ............................................................ 87
Bảng 3.4.2.11 Chi tiết dữ liệu bảng đơn hàng ........................................................................ 88
Bảng 3.4.2.12 Chi tiết dữ liệu bảng sản phẩm ........................................................................ 90
Bảng 3.4.2.13 Chi tiết dữ liệu bảng vai trò ............................................................................. 91
Bảng 3.4.2.14 Chi tiết dữ liệu bảng lương nhân viên ............................................................. 91
Bảng 3.4.2.15 Chi tiết dữ liệu bảng nhân viên ........................................................................ 92
Bảng 3.4.2.16 Chi tiết dữ liệu bảng trạng thái đơn hàng ........................................................ 93
Bảng 3.4.2.17 Chi tiết dữ liệu bảng phương thức giao dịch ................................................... 93
Bảng 3.4.2.18 Chi tiết dữ liệu bảng khách hàng ..................................................................... 94
Bảng 3.4.2.19 Chi tiết dữ liệu bảng voucher .......................................................................... 95
Bảng 4.2.2.1 Test case chức năng đăng nhập ....................................................................... 142
Bảng 4.4.2.2 Test case chức năng đăng kí ............................................................................ 146
Bảng 4.4.2.3 Test case chức năng thêm loại sản phẩm ......................................................... 149
Bảng 4.4.2.4 Test case chức năng xóa loại sản phẩm ........................................................... 151
11
DANH SÁCH TỪ VIẾT TẮT
HTML: HyperText Markup Language
CSS: Cascading Style Sheets
MVC: Model-View-Controller
API: Application Programming Interface
SQL: Structured Query Language
ASP: Active Server Pages
.NET: Network Enabled Technologies
DB: Database
DOM: Document Object Model
URL: Uniform Resource Locator
JS: JavaScript
AoT: Ahead-of-time
RDBMS: Relational Database Management System
VB: Visual Basic
CLR: Common Language Runtime
CI: Continuous Integration
SSL: Secure Sockets Layer
IIS: Internet Information Services
12
LỜI CẢM ƠN
Để hồn thành tốt đồ án khóa luận tốt và bài báo cáo này, chúng em xin gửi lời
cảm ơn chân thành đến giảng viên, thầy Nguyễn Minh Đạo đã hỗ cho chúng em trong
quá trình làm đề tài. Chúng em cảm ơn thầy đã giải đáp những thắc mắc và đưa ra những
lời nhận xét, góp ý quý báu trong những lần báo báo tiến độ để chúng em có thể chỉnh
sửa, khắc phục kịp thời và hoàn thành tốt bài báo cáo cũng như đúng thời hạn Khoa đã đề
ra.
Chúng em cũng xin gửi lời cảm ơn chân thành các quý thầy cô trong khoa Đào tạo
Chất Lượng Cao nói chung và ngành Cơng Nghệ Thơng Tin nói riêng đã tận tình truyền
đạt những kiến thức nền tảng cũng như tạo điều kiện để chúng em có thể tìm hiểu và thực
hiện đề tài. Cùng với đó, chúng em xin được gửi lời cảm ơn đến các bạn cùng khoa, cùng
khóa nói chung và các bạn cùng lớp nói riêng, đã chia sẻ kiến thức cũng như hỗ trợ nhiệt
tình để giúp chúng em có thể hồn thiện hơn đề tài của mình.
Đề tài và bài báo cáo được chúng em thực hiện trong thời gian ngắn, với những
hạn chế về kiến thức chuyên môn cũng như về mặt kỹ thuật và kinh nghiệm trong việc
thực hiện một dự án. Do đó, trong q trình hồn thiện đề tài có những thiếu sót là điều
khơng thể tránh khỏi nên chúng em rất mong nhận được những ý kiến đóng góp q báu
của các q thầy cơ để kiến thức của chúng em được hoàn thiện hơn và chúng em có thể
làm tốt hơn nữa cho những đề tài sau. Chúng em xin chân thành cảm ơn.
Cuối lời, chúng em kính chúc q thầy cơ ln dồi dào sức khỏe và thành công
hơn nữa trong sự nghiệp trồng người. Một lần nữa chúng em xin chân thành cảm ơn.
13
LỜI GIỚI THIỆU
Nhóm đã xây dựng ứng dụng Web bán quản lí và bán hàng thời trang sử dụng
cơng nghệ Angular và ASP.NET Core. Web được sử dụng cho một doanh nghiệp hoặc
cửa hàng cụ thể. Chủ cửa hàng đóng vai trị như người quản có thể quản lý các sản phẩm
mình bán, quản lí danh mục sản phẩm, quản lý thông tin nhân viên, thông tin khách
hàng, kiểm duyệt đơn đặt và xem thống kê doanh thu theo tháng của năm, thống kê đơn
đặt theo trạng thái, thống lế số lượng người dùng mới . Nhân viên có thể kiểm duyệt đơn
đặt của khách hàng, tài khoản của nhân viên sẽ do người quản trị tạo ở mục quản lý nhân
viên. Khách hàng sau khi đăng nhập có thể thêm sản phẩm vào giỏ hàng, khi tiến hành
đặt hàng sẽ lấy những sản phẩm trong giỏ hàng để đặt đơn, có thể thay đổi số lượng sản
phẩm trong giỏ hoặc xóa sản phẩm khỏi giỏ hàng.
14
PHẦN MỞ ĐẦU
1. TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Hiện nay, ngành công nghệ thông tin đã và đang phát triển nhanh chóng, khơng
thể thiếu trong mọi lĩnh vực của đời sống góp phần đẩy mạnh cơng nghiệp hóa hiện đại
hóa đất nước. Với nhu cầu mua sắm trực tuyến không thể thiếu và ngày càng tăng mạnh
điển hình như các trang thương mại điện tử nổi tiếng như Alibaba, Shopee, Tiki,
Lazada…
Nhận thấy tiềm năng của kinh doanh mua sắm online này, các doanh nghiệp, cơng
ty, chủ cửa hàng cũng có nhu cầu cao để đưa sản phẩm của doanh nghiệp, cơng ty, cửa
hàng của mình được người dùng biết đến nhiều hơn và có thể mua sắm, xem các mặt
hàng sản phẩm và đặt hàng thơng qua thiết bị có kết nối mạng một cách dễ dàng. Ngoài
việc giúp người dùng có thể xem những sản phẩm bày bán, người dùng có thể mua trực
tuyến hoặc tham khảo các sản phẩm có trong cửa hàng để có thể đưa ra quyết định lựa
chọn sản phẩm dễ dàng hơn khi đến mua trực tiếp tại cửa hàng. Áp dụng công nghệ thơng
tin trong bán hàng cịn giúp chủ cửa hàng, doanh nghiệp dễ dàng quản lý các thông tin
giao dịch, thông tin của nhân viên, quản lý các đơn vị giao hàng đã liên kết, quản lý các
sản phẩm hiện có thống kê doanh thu… một cách dễ dàng ở bất kỳ đâu có kết nối
Internet.
Với nhu cầu đã và đang tăng cao của mua sắm online, nhóm em đã chọn đề tài về
Web thời trang dành cho một cửa hàng để có thể tìm hiểu và xây dựng một web bán
hàng đầu tiên cho mình đáp ứng nhu cầu khảo sát của các khách hàng trong mua sắm
online. Bước đầu có thể làm quen với các nghiệp vụ của cơ bản của thương mại điện thử
để về sau có thể dễ dàng tham gia vào các dự án xây dựng hoặc bảo trì về web thương
mại điện tử.
Đề tài hướng đến khả năng tiếp thu, nâng cao kỹ năng lập trình thơng qua q
15
trình phát triển ứng dụng web, nghiên cứu nghiệp vụ về thương mại điện tử, nghiên cứu
công nghệ mới và đáp ứng nhu cầu mua sắm online của thị thường đã và đang phát triển
mạnh. Mục đích tạo ra một web bán hàng đáp ứng được các chức năng cơ bản cần có của
một web bán hàng và có thể phát triển hơn trong tương lai.
2. ĐỐI TƯỢNG NGHIÊN CỨU
Đối với đề tài này, đối tượng nghiện cứu dựa trên nhu cầu mua sắm online của
khách hàng, và những thứ đáp ứng được mong muốn của khàng hàng khi mua sắm
online. Đồng thời kèm theo đó là cơng nghệ áp dụng tạo ra sản phẩm. Cụ thể như sau:
-
Tập trung nghiên cứu AngularJS để xây dựng giao diện thân thiện với người
dùng, giúp người dùng khơng gặp khó khăn khi lần đầu truy cập sử dụng
website ứng dụng.
-
Áp dụng cơ sỡ dữ liệu có ràng buộc là SQLServer để lưu trữ dữ liệu của hệ
thống.
-
Nghiên cứu về web API sử dụng ASP.NET Core để xây dựng API tương tác
với giao diện người dùng.
-
Nghiên cứu về xác thực người dùng thông qua Json Web Token để bảo mật
cho hệ thống, các tương tác API yêu cầu đăng nhập sẽ được thực hiện thông
qua Token.
3. PHẠM VI NGHIÊN CỨU
Đề tài chủ yếu tập chung vào xử lý nghiệp vụ và xây dựng các chức năng cơ bản
cần có của một website bán hàng online như: quản lý nhân viên, quản lý thông tin các
nhân khách hàng, quản lý sản phẩm, quản lý hóa đơn đặt mua phía người dùng, quản lý
hóa đơn kiểm duyệt phía quản trị viên, thống kê doanh thu, thanh tốn online.
4. PHÂN TÍCH CÁC ỨNG DỤNG CĨ LIÊN QUAN
Hầu hết các web bán hàng online đã được xây dựng và ra mắt đều có tính năng từ
cơ bản đến phức tạp. Tuy nhiên một số ứng dụng web bán hàng hiện có trên thị trường
vẫn có nhược điểm sau:
16
-
Chưa tích hợp chức năng thanh tốn online hoặc cịn ít lựa chọn thanh toán
online qua các cổng thanh toán.
-
Chi phí giao hàng q cao, chưa có hỗ trợ viên hỗ trợ khi khách hàng gặp khó
khăn cần giải đáp.
-
Chưa có nhiều lựa chọn xác thực người dùng như đăng nhập qua Google,
Gmail,…
-
Tính năng một số ứng dụng vẫn cịn hạn chế.
5. KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC
Xây dựng được một website bán hàng online đáp ứng các tính năng cơ bản cần có
như: quản lý nhân viên, quản lý thông tin khách hàng mua, đơn mua, quản lý các sản
phẩm, thống kê doanh thu, thống kê sản phẩm bán chạy. Về phía khách hàng có thể xem
được thơng tin các sản phẩm, tìm kiếm sản phẩm, đặt mua hàng, xem được lịch sử các
giao dịch mua hàng, thay đổi được các thông tin cá nhân, mật khẩu, khôi phục mật khẩu
qua email.
6. Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN
Đề tài hướng đến khả năng tiếp thu, nâng cao kỹ năng lập trình thơng qua q
trình phát triển ứng dụng web, nghiên cứu nghiệp vụ về thương mại điện tử, nghiên cứu
công nghệ mới và đáp ứng nhu cầu mua sắm online của thị thường đã và đang phát triển
mạnh. Mục đích tạo ra một web bán hàng đáp ứng được các chức năng cơ bản cần có của
một web bán hàng và có thể phát triển hơn trong tương lai.
17
CHƯƠNG 1 CƠ SỞ LÍ THUYẾT
1.1 ANGULAR
1.1.1 Khái niệm
Angular là một bộ Javascript Framework rất mạnh và thường được sử dụng để xây
dựng project Single Page Application (SPA). Nó hoạt động dựa trên các thuộc tính mở
rộng HTML (các atributes theo quy tắc của Angular). Đây là một Framework mã nguồn
mở hồn tồn miễn phí và được hàng ngàn các lập trình viên trên thế giới ưa chuộng và
sử dụng. Framework này được thế hệ Web 2.0 phát triển khá mạnh ở nước ngồi, tuy
nhiên ở Việt Nam thì vẫn chưa thơng dụng lắm.
1.1.2 Các đặc tính của Angular
Angular là một Framwork phát triển dựa trên Javascript để tạo các ứng dụng web
phong phú. Angular thường dùng để phát triển frontend (giao diện khách hàng) thông qua
các API để gọi data, sử dụng mơ hình MVC rất mạnh mẽ.
Mã nguồn AngularJS tự động fix với các trình duyệt khác nhau nên bạn khơng cần
phải lo vấn đề tương thích trình duyệt. Angular là mã nguồn mở, hồn tồn miễn phí và
được phát triển bởi hàng ngàn các lập trình viên trên thế giới.
Chung quy lại có thể hiểu khi làm việc với AngularJS giống như là đang làm việc
với Ajax, sử dụng cớ chế bind data, hoạt động theo mô hình MVC và sử dụng service để
tương tác với dữ liệu từ server.
1.1.3 Các tính năng cốt lõi của Angular
-
Data-binding: (liên kết dữ liệu) tự động đồng bộ dữ liệu giữa model và view.
-
Scope: (Phạm vi) Đây là những đối tượng kết nối giữa Controller và View.
-
Controller: Đây là những hàm javascript xử lý kết hợp với bộ điều khiển
Scope.
18
-
Service: Như tôi đề cập ở trên, AngularJS sử dụng các API được xây dựng từ
các web service (PHP, ASP) để thao tác với DB.
-
Filters: Bộ lọc lọc ra các thành phẩn của một mảng và trả về mảng mới.
-
Directives: đánh dấu vào các yếu tố của DOM, nghĩa là sẽ tạo ra các thẻ
HTML tùy chỉnh.
-
Templates: hiển thị thông tin từ controller, đây là một thành phần của views
-
Routing: chuyển đổi giữa các action trong controller.
-
MVC: Mơ hình chia thành phần riêng biệt thành Model, View, Controller. Đây
là một mơ hình khá hay nhưng trong Angular thì nó được chế biến lại một chút
gần giốn với MVVM (Model View View Model).
-
Deep Linking: Liên kết sâu, cho phép bạn mã hóa trạng thái của ứng dụng
trong các URL để nó có thể đánh dấu được với cơng cụ tìm kiếm.
-
Dependency Injection: Angular giúp các nhà phát triển tạo ứng dụng dễ dàng
hơn để phát triển, hiểu và thử nghiệm dễ dàng.
Hình 1.1.3.1 Các tính năng cốt lõi của Angular (Trích: a/p/tim-hieu19
va-huong-dan-lam-angularjs-Q7eEREb9MgNj)
1.1.4 Các thành phần trong Angular
1.1.4.1 Component
Components là một khối code trong app Angular. Nó là sự kết hợp của bộ
template html và nhúng kèm code TypeScript (hoặc Javascript). Các components là độc
lập với nhau và độc lập với hệ thống. Nó có thể được cài vào hoặc tháo ra khỏi hệ thống
dễ dàng. Một component có thể hiểu như một control trên màn hình hiển thị, gồm giao
diện html và code logic xử lý sự kiện đi kèm control đó. Một component cũng có thể to
lớn như là cả 1 màn hình chứa nhiều control hoặc một nhóm nhiều màn hình. Tức là là
một component cũng có thể chứa và gọi được nhiều component khác nối vào cấu trúc của
component:
-
Từ khóa @Component sẽ giúp định nghĩa bộ khung html cho nó. Và bên dưới
là một class CategoryListComponent dùng để viết code logic. Trong định
nghĩa bộ khung html, chúng ta có một số thuộc tính cần chú ý sau đây:
-
Selector : Là tên được đặt để gọi một component trong code html. Ở ví dụ vừa
rồi, từ khóa hello-ng-world được đặt tên cho component này. Khi cần gọi
component này ra ở màn hình html cha, ta sẽ gọi bằng html tag <app-categorylist></app-category-list>. Gọi như vậy thì component con sẽ được render ra
component cha.
-
Template : Là tự định nghĩa khung html cho component .
-
TemplateUrl : Là đường dẫn url tới file html bên ngồi để load file đó vào làm
khung html cho component này.
-
Styles : Là viết style css luôn vào file component này. Cách này chỉ dùng cho
component đơn giản.
-
StyleUrls : Là đường dẫn url đến file style css độc lập cho component này
1.1.4.2 Binding
20
