BỘ MÔN KỸ THUẬT ĐIỆN TỬ Độc lập – Tự do – Hạnh phúc BẢNG DUYỆT ĐỒ ÁN VÀ XÁC NHẬN CHO SINH VIÊN NỘP ĐỒ ÁN TỐT NGHIỆP Họ và tên sinh viên: Nguyễn Mạnh Cường Mã SV: 191414423 Tên đề tài:
TỔNG QUAN VỀ ĐỀ TÀI
Tên đề tài
HỆ THỐNG THƯƠNG MẠI ĐIỆN TỬ PHƯƠNG TIỆN THỂ THAO
Lý do chọn đề tài
Thương mại điện tử là một thuật ngữ rất phổ biến hiện nay Nó được nhắc nhiều trên phương tiện truyền thông Vậy thương mại điện tử là gì?
Theo tổ chức kinh tế thế giới định nghĩa: “Thương mại điện tử bao gồm việc sản xuất, quảng cáo, bán hàng và phân phối sản phẩm được mua bán và thanh toán trên mạng Internet, nhưng được giao nhận một cách hữu hình, cả các sản phẩm giao nhận cũng như những thông tin số hoá thông qua mạng Internet”.
Theo Ủy ban Thương mại điện tử của Tổ chức Hợp tác kinh tế châu Á - Thái Bình Dương định nghĩa: "Thương mại điện tử liên quan đến các giao dịch thương mại trao đổi hàng hóa và dịch vụ giữa các nhóm (cá nhân) mang tính điện tử chủ yếu thông qua các hệ thống có nền tảng dựa trên Internet."
Thương mại điện tử có thể hiểu là thực hiện hoạt động thương mại bằng những phương tiện điện tử Cụ thể hơn, đó là hoạt động giao dịch mua sắm qua internet Đây là một phương thức kinh doanh sử dụng internet mang lại nhiều hiệu quả như giao dịch nhanh chóng, tiết kiệm chi phí mặt bằng và quản lý.
Trong những năm gần đây, thương mại điện tử đang phát triển mạnh mẽ và trở thành một phần quan trọng của nền kinh tế Việc xây dựng hệ thống gợi ý sản phẩm dựa trên dữ liệu mua sắm trực tuyến sẽ giúp các nhà bán lẻ trực tuyến cải thiện trải nghiệm mua sắm của khách hàng và tăng doanh số bán sắm trực tuyến cũng giúp các doanh nghiệp cạnh tranh và nắm bắt nhu cầu của khách hàng một cách chính xác hơn và đây có thể là một chủ đề thú vị và hữu ích cho nghiên cứu khoa học về khoa học máy tính, trí tuệ nhân tạo, học máy, v.v
Vì những lý do trên, xây dựng hệ thống gợi ý sản phẩm dựa trên dữ liệu mua sắm trực tuyến là một đề tài hấp dẫn và có tiềm năng để áp dụng rộng rãi trong thực tế.
Mục tiêu của đề tài
Đề tài: HỆ THỐNG THƯƠNG MẠI ĐIỆN TỬ PHƯƠNG TIỆN THỂ
THAO đáp ứng được những mục tiêu:
− Hiểu biết những kiến thức cần thiết về xây dựng giao diện trang web, phân tích thiết kế hệ thống, cơ sở dữ liệu.
− Xây dựng một hệ thống gợi ý sản phẩm hiệu quả dựa trên dữ liệu mua sắm trực tuyến, giúp cải thiện trải nghiệm mua sắm của người dùng và tăng doanh số bán hàng cho các nhà bán lẻ trực tuyến.
− Phát triển các thuật toán và công nghệ để xử lý và phân tích dữ liệu mua sắm trực tuyến, nhằm tạo ra những gợi ý sản phẩm chính xác và hữu ích cho người dùng.
− Nghiên cứu các phương pháp để tăng tính cá nhân hóa và độ chính xác của hệ thống gợi ý sản phẩm, từ đó cải thiện trải nghiệm mua sắm của khách hàng và tăng doanh số bán hàng.
− Áp dụng những công nghệ mới nhất và những tiêu chuẩn tốt nhất để bảo mật dữ liệu mua sắm trực tuyến và đảm bảo tính riêng tư của người dùng.
− Thực hiện các thí nghiệm và đánh giá hiệu quả của hệ thống gợi ý sản phẩm dựa trên dữ liệu mua sắm trực tuyến, từ đó đưa ra những đề xuất và cải tiến cho hệ thống.
Đối tượng và phạm vi
Bất cứ ai có nhu cầu mua phương tiện giao thông trực tuyến trên nền tảng internet.
Kết quả dự kiến đạt được
Website bao gồm những mục chính và chức năng chính:
− Đăng ký, đăng nhập tài khoản cá nhân.
− Phân quyền giữa người quản trị và khách hàng.
− Chức năng quản trị: quản lý tài khoản, danh mục sản phẩm, sản phẩm, đơn hàng, hình ảnh sản phẩm.
− Tìm kiếm sản phẩm, xem chi tiết sản phẩm.
− Thêm sản phẩm vào giỏ hàng và lưu trữ giỏ hàng của mỗi người dùng.
CƠ SỞ LÝ THUYẾT VÀ CÔNG CỤ SỬ DỤNG
Cơ sở lý thuyết
2.1.1 Hyper Text Markup Language (HTML)
Trong chương trình trung học phổ thông, trong môn tin học bạn sẽ được các thầy cô giới thiệu: HTML hay HyperText Markup Language – Ngôn ngữ đánh dấu siêu văn bản, là ngôn ngữ được sử dụng cho các tài liệu web Nhưng HTML không phải là một ngôn ngữ lập trình, HTML giống như một ngôn ngữ xác định đâu là ý nghĩa, mục đích và cấu trúc của một tài liệu Cùng với CSS và JavaScript, HTML tạo ra bộ ba nền tảng kỹ thuật cho các website
Một website thường chứa nhiều trang con Mỗi trang con sẽ có một tập tin HTML riêng Dù bạn lập trình bằng bất cứ ngôn ngữ nào, trên bất cứ Framework nào, khi chạy trên nền website, chúng đều được biên dịch ra ngôn ngữ HTML Đa số các trình soạn thảo văn bản trên website đều có 2 chế độ xem: HTML và văn bản thường.
Chức năng chính của HTML là xây dựng cấ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 HTML thường được dùng để phân chia các đoạn văn, heading, links, blockquotes,…
Với HTML, người ta sẽ có thể:
− Thêm tiêu đề, định dạng đoạn văn, ngắt dòng điều khiển
− Tạo danh sách, nhấn mạnh văn bản, tạo ký tự đặc biệt, chèn hình ảnh,tạo liên kết
Như đã đề cập ở trên, HTML không phải là ngôn ngữ lập trình Do đó, HTML cũng không thể tạo ra các chức năng “động” được Hiểu đơn giản, HTML giống như Microsoft Word, dùng để bố cục và định dạng trang web.
Tóm lại, HTML là ngôn ngữ markup, dễ học, dễ hiểu, dễ áp dụng Tuy nhiên, một website được viết bằng HTML rất đơn giản, nếu không muốn nói là nhàm chán Để gây hứng thú với người truy cập, website cần có sự hỗ trợ của CSS và JavaScript
Nếu HTML cung cấp cấu trúc cơ bản của các trang web thì CSS và JavaScript sẽ cải tiến và sửa đổi website sinh động hơn.
CSS sẽ giúp webmaster xác định styles và định nghĩa nhiều loại nội dung của website CSS được tạo ra để kết hợp với ngôn ngữ markup HTML để tạo phong cách cho trang web Có 3 loại style CSS chính:
− Style CSS Internal: là style được tải lên mỗi khi trang web được refresh
− Style CSS Inline: bạn có thể chỉnh sửa một yếu tố nào đó mà không cần truy cập trực tiếp vào file CSS
− External style: bạn có thể tạo phong cách ở file khác áp dụng CSS vào trang bạn muốn External style sẽ cải thiện thời gian tải trang rất nhiều. Đặc biệt, bạn có thể sử dụng External Style CSS để tạo phong cách cho nhiều trang cùng lúc
Do đó, sử dụng CSS, bạn có thể:
− Tạo phong cách và định kiểu cho những yếu tố được viết dưới dạng ngôn ngữ đánh dấu, như HTML
− Tiết kiệm công sức của lập trình viên nhờ điều khiển định dạng của nhiều trang web
− Phân biệt cách hiển thị của trang web với nội dung chính của trang bằng cách điều khiển bố cục, màu sắc và font chữ
− Nếu HTML cung cấp các công cụ thô cần thiết để cấu trúc nội dung trên một trang web thì CSS sẽ giúp định hình kiểu nội dung này để trang web xuất hiện trước người dùng theo một cách đẹp hơn.
Ví dụ: HTML sẽ đánh dấu từng phần văn bản để biết được đó là yếu tố gì CSS sẽ sử dụng cấu trúc tiếng Anh đơn giản để tạo ra một bộ các quy tắc tạo phong cách cho các yếu tố
Có thể nói, CSS gần như tạo nên bộ mặt của một website Và CSS cũng không phải là tất cả Để có một trang web đẹp bạn không chỉ dựa vào CSS mà phải kết hợp với nhiều ngôn ngữ khác Các ngôn ngữ phải được thực hiện dựa trên các bản thiết kế đã thống nhất.
Thường được viết tắt là “JS”, JavaScript là một ngôn ngữ lập trình được Brendan Eich (đồng sáng lập dự án Mozilla, quỹ Mozilla và tập đoàn Mozilla) cho ra mắt vào năm 1995 với tên LiveScript
JavaScript được biết đến đầu tiên với tên Mocha, và sau đó làLiveScript, nhưng công ty Netscape đã đổi tên của ngôn ngữ thành
Các slideshow, pop-up quảng cáo và tính năng tự động hoàn thành của Google đều được viết bằng JavaScript
JS có tác dụng giúp chuyển website từ trạng thái tĩnh sang động, tạo tương tác để cải thiện hiệu suất máy chủ và nâng cao trải nghiệm người dùng. Hiểu đơn giản, JavaScript là ngôn ngữ được sử dụng rộng rãi khi kết hợp với HTML/CSS để thiết kế web động Sử dụng JavaScript, người ta sẽ:
− Dễ dàng bắt đầu với các bước nhỏ, với thư viện ảnh, bố cục có tính thay đổi … nhờ sự linh hoạt của JavaScript
− Có thể tạo ra các trò chơi, hoạt họa 2D hoặc 3D, ứng dụng cơ sở dữ liệu toàn diện, …
− Tăng cường các hành vi và kiểm soát mặc định của trình duyệt.
JavaScript là ngôn ngữ lập trình cho phép các nhà phát triển web thiết kế các trang web tương tác Hầu hết các hành vi động mà bạn sẽ thấy trên một trang web đều có được là nhờ JavaScript Vì thế, đây là một ngôn ngữ phức tạp và khó học.
Laravel là một PHP framework, áp dụng ở phần Back-end, xử lý ở phía server, có mã nguồn mở và miễn phí, được xây dựng nhằm hỗ trợ phát triển các phần mềm, ứng dụng, theo kiến trúc MVC Hiện nay, Laravel đang làPHP framework phổ biến nhất và tốt nhất Một số tính năng của Laravel là hệ thống đóng gói mô-đun với trình quản lý phụ thuộc chuyên dụng, các cách khác nhau để truy cập cơ sở dữ liệu quan hệ, các tiện ích hỗ trợ triển khai và bảo trì ứng dụng
+ Cú pháp dễ hiểu – rõ ràng
+ Hệ thống đóng gói modular và quản lý gói phụ thuộc
+ Nhiều cách khác nhau để truy cập vào các cơ sở dữ liệu quan hệ
+ Nhiều tiện ích khác nhau hỗ trợ việc triển khai vào bảo trì ứng dụng
- Những tính năng nổi bật của Laravel:
+ Nâng cấp, cài đặt, … với Composer
+ Thao tác với cú pháp đẹp mắt và đơn giản với Eloquent ORM
+ Hỗ trợ biến Laravel thành một web service API với Restful API
+ Cung cấp các lệnh cần thiết để phát triển ứng dụng với Artisan
+ Hỗ trợ tạo các trường trong cơ sở dữ liệu, thêm các cột trong bảng,
+ Cung cấp sẵn các tính năng đăng nhập, đăng ký, quên mật khẩu,
+ Hỗ trợ test lỗi để sửa chữa với Unit Testing.
ReactJS là một thư viện JavaScript mã nguồn mở dùng để xây dựng giao diện người dùng hoặc các thành phần UI.
ReactJS là một thư viện JavaScript với xu hướng Single Page Application.
Hiện tại, nó đã đi trước các đối thủ chính như Angular và Bootstrap. Được đánh giá cao và trở nên rất phổ biến với hơn 1.300 developer và hơn 94.000 trang web đang sử dụng.
2.1.5.2 Lịch sử phát triển của ReactJS
Hình 2.2 Công nghệ React JS
Trước thời điểm năm 2013 việc xây dựng UI cho Facebook hoàn toàn dựa trên framework AngularJS của Google, tuy nhiên sau thời điểm năm
2013 khi lượng người dùng trở nên quá lớn và dữ liệu Facebook lưu trữ ngày
Công cụ sử dụng
Visual Studio Code (VS Code hay VSC) là một trong những trình soạn thảo mã nguồn phổ biến nhất được sử dụng bởi các lập trình viên Nhanh, nhẹ, hỗ trợ đa nền tảng, nhiều tính năng và là mã nguồn mở chính là những ưu điểm vượt trội khiến VS Code ngày càng được ứng dụng rộng rãi Một số tính năng của Visual Studio Code:
− Hỗ trợ nhiều ngôn ngữ lập trình
− Hỗ trợ đa nền tảng
− Cung cấp kho tiện ích mở rộng
− Kho lưu trữ an toàn
− Lưu trữ dữ liệu dạng phân cấp
− Hỗ trợ thiết bị đầu cuối
Rational rose là phần mềm công cụ mạnh hỗ trợ phân tích, thiết kế hệ thống phần mềm theo hướng đối tượng Phần mềm này giúp mô hình hoá hệ thống trước khi viết mã chương trình Rational rose cho ra các mô hình tổng quan của hệ thống từ những góc độ, khía cạnh khác nhau, bao gồm tất cả các mô hình UML, actors, use cases, objects, component và deployment nodes trong hệ thống Phần mô tả chi tiết về hệ thống bao gồm hệ thống sẽ hoạt động như thế nào vì thế người lập trình có thể dùng mô hình như một bản thiết kế cho công việc xây dựng hệ thống Phần mềm này được phát triển bởi công ty Rational Software, phiên bản đầu tiên phát hành năm 1994.
2.2.3 Hệ quản trị 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à hệ quản trị 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ập CSDL trên internet Người dùng có thể tải về MySQL miễn phí từ trang chủ MySQL có nhiều phiên bản cho các hệ điều hành khác nhau: phiên bản Win32 cho 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ệu quan 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ợ NodeJs, PHP, Perl, và nhiều ngôn ngữ khác, làm nơi lưu trữ những thông tin trên các trang web viết bằng NodeJs, PHP hay Perl,
Phân tích hệ thống
3.1.1 Vai trò của người dùng
− Hệ thống chia làm 3 nhóm người dùng chính:
+ Khách truy cập vãng lai
− Mô tả nhóm người dùng.
+ Khách truy cập vãng lai: những người dùng truy cập trang web và chưa có tài khoản đăng nhập trên trang web Khách truy cập vãng lai có thể xem thông tin sản phẩm, nếu không đăng ký tài khoản của trang web thì người dùng không thể đặt hàng.
+ Khách hàng (thành viên của trang web): những khách hàng đã có tài khoản đăng nhập trên trang web Khách hàng khi mua hàng trên trang web thì thông tin của khách hàng đã được lưu lại trong cơ sở dữ liệu và khi người dùng muốn mua hàng chỉ cần đăng nhập bằng tài khoản thông tin của khách hàng sẽ hiển thị và khách hàng chỉ cần tiến hành mua.
+ Người quản trị: là người quản lý trang web và được truy cập vào các chức năng quản lý của hệ thống.
− Khách truy cập vãng lai:
+ Xem chi tiết sản phẩm
− Thành viên của trang web:
+ Xem chi tiết sản phẩm
+ Quản lý danh mục sản phẩm
3.1.3 Yêu cầu phi chức năng
− Giao diện trang web được thiết kế dễ sử dụng và có tính thẩm mỹ cao.
− Được viết trên nền tảng web.
− Hiệu năng: tốc độ, khả năng và độ tin cậy của hệ thống.
− Website bảo mật phân quyền để thực hiện các chức năng của hệ thống.
Biểu đồ use case tổng quát
Hình 3.1 Biểu đồ UC tổng quát hệ thống
Mô hình thực thể liên kết
Hình 3.2 Biểu đồ thực thể liên kết
Đặc tả use case
3.4.1 Use case đăng nhập a) Đặc tả use case:
❖ Mô tả use case: Use case này cho phép người dùng đăng nhập vào hệ thống bằng tài khoản cá nhân để sử dụng 1 số tính năng riêng biệt theo cá nhân
❖ Luồng các sự kiện: o Luồng cơ bản:
1 Use case này bắt đầu khi người dùng kích vào Icon Đăng Nhập Hệ thống sẽ hiển thị form nhập thông tin tài khoản bao gồm: Email, Mật khẩu.
2 Người dùng nhập thông tin bao gồm: Email, Mật khẩu và kích vào nút “Đăng Nhập” Hệ thống sẽ gửi 1 yêu cầu truy xuất vào bảng users để kiểm tra tài khoản.
3 Hệ thống hiển thị màn hình thành công Người dùng kích vào chức năng khác của hệ thống Ca sử dụng này kết thúc o Luồng rẽ nhánh:
1 Tại bất kỳ bước nào mà hệ thống không thể kết nối đến Cơ sở dữ liệu thì hệ thống sẽ hiển thị thông báo lỗi và Ca sử dụng này kết thúc.
2 Tại bước 2 của luồng cơ bản khi người dùng không nhập thông tin gì thì sẽ hiện thông báo “Người dùng chưa nhập thông tin”.
3 Tại bước 2 của luồng cơ bản nếu nhập sai tên tài khoản
❖ Các yêu cầu đặc biệt: Không có
❖ Tiền điều kiện: Không có
❖ Hậu điều kiện: Nếu use case thành công, người dùng sẽ đăng nhập vào hệ thống Nếu không trạng thái không thay đổi
❖ Điểm mở rộng: Use case Quên mật khẩu, Use case Đăng Ký b) Biểu đồ VOPC:
Hình 3.3 VOPC Đăng Nhập c) Biểu đồ trình tự Luồng Cơ Bản:
Hình 3.4 Biểu đồ trình tự Đăng Nhập
3.4.2 Use case đăng ký a) Đặc tả use case:
❖ Mô tả use case: Use case này cho phép người dùng tạo tài khoản cá nhân
❖ Luồng các sự kiện: o Luồng cơ bản:
1 Use case này bắt đầu khi người dùng kích vào Icon → Đăng Ký Hệ thống sẽ hiển thị form nhập thông tin tài khoản bao gồm: Email, Mật khẩu, Xác Nhận Mật Khẩu.
2 Người dùng nhập thông tin bao gồm: Số điện thoại, Mật khẩu, Xác Nhận Mật Khẩu và kích vào nút “Đăng Ký” Hệ thống sẽ gửi 1 yêu cầu truy xuất vào bảng users để kiểm tra tài khoản.
3 Hệ thống hiển thị màn hình thành công điều hướng về màn hình “Đăng Nhập” Người dùng kích vào chức năng khác của hệ thống Ca sử dụng này kết thúc o Luồng rẽ nhánh:
1 Tại bất kỳ bước nào mà hệ thống không thể kết nối đến Cơ sở dữ liệu thì hệ thống sẽ hiển thị thông báo lỗi và Ca sử dụng này kết thúc.
2 Tại bước 2 của luồng cơ bản khi người dùng không nhập thông tin gì thì sẽ hiện thông báo “Người dùng chưa nhập thông tin”.
3 Tại bước 2 của luồng cơ bản nếu tên tài khoản trùng với 1 tài khoản bất kỳ trong bảng users thì sẽ hiển thị ra thông báo lỗi
❖ Các yêu cầu đặc biệt: Không có
❖ Tiền điều kiện: Không có
❖ Hậu điều kiện: Nếu use case thành công, người dùng sẽ có thể đăng nhập vào tài khoản mới lập
❖ Điểm mở rộng: Không có b) Biểu đồ VOPC:
Hình 3.5 VOPC Đăng Ký c) Biểu đồ trình tự Luồng Cơ Bản:
Hình 3.6 Biểu đồ trình tự Đăng Ký 3.4.3 Chức năng Xem Sản Phẩm a) Đặc tả use case:
❖ Mô tả use case: Use case này cho phép người dùng xem các sản phẩm tại trang chủ
❖ Luồng các sự kiện: o Luồng cơ bản:
1 Use case này bắt đầu khi người dùng vào theo đường link products, product_images để lấy thông tin như : name, price, image và hiển thị thông tin ra màn hình.
2 Người sử dụng kích vào chức năng khác của hệ thống Ca sử dụng này kết thúc o Luồng rẽ nhánh:
1 Tại bất kỳ bước nào mà hệ thống không thể kết nối đến Cơ sở dữ liệu thì hệ thống sẽ hiển thị thông báo lỗi và Ca sử dụng này kết thúc.
2 Nếu trong các bảng products, product_images thì hệ thống sẽ hiển thị thông báo “Không có mặt hàng nào”
❖ Các yêu cầu đặc biệt: Không có
❖ Tiền điều kiện: Không có
❖ Hậu điều kiện: Không có
❖ Điểm mở rộng: Use case Xem chi tiết sản phẩm, Use case Tìm Kiếm
Sản Phẩm b) Biểu đồ VOPC:
Hình 3.7 VOPC Xem Sản Phẩm c) Biểu đồ trình tự Luồng Cơ Bản:
Hình 3.8 Biểu đồ trình tự Xem Sản Phẩm 3.4.4 Use case tìm kiếm a) Đặc tả use case:
❖ Mô tả use case: Use case này cho phép người dùng tìm kiếm các sản phẩm trong hệ thống bán hàng.
❖ Luồng các sự kiện: o Luồng cơ bản:
1 Use case này bắt đầu khi người dùng vào theo đường link trang chủ hệ thống Hệ thống sẽ truy xuất vào bảng products, product_images để lấy thông tin như : name, price, image và hiển thị thông tin ra màn hình.
2 Người dùng nhập thông tin vào ô tìm kiếm và bấm vào nút
“Tìm Kiếm”(mô phỏng bằng hình kính lúp) Hệ thống sẽ truy xuất đến bảng products o Luồng rẽ nhánh:
1 Tại bất kỳ bước nào mà hệ thống không thể kết nối đến Cơ sở dữ liệu thì hệ thống sẽ hiển thị thông báo lỗi và Ca sử dụng này kết thúc.
2 Nếu trong các bảng products, product_images thì hệ thống sẽ hiển thị thông báo “Không có mặt hàng nào”.
3 Nếu không có sản phẩm nào khớp với lệnh tìm kiếm thì hiển thị thông báo “Không tồn tại sản phẩm này”.
❖ Các yêu cầu đặc biệt: Không có
❖ Tiền điều kiện: Không có
❖ Hậu điều kiện: Không có
❖ Điểm mở rộng: Use case Xem chi tiết sản phẩm
Hình 3.9 VOPC Tìm Kiếm Sản Phẩm c) Biểu đồ trình tự Luồng Cơ Bản:
Hình 3.10 Biểu đồ trình tự Tìm Kiếm Sản Phẩm 3.4.5 Use case xem chi tiết sản phẩm a) Đặc tả use case:
❖ Mô tả use case: Use case này cho phép người dùng xem chi tiết sản phẩm đã chọn
❖ Luồng các sự kiện: o Luồng cơ bản:
3 Use case này bắt đầu khi người dùng kích vào một sản phẩm Hệ thống sẽ truy xuất vào bảng products, product_images để lấy thông tin như : name, size, sku, price, weight, tag, category, image, qty và hiển thị thông
4 Người sử dụng kích vào chức năng khác của hệ thống Ca sử dụng này kết thúc o Luồng rẽ nhánh:
3 Tại bất kỳ bước nào mà hệ thống không thể kết nối đến Cơ sở dữ liệu thì hệ thống sẽ hiển thị thông báo lỗi và Ca sử dụng này kết thúc.
4 Nếu trong các bảng products, product_images thì hệ thống sẽ hiển thị thông báo “Không có mặt hàng nào”
❖ Các yêu cầu đặc biệt: Không có
❖ Tiền điều kiện: Không có
❖ Hậu điều kiện: Không có
❖ Điểm mở rộng: Use case Đặt hàng
Hình 3.11 VOPC Xem Chi Tiết Sản Phẩm c) Biểu đồ trình tự Luồng Cơ Bản:
Hình 3.12 Biểu đồ trình tự Xem Chi Tiết Sản Phẩm
3.4.6 Use case đặt hàng a) Đặc tả use case:
❖ Mô tả use case: Use case này cho phép người dùng chọn sản phẩm vào mua hàng trên hệ thống.
❖ Luồng các sự kiện: o Luồng cơ bản:
1 Use case này bắt đầu khi người chọn vào nút “Thêm vào giỏ” ở màn hình chi tiết sản phẩm Hệ thống hiển thị Danh sách sản phẩm có trong giỏ hàng gồm các thông tin bao gồm: Tên sản phẩm, số lượng, đơn giá.
2 Tại giỏ hàng, người dùng chọn các sản phẩm cần mua để thêm vào Đơn hàng, chọn vào nút Đặt hàng Hệ thống hiển thị thông tin chi tiết đơn hàng bao gồm: Tên sản phẩm, số lượng, đơn giá, tổng giá trị đơn hàng, các thông tin cần thiết của đơn hàng.
3 Người dùng xác nhận thông tin đơn hàng chính xác, chọn vào nút “Gửi” để hoàn tất thao tác mua hàng.
4 Hệ thống hiển thị màn hình thông báo “Đặt hàng thành công” Người dùng kích vào chức năng khác của hệ thống.
Ca sử dụng này kết thúc. o Luồng rẽ nhánh:
Thiết kế cơ sở dữ liệu
3.5.1 Thiết kế cơ sở dữ liệu
Hình 3.21 Biều đồ mô tả cấu trúc cơ sở dữ liệu
KIỂM TRA VÀ ĐÁNH GIÁ
Kết quả đạt được
4.1.1 Giao diện trang web bán hàng
Hình 4.2 Giao diện đăng nhập
Hình 4.3 Giao diện đăng ký
Hình 4.4 Giao diện chi tiết sản phẩm
Hình 4.5 Giao diện giỏ hàng
Hình 4.6 Giao diện thanh toán đơn hàng
Hình 4.7 Giao diện đơn hàng của tôi
Hình 4.8 Giao diện đặt hàng thanh toán sau thành công.
Hình 4.9 Giao diện thanh toán online
Hình 4.10 Giao diện thanh toán bằng ứng dụng có hỗ trợ VNPAY
Hình 4.11 Giao diện chọn ngân hàng để thanh toán thẻ nội địa và ngân hàng
Hình 4.12 Giao diện thanh toán bằng thẻ nội địa và ngân hàng
Hình 4.13 Giao diện chọn loại thẻ thanh toán quốc tế
Hình 4.14 Giao diện thanh toán bằng thẻ quốc tế
Hình 4.15 Giao diện thanh toán bằng VNPAY
Hình 4.16 Giao diện hủy thanh toán
Hình 4.17 Giao diện đặt hàng không thành công
4.1.2 Giao diện quản lý tài khoản
Hình 4.18 Giao diện đăng nhập tài khoản admin
Hình 4.19 Giao diện quản lý tài khoản
Hình 4.20 Giao diện quản lý đơn hàng
Hình 4.21 Giao diện thêm sản phẩm
Hình 4.22 Giao diện thêm loại sản phẩm
Hình 4.24 Giao diện thêm sản phẩm
