Đồ án website đi động được thiết kế chuẩn Cáu trúc rõ ràng bao gồm các tính năng nổi bật như đánh giá , review sản phẩm, giúp bạn hiểu rõ hơn về 1 hệ thống website Mọi thông tin hỗ trợ cũng như mua đồ án bạn vui lòng liên hệ Phan Trung Phú : SĐT 0986420994
Trang 1VIỆN CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
──────── * ───────
ĐỒ ÁN
TỐT NGHIỆP ĐẠI HỌC
NGÀNH CÔNG NGHỆ THÔNG TIN
XÂY DỰNG WEBSITE BÁN ĐỒ ĐIỆN TỬ
Sinh viên thực hiện: Họ tên sinh viên
Lớp XXXX - Kxx Giáo viên hướng dẫn: [GS/PGS/GVC/TS/ThS]
Tên giáo viên
HÀ NỘI 12-2018
Trang 2PHIẾU GIAO NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP
1 Thông tin về sinh viên
Họ và tên sinh viên:
Điện thoại liên lạc Email:
Đồ án tốt nghiệp được thực hiện tại:
Thời gian làm ĐATN: Từ ngày / / đến / /
2 Mục đích nội dung của ĐATN
- Xây dựng website bán đồ điện tử cho phép mua bán, đặt hàng online
3 Các nhiệm vụ cụ thể của ĐATN
- Trình bày cơ sở lý thuyết được áp dụng để xây dựng ĐATN
- Đặc tả hệ thống, phân tích thiết kế hệ thống, thiết kế giao diện hệ thống
- Xây dựng hệ thống website bán đồ điện tử có các chức năng:
+ Quản lý tài khoản admin
+ Quản lý doanh thu
+ Quản lý các chương trình khuyến mãi, chế độ bảo hành, đơn vị tính
+ Hiển thị các sản phẩm kinh doanh trên website
+ Cho phép khách hàng đăng ký, đăng nhập hệ thống
+ Cho phép khách hàng tìm kiếm sản phẩm, đặt hàng và thanh toán, gửi thông tin liên hệ, bình luận sản phẩm, đánh giá sản phẩm
+ Chức năng nạp card và đổi mã khuyến mãi để thanh toán
4 Lời cam đoan của sinh viên:
Tôi - điền tên sinh viên - cam kết ĐATN là công trình nghiên cứu của bản thân tôi dưới sự hướng dẫn của học hàm học vị+điền tên giáo viên hướng dẫn
Các kết quả nêu trong ĐATN là trung thực, không phải là sao chép toàn văn của bất kỳcông trình nào khác
Hà Nội, ngày tháng năm
Tác giả ĐATN
Họ và tên sinh viên
5 Xác nhận của giáo viên hướng dẫn về mức độ hoàn thành của ĐATN và cho phép bảovệ:
Trang 3Hà Nội, ngày tháng năm
Giáo viên hướng dẫn
Học hàm học vị+điền tên giáo viên hướng
dẫn
Trang 4TÓM TẮT NỘI DUNG ĐỒ ÁN TỐT NGHIỆP
Hình thức kinh doanh online đang ngày càng phổ biến rộng rãi trên hầu khắp thế giớibởi những lợi ích mà hình thức này mang lại Kinh doanh online không chỉ mang lại lợi íchcho các nhà kinh doanh mà còn mang lại sự thuận tiện đối với người tiêu dùng Cùng với
sự phát triển của công nghệ thông tin, các thiết bị điện tử được nhiều người ưa chuộng.Nhu cầu mua sắm của người dân về loại mặt hàng này ngày một tăng Từ thực tế trên emchọn đề tài “Xây dựng website bán đồ điện tử” Nội dung đồ án sẽ trình bày nhiệm vụ cầnthực hiện, cơ sở lý thuyết, phân tích thiết kế hệ thống và xây dựng hệ thống website bán đồđiện tử
Trang 5MỤC LỤC
PHIẾU GIAO NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP i
TÓM TẮT NỘI DUNG ĐỒ ÁN TỐT NGHIỆP iii
MỤC LỤC iv
DANH MỤC HÌNH VẼ viii
DANH MỤC BẢNG BIỂU xii
DANH MỤC TỪ VIẾT TẮT VÀ THUẬT NGỮ xvi
MỞ ĐẦU 1
PHẦN 1: ĐẶT VẤN ĐỀ VÀ ĐỊNH HƯỚNG GIẢI PHÁP 3
1.1 Nhiệm vụ 3
1.2 Định hướng giải quyết 3
1.3 Tóm tắt cơ sở lý thuyết và công cụ sử dụng 3
1.3.1 Ngôn ngữ HTML 3
1.3.2 Ngôn ngữ CSS 4
1.3.3 Ngôn ngữ lập trình PHP 5
1.3.4 Thư viện hỗ trợ 6
1.3.5 Cơ sở dữ liệu MySQL 9
1.3.6 Các cộng cụ sử dụng 10
PHẦN 2: CÁC KẾT QUẢ ĐẠT ĐƯỢC 10
2.1 Đặc tả yêu cầu 10
2.1.1 Backend 10
2.1.2 Frontend (Giao diện người dùng) 11
2.2 Các yêu cầu phi chức năng 12
2.3 Phân tích thiết kế hệ thống 12
2.4 Biểu đồ use case 15
2.4.1 Biểu đồ Use – case tổng quát 15
2.4.2 Use case đăng nhập 15
2.4.3 Use case quản lý danh mục 16
Trang 62.4.4 Use case quản lý kho 17
2.4.5 Use case quản lý người dùng 18
2.4.6 Use case quản lý đơn hàng 19
2.4.7 Use case quản lý admin 20
2.4.8 Use case quản lý doanh thu 21
2.4.9 Use case quản lý trang cá nhân 21
2.4.10 Use case chức năng của khách hàng 22
2.5 Biểu đồ tuần tự 24
2.5.1 Biểu đồ tuần tự chức năng đăng nhập 24
2.5.2 Biểu đồ tuần tự quản lý danh mục sản phẩm 25
2.5.3 Biểu đồ tuần tự quản lý sản phẩm 26
2.5.4 Biểu đồ tuần tự quản lý mặt hàng bán chạy 27
2.5.5 Biểu đồ tuần tự quản lý đơn hàng 27
2.5.6 Biểu đồ tuần tự quản lý mặt hàng sắp hết 28
2.5.7 Biểu đồ tuần tự quản lý chế độ bảo hành 29
2.5.8 Biểu đồ tuần tự quản lý đơn vị tính 30
2.5.9 Biểu đồ tuần tự quản lý nội dung khuyến mãi 31
2.5.10 Biểu đồ tuần tự quản lý admin 32
2.5.11 Biểu đồ tuần tự cấu hình chung Website 33
2.5.12 Biểu đồ tuần tự quản lý hàng tồn 33
2.5.13 Biểu đồ tuần tự nạp card 34
2.5.14 Biểu đồ tuần tự đổi mã giảm giá 34
2.5.15 Biểu đồ tuần tự xem lịch sử giao dịch 34
2.6 Biểu đồ lớp 35
2.6.1 Danh sách các đối tượng 35
2.6.2 Mô hình hóa các lớp đối tượng 36
2.7 Thiết kế cơ sở dữ liệu 36
2.7.1 Danh sách các bảng 36
2.7.2 Bảng Admin 37
2.7.3 Bảng Category 37
2.7.4 Bảng Rating 37
Trang 72.7.5 Bảng contact 38
2.7.6 Bảng Orders 38
2.7.7 Bảng product 38
2.7.8 Bảng Transaction 39
2.7.9 Bảng Users 39
2.7.10 Bảng Units 40
2.7.11 Bảng Promotions 40
2.7.12 Bảng Code 40
2.7.13 Bảng Card 40
2.7.14 Bảng Guarantee 40
2.7.15 Bảng Listimage 41
2.7.16 Bảng Setting_email 41
2.7.17 Bảng Slide 41
2.8 Mô hình cơ sở dữ liệu – mô hình quan hệ mua hàng 42
2.8.1 Mô hình cơ sở dữ liệu 42
2.8.2 Sơ đồ quan hệ mua hàng 43
2.9 Kết quả thực hiện (giao diện) và cài đặt, thử nghiệm 43
2.9.1 Giao diện trang quản trị 43
2.9.2 Giao diện đăng nhập hệ thống của admin 44
2.9.3 Giao diện danh mục sản phẩm 44
2.9.4 Giao diện chế độ bảo hành 45
2.9.5 Giao diện nội dung khuyến mãi 45
2.9.6 Giao diện đơn vị tính 46
2.9.7 Giao diện danh sách sản phẩm 46
2.9.8 Giao diện danh sách các đơn hàng 47
2.9.9 Giao diện danh sách các đơn hàng chưa thanh toán 47
2.9.10 Giao diện danh sách đơn hàng đã thanh toán 48
2.9.11 Giao diện danh sách hàng tồn 48
2.9.12 Giao diện danh sách mặt hàng bán chạy 49
2.9.13 Giao diện mặt hàng sắp hết 49
2.9.14 Giao diện danh sách thành viên 50
Trang 82.9.15 Giao diện trang cá nhân của admin 50
2.9.16 Giao diện quản lý doanh thu 51
2.9.17 Giao diện danh sách admin 51
2.9.18 Giao diện trang chủ website 52
2.9.19 Giao diện danh sách sản phẩm trên website 53
2.9.20 Giao diện liên hệ 54
2.9.21 Giao diện giới thiệu 54
2.9.22 Giao diện chi tiết sản phẩm 55
2.9.23 Giao diện đăng ký tài khoản 55
2.9.24 Giao diện đăng nhập hệ thống của khách hàng 56
2.9.25 Giao diện giỏ hàng 56
2.9.26 Giao diện thanh toán 57
2.9.27 Giao diện thông tin tài khoản khách hàng 58
2.9.28 Giao diện lịch sử giao dịch 58
2.9.29 Giao diện nạp card 59
2.9.30 Giao diện đổi mã giảm giá 59
2.9.31 Cài đặt và thử nghiệm 60
2.10 Đánh giá 60
KẾT LUẬN 61
TÀI LIỆU THAM KHẢO 62
PHỤ LỤC 63
Trang 9DANH MỤC HÌNH VẼ
Bảng 2.1: Các yêu cầu chức năng của ứng dụng 12
Bảng 2.2: Bảng chức năng của Admin 12
Bảng 2.3: Bảng chức năng của khách hàng 13
Hình 2.1: Biểu đồ Use case tổng quát 15
Hình 2.2: Biểu đồ Use case đăng nhập 15
Hình 2.3: Biểu đồ Use case quản lý danh mục 16
Hình 2.4: Biểu đồ Use case quản lý kho 17
Hình 2.5: Biểu đồ Use case quản lý người dùng 18
Hình 2.6: Biểu đồ use case quản lý đơn hàng 19
Hình 2.7: Biểu đồ use case quản lý admin 20
Hình 2.8: Biểu đồ use case quản lý doanh thu 21
Hình 2.9: Biểu đồ use case quản lý trang cá nhân 21
Hình 2.10: Biểu đồ use case chức năng của khách hàng 22
Hình 2.11: Biều đồ tuần tự chức năng đăng nhập 24
Hình 2.12: Biều đồ tuần tự quản lý danh mục sản phẩm 25
Hình 2.13: Biều đồ tuần tự quản lý sản phẩm 26
Hình 2.14: Biều đồ tuần tự quản lý mặt hàng bán chạy 27
Hình 2.15: Biều đồ tuần tự quản lý đơn hàng 27
Hình 2.16: Biều đồ tuần tự quản lý mặt hàng sắp hết 28
Hình 2.17: Biều đồ tuần tự quản lý chế độ bảo hành 29
Hình 2.18: Biểu đồ tuần tự quản lý đơn vị tính 30
Hình 2.19: Biều đồ tuần tự quản lý nội dung khuyến mãi 31
Hình 2.20: Biều đồ tuần tự quản lý admin 32
Hình 2.21: Biểu đồ tuần tự cấu hình chung Website 33
Trang 10Hình 2.22: Biểu đồ tuần tự quản lý hàng tồn 33
Hình 2.23: Biểu đồ tuần tự nạp card 34
Hình 2.24: Biểu đồ tuần tự đổi mã giảm giá 34
Hình 2.25: Biểu đồ tuần tự xem lịch sử giao dịch 34
Bảng 2.4: Danh sách các đối tượng 35
Hình 2.26: Biểu đồ lớp của Website 36
Bảng 2.5: Danh sách các bảng cơ sở dữ liệu 36
Bảng 2.6: Bảng Admin 37
Bảng 2.7: Bảng Category 37
Bảng 2.8: Bảng Rating 37
Bảng 2.9: Bảng Contact 38
Bảng 2.10: Bảng Orders 38
Bảng 2.11: Bảng product 38
Bảng 2.12: Bảng Transaction 39
Bảng 2.13: Bảng Users 39
Bảng 2.14: Bảng Units 40
Bảng 2.15: Bảng Promotions 40
Bảng 2.16: Bảng Code 40
Bảng 2.17: Bảng Card 40
Bảng 2.18: Bảng Guarantee 40
Bảng 2.19: Bảng Listimage 41
Bảng 2.20: Bảng Setting_email 41
Bảng 2.21: Bảng Slide 41
Hình 2.27: Mô hình cơ sở dữ liệu 42
Trang 11Hình 2.28: Sơ đồ quan hệ mua hàng 43
Hình 2.29: Giao diện trang quản trị 43
Hình 2.30: Giao diện đăng nhập hệ thống của admin 44
Hình 2.31: Giao diện danh mục sản phẩm 44
Hình 2.32: Giao diện chế độ bảo hành 45
Hình 2.33: Giao diện nội dung khuyến mãi 45
Hình 2.34: Giao diện đơn vị tính 46
Hình 2.35: Giao diện danh sách sản phẩm 46
Hình 2.36: Giao diện danh sách đơn hàng 47
Hình 2.37: Giao diện danh sách các đơn hàng chưa thanh toán 47
Hình 2.38: Giao diện danh sách đơn hàng đã thanh toán 48
Hình 2.39: Giao diện danh sách hàng tồn 48
Hình 2.40: Giao diện danh sách mặt hàng bán chạy 49
Hình 2.41: Giao diện mặt hàng sắp hết 49
Hình 2.42: Giao diện danh sách thành viên 50
Hình 2.43: Giao diện trang cá nhân của admin 50
Hình 2.44: Giao diện quản lý doanh thu 51
Hình 2.45: Giao diện danh sách admin 51
Hình 2.46: Giao diện trang chủ website 52
Hình 2.47: Giao diện danh sách sản phẩm trên website 53
Hình 2.48: Giao diện liên hệ 54
Hình 2.49: Giao diện giới thiệu 54
Hình 2.50: Giao diện chi tiết sản phẩm 55
Hình 2.51: Giao diện đăng ký tài khoản 55
Trang 12Hình 2.52: Giao diện đăng nhập hệ thống của khách hàng 56
Hình 2.53: Giao diện giỏ hàng 56
Hình 2.54: Giao diện thanh toán 57
Hình 2.55: Giao diện thông tin tài khoản khách hàng 58
Hình 2.56: Giao diện lịch sử giao dịch 58
Hình 2.57: Giao diện nạp card 59
Hình 2.58: Giao diện đổi mã giảm giá 59
Trang 13DANH MỤC BẢNG BIỂU
Bảng 2.1: Các yêu cầu chức năng của ứng dụng 12
Bảng 2.2: Bảng chức năng của Admin 12
Bảng 2.3: Bảng chức năng của khách hàng 13
Hình 2.1: Biểu đồ Use case tổng quát 15
Hình 2.2: Biểu đồ Use case đăng nhập 15
Hình 2.3: Biểu đồ Use case quản lý danh mục 16
Hình 2.4: Biểu đồ Use case quản lý kho 17
Hình 2.5: Biểu đồ Use case quản lý người dùng 18
Hình 2.6: Biểu đồ use case quản lý đơn hàng 19
Hình 2.7: Biểu đồ use case quản lý admin 20
Hình 2.8: Biểu đồ use case quản lý doanh thu 21
Hình 2.9: Biểu đồ use case quản lý trang cá nhân 21
Hình 2.10: Biểu đồ use case chức năng của khách hàng 22
Hình 2.11: Biều đồ tuần tự chức năng đăng nhập 24
Hình 2.12: Biều đồ tuần tự quản lý danh mục sản phẩm 25
Hình 2.13: Biều đồ tuần tự quản lý sản phẩm 26
Hình 2.14: Biều đồ tuần tự quản lý mặt hàng bán chạy 27
Hình 2.15: Biều đồ tuần tự quản lý đơn hàng 27
Hình 2.16: Biều đồ tuần tự quản lý mặt hàng sắp hết 28
Hình 2.17: Biều đồ tuần tự quản lý chế độ bảo hành 29
Hình 2.18: Biểu đồ tuần tự quản lý đơn vị tính 30
Hình 2.19: Biều đồ tuần tự quản lý nội dung khuyến mãi 31
Hình 2.20: Biều đồ tuần tự quản lý admin 32
Hình 2.21: Biểu đồ tuần tự cấu hình chung Website 33
Trang 14Hình 2.22: Biểu đồ tuần tự quản lý hàng tồn 33
Hình 2.23: Biểu đồ tuần tự nạp card 34
Hình 2.24: Biểu đồ tuần tự đổi mã giảm giá 34
Hình 2.25: Biểu đồ tuần tự xem lịch sử giao dịch 34
Bảng 2.4: Danh sách các đối tượng 35
Hình 2.26: Biểu đồ lớp của Website 36
Bảng 2.5: Danh sách các bảng cơ sở dữ liệu 36
Bảng 2.6: Bảng Admin 37
Bảng 2.7: Bảng Category 37
Bảng 2.8: Bảng Rating 37
Bảng 2.9: Bảng Contact 38
Bảng 2.10: Bảng Orders 38
Bảng 2.11: Bảng product 38
Bảng 2.12: Bảng Transaction 39
Bảng 2.13: Bảng Users 39
Bảng 2.14: Bảng Units 40
Bảng 2.15: Bảng Promotions 40
Bảng 2.16: Bảng Code 40
Bảng 2.17: Bảng Card 40
Bảng 2.18: Bảng Guarantee 40
Bảng 2.19: Bảng Listimage 41
Bảng 2.20: Bảng Setting_email 41
Bảng 2.21: Bảng Slide 41
Hình 2.27: Mô hình cơ sở dữ liệu 42
Trang 15Hình 2.28: Sơ đồ quan hệ mua hàng 43
Hình 2.29: Giao diện trang quản trị 43
Hình 2.30: Giao diện đăng nhập hệ thống của admin 44
Hình 2.31: Giao diện danh mục sản phẩm 44
Hình 2.32: Giao diện chế độ bảo hành 45
Hình 2.33: Giao diện nội dung khuyến mãi 45
Hình 2.34: Giao diện đơn vị tính 46
Hình 2.35: Giao diện danh sách sản phẩm 46
Hình 2.36: Giao diện danh sách đơn hàng 47
Hình 2.37: Giao diện danh sách các đơn hàng chưa thanh toán 47
Hình 2.38: Giao diện danh sách đơn hàng đã thanh toán 48
Hình 2.39: Giao diện danh sách hàng tồn 48
Hình 2.40: Giao diện danh sách mặt hàng bán chạy 49
Hình 2.41: Giao diện mặt hàng sắp hết 49
Hình 2.42: Giao diện danh sách thành viên 50
Hình 2.43: Giao diện trang cá nhân của admin 50
Hình 2.44: Giao diện quản lý doanh thu 51
Hình 2.45: Giao diện danh sách admin 51
Hình 2.46: Giao diện trang chủ website 52
Hình 2.47: Giao diện danh sách sản phẩm trên website 53
Hình 2.48: Giao diện liên hệ 54
Hình 2.49: Giao diện giới thiệu 54
Hình 2.50: Giao diện chi tiết sản phẩm 55
Hình 2.51: Giao diện đăng ký tài khoản 55
Trang 16Hình 2.52: Giao diện đăng nhập hệ thống của khách hàng 56
Hình 2.53: Giao diện giỏ hàng 56
Hình 2.54: Giao diện thanh toán 57
Hình 2.55: Giao diện thông tin tài khoản khách hàng 58
Hình 2.56: Giao diện lịch sử giao dịch 58
Hình 2.57: Giao diện nạp card 59
Hình 2.58: Giao diện đổi mã giảm giá 59
Trang 17DANH MỤC TỪ VIẾT TẮT VÀ THUẬT NGỮ
N/A
Trang 18MỞ ĐẦU
Hiện nay, công nghệ thông tin phát triển mạnh mẽ và được ứng dụng ngàycàng nhiều vào các lĩnh vực kinh tế, sản xuất cũng như đời sống của con người Cóthể thấy công nghệ thông tin được ứng dụng vào hầu khắp các hoạt động Nhờ đó,các công việc được thực hiện thuận tiện, nhanh, chính xác và đạt kết quả cao
Đối với các nhà quản lý và nhà kinh doanh thì việc tìm ra các phương pháp đểđưa sản phẩm của mình đến với người tiêu dùng một cách nhanh chóng là rất cầnthiết Để quảng bá sản phẩm, nhiều nhà kinh doanh của các công ty lớn đã có chiếnlược quảng cáo trên các phương tiện thông tin đại chúng như báo, radio, truyềnhình, trong đó quảng bá sản phẩm trên website là một trong những giải pháp hữuhiệu nhất Đây là hình thức truyền tải thông tin nhanh chóng, hiệu quả nhưng chiphí thấp Cùng với sự phát triển của mạng Internet thì việc tiếp cận để tìm hiểu vàtrực tiếp mua bán trên website trực tuyến trở nên dễ dàng hơn bao giờ hết Khôngmất nhiều thời gian mà khách hàng đã có thể mua được sản phẩm mong muốn tốtnhất chỉ bằng việc nhấp chuột Chính vì thế, khách hàng có thể mua bán ở mọi nơi,vào bất kỳ thời gian nào và rất phù hợp với cuộc sống ngày càng bận rộn như ngàynay
Cùng với đó, thực tế là nhu cầu mua sắm của người dân ngày càng tăng, đặc
biệt là các thiết bị điện tử như điện thoại di động, máy tính bảng, Chính vì thế,một website về quản lý và bán đồ điện tử sẽ đáp ứng được tối đa nhu cầu của người
sử dụng Hơn nữa, website cũng sẽ cung cấp thông tin một cách đầy đủ, kịp thời bởichỉ một vài thao tác click chuột chúng ta đã có thể tìm được sản phẩm phù hợp vớimình, từ giá cả đến kiểu dáng, tính năng phù hợp với mọi tầng lớp người sử dụng.Thỏa mãn nhu cầu của người sử dụng và nhanh chóng là thành công mà websitemang đến
Phần mềm quản lý và bán hàng online không chỉ giúp các đối tượng kinhdoanh giới thiệu, quảng bá sản phẩm rộng rãi tới người tiêu dùng mà còn hỗ trợviệc mua bán qua mạng một cách nhanh chóng, hiệu quả, đáp ứng nhu cầu thiếtthực của người tiêu dùng hiện nay
Bên cạnh đó, phần mềm này còn cho phép người dùng xem, tìm kiếm thôngtin, đặt mua sản phẩm được quảng bá trên website khi có nhu cầu
Từ những lý do trên, em quyết định chọn đề tài “Xây dựng Website bán đồ điện tử” Việc xây dựng website sẽ giúp cho công việc kinh doanh trở nên thuận
lợi và dễ dàng hơn, đáp ứng được nhu cầu làm việc mọi lúc, mọi nơi, đồng thời thỏamãn nhu cầu xem thông tin, mua bán online…của mọi đối tượng khách hàng
Hệ thống website được xây dựng dựa trên các mục tiêu chính:
- Hệ thống hiển thị thông tin sản phẩm theo từng loại, danh mục sản phẩm
- Cung cấp tính năng đặt hàng, thanh toán, tìm kiếm thông tin sản phẩm, bàiviết cho khách hàng
Trang 19- Cho phép khách hàng đăng ký, đăng nhập hệ thống, gửi thông tin liên hệ, bìnhluận sản phẩm.
- Quản trị hệ thống có thể quản lý các sản phẩm, danh mục sản phẩm, bài viết,đơn hàng, doanh thu, cập nhật thông tin cá nhân, quản lý hàng tồn kho, quản
lý thông tin khách hàng và admin trong hệ thống
Nội dung đề tài gồm các phần:
Phần 1: Đặt vấn đề và định hướng giải pháp
Phần 2: Các kết quả đạt được
Trang 20- Quản lý tài khoản admin
- Quản lý doanh thu
- Quản lý các chương trình khuyến mãi, chế độ bảo hành, đơn vị tính
- Hiển thị các sản phẩm kinh doanh trên website, các bài giới thiệu
- Cho phép khách hàng đăng ký, đăng nhập hệ thống
- Cho phép khách hàng tìm kiếm bài viết, sản phẩm, đặt hàng và thanh toán, gửithông tin liên hệ, bình luận sản phẩm, đánh giá sản phẩm
- Chức năng nạp card và đổi mã khuyến mãi để thanh toán
1.2 Định hướng giải quyết
- Nghiên cứu lý thuyết về các ngôn ngữ lập trình như PHP, HTML, CSS, các thư viện hỗ trợ, cơ sở dữ liệu MySQL
- Tìm hiểu quy trình nghiệp vụ của website bán hàng online
- Phân tích thiết kế và xây dựng hệ thống dựa trên quy trình và cơ sở kiến thức
đã tìm hiểu
1.3 Tóm tắt cơ sở lý thuyết và công cụ sử dụng
1.3.1 Ngôn ngữ HTML
Giới thiệu chung:
HTML là chữ viết tắt của cụm từ HyperText Markup Language (dịch là Ngôn
ngữ đánh dấu siêu văn bản) được sử dụng để tạo một trang web, trên một website cóthể sẽ chứa nhiều trang và mỗi trang được quy ra là một tài liệu HTML Cha đẻ củaHTML là Tim Berners-Lee, cũng là người khai sinh ra World Wide Web và chủ tịchcủa World Wide Web Consortium (W3C – tổ chức thiết lập ra các chuẩn trên môitrường Internet)
Một tài liệu HTML được hình thành bởi các phần tử HTML (HTML Elements)được quy định bằng các cặp thẻ (tag), các cặp thẻ này được bao bọc bởi một dấungoặc ngọn (ví dụ <html>) và thường là sẽ được khai báo thành một cặp, bao gồmthẻ mở và thẻ đóng (ví <strong> dụ </strong> và ) Các văn bản muốn được đánhdấu bằng HTML sẽ được khai báo bên trong cặp thẻ (ví dụ <strong>Đây là chữ inđậm</strong>) Nhưng một số thẻ đặc biệt lại không có thẻ đóng và dữ liệu đượckhai báo sẽ nằm trong các thuộc tính (ví dụ như thẻ <img>)
Trang 21Một tập tin HTML sẽ bao gồm các phần tử HTML và được lưu lại dưới đuôi
mở rộng là html hoặc htm.
Khi một tập tin HTML được hình thành, việc xử lý nó sẽ do trình duyệt webđảm nhận Trình duyệt sẽ đóng vai trò đọc hiểu nội dung HTML từ các thẻ bêntrong và sẽ chuyển sang dạng văn bản đã được đánh dấu để đọc, nghe hoặc hiểu (docác bot máy tính hiểu)
Cấu trúc một đoạn HTML
HTML sẽ được khai báo bằng các phần tử bởi các từ khóa Nội dung nằm bêntrong cặp từ khóa sẽ là nội dung mà cần định dạng với HTML
Ví dụ: <p>Đây là một đoạn văn bản trong HTML.</p>
Ngoài ra, trong các thẻ còn có các thuộc tính, thuộc tính sẽ đặt bên trong thẻ
mở đầu, mỗi thuộc tính sẽ có giá trị được đặt trong dấu ngoặc kép và cách nhau bởidấu bằng (=) với tên thuộc tính
Ví dụ: <form action="https://google.com"> </form>
Vai trò của HTML
HTML là một ngôn ngữ đánh dấu siêu văn bản nên nó sẽ có vai trò xây dựngcấu trúc siêu văn bản trên một website, hoặc khai báo các tập tin kỹ thuật số (media)như hình ảnh, video, nhạc Tuy nhiên, không có nghĩa là chỉ sử dụng HTML để tạo
ra một website mà HTML chỉ đóng một vai trò hình thành trên website
Ưu điểm của HTML:
- Tương thích với mọi hệ điều hành cùng các trình duyệt của nó
- Khả năng dễ học, dễ viết
- Việc soạn thảo đòi hỏi hết sức đơn giản, có thể dùng word, notepad hay bất cứmột trình soạn thảo văn bản nào để viết và chỉ cần lưu với định dạng “.html “hoặc “.htm” là đã có thể tạo ra một file chứa HTML
- Cho phép nhúng thêm các đối tượng hình ảnh, âm thanh, các ngôn ngữ kịchbản như Javascript để tạo hiệu ứng động cho trang web
- Cho phép sử dụng kết hợp với CSS để trình bày trang web hiệu quả hơn.Phiên bản mới nhất của HTML hiện nay là HTML5 với nhiều tính năng ưuviệt so với các phiên bản cũ HTML:
- HTML5 hỗ trợ mạnh mẽ các phần tử multimedia mà không cần các plugin
- HTML5 nói chung mạnh mẽ hơn nhiều không chỉ về tốc độ và độ thích ứngcao mà chính là khả năng hỗ trợ API (Application Programming Interface -giao diện lập trình ứng dụng) và DOM (Document Object Model – các đốitượng thao tác văn bản)
1.3.2 Ngôn ngữ CSS
CSS là chữ viết tắt của Cascading Style Sheets, là một ngôn ngữ được sử dụng
để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví dụ
như HTML).Có thể hiểu đơn giản nếu HTML đóng vai trò định dạng các phần tử
Trang 22trên website như việc tạo ra các đoạn văn bản, các tiêu đề, bảng,…thì CSS sẽ giúpchúng ta có thể thêm một chút “phong cách” vào các phần tử HTML đó như đổimàu sắc trang, đổi màu chữ, thay đổi cấu trúc,…rất nhiều
Phương thức hoạt động của CSS là nó sẽ tìm dựa vào các vùng chọn, vùngchọn có thể là tên một thẻ HTML, tên một ID, class hay nhiều kiểu khác Sau đó làCSS sẽ áp dụng các thuộc tính cần thay đổi lên vùng chọn đó
Tác dụng của CSS:
- Hạn chế tối thiểu việc làm rối mã HTML của trang Web bằng các thẻ quy địnhkiểu dáng (chữ đậm, chữ in nghiêng, chữ có gạch chân, chữ màu), khiến mãnguồn của trang Web được gọn gàng hơn, tách nội dung của trang Web vàđịnh dạng hiển thị, dễ dàng cho việc cập nhật nội dung
- Tạo ra các kiểu dáng có thể áp dụng cho nhiều trang Web, giúp tránh phải lặplại việc định dạng cho các trang Web giống nhau
1.3.3 Ngôn ngữ lập trình PHP
PHP - viết tắt hồi quy của "Hypertext Preprocessor", là một ngôn ngữ lập trìnhkịch bản được chạy ở phía server nhằm sinh ra mã html trên client PHP đã trải quarất nhiều phiên bản và được tối ưu hóa cho các ứng dụng web, với cách viết mã rõrãng, tốc độ nhanh, dễ học nên PHP đã trở thành một ngôn ngữ lập trình web rấtphổ biến và được ưa chuộng
PHP chạy trên môi trường Webserver và lưu trữ dữ liệu thông qua hệ quản trị
cơ sở dữ liệu nên PHP thường đi kèm với Apache, MySQL và hệ điều hành Linux(LAMP)
- Apache là một phần mềm web server có nhiệm vụ tiếp nhận request từ trìnhduyệt người dùng sau đó chuyển giao cho PHP xử lý và gửi trả lại cho trìnhduyệt
- MySQL cũng tương tự như các hệ quản trị cơ sở dữ liệu khác (Postgress,Oracle, SQL server ) đóng vai trò là nơi lưu trữ và truy vấn dữ liệu
Trang 23- Linux: Hệ điều hành mã nguồn mở được sử dụng rất rộng rãi cho cácwebserver Thông thường các phiên bản được sử dụng nhiều nhất là RedHatEnterprise Linux, Ubuntu
Phương thức hoạt động của PHP: Khi người sử dụng gọi trang PHP, WebServer sẽ triệu gọi PHP Engine để thông dịch dịch trang PHP và trả kết quả chongười dùng
1.3.4 Thư viện hỗ trợ
Thư viện JavaScript
JavaScript là một ngôn ngữ lập trình đa nền tảng (cross-platform), ngôn ngữ
lập trình kịch bản, hướng đối tượng JavaScript là một ngôn ngữ nhỏ và nhẹ (smalland lightweight) Khi nằm bên trong một môi trường (host environment), JavaScript
có thể kết nối tới các object của môi trường đó và cung cấp các cách quản lý chúng(object)
JavaScript chứa các thư viện tiêu chuẩn cho các object, ví dụ như: Array, Date,
và Math, và các yếu tố cốt lõi của ngôn ngữ lập trình như: toán tử (operators), cấutrúc điều khiển (control structures), và câu lệnh JavaScript có thể được mở rộng chonhiều mục đích bằng việc bổ sung thêm các object; ví dụ:
- Client-side JavaScript - JavaScript phía máy khách, JavaScript được mở rộng
bằng cách cung cấp các object để quản lý trình duyệt và Document ObjectModel (DOM) của nó Ví dụ, phần mở rộng phía máy khách cho phép một ứngdụng tác động tới các yếu tố trên một trang HTML và phản hồi giống các tácđộng của người dùng như click chuột, nhập form, và chuyển trang
- Server-side JavaScript - JavaScript phía Server, JavaScript được mở rộng bằng
cách cung cấp thêm các đối tượng cần thiết để để chạy JavaScript trên máychủ Ví dụ, phần mở rộng phía server này cho phép ứng dụng kết nối với cơ sở
dữ liệu (database), cung cấp thông tin một cách liên tục từ một yêu cầu tới phầnkhác của ứng dụng, hoặc thực hiện thao tác với các tập tin trên máy chủ
JavaScript và tiêu chuẩn ECMAScriptSection:
JavaScript được tiêu chuẩn hóa tại Ecma International — the Europeanassociation for standardizing information and communication systems, Liên kếtChâu Âu cho các tiêu chuẩn hóa hệ thống thông tin và truyền thông (ECMA trướcđây là viết tắt cho the European Computer Manufacturers Association) cung cấp mộttiêu chuẩn hóa, nền tảng ngôn ngữ lập trình mở quốc tế lên JavaScript Phiên bản đãtiêu chuẩn hóa của JavaScript được gọi là ECMAScript, làm việc giống với cái cách
mà tất cả ứng dụng đã được hỗ trợ theo tiêu chuẩn Các công ty có thể sử dụng tiêuchuẩn ngôn ngữ mở (open standard language) để phát triển các implementation củaJavaScript riêng cho họ Tiêu chuẩn ECMAScript là tài liệu nằm trong tiêu chuẩnECMA-262 (ECMA-262 specification) Xem New in JavaScript để biết thêm về sự
Trang 24khác nhau giữa các phiên bản JavaScript cũng như sự khác nhau của phiên bản tiêuchuẩn ECMAScript (ECMAScript specification editions).
Tiêu chuẩn ECMA-262 cũng đã được phê duyệt bởi ISO (InternationalOrganization for Standardization) tại ISO-16262 Bạn cũng có thể tìm tiêu chuẩntrên the Ecma International website Tiêu chuẩn ECMAScript không bao gồm các
mô tả cho Document Object Model (DOM), nó được tiêu chuẩn hóa bởi World WideWeb Consortium (W3C) DOM định nghĩa cách mà các đối tượng trong HTML tiếpxúc với các đoạn script của bạn Để có được một cảm nhận tốt hơn về các côngnghệ khác nhau được sử dụng khi lập trình với JavaScript, hãy tham khảo bàiviết tổng quan về công nghệ JavaScript
Thư viện Ajax
Khác với các phần mềm chạy độc lập ở máy khách (có khả năng tương tác gầnnhư tức thời với người dùng), các ứng dụng Web bị giới hạn bởi chính nguyên lýhoạt động của nó: tất cả các giao dịch phải thực hiện thông qua phương thức giaodịch HTTP (HyperText Transport Protocol - Giao thức truyền tải qua các siêu liênkết) trong một mô hình có tên Client/Server Bất kỳ một tác động nào của ngườidùng lên ứng dụng Web thông qua trình duyệt đều cần thời gian gửi về Server vàsau khi xử lý, Server sẽ trả về những thông tin người dùng mong đợi Như vậy, độtrễ trong trường hợp này chính là điều mà các ứng dụng Web khó có thể sánh vớinhư các phần mềm chạy trên máy tính đơn lẻ (đặc biệt là trong các ứng dụng nhưBản đồ trực tuyến, soạn thảo văn bản trực tuyến, sát hạch trực tuyến có tính thờigian làm bài…)
Thuật ngữ AJAX được xuất hiện vào ngày 18/2/2005 trong một bài báo có tênAJAX : A New Approach to Web Applications của tác giả Jesse James Garrett, công
ty AdapativePath Ông định nghĩa và tóm gọn lại từ cụm từ “AsynchronousJavaScript+CSS+DOM+XMLHttpRequest” Ngay sau đó thuật ngữ AJAX đượcphổ biến cực kỳ nhanh chóng trong cộng đồng phát triển Web và cho đến nay nó làmột trong những từ khóa được tìm kiếm nhiều nhất trên Internet
Nội dung định nghĩa của Garrett về AJAX như sau:
- AJAX không phải là một công nghệ Nó là tập hợp của nhiều công nghệ vớithế mạnh của riêng mình để tạo thành một sức mạnh mới AJAX bao gồm:
- Thể hiện Web theo tiêu chuẩn XHTML và CSS;
- Nâng cao tính năng động và tương tác bằng DOM (Document Object Model);
- Trao đổi và xử lý dữ liệu bằng XML và XSLT;
- Truy cập dữ liệu theo kiểu bất đồng bộ (asynchronous) bằngXMLHttpRequest;
- Và tất cả các kỹ thuật trên được liên kết lại với nhau bằng JavaScript
Cấu trúc và cách hoạt động:
Trang 25Trong các thành phần cấu thành trên, điểm mấu chốt của AJAX nằm ởXMLHttpRequest Đây là một kỹ thuật do Microsoft khởi xướng và tích hợp lầnđầu tiên vào IE5 dưới dạng một ActiveX Mozilla tích hợp công nghệ này vàoMozilla 1.0/Netscape 6 sau đó (đương nhiên toàn bộ các version sau này củaFirefox đều có XMLHttpRequest) và hiện nay đã có trong trình duyệt Safari 1.2(Apple) và Opera 7 trở lên Sau đây là một số nét khác biệt cơ bản giữa các ứngdụng Web truyền thống và ứng dụng Web sử dụng AJAX:
- Trong các ứng dụng Web truyền thống, khi người dùng có một cần thay đổi dữliệu trên trang Web, yêu cầu thay đổi được gửi về server dưới dạng HTTPrequest (hay còn gọi postback), server sẽ xử lý yêu cầu này và gửi trả lại trangHTML khác thay thế trang cũ Qui trình này được mô tả là nhấp-chờ và tải lại(click-wait-and-refresh): ví dụ người dùng sau khi nhấn một nút “Submit” trêntrang Web phải chờ cho đến khi server xử lý xong mới có thể tiếp tục côngviệc
- Ngược lại, trong các ứng dụng AJAX, người dùng có thể nhấn chuột, gõ phímliên tục mà không cần chờ đợi Nội dung tương ứng với từng hành động củangười dùng sẽ gần như ngay lập tức được hiển thị vào vị trí cần thiết (đáp ứnggần như tức thời) trong khi trang Web không cần phải refresh lại toàn bộ nộidụng
Thư viện BOOTSTRAP
Bootstrap là một framework cho phép thiết kế website reponsive nhanh hơn và
dễ dàng hơn
Bootstrap là bao gồm các HTML templates, CSS templates và Javascript tao ranhững cái cơ bản có sẵn như: typography, forms, buttons, tables, navigation,modals, image carousels và nhiều thứ khác Trong bootstrap có thêm các pluginJavascript trong nó Giúp cho việc thiết kế reponsive của bạn dễ dàng hơn và nhanhchóng hơn
Lịch sử Bootstrap: Bootstrap là được phát triển bởi Mark Otto và JacobThornton tại Twitter, được xuất bản như là một mã nguồn mở vào tháng 8 năm 2011trên GitHub
Những điểm thuận lợi khi bản sử dụng bootstrap:
- Rất dễ để sử dụng bởi được base trên HTML, CSS và Javascript chỉ cẩn cókiến thức cơ bản về HTML, CSS và Javascript là có thể sử dụng bootstrap tốt
- Tính năng Responsive: Bootstrap’s xây dựng sẵn reponsive css trên các thiết
bị phones, tablets, và desktops
- Mobile: Trong Bootstrap 3 mobile-first styles là một phần của coreframework
- Tương thích với trình duyệt: tương thích với tất cả các trình duyệt (Chrome,Firefox, Internet Explorer, Safari, and Opera)
Trang 26 Thư viện JQUERY
JQuery là một thư viện JavaScript gọn nhẹ, giúp các lập trình viên "Write less,
do more" (viết ít, được nhiều!)
Mục đích của jQuery là làm cho việc sử dụng JavaScript trên trang web dễdàng hơn
JQuery có rất nhiều tác vụ yêu cầu nhiều dòng code JavaScript để thực hiện,chúng được gói gọn thành các phương thức mà chúng ta có thể gọi các phương thức
đó ra bằng một dòng lệnh đơn giản
JQuery cũng đơn giản hoá rất nhiều thứ phức tạp từ JavaScript, nhưgọi AJAX và thao tác DOM:
Thư viện jQuery chứa các tính năng sau:
- Thao tác với HTML/DOM
1.3.5 Cơ sở dữ liệu MySQL
MySQL là hệ quản trị cơ sở dữ liệu tự do nguồn mở phổ biến nhất thế giới vàđược các nhà phát triển rất ưa chuộng trong quá trình phát triển ứng dụng VìMySQL là cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng, có tính khả chuyển, hoạtđộng trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh.Với tốc độ và tính bảo mật cao, MySQL rất thích hợp cho các ứng dụng có truy cậpCSDL trên internet MySQL miễn phí hoàn toàn cho nên có thể tải về MySQL từtrang chủ Nó có nhiều phiên bản cho các hệ điều hành khác nhau: phiên bản Win32cho các hệ điều hành dòng Windows, Linux, Mac OS
X, Unix, FreeBSD, NetBSD, Novell NetWare, SGI Irix, Solaris, SunOS,…
MySQL là một trong những ví dụ rất cơ bản về Hệ Quản trị Cơ sở dữ liệuquan hệ sử dụng Ngôn ngữ truy vấn có cấu trúc (SQL)
MySQL được sử dụng cho việc bổ trợ PHP, Perl, và nhiều ngôn ngữ khác, nólàm nơi lưu trữ những thông tin trên các trang web viết bằng PHP hay Perl,…
MySQL có nhiều ưu điểm:
- Tốc độ: MySQL rất nhanh Những nhà phát triển cho rằng MySQL là cơ sở dữliệu nhanh nhất mà chúng ta có thể có
- Dễ sử dụng: MySQL tuy có tính năng cao nhưng thực sự là một hệ thống cơ sở
dữ liệu rất đơn giản và ít phức tạp khi cài đặt và quản trị hơn các hệ thốnglớn
- Giá thành: MySQL là miễn phí cho hầu hết các việc sử dụng trong một tổchức
Trang 27- Hỗ trợ ngôn ngữ truy vấn: MySQL hiểu SQL, là ngôn ngữ của sự chọn lựa chotất cả các hệ thống cơ sở dữ liệu hiện đại Chúng ta cũng có thể truy cậpMySQL bằng cách sử dụng các ứng dụng mà hỗ trợ ODBC (Open DatabaseConnectivity -một giao thức giao tiếp cơ sở dữ liệu được phát triển bởiMicrosoft).
- Năng lực: Nhiều client có thể truy cập đến server trong cùng một thời gian.Các client có thể sử dụng nhiều cơ sở dữ liệu một cách đồng thời Chúng ta cóthể truy cập MySQL tương tác với sử dụng một vài giao diện để có thể đưavào các truy vấn và xem các kết quả: các dòng yêu cầu của khách hàng, cáctrình duyệt Web…
- Kết nối và bảo mật: MySQL được nối mạng một cách đầy đủ, các cơ sở dữliệu có thể được truy cập từ bất kỳ nơi nào trên Internet do đó có thể chia sẽ dữliệu với bất kỳ ai, bất kỳ nơi nào Nhưng MySQL kiểm soát quyền truy cậpcho nên người mà không nên nhìn thấy dữ liệu thì không thể nhìn được
- Tính linh động: MySQL chạy trên nhiều hệ thống UNIX cũng như không phảiUNIX chẳng hạn như Windows hay OS/2 MySQL chạy được các với mọiphần cứng từ các máy PC ở nhà cho đến các máy server
- Sự phân phối rộng: MySQL rất dễ dàng đạt được, chỉ cần sử dụng trình duyệtweb
- Sự hỗ trợ: có thể tìm thấy các tài nguyên có sẵn mà MySQL hỗ trợ Cộng đồngMySQL rất có trách nhiệm Họ trả lời các câu hỏi trên mailing list thường chỉtrong vài phút Khi lỗi được phát hiện, các nhà phát triển sẽ đưa ra cách khắcphục trong vài ngày, thậm chí có khi trong vài giờ và cách khắc phục đó sẽngay lập tức có sẵn trên Internet
1.3.6 Các cộng cụ sử dụng
- Công cụ lập trình: Sublime Text 3
- Cộng cụ hỗ trợ chạy chương trình: Xampp
- Công cụ thiết kế hệ thống: Star UML
PHẦN 2: CÁC KẾT QUẢ ĐẠT ĐƯỢC 2.1 Đặc tả yêu cầu
2.1.1 Backend
Quản trị hệ thống quản lý toàn bộ hoạt động của website bán đồ điện tử:
Trang 28- Thống kê tổng số sản phẩm, tổng số tiền, số lượng đơn hàng, tổng số thànhviên, doanh thu theo ngày, tuần, tháng.
- Quản lý danh mục: quản lý danh mục sản phẩm, chế độ bảo hành, nội dungkhuyến mãi, đơn vị tính, quản lý sản phẩm
+ Quản lý danh mục sản phẩm: Cho phép xem, tìm kiếm, thêm, sửa, xóa danhmục sản phẩm
+ Quản lý chế độ bảo hành: cho phép xem, tìm kiếm, thêm, sửa, xóa chế độbảo hành
+ Quản lý nội dung khuyến mãi: cho phép xem, tìm kiếm, thêm, sửa, xóa nộidung khuyến mãi
+ Quản lý đơn vị tính: cho phép xem, tìm kiếm, thêm, sửa, xóa đơn vị tính.+ Quản lý sản phẩm: cho phép xem, tìm kiếm, thêm, sửa, xóa sản phẩm
+ Quản lý đơn hàng: quản lý danh sách tất cả các đơn hàng, các đơn hàngchưa thanh toán, danh sách đơn hàng đã thanh toán, cho phép tìm kiếm, cậpnhật trạng thái, xóa một đơn hàng
- Quản lý kho: cho phép xem, tìm kiếm hàng tồn, mặt hàng bán chạy, mặt hàngsắp hết
- Quản lý người dùng: quản lý danh sách người dùng đã đăng ký tài khoản trên
hệ thống, quản lý đánh giá của người dùng đối với sản phẩm
+ Quản lý người dùng đã đăng ký tài khoản: cho phép tìm kiếm, xóa tài khoản
đã đăng ký trên hệ thống
+ Quản lý đánh giá của người dùng đối với sản phẩm: cho phép tìm kiếm, xóađánh giá
- Quản lý trang cá nhân: cho phép cập nhật thông tin cá nhân của admin
- Quản lý doanh thu: cho phép xem thông tin doanh thu của cửa hàng, tìm kiếmthông tin doanh thu, xuất file excel hoặc csv hoặc text
- Quản lý cấu hình website: cho phép quản lý thông tin các admin của hệ thống,thêm, sửa, xóa thông tin admin trong hệ thống
2.1.2 Frontend (Giao diện người dùng)
Frontend của website bán đồ điện tử được xây dựng trên các tiêu chí:
- Hình ảnh giao diện thu hút người xem, các thao tác không quá phức tạp, thânthiện với người dùng
- Dung lượng file không quá lớn
- Phải có thông tin liên hệ của cửa hàng để nhanh chóng giải đáp thắc mắc củakhách hàng
- Font chữ đơn giản, dễ nhìn, màu sắc hài hòa
- An toàn và bảo mật dữ liệu
- Website tương thích với các trình duyệt phổ biến
Frontend của website bán đồ điện tử thực hiện các chức năng:
Trang 29- Hiển thị được các sản phẩm bán chạy, sản phẩm nổi bật, các loại sản phẩmtheo từng danh mục sản phẩm, bài giới thiệu về hệ thống.
- Cho phép khách hàng xem thông tin chi tiết của sản phẩm, xem hướng dẫnmua và thanh toán, bình luận sản phẩm, đánh giá sản phẩm
- Cho phép tìm kiếm các sản phẩm mà khách hàng quan tâm
- Cho phép khách hàng đặt mua sản phẩm (phải đăng ký tài khoản mới có thểmua hàng)
- Cho phép khách hàng nạp card và đổi mã khuyến mãi để thuận tiện khi thanhtoán
- Cho phép khách hàng để lại thông tin liên hệ
- Đăng ký hoặc đăng nhập tài khoản
- Cập nhật thông tin cá nhân, xem lịch sửa giao dịch
2.2 Các yêu cầu phi chức năng
Bảng 2.1: Các yêu cầu chức năng của ứng dụng
1 Giao diện Giao diện hệ thống phải dễ sử dụng, trực quan,
thân thiện với mọi người dùng
2 Tốc độ xử lý
Hệ thống phải xử lý nhanh chóng và chính xác.Tốc độ tải trang hợp lý đảm bảo theo hạ tầng,đầu tư triển khai và số lượng người truy cậpđồng thời
4 Tương thích Tương thích với đa phần các trình duyệt web
Khách hàng: có thể thực hiện các chức năng như đăng ký tài khoản, tìm kiếmsản phẩm, xem thông tin chi tiết của sản phẩm, xem hướng dẫn đặt và thanh toán, ýkiến bình luận, đánh giá sản phẩm, xem giới thiệu, đặt hàng, xem giỏ hàng, nạpcard, đổi mã khuyến mãi, cập nhật thông tin tài khoản, xem lịch sử giao dịch, gửithông tin liên hệ
Chức năng Admin
Bảng 2.2: Bảng chức năng của Admin
Trang 30Mục Tên chức năng Mô tả
Admin thực hiện đăng nhập vào hệ thống, nhập vàouser và password Kiểm tra hợp lệ trùng với dữ liệu cósẵn thì hệ thống sẽ cho phép đăng nhập để thực hiện cácchức năng trong hệ thống
2 Quản trị hệ thống Quản lý toàn hộ hệ thống, có quyền thay đổi các thông
tin trong hệ thống
3 Quản lý danh
mục
Quản lý, lưu trữ thông tin về danh mục sản phẩm, chế
độ bảo hành, đơn vị tính, nội dung khuyến mãi, danhsách sản phẩm
4 Quản lý đơn hàng
Quản lý thông tin về các đơn hàng trong hệ thống, quản
lý đơn hàng chưa thanh toán, quản lý đơn hàng đã thanhtoán
5 Quản lý kho
Quản lý thông tin về hàng tồn kho, mặt hàng sắp hết,mặt hàng bán chạy để nhập hàng phù hợp về cho cửahàng
6 Quản lý người
dùng
Quản lý thông tin tài khoản mà khách hàng đăng kýtrên hệ thống, quản lý đánh giá của khách hàng đối vớisản phẩm
7 Quản lý thông tin
cá nhân Cập nhật thông tin cá nhân trên hệ thống
Chức năng của khách hàng
Bảng 2.3: Bảng chức năng của khách hàng
Mục Tên chức năng Mô tả
1 Tạo một tài khoản
3 Tìm kiếm thông
tin
Tìm kiếm, nhanh về thông tin sản phẩm, dựa vào cáctiêu chí tìm kiếm của website như tìm theo tên của sảnphẩm, tiêu đề bài viết…
4 Đặt hàng Khách hàng phải đăng ký tài khoản mới có thể đặt hàng
Trang 31Mục Tên chức năng Mô tả
trên hệ thống Nếu khách hàng không đăng ký sảnphẩm trước khi đặt hàng, hệ thống sẽ hiển thị thôngbáo
Sau khi đăng nhập và chọn mua sản phẩm, giỏ hàng lànơi chứa thông tin về sản phẩm mà khách hàng đã chọnmua như số lượng sản phẩm, tên sản phẩm và giá tiềnsản phẩm đó
6 Thanh toán
Sau khi chọn mua sản phẩm, người dùng tiến hành gửithông tin, chọn hình thức thanh toán để tiến hành đặthàng và lưu lại hóa đơn Khách hàng có thể lấy mãkhuyến mãi trong mục đổi mã khuyến mãi trong thôngtin cá nhân để điền vào thông tin thanh toán, nhận ưuđãi của cửa hàng
7 Liên hệ
Khi khách hàng có thắc mắc về giá sản phẩm, thời gianvận chuyển có thể liên hệ với người quản trị websitequa phần liên hệ
8 Quản lý thông tin
tài khoản
Khách hàng có thể cập nhật thông tin cá nhân, xem lịch
sử giao dịch, nạp card, đổi mã khuyến mãi
9 Xem bài viết giới
Trang 322.4 Biểu đồ use case
2.4.1 Biểu đồ Use – case tổng quát
Hình 2.1: Biểu đồ Use case tổng quát
2.4.2 Use case đăng nhập
Hình 2.2: Biểu đồ Use case đăng nhập
Tác nhân: Admin, khách hàng
Mô tả: Use case cho admin, khách hàng đăng nhập vào hệ thống
Điều kiện trước: admin, khách hàng chưa đăng nhập vào hệ thống
Dòng sự kiện chính:
- Chọn chức năng đăng nhập
- Giao diện đăng nhập hiển thị
- Nhập email, mật khẩu của admin, khách hàng vào giao diện đăng nhập
- Hệ thống kiểm tra email và mặt khẩu của admin, khách hàng Nếu nhập saiemail hoặc mật khẩu thì chuyển sang dòng sự kiện rẽ nhánh A1 Nếu nhậpđúng thì hệ thống sẽ chuyển tới trang quản trị hoặc truy cập vào hệ thống
Trang 33Use case kết thúc.
Dòng sự kiện rẽ nhánh:
- Dòng rẽ nhánh A1: admin, khách hàng đăng nhập không thành công
- Hệ thống thông báo quá trình đăng nhập không thành công do sai email hoặcmật khẩu
- Chọn nhập lại hệ thống yêu cầu nhập lại email, mật khẩu
Use case kết thúc
Hậu điều kiện: admin, khách hàng đăng nhập thành công và có thể sử dụngcác chức năng tương ứng trong trang quản trị hoặc hệ thống
2.4.3 Use case quản lý danh mục
Hình 2.3: Biểu đồ Use case quản lý danh mục
- Quản lý nội dung khuyến mãi: hệ thống hiển thị danh sách nội dung khuyếnmãi, người dùng chọn thêm, sửa, xóa hoặc tìm kiếm nội dung khuyến mãi.Nếu việc thay đổi thông tin thành công, hệ thống sẽ đưa ra thông báo, nếu saithì thực hiện dòng rẽ nhánh A1, lưu thông tin danh sách nội dung khuyến mãi
- Quản lý đơn vị tính: hệ thống hiển thị danh sách đơn vị tính, người dùng chọnthêm, sửa, xóa hoặc tìm kiếm đơn vị tính Nếu việc thay đổi thông tin thành
Trang 34công, hệ thống sẽ đưa ra thông báo, nếu sai thì thực hiện dòng rẽ nhánh A1,lưu thông tin danh sách đơn vị tính.
- Quản lý sản phẩm: hệ thống hiển thị danh sách sản phẩm, người dùng chọnthêm, sửa, xóa hoặc tìm kiếm sản phẩm Nếu việc thay đổi thông tin thànhcông, hệ thống sẽ đưa ra thông báo, nếu sai thì thực hiện dòng rẽ nhánh A1,lưu thông tin danh sách sản phẩm
- Quản lý chế độ bảo hành: hệ thống hiển thị danh sách chế độ bảo hành, ngườidùng chọn thêm, sửa, xóa hoặc tìm kiếm chế độ bảo hành Nếu việc thay đổithông tin thành công, hệ thống sẽ đưa ra thông báo, nếu sai thì thực hiện dòng
rẽ nhánh A1, lưu thông tin danh sách chế độ bảo hành
Use case kết thúc
Dòng sự kiện rẽ nhánh A1: hệ thống thông báo việc nhập dữ liệu không hợp
lệ, nhập lại thông tin, quay lại bước 1 của dòng sự kiện chính
Hậu điều kiện: các thông tin về danh mục sản phẩm, nội dung khuyến mãi,đơn vị tính, sản phẩm, chế độ bảo hành được cập nhật trong cơ sở dữ liệu
2.4.4 Use case quản lý kho
Hình 2.4: Biểu đồ Use case quản lý kho
- Quản lý mặt hàng bán chạy: hệ thống hiển thị danh sách mặt hàng bán chạy,người dùng nhập dữ liệu cần tìm kiếm vào textbox tiêu chí tìm kiếm Nếu dữ
Trang 35liệu tìm kiếm có tồn tại trong cơ sở dữ liệu, hệ thống hiển thị danh sách mặthàng bán chạy thỏa mãn dữ liệu tìm kiếm, ngược lại hệ thống hiển thị danhsách trống, không có dữ liệu.
- Quản lý mặt hàng sắp hết: hệ thống hiển thị danh sách mặt hàng sắp hết, ngườidùng nhập dữ liệu cần tìm kiếm vào textbox tiêu chí tìm kiếm Nếu dữ liệu tìmkiếm có tồn tại trong cơ sở dữ liệu, hệ thống hiển thị danh sách mặt hàng sắphết thỏa mãn dữ liệu tìm kiếm, ngược lại hệ thống hiển thị danh sách trống,không có dữ liệu
Use case kết thúc
Hậu điều kiện: các thông tin về hàng tồn, mặt hàng bán chạy, mặt hàng sắp hếtđược cập nhật trong cơ sở dữ liệu
2.4.5 Use case quản lý người dùng
Hình 2.5: Biểu đồ Use case quản lý người dùng
Người sử dụng chọn kiểu tác động: xóa, tìm kiếm thông tin người dùng
- Xóa thông tin người dùng: hệ thống hiển thị danh sách người dùng, chọnngười dùng cần xóa, nếu việc thay đổi thông tin thành công hệ thống sẽ đưa rathông báo, nếu sai thì thực hiện dòng rẽ nhánh A1, lưu thông tin danh sáchngười dùng
- Tìm kiếm người dùng: nhập thông tin vào ô trong danh sách, hệ thống sẽ hiểnthị danh sách người dùng
- Xóa đánh giá sản phẩm: hệ thống hiển thị danh sách đánh giá sản phẩm, chọnđánh giá sản phẩm cần xóa, nếu việc thay đổi thông tin thành công hệ thống sẽđưa ra thông báo, nếu sai thì thực hiện dòng rẽ nhánh A1, lưu thông tin danhsách đánh giá sản phẩm
Trang 36- Tìm kiếm đánh giá sản phẩm: nhập thông tin vào ô trong danh sách, hệ thống
sẽ hiển thị danh sách đánh giá sản phẩm
Use case kết thúc
Hậu điều kiện: các thông tin về quản lý người dùng được cập nhật trong cơ sở
dữ liệu
2.4.6 Use case quản lý đơn hàng
Hình 2.6: Biểu đồ use case quản lý đơn hàng
- Xóa thông tin danh sách đơn hàng: hệ thống hiển thị danh sách đơn hàng, chọndanh sách đơn hàng cần xóa, nếu việc thay đổi thông tin thành công hệ thống
sẽ đưa ra thông báo, nếu sai thì thực hiện dòng rẽ nhánh A1, lưu thông tindanh sách đơn hàng
Use case kết thúc
Dòng sự kiện rẽ nhánh A1: hệ thống thông báo việc nhập dữ liệu không hợp
lệ, nhập lại thông tin, quay lại bước 1 của dòng sự kiện chính
Hậu điều kiện: các thông tin về danh sách đơn hàng được cập nhật trong cơ sở
dữ liệu
Trang 372.4.7 Use case quản lý admin
Hình 2.7: Biểu đồ use case quản lý admin
Người sử dụng chọn kiểu tác động: thêm, sửa, xóa, tìm kiếm danh sách admin
- Thêm admin: chọn thêm danh sách admin, hệ thống hiển thị giao diện nhậpthông tin admin, người sử dụng nhập thông tin admin, nếu thành công hệthống đưa ra thông báo, nếu sai thực hiện dòng rẽ nhánh A1, lưu thông tin vàodanh sách admin
- Sửa thông tin admin: hệ thống hiển thị danh sách admin, chọn danh sách đơnhàng cần sửa, nhập các thông tin cần thay đổi, nếu việc thay đổi thông tinthành công hệ thống sẽ đưa ra thông báo, nếu sai thì thực hiện dòng rẽ nhánhA1, lưu thông tin danh sách admin
- Xóa thông tin admin: hệ thống hiển thị danh sách admin, chọn admin cần xóa,nếu việc thay đổi thông tin thành công hệ thống sẽ đưa ra thông báo, nếu saithì thực hiện dòng rẽ nhánh A1, lưu thông tin danh sách admin
- Tìm kiếm admin: nhập thông tin vào ô trong danh sách, hệ thống sẽ hiển thịdanh sách admin
Use case kết thúc
Dòng sự kiện rẽ nhánh A1: hệ thống thông báo việc nhập dữ liệu không hợp
lệ, nhập lại thông tin, quay lại bước 1 của dòng sự kiện chính
Hậu điều kiện: các thông tin về danh sách admin được cập nhật trong cơ sở dữliệu
Trang 382.4.8 Use case quản lý doanh thu
Hình 2.8: Biểu đồ use case quản lý doanh thu
Người sử dụng chọn kiểu tác động: tìm kiếm, export file doanh thu
- Tìm kiếm doanh thu: nhập thông tin vào ô trong danh sách, hệ thống sẽ hiểnthị danh sách doanh thu
- Export file: chọn những bản ghi cần export, click vào nút định dạng muốnexport, hệ thống xuất file doanh thu
Use case kết thúc
Hậu điều kiện: các thông tin về doanh thu được cập nhật trong cơ sở dữ liệu
2.4.9 Use case quản lý trang cá nhân
Hình 2.9: Biểu đồ use case quản lý trang cá nhân
Trang 39- Cập nhật thông tin cơ bản: hệ thống hiển thị thông tin cá nhân của admin, nhậpcác thông tin cần thay đổi, nếu việc thay đổi thông tin thành công hệ thống sẽđưa ra thông báo, nếu sai thì thực hiện dòng rẽ nhánh A1, lưu thông tin cánhân vào hệ thống.
- Đổi avatar: admin chọn ảnh avatar cần upload trên hệ thống, nếu việc thay đổithông tin thành công hệ thống sẽ đưa ra thông báo, nếu sai thì thực hiện dòng
rẽ nhánh A1, lưu ảnh vào hệ thống
- Đổi mật khẩu: admin nhập mật khẩu mới và xác nhận mật khẩu mới, nếu việcthay đổi thông tin thành công hệ thống sẽ đưa ra thông báo, nếu sai thì thựchiện dòng rẽ nhánh A1, lưu thông tin mật khẩu mới
Use case kết thúc
Dòng sự kiện rẽ nhánh A1: hệ thống thông báo việc nhập dữ liệu không hợp lệ,nhập lại thông tin, quay lại bước 1 của dòng sự kiện chính
Hậu điều kiện: các thông tin về doanh thu được cập nhật trong cơ sở dữ liệu
2.4.10 Use case chức năng của khách hàng
Hình 2.10: Biểu đồ use case chức năng của khách hàng
Tác nhân: khách hàng
Mô tả: use case cho phép đăng ký tài khoản, đặt hàng và thanh toán, gửi thôngtin liên hệ, quản lý thông tin cá nhân, tìm kiếm thông tin, bình luận sản phẩm, xemthông tin chi tiết sản phẩm
Điều kiện trước: khách hàng đã vào hệ thống
Dòng sự kiện chính:
Trang 40Người sử dụng chọn kiểu tác động: đăng ký tài khoản, đặt hàng và thanh toán,gửi thông tin liên hệ, quản lý thông tin cá nhân, tìm kiếm thông tin, bình luận sảnphẩm, xem thông tin chi tiết sản phẩm.
- Đăng ký tài khoản: nhập thông tin tài khoản muốn đăng ký vào form đăng ký,nếu việc tạo tài khoản thành công hệ thống sẽ đưa ra thông báo, nếu sai thìthực hiện dòng rẽ nhánh A1, lưu thông tin tài khoản vào hệ thống
- Đặt hàng và thanh toán: khách hàng phải đăng nhập hoặc đăng ký tài khoản vàđăng nhập trước khi đặt hàng Thông tin đăng nhập sẽ được hiển thị trên formthanh toán, khách hàng có thể sửa thông tin nếu muốn Có hai hình thức thanhtoán là thanh toán sau khi nhận hàng và thanh toán qua ví (đã nạp card trướcđó) Nếu có mã giảm giá, khách hàng có thể nhập vào thông tin thanh toán đểhưởng ưu đãi
- Gửi thông tin liên hệ: nhập thông tin liên hệ vào form liên hệ, nếu việc nhậpthêm thông tin thành công hệ thống sẽ đưa ra thông báo, nếu sai thì thực hiệndòng rẽ nhánh A1, lưu thông tin liên hệ vào hệ thống
- Quản lý thông tin cá nhân: sau khi đăng nhập vào hệ thống, khách hàng có thểcập nhật thông tin cá nhân của mình, xem lịch sử giao dịch, nạp card và đổi
mã khuyến mại để mua hàng thuận tiện và hưởng ưu đãi từ của hàng
- Tìm kiếm thông tin: nhập thông tin cần tìm kiếm vào ô tìm kiếm, hệ thốnghiển thị dữ liệu tìm được
- Bình luận sản phẩm: khách hàng có thể bình luận sản phẩm trong trang chi tiếtsản phẩm với nick face book cá nhân của khách hàng
- Xem thông tin chi tiết sản phẩm: khách hàng có thể chọn xem nhanh hoặc vàotrang chi tiết sản phẩm để xem thông tin chi tiết của sản phẩm và các sảnphẩm liên quan
- Đánh giá sản phẩm: sau khi click xem chi tiết sản phẩm, khách hàng có thểđánh giá sản phẩm
- Xem hướng dẫn mua hàng và thanh toán: khách hàng có thể xem thông tinmua hàng và thanh toán trong trang chi tiết sản phẩm
Use case kết thúc
Dòng sự kiện rẽ nhánh A1: hệ thống thông báo việc nhập dữ liệu không hợp
lệ, nhập lại thông tin, quay lại bước 1 của dòng sự kiện chính
Hậu điều kiện: các thông tin về các thông tin khách hàng được cập nhật trong
cơ sở dữ liệu