TỔNG QUAN
Tính cấp thiết của đề tài
Trong những năm gần đây, sự chú trọng đến tiêu chuẩn an toàn vệ sinh thực phẩm đã dẫn đến sự ra đời của nhiều cửa hàng nông sản sạch để đáp ứng nhu cầu người tiêu dùng Mô hình kinh doanh này đã thành công, khiến các nhà cung cấp nhanh chóng mở rộng thành mạng lưới kinh doanh trực tuyến Việc quảng bá và giới thiệu sản phẩm một cách hiệu quả và kịp thời là yếu tố quan trọng giúp thương hiệu tiếp cận đông đảo khách hàng.
Với sự phát triển mạnh mẽ của công nghệ thông tin, việc lựa chọn nông sản tươi ngon trở nên dễ dàng chỉ với một chiếc máy tính kết nối internet và vài thao tác đơn giản Kinh doanh trực tuyến không chỉ giúp cửa hàng quản lý mua bán hiệu quả hơn so với phương pháp thủ công, mà còn đảm bảo an toàn cho dữ liệu về sản phẩm và khách hàng.
Nhằm giải quyết các vấn đề hiện tại và mang sản phẩm nông sản sạch đến tay người tiêu dùng, nhóm chúng em đã quyết định phát triển một website thương mại điện tử chuyên về nông sản Dự án này không chỉ tạo ra một hệ thống bán hàng trực tuyến thân thiện, giúp khách hàng dễ dàng mua sắm và tiết kiệm thời gian, mà còn hỗ trợ doanh nghiệp trong việc quảng bá và thu hút người tiêu dùng hiệu quả.
Mục tiêu của đề tài
Nhóm chúng em nghiên cứu công nghệ MERN Stack và vai trò quan trọng của nó trong ngành lập trình hiện nay, từ đó áp dụng công nghệ này vào thực tiễn.
17 này để tiến hành xây dựng một website thương mại điện tử có đầy đủ các chức năng như sau:
- Giới thiệu danh sách sản phẩm và thông tin chi tiết cho từng sản phẩm
- Hỗ trợ khách hàng tương tác với người quản trị thông qua kết nối messenger
- Mua hàng và thanh toán trực tuyến
- Hỗ trợ chủ doanh nghiệp có thể quản lý các sản phẩm
- Hỗ trợ chủ doanh nghiệp quản lý các hoá đơn và thông tin người dùng
Nội dung nghiên cứu
- Tìm hiểu công nghệ MERN Stack
- Tìm hiểu cách quản lý cơ sở dữ liệu trên Mongo Atlas
- Tìm hiểu công nghệ Express JS với mô hình MVC
- Tìm hiểu về công nghệ React JS và Redux
- Tìm hiểu Vercel để triển khai một website và API
Phương pháp nghiên cứu
Để thực hiện đề tài nghiên cứu, nhóm đã sử dụng các phương pháp sau:
- Phương pháp nghiên cứu tài liệu, đọc ebook, các tài liệu tham khảo, các bài viết, các video liên quan đến MERN Stack
Phương pháp chuyên gia bao gồm việc nhận sự góp ý, hỗ trợ và tư vấn từ giáo viên hướng dẫn cùng các giảng viên trong khoa Đào tạo chất lượng cao của trường Đại học Sư phạm Kỹ thuật.
CƠ SỞ LÝ THUYẾT
Giới thiệu về Technical Stack
Technical Stack là tập hợp các công nghệ và phần mềm kết hợp với nhau, tạo nền tảng cho sự hoạt động của ứng dụng.
2.1.2 Một số Stack thông dụng
TECHNICAL STACK CÁC CÔNG NGHỆ
MERN Mongo DB, Express JS, React JS, Node JS
MEAN Mongo DB, Express, Angular, Node JS
LAMP Stack Linux, Apache, MySQL, PHP
WISA Stack Window, IIS, SQL Server, ASP.NET
Bảng 1 Một số Stack thông dụng
Giới thiệu về MERN Stack
Hình 1 Định nghĩa MERN Stack
MERN Stack là một bộ bốn công nghệ mã nguồn mở, bao gồm MongoDB, Express JS, React JS và Node JS MongoDB là giải pháp cho cơ sở dữ liệu, trong khi Express JS là công nghệ của Node JS được sử dụng để xây dựng ứng dụng Node JS React JS là thư viện dùng để phát triển giao diện phía client, và Node JS là một môi trường chạy JavaScript được xây dựng dựa trên engine JavaScript V8 của Chrome.
2.2.2 Cách thức hoạt động của MERN Stack
Kiến trúc của MERN cho phép các lập trình viên dễ dàng xây dựng nên kiến trúc ba lớp của một trang web (frontend, backend, database)
React đảm nhận việc xử lý tương tác và tạo giao diện người dùng ở phía client, trong khi Node và Express xử lý logic và xác thực từ client khi người dùng thực hiện các sự kiện MongoDB sẽ tổ chức và lưu trữ dữ liệu ở phía server.
Client và Server giao tiếp thông qua việc gửi các request và response Công nghệ AJAX cho phép gửi các request và response này một cách ngầm, giúp người dùng thực hiện các tương tác mà không cần tải lại trang web.
2.2.3 Vai trò của MERN Stack
- Ưu điểm tốt nhất của MERN Stack là tách biệt riêng hai phần frontend và backend
- Cho phép xây dựng các Single Page Application (SPA) mang đến cho người dùng một trải nghiệm tối ưu nhất
- MERN Stack sử dụng chung ngôn ngữ Javascript cho cả phần client và server nên khi phát triển sẽ tiết kiệm được thời gian và chi phí
MERN Stack sử dụng JSON làm định dạng dữ liệu trao đổi giữa các thành phần, giúp loại bỏ nhu cầu sử dụng thư viện bổ sung để chuyển đổi dữ liệu trong quá trình tương tác giữa client và server.
- Node JS hoạt động trên cả hệ điều hành Linux và Window, vì vậy không bị ràng buộc bởi hiệu hành khi sử dụng
MongoDB có khả năng quản lý khối lượng lớn dữ liệu và cho phép thêm thuộc tính mới cho bảng mà không cần cập nhật toàn bộ bảng, nhờ vào việc không bị ràng buộc chặt chẽ bởi các quan hệ.
- Toàn bộ công nghệ MERN Stack đều là mã nguồn mở có sẵn và miễn phí.
Giới thiệu về MongoDB
MongoDB là một cơ sở dữ liệu hướng tài liệu, một dạng NoSQL database
MongoDB Atlas là một dịch vụ trả phí cho phép người dùng lưu dữ liệu ứng dụng trên đám mây
MongoDB Atlas mang đến các tính năng của MongoDB mà không yêu cầu quá nhiều tài nguyên cho các ứng dụng mới, cho phép hoạt động trên nhiều nền tảng đám mây như AWS, Azure và Google Cloud Ngoài ra, nó còn cung cấp nhiều công cụ hữu ích để quản lý, khai thác và phân tích dữ liệu hiệu quả.
- MongoDB sử dụng dữ liệu dưới dạng Document JSON nên rất dễ dàng truy cập
- Thêm, xoá, cập nhật sẽ không mất nhiều thời gian như RDBMS
- Dữ liệu được lưu trong MongoDB thường không bị ràng buộc với nhau
- Các trường hợp dữ liệu “_id” sẽ luôn được đánh tự động index, nên tốc độ truy xuất thông tin sẽ luôn đạt hiệu xuất cao
- Tốc độ truy vấn của MongoDB luôn nhanh hơn so với các hệ quản trị cơ sở dữ liệu
- Nhờ có một lượng đủ dữ liệu nên việt thực nghiệm cho thấy tốc độ insert của MongoDB sẽ nhanh gấp 100 lần so với MySQL
Giới thiệu về ExpressJS
ExpressJS là một công nghệ phát triển dựa trên NodeJS, cho phép hỗ trợ các phương thức HTTP và middleware, giúp tạo ra các API dễ dàng sử dụng.
2.4.2 Một số tính năng của Express
- Phát triển máy chủ nhanh chóng: ExpressJS cung cấp nhiều tính năng dưới dạng các hàm để dễ dàng sử dụng và giúp tiết kiệm được thời gian
Phần mềm trung gian Middleware là một loại phần mềm có khả năng truy cập vào cơ sở dữ liệu, xử lý yêu cầu từ người dùng và tương tác với các phần mềm trung gian khác Nó đóng vai trò quan trọng trong việc tổ chức hệ thống các chức năng của ExpressJS một cách hiệu quả.
- Định tuyến – Routing: Duy trì trạng thái của website với sự trợ giúp của URL
- Tạo mẫu – Templating: Cho phép các nhà xây dựng nội dung trên các website bằng cách tạo dựng các mẫu HTML phía máy chủ
- Gỡ lỗi – Debugging: Dễ dàng gỡ lỗi nhờ khả năng xác định chính xác các phần trong ứng dụng web có lỗi
- Dễ học bởi vì các lập trình viên front-end đã biết về Javascript nên không cần phải học một ngôn ngữ mới
- Giúp cho việc phát triển back-end dễ dàng hơn khi sử dụng ExpressJS
- ExpressJS rất đơn giản để tuỳ chỉnh và sử dụng theo yêu cầu
- Hỗ trợ phát triển theo mô hình MVC
- Thiết lập các lớp trung gian để trả về các yêu cầu HTTP
- Định nghĩa bộ định tuyến cho phép sử dụng trên phương thức HTTP và URL
- Cho phép trả về các trang HTML dựa trên các tham số
Giới thiệu về ReactJS
Hình 4 Định nghĩa React JS
React là thư viện JavaScript mã nguồn mở cho front-end, giúp xây dựng các thành phần giao diện người dùng (UI) có thể tái sử dụng và hiển thị dữ liệu thay đổi theo thời gian.
React là một thư viện JavaScript chuyên dụng để xây dựng giao diện người dùng (UIs) Thư viện này cho phép tái sử dụng các thành phần, giúp tiết kiệm thời gian phát triển và giảm thiểu nguy cơ lỗi Hai tính năng nổi bật của React là JSX và Virtual DOM.
JSX là cú pháp mở rộng của Javascript, cho phép sửa đổi DOM một cách dễ dàng thông qua mã HTML đơn giản, và tương thích với hầu hết các trình duyệt.
Hình 5 Định nghĩa Virtual Dom
Virtual DOM là định dạng dữ liệu trong Javascript, thể hiện nội dung của DOM tại một thời điểm cụ thể Khi trạng thái của đối tượng thay đổi, Virtual DOM chỉ cập nhật đối tượng đó trong DOM thực, thay vì làm mới toàn bộ các đối tượng trong DOM.
Hooks là một bổ sung mới trong React 16.8 Chúng cho phép sử dụng trạng thái và các tính năng khác của React mà không cần viết một lớp
Component là các thành phần độc lập và có thể tái sử dụng trong giao diện Chúng được sử dụng bằng cách gọi tên tương tự như các thẻ HTML và nhiệm vụ chính là trả về HTML thông qua hàm render Trong ReactJS, có hai loại component.
Giới thiệu về NodeJS
NodeJS là nền tảng phát triển ứng dụng mạng nhanh và mở rộng, được xây dựng trên thời gian chạy JavaScript V8 của Chrome.
NodeJS có thể được sử dụng để xây dựng các loại ứng dụng khác nhau như ứng dụng dòng lệnh, ứng dụng web, máy chủ REST API…
NodeJS là một môi trường mã nguồn mở, đa nền tảng, lý tưởng cho việc phát triển ứng dụng mạng và phía máy chủ trên các hệ điều hành như OS X, Microsoft Windows và Linux.
2.6.2 Một số tính năng của NodeJS
NodeJS sử dụng API bất đồng bộ, cho phép máy chủ xử lý nhiều yêu cầu cùng lúc Cơ chế thông báo sự kiện trong NodeJS giúp máy chủ nhận phản hồi từ các lệnh gọi API trước đó một cách hiệu quả.
- Nhanh: Được xây dựng trên JavaScript V8 của Google Chrome, NodeJS thực thi mã rất nhanh
Đơn luồng với khả năng mở rộng vượt trội: Cơ chế sự kiện cho phép máy chủ phản hồi một cách bất đồng bộ, mang lại khả năng mở rộng cao hơn so với các máy chủ truyền thống.
- Không đệm: Các ứng dụng NodeJS chỉ xuất dữ liệu theo từng phần mà không đệm bất kỳ dữ liệu nào
- Giấy phép: NodeJS được phát hành theo giấy phép MIT
- NodeJS là một framework mã nguồn mở theo giấy phép của MIT
- Sử dụng JavaScript để xây dựng toàn bộ ứng dụng phía máy chủ
- Các modules có thể được đưa vào tùy theo nhu cầu của ứng dụng
- Bất đồng bộ theo mặc định nên có thể hoạt động nhanh hơn
- Đa nền tảng chạy trên Windows, MAC hoặc Linux
Giới thiệu về Redux
Redux là công cụ quản lý state trong ứng dụng Javascript, giúp viết ứng dụng hoạt động nhất quán và linh hoạt trên nhiều môi trường như client, server và native, đồng thời dễ dàng kiểm thử.
Redux là sự kết hợp hoàn hảo với React, cho phép lưu trữ state của ứng dụng trong store Mỗi component có thể dễ dàng truy cập vào bất kỳ state nào cần thiết từ store này.
2.7.2 Cách thức hoạt động của Redux
Redux hoạt động thông qua một store duy nhất, nơi lưu trữ toàn bộ state của ứng dụng Điều này cho phép các component truy cập trực tiếp vào state mà không cần phải truyền props giữa các component.
Hình 8 Cách thức hoạt động của Redux
Redux hoạt động dựa vào 3 thành phần cơ bản: Actions, Reducers và Store
Actions are events that facilitate the transmission of data from an application to the store These tasks are dispatched using the store.dispatch() method Actions are JavaScript objects that must include a type property to indicate the specific action being performed.
A reducer is a function that takes the current state of an application, processes an action, and returns a new state These states are stored as objects and define how the application's state changes in response to an action dispatched to the store.
- Store: lưu trữ các states của ứng dụng Các actions được thực hiện trên state luôn trả về state mới Như vậy, state rất dễ dự đoán trước
- Hỗ trợ dự đoán và quản lý các states
- Dễ dàng bảo trì, test và gỡ lỗi
- Tối ưu hiệu suất giúp các components kết nối dễ dàng và hiển thị ngay khi thực hiện
- Giữ state trong bộ nhớ cục bộ của ứng dụng và khôi phục dễ dàng
- Xử lý render ban đầu của ứng dụng bằng cách gửi state đến server cùng với phản hồi của nó
KHẢO SÁT VÀ XÁC ĐỊNH YÊU CẦU
Khảo sát hiện trạng
Sử dụng các từ khoá như "các website bán nông sản nổi tiếng", "most popular fruits and vegetables website", và "top rated fruits and vegetables website", Google đã trả về nhiều kết quả phù hợp cả trong nước và quốc tế Để đảm bảo tính phổ biến và thịnh hành của các website, nhóm em đã chọn 2 website đứng đầu cho mỗi từ khoá để tiến hành khảo sát.
Website fruitworld.co.nz là một trong những trang web nổi bật nhất tại New Zealand trong lĩnh vực kinh doanh nông sản quốc tế, nhờ vào trải nghiệm người dùng được đánh giá cao.
Hình 10 Trang chi tiết sản phẩm website fruitworld.co.nz
Hình 11 Trang giỏ hàng website fruitworld.co.nz
- Tông màu chủ đạo là trắng và xanh lá đặc trưng giúp làm nổi bật các mặt hàng rau củ
- Thân thiện với các thiết bị di động
- Hỗ trợ tìm kiếm địa chỉ các cửa hàng thông qua bản đồ
- Menu được thiết kế đầy đủ các chức năng, giúp người dùng dễ dàng tìm kiếm sản phẩm phân theo nhóm
- Với mỗi sản phẩm, thông tin, hình ảnh được cung cấp đầy đủ và trực quan
- Hỗ trợ tính năng gợi ý các sản phẩm tương tự, sản phẩm đã từng xem qua
- Lọc sản phẩm theo giá, best selling, thứ tự chữ cái, ngày nhập sản phẩm…
- Dễ dàng chỉnh sửa, thanh toán các sản phẩm đã được thêm vào giỏ hàng
- Liên lạc, để lại lời nhắn cho cửa hàng thông qua Contact
- Cuối menu là phần blog, là nơi cấp thêm rất nhiều thông tin, cách chế biến các loại ra củ quả
- Quá trình thanh toán diễn ra nhanh chóng
Website đáp ứng hầu hết các chức năng cần thiết cho thương mại điện tử với tốc độ truy cập mượt mà, nhưng vẫn còn một số hạn chế tiềm ẩn.
- Phương thức thanh toán chưa đa dạng (Internet Banking, VISA/MasterCard…)
- Không có mục đánh giá, bình luận về sản phẩm
- Chưa hỗ trợ đăng nhập / đăng ký qua các trang mạng xã hội phổ biến như facebook, google
- Không thể tương tác trực tiếp với khách hàng (live chat)
Hình 12 Trang chủ website freshindiaorganics.com
Freshindiaorganics là website hàng đầu tại Mumbai, Maharashtra, Ấn Độ, chuyên cung cấp nông sản sạch và chất lượng Nơi đây nổi bật với các loại rau củ quả được nhiều người tiêu dùng tin tưởng Freshindiaorganics đang ngày càng phát triển mạnh mẽ trên các nền tảng truyền thông.
Hình 13 Trang danh sách sản phẩm website freshindiaorganics.com
Hình 14 Trang liên hệ website freshindiaorganics.com
Tương tự website fruitworld, freshindiaorganics cũng hỗ trợ đầy đủ các tính năng như trên Tuy nhiên, có vài tính năng nổi bật hơn như:
- Tốc độ load trang nhanh
- Giao diện thân thiện, chi tiết, dễ sử dụng
- Sản phẩm được phân vùng hợp lý, bố cục rõ ràng
- Có liên kết với các kênh mạng xã hội
- Hỗ trợ tương tác trực tiếp với khách hàng thông qua live chat
Khi người dùng duyệt danh sách sản phẩm và muốn xem nhanh chi tiết về một loại rau củ, họ có thể nhấn vào tùy chọn “quick view”.
- Với mỗi sản phẩm, có thể lựa chọn khối lượng cần mua
- Cung cấp tính năng bình luận, đánh giá sản phẩm
- Có thể thêm sản phẩm vào danh mục yêu thích
- Lọc sản phẩm theo mức giá, loại sản phẩm, sản phẩm có sẵn, sale…
- Được phép lựa chọn ngày giao hàng
Website freshindiaorganics được xem là một trong những nền tảng kinh doanh nông sản chất lượng cao nhờ vào việc tối ưu hóa cả giao diện người dùng (UI) và trải nghiệm người dùng (UX) Mặc dù vậy, trang web vẫn tồn tại một số hạn chế cần được cải thiện.
- Phương thức thanh toán chưa đa dạng (Internet Banking, VISA/MasterCard…)
- Cung cấp chưa đầy đủ hình ảnh chi tiết về sản phẩm
- Cỡ chữ còn nhỏ khiến người dùng khó nhìn
- Chưa hỗ trợ đăng nhập / đăng ký qua các trang mạng xã hội phổ biến như facebook, google
Hình 15 Trang chủ website hoamau24h.com
Hoamay24h là một trong những trang web bán nông sản uy tín tại Việt Nam, cung cấp rau củ quả tươi ngon và đạt tiêu chuẩn VietGAP, không thua kém các trang web quốc tế.
Hình 16 Trang danh mục sản phẩm website hoamau24h.com
Hình 17 Trang blog website hoamau24h.com
Bên cạnh đó, hoamay24h còn cung cấp đầy đủ tính năng đáp ứng các yêu cầu của khác hàng, nổi bật hơn hẳn các website trên, đó là:
- Tốc độ load trang nhanh
- Có sự sắp xếp bố cục, chi tiết rõ ràng phù hợp với mọi khách hàng
- Cho phép đăng nhập / đăng ký nhanh chóng thông qua tài khoản facebook, google
- Trò chuyện trực tiếp với khách hàng thông qua facebook / zalo
- Gợi ý sản phẩm cùng loại với mặt hàng rau củ khách hàng đang xem
- Cung cấp các blog về cách chế biến và công dụng của các loại rau củ quả
- Lọc sản phẩm theo giá, thứ tự chữ cái…
- Dễ dàng chỉnh sửa, thanh toán các sản phẩm đã được thêm vào giỏ hàng
Hoamau24h là một trong những trang web hàng đầu về kinh doanh nông sản tại Việt Nam, được đánh giá cao về chất lượng sản phẩm Thực phẩm tại Hoamau24h được người tiêu dùng tin tưởng và ngày càng phát triển mạnh mẽ trên các nền tảng truyền thông Tuy nhiên, vẫn tồn tại một số hạn chế cần khắc phục.
- Chưa cập nhật bản đồ khiến việc tìm kiếm địa chỉ cửa hàng trở nên khó khăn
- Không thể để lại bình luận hay đánh giá chất lượng sản phẩm
- Phương thức thanh toán chưa đa dạng (Internet Banking, VISA/MasterCard…)
- Không cung cấp tính năng bình luận, đánh giá sản phẩm
- Giao diện còn khá đơn sơ
Hình 18 Trang chủ website bio-ngon.com
Tại thành phố Hồ Chí Minh, Bio-ngon là website hàng đầu cung cấp đa dạng các loại rau củ quả chất lượng cao Khách hàng có thể xem thông tin chi tiết về từng sản phẩm khi đặt hàng trên website Đặc biệt, nếu gặp khó khăn trong việc lựa chọn, khách hàng sẽ nhận được sự tư vấn trực tiếp từ nhân viên cửa hàng.
Hình 19 Trang danh sách các sản phẩm đã xem website bio-ngon.com
Hình 20 Trang thanh toán website bio-ngon.com
Hình 21 Trang chi tiết sản phẩm website bio-ngon.com
Website bio-ngon còn nổi bật với các tính năng:
- Tốc độ load trang nhanh
- Giao diện thân thiện, chi tiết, dễ sử dụng
- Sản phẩm được phân vùng hợp lý, bố cục màu sắc hài hoà, dễ nhìn
- Dễ dàng tìm kiếm sản phẩm theo từ khoá
- Đăng nhập qua nhiều hình thức (tài khoản google và facebook)
- Sản phẩm khi hết hàng sẽ được hiển thị và khách hàng không thể thêm vào giỏ
- Gợi ý các sản phẩm đang trong khung giờ flash sale
- Phương thức thanh toán đa dạng
Nhìn chung website bio-ngon đáp ứng được hầu hết các chức năng cần thiết cho website thương mại điện tử Tuy nhiên vẫn còn những hạn chế như:
- Chưa cập nhật bản đồ khiến việc tìm kiếm địa chỉ cửa hàng trở nên khó khăn
- Chưa có tính năng chọn khối lượng cần mua
- Cỡ chữ sản phẩm còn quá nhỏ khiến người dùng khó nhìn
- Chưa hỗ trợ các phương thức thanh toán qua thẻ visa, mastercard
3.1.3 Kết luận sau khi khảo sát
3.1.3.1 Điểm giống nhau của các websites
Từ những khảo sát phía trên, có thể thấy website kinh doanh nông sản hầu hết đều sẽ có những tính năng như sau:
- Lựa chọn, tìm kiếm sản phẩm theo từ khóa
- Gợi ý các sản phẩm liên quan với sản phẩm mà người dùng đang quan tâm
- Dễ dàng thêm sản phẩm vào giỏ hàng
- Chỉnh sửa (thêm, sửa, xóa) sản phẩm trong giỏ hàng
- Đặt hàng, thanh toán nhanh chóng
- Theo dõi, quản lý các đơn hàng đã đặt
- Liên hệ với quản trị viên thông qua messenger
- Quản lý thông tin cá nhân
Ngoài ra đối với hầu hết các website thương mại điện tử, cần đáp ứng đầy đủ các yếu tố sau:
Người dùng mong muốn website phải đảm bảo tính ổn định và mượt mà, dễ sử dụng, thân thiện với người dùng, đồng thời bảo mật thông tin cá nhân và cho phép thanh toán trực tuyến một cách an toàn.
Doanh nghiệp cần duy trì hệ thống hoạt động ổn định để cập nhật thông tin và giá sản phẩm hàng ngày, đồng thời quản lý đơn hàng một cách chặt chẽ và tiếp cận được đa dạng khách hàng.
3.1.3.2 Điểm khác nhau của các websites
Hiện nay, một số websites sẽ cung cấp thêm nhiều tính năng mới giúp cải thiện trải nghiệm người dùng, cụ thể như:
- Về đăng nhập: Có những trang web cung cấp thêm lựa chọn việc đăng nhập bằng google, facebook…
- Chatbox: Nhiều websites hỗ trợ chatbox giúp khách hàng dễ dàng trong việc chọn mua sản phẩm
- Bản đồ: Một vài websites hỗ trợ bản đồ để khách hàng có thể tìm kiếm địa chỉ cửa hàng dễ dàng
- Đánh giá sản phẩm: Nhiều website cho phép khách hàng đánh giá, nhận xét về sản phẩm
- Phương thức thanh toán: Nhiều websites chưa hỗ trợ thanh toán qua các loại thẻ onl (ZaloPay, Visa, Momo…)
Xác định yêu cầu
Các chức năng phía khách (Guest):
STT Tên chức năng Mô tả chức năng
1 Đăng ký Chức năng này cho phép khách hàng đăng ký để trở thành một user của hệ thống
2 Lọc sản phẩm theo danh mục
Chức năng này cho phép guest tìm kiếm sản phẩm thông qua danh mục
3 Lọc sản phẩm theo giá Chức năng này cho phép guest tìm kiếm sản phẩm thông qua giá sản phẩm
4 Tìm kiếm sản phẩm theo từ khoá
Chức năng cho phép guest tìm kiếm sản phẩm thông qua từ khoá
5 Xem danh sách sản phẩm
Chức năng giúp guest xem tất cả các sản phẩm hiện có trên hệ thống
6 Xem chi tiết sản phẩm Chức năng giúp guest xem chi tiết sản phẩm của sản phẩm như tên sản phẩm, giá sản phẩm, mô tả sản phẩm
7 Tương tác với admin thông qua tin nhắn
Chức năng cho phép guest liên lạc với admin
Bảng 2 Chức năng phía guest
Các chức năng phía người dùng (User)
STT Tên chức năng Mô tả chức năng
1 Đăng nhập Chức năng này cho phép user đăng nhập vào hệ thống (quyền user)
2 Cập nhập hồ sơ Chức năng này cho phép user cập nhật thông tin cá nhân của họ
3 Lọc sản phẩm theo danh mục
Chức năng này cho phép user tìm kiếm sản phẩm thông qua danh mục
4 Lọc sản phẩm theo giá Chức năng này cho phép user tìm kiếm sản phẩm thông qua giá sản phẩm
5 Tìm kiếm sản phẩm theo từ khoá
Chức năng cho phép user tìm kiếm sản phẩm thông qua từ khoá
6 Xem danh sách sản phẩm
Chức năng giúp user xem tất cả các sản phẩm hiện có trên hệ thống
7 Xem chi tiết sản phẩm Chức năng này giúp user xem chi tiết sản phẩm của sản phẩm như tên sản phẩm, giá sản phẩm, mô tả sản phẩm
8 Tương tác với admin thông qua tin nhắn
Chức năng này cho phép user liên lạc với admin
9 Thêm sản phẩm vào giỏ hàng
Chức này cho phép user thêm sản phẩm vào giỏ hàng của họ
10 Xoá sản phẩm khỏi giỏ hàng
Chức này cho phép user xoá sản phẩm ra khỏi giỏ hàng của họ
11 Bình luận sản phẩm Chức năng này cho phép user đánh giá sản phẩm thông qua ý kiến của họ
12 Đặt hàng Chức năng này cho phép user đặt hàng
13 Thanh toán Chức này cho phép user thanh toán hoá đơn của họ
14 Sử dụng mã giảm giá Chức này cho phép user sử dụng các mã giảm giá hiện có
Bảng 3 Chức năng phía user
Các chức năng phía người quản trị (Admin):
STT Tên chức năng Mô tả chức năng
1 Đăng nhập Chức này cho phép admin đăng nhập vào hệ thống (quyền admin)
2 Thêm danh mục sản phẩm
Chức năng này cho phép admin thêm danh mục sản phẩm vào hệ thống
3 Cập nhật danh mục sản phẩm
Chức năng này cho phép admin cập nhật danh mục sản phẩm vào hệ thống
4 Xoá danh mục sản phẩm
Chức năng này cho phép admin xoá danh mục sản phẩm ra khỏi hệ thống
5 Thêm sản phẩm Chức năng này cho phép admin thêm sản phẩm vào hệ thống
6 Cập nhật sản phẩm Chức năng này cho phép admin cập nhật sản phẩm vào hệ thống
7 Cập nhật trạng thái hoá đơn
Chức năng này cho phép admin cập nhật trạng thái của hoá đơn vào hệ thống
8 Cập nhật user Chức năng này cho phép admin cập nhật trạng thái của user vào hệ thống
Bảng 4 Chức năng phía admin
3.2.2 Yêu cầu phi chức năng
STT Nội dung Tiêu chuẩn Mô tả chi tiết Ghi chú
1 Cho phép thay đổi giá sản phẩm
Tiến hóa Admin có thể thay đổi đơn giá cho từng sản phẩm
2 - Hình thức tra cứu tiện dụng, trực quan
- Dễ sử dụng cho cả những người không chuyên tin học
Tiện dụng Hỗ trợ khả năng tra cứu gần đúng, tìm kiếm theo tên sản phẩm
3 Các màn hình có sự nhất quán chung
Tương thích Các màn hình có sự đồng nhất về bố
43 cục, màu sắc, kiểu chữ…
4 Tốc độ xử lý việc đặt hàng và thanh toán ở mức ổn định
Hiệu quả Tối đa 10s cho một lần đặt hàng
Tối đa 20s cho một lần thanh toán
5 Bảo mật thông tin người dùng
Bảo mật Mã hóa password của người dùng, xác thực người dùng khi đăng nhập vào hệ thống
6 Hệ thống có thể được bảo trì và nâng cấp dễ dàng trong tương lai
Khả năng bảo trì và mở rộng
Các component được chia rõ ràng và khoa học để có thể dễ dàng nâng cấp và mở rộng về sau
7 Giao diện thân thiện, dễ sử dụng
Giao diện đảm bảo tính tinh gọn, và thân thiện, thực hiện giao dịch và tương tác với website một cách dễ dàng
Bảng 5 Yêu cầu phi chức năng
Mô hình hóa yêu cầu
3.3.1 Danh sách các tác nhân
Có 3 actors chính (nhóm người dùng) sẽ có nhu cầu sử dụng đến Website kinh doanh nông sản, cụ thể sẽ gồm:
Khách hàng vãng lai, hay còn gọi là guest, thường chỉ có nhu cầu xem sản phẩm và cập nhật tin tức Nếu họ cảm thấy hài lòng với những gì đã xem, họ có thể đăng ký tài khoản để tiến hành mua sản phẩm.
- User: là người đã có sẵn tài khoản khách hàng và có nhu cầu về mua sắm hàng hóa nên có thể tiến hành đặt mua sản phẩm
- Admin: là người có quyền kiểm soát mọi hoạt động của hệ thống như quản lý sản phẩm, quản lý đơn hàng,…
Hình 22 Use Case Diagram – User
Hình 23 Use Case Diagram – Admin
Summary Cho phép Guest có thể tạo một tài khoản của họ
Goal Guest đăng ký thành công một tài khoản trên hệ thống
Triggers Guest click chọn nút đăng ký trên màn hình trang chủ
Post-conditions Thành công: Hệ thống sẽ có một tài khoản mới
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Guest thực hiện truy cập tới website
2 Guest thực hiện click chọn nút đăng ký
3 Hệ thống điều hướng tới trang đăng ký
4 Người dùng thực hiện nhập các thông tin: tên tài khoản, email, mật khẩu Sau đó chọn nút đăng ký
5 Hệ thống sẽ tạo một tài khoản mới trên hệ thống sau đó sẽ điều hướng người dùng quay lại trang chủ, tên người dùng sẽ hiển thị trên header
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
2a Người dùng không nhập một trong các thông tin: tên tài khoản, email, mật khẩu
2b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng nhập email hoặc tên tài khoản hoặc mật khẩu”
3a Tên tài khoản đã có người đăng ký 3b Hệ thống sẽ thông báo lỗi với nội dung: “Tên tài khoản đã có người đăng ký”
Bảng 6 Register b Login
Summary Cho phép Guest đăng nhập vào hệ thống
Goal Guest đăng nhập thành công vào hệ thống
Triggers Guest click chọn nút đăng nhập trên màn hình trang chủ
Pre-conditions Guest cần phải nhập chính xác email và mật khẩu
Post-conditions Thành công: Hệ thống sẽ điều hướng người dùng quay lại trang chủ
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Guest thực hiện truy cập tới website
2 Guest thực hiện click chọn nút đăng nhập
3 Hệ thống điều hướng tới trang đăng nhập
4 Người dùng thực hiện nhập các thông tin: email, mật khẩu
5 Email và mật khẩu sẽ xuất hiện trên mỗi input
6 Guest click chọn nút đăng nhập
7 Hệ thống điều hướng quay lại trang chủ
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
2a Người dùng không nhập một trong các thông tin: tên tài khoản, email, mật khẩu
2b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng nhập email hoặc tên tài khoản hoặc mật khẩu”
3a Người dùng nhập sai một trong các thông tin: tên tài khoản, email, mật khẩu
3b Hệ thống sẽ thông báo lỗi với nội dung: “Tên tài khoản hoặc mật khẩu sai.”
Bảng 7 Login c View Product List
Use Case Name View Product List
Summary Cho phép Guest xem tất các sản phẩm hiện có trên hệ thống
Goal Guest xem được tất cả các sản phẩm
Post-conditions Thành công: Hệ thống sẽ hiển thị tất cả các sản phẩm trên màn hình
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Guest thực hiện truy cập vào trang chủ của website
2 Tại trang chủ người dùng sẽ xem được tất cả sản phẩm
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 8 View Product List d View Detailed Product
Use Case Name View Product Details
Summary Cho phép Guest xem thông tin chi tiết của một sản phẩm
Goal Guest có thể xem được thông tin chi tiết của một sản phẩm trên hệ thống
Triggers Guest cần phải thực hiện click chọn vào biểu tượng của sản phẩm trên màn hình trang chủ
Post-conditions Thành công: Hệ thống sẽ xuất hiện thông tin chi tiết của sản
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Guest thực hiện truy cập tới website
2 Guest thực hiện click vào biểu tưởng sản phẩm trên màn hình trang chủ
3 Hệ thống điều hướng tới trang chi tiết sản phẩm, thông tin của sản phẩm sẽ được hiển thị
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 9 View Detailed Product e Filter Product
Use Case Name Filter Product
Summary Cho phép Guest có thể lọc sản phẩm để tìm kiếm sản phẩm thông qua giá của sản phẩm
Goal Guest có thể lọc sản phẩm để tìm kiếm sản phẩm thông qua giá của sản phẩm
Triggers Guest cần phải thực hiện click chọn phương thức lọc giá hoặc nhập giá sản phẩm
Post-conditions Thành công: Hệ thống sẽ lọc sản phẩm theo lựa chọn mà người dùng muốn
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra Main Success
1 Guest thực hiện truy cập tới trang sản phẩm theo danh mục
2 Hệ thống sẽ điều hướng tới trang xem sản phẩm theo danh mục
3 Guest nhập khoảng giá nhỏ nhất và lớn nhất mà mình
51 muốn hoặc chọn phương thức giá mà mình muốn lọc
4 Hệ thống sẽ xuất hiện các sản phẩm theo mức giá mà người dùng muốn
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 10 Filter Product By Keyword f Search Product
Use Case Name Search Product
Summary Cho phép Guest có thể tìm kiếm sản phẩm thông qua từ khoá
Goal Guest có thể tìm kiếm sản phẩm thông qua từ khoá
Triggers Guest cần phải thực hiện nhập từ khoá sản phẩm
Post-conditions Thành công: Hệ thống sẽ xuất hiện tên các sản phẩm theo từ khoá mà người dùng đã nhập
1 Guest thực hiện truy cập tới website
2 Guest nhập từ khoá tìm kiếm vào ô tìm kiếm
3 Hệ thống sẽ xuất hiện tên các sản phẩm theo từ khoá đã nhập
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 11 Search Product g Send Message
Use Case Name Send Message
Summary Cho phép Guest có thể tương tác admin thông qua tin nhắn
Goal Guest có thể tương tác với admin của hệ thống
Post-conditions Thành công: Người dùng có thể tương tác với quản trị viên website
1 Guest thực hiện click chọn vào biểu tượng messenger trên màn hình trang chủ
2 Màn hình tin nhắn sẽ xuất hiện
3 Guest click chọn button Start chat để bắt đầu
4 Hệ thống sẽ xuất hiện các button và input để nhập tin nhắn
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 12 Send Message h View Product by Category
Use Case Name View Product By Category
Summary Cho phép Guest có thể xem các sản phẩm theo từng loại danh mục
Goal Guest có thể xem các sản phẩm theo từng loại danh mục
Post-conditions Thành công: Các sản phẩm theo từng danh mục sẽ xuất hiện
1 Guest thực hiện click chọn vào tên danh mục sản phẩm bất kỳ trên header
2 Hệ thống sẽ điều hướng tới trang sản phẩm theo danh mục tương ứng
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 13 View Product By Category
Summary Cho phép User đăng xuất tài khoản ra khỏi hệ thống
Goal User đăng xuất thành công
Triggers User click vào button Logout trên menu profile
Pre-conditions User đã đăng nhập vào hệ thống thành công
Post-conditions Thành công: Hệ thống sẽ điều hướng tới trang đăng nhập
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 User thực hiện di chuyển con trỏ tới biểu tượng profile trên header
2 Hệ thống sẽ xuất hiện menu profile
3 User thực hiện chọn button Logout
4 Trang đăng nhập sẽ xuất hiện và hệ thống thông báo với nội dung: “Đăng xuất thành công”
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 14 Logout b Edit Profile
Use Case Name Edit Profile
Summary Cho phép User cập nhật thông tin tài khoản
Goal Thông tin tài khoản được cập nhật trên hệ thống
Triggers User click vào button Thông tin tài khoản trên menu Profile
Pre-conditions User đã đăng nhập vào hệ thống thành công
Post-conditions Thành công: Hệ thống sẽ cập nhật thông tin tài khoản thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 User thực hiện di chuyển con trỏ tới biểu tượng profile trên header
2 Hệ thống sẽ xuất hiện menu profile
3 User thực hiện chọn button Thông tin tài khoản
4 Hệ thống sẽ điều hướng tới trang profile
5 User thực hiện nhập thông tin cần cập nhật vào form
6 User click chọn button Cập nhật tài khoản
7 Thông báo thông tin tài khoản đã cập nhật thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Use Case Name Add To Cart
Summary Cho phép User thêm sản phẩm vào giỏ hàng
Goal Sản phẩm được thêm vào giỏ hàng thành công
Triggers User click vào button Thêm vào giỏ hàng tại trang chi tiết sản phẩm
Pre-conditions User đã đăng nhập vào hệ thống thành công
Post-conditions Thành công: Sản phẩm được thêm vào giỏ hàng thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra Main Success
1 User thực hiện click vào biểu tượng sản phẩm muốn thêm vào giỏ hàng
2 Hệ thống điều hướng sang trang chi tiết sản phẩm
3 User thực hiện chọn button Thêm vào giỏ hàng trên màn hình chi tiết sản phẩm
4 Hệ thống thông báo sản phẩm đã được thêm thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 16 Add To Cart
Use Case Name Remove From Cart
Summary Cho phép User xoá sản phẩm ra khỏi giỏ hàng
Goal Sản phẩm được xoá khỏi giỏ hàng thành công
Triggers User click vào biểu tượng xoá sản phẩm tại trang giỏ hàng
Pre-conditions - User đã đăng nhập vào hệ thống thành công
- Có ít nhất một sản phẩm trong giỏ hàng
Post-conditions Thành công: Sản phẩm được xoá khỏi giỏ hàng thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra Main Success
1 User thực hiện click vào biểu tượng giỏ hàng trên thanh header
2 Hệ thống điều hướng sang trang giỏ hàng
3 User thực hiện chọn biểu tượng xoá
4 Hệ thống thông báo sản phẩm được xoá thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 17 Remove From Cart d Using Voucher
Use Case Name Using Voucher
Summary Cho phép User sử dụng voucher để nhận giảm giá khi mua sản phẩm
Goal User sử dụng voucher thành công khi mua sản phẩm
Triggers User click vào button mã giảm giá tại trang giỏ hàng
Pre-conditions - User đã đăng nhập vào hệ thống thành công
- Có ít nhất một sản phẩm trong giỏ hàng
Post-conditions Thành công: Mã giảm giá được áp dụng thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 User thực hiện click vào biểu tượng giỏ hàng trên thanh header
2 Hệ thống điều hướng sang trang giỏ hàng
3 User thực hiện chọn biểu tượng mã giảm giá
4 Các mã giảm giá hiện có sẽ xuất hiện
5 User thực hiện chọn mã giảm giá và click chọn button Áp
6 Giá đơn hàng sẽ được giảm tuỳ theo mã giảm giá được áp dụng
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 18 Using Voucher e Comment Product
Use Case Name Comment Product
Summary Cho phép User đánh giá, nhận xét về sản phẩm thông qua bình luận
Goal User đánh giá, nhận xét sản phẩm thành công
Pre-conditions User đã đăng nhập vào hệ thống thành công
Post-conditions Thành công: User bình luận trên trang chi tiết sản phẩm thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 User chọn sản phẩm muốn xem chi tiết
2 Hệ thống điều hướng sang trang chi tiết sản phẩm
3 Tại trang chi tiết sản phẩm user thực hiện nhập thông điệp đánh giá và đánh giá số sao cho sản phẩm
4 Phần nhập bình luận hiển thị đoạn văn bản mà người dùng đã nhập và số sao hiển thị mà người dùng đã chọn
5 User thực hiện click button để gửi đánh giá
6 Hệ thống hiển thị đánh giá của người dùng đã nhập
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
2a Người dùng chưa đăng nhập 2b Hệ thống hiển thị thông báo yêu cầu người dùng đăng nhập để thực hiện chức năng
Bảng 19 Comment Product f Place Order
Use Case Name Place Order
Summary Cho phép User đặt hàng khi đã lựa chọn các sản phẩm hoàn tất
Goal User đặt hàng thành công
Triggers User click vào button Mua hàng tại trang giỏ hàng
Pre-conditions - User đã đăng nhập vào hệ thống thành công
- Có ít nhất một sản phẩm trong giỏ hàng
- Sản phẩm phải được tích chọn trong giỏ hàng
Post-conditions Thành công: User đặt hàng mua sản phẩm thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 User thực hiện truy cập biểu tượng giỏ hàng
2 Hệ thống sẽ điều hướng tới trang giỏ hàng
3 User thực hiện tích chọn các sản phẩm muốn mua
4 Hệ thống xuất hiện các đánh dấu các sản phẩm mà người dùng chọn
5 User thực hiện click chọn button đặt hàng
6 Hệ thống sẽ điều hướng tới trang thanh toán
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Nếu người dùng không chọn sản phẩm nào, hệ thống sẽ thông báo yêu cầu họ chọn sản phẩm Ngoài ra, nếu người dùng chưa cập nhật địa chỉ giao hàng, hệ thống cũng sẽ thông báo yêu cầu họ nhập địa chỉ giao hàng.
Bảng 20 Place Order g Checkout
Summary Cho phép User thanh toán đơn hàng khi mua sản phẩm
Goal User thanh toán hoá đơn thành công
Triggers User đã hoàn tất việc đặt hàng
Pre-conditions - User đã đăng nhập vào hệ thống thành công
- User đã được điều hướng tới trang thanh toán
Post-conditions Thành công: Sản phẩm được mua và hoàn tất thanh toán
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 User kiểm tra và click chọn phương thức thanh toán
2 Hệ thống sẽ đánh dấu phương thức mà User đã chọn
3 User click chọn button Thanh toán
1a User chọn phương thức thanh toán tiền mặt khi nhận hàng 2a User click chọn button Thanh toán
3a Hệ thống thông báo thanh toán thành công và chuyển hướng về trang chủ
1b User chọn phương thức thanh toán bằng Momo 2b User click chọn button Thanh toán
3b Hệ thống chuyển hướng sang trang thanh toán với Momo 4b Người dùng thực hiện quét mã thanh toán
5b Sau khi thực hiện quét mã thành công hệ thống thông báo và quay lại trang giỏ hàng
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 21 Checkout h Order Tracking
Use Case Name View Order Tracking
Summary Cho phép User theo dõi tất cả các đơn đặt hàng của họ
Goal Người dùng có thể theo dõi tất cả các đơn đặt hàng
Triggers User thực hiện click vào button Quản lý đơn hàng tại
Pre-conditions - User đã đăng nhập vào hệ thống thành công
Post-conditions Thành công: Hệ thống hiển thị tất cả các đơn đặt hàng và trạng thái đi kèm
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Người dùng thực hiện click vào button Quản lý đơn hàng tại Dashboard Profile
2 Hệ thống hiển thị tất cả các đơn hàng và trạng thái đi kèm
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 22 Order Tracking i Cancel Order
Use Case Name Cancel Order
Summary Cho phép User huỷ bỏ đơn hàng của họ
Goal Người dùng có thể huỷ bỏ thành công đơn hàng
Triggers User thực hiện click vào button Huỷ bỏ tại trang quản lý đơn hàng
Pre-conditions - User đã đăng nhập vào hệ thống thành công
- Phải có tối thiểu một hoá đơn và trạng thái hoá đơn không được ở trạng thái huỷ bỏ
Post-conditions Thành công: Người dùng huỷ bỏ hoá đơn thành công
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Người dùng thực hiện click vào button Quản lý đơn hàng tại Dashboard Profile
2 Hệ thống hiển thị tất cả các đơn hàng và trạng thái đi kèm
3 Người dùng thực hiện click vào button Huỷ bỏ
4 Hệ thống thông báo huỷ bỏ hoá đơn thành công và trạng thái hoá đơn được cập nhật thành huỷ bỏ
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Summary Cho phép Admin đăng nhập vào hệ thống
Goal Admin đăng nhập vào hệ thống thành công
Triggers Admin truy cập vào trang đăng nhập của Admin
Pre-conditions Admin cần nhập chính xác email và mật khẩu
Post-conditions Thành công: Admin được điều hướng quay lại trang chủ
Thất bại: Hệ thống thông báo lỗi xảy ra
Main Success 1 Admin truy cập đến trang đăng nhập
Scenario 2 Trang đăng nhập sẽ xuất hiện
3 Admin nhập email và mật khẩu
4 Thông tin email và mật khẩu sẽ hiện trên mỗi input
5 Admin click chọn button Đăng nhập
6 Hệ thống điều hướng quay lại trang chủ và thông báo đăng nhập thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
2a Admin không để trống input mật khẩu hoặc email
2b Hệ thống thông báo yêu cầu nhập đủ các thông tin đăng nhập
Bảng 24 Login b Logout
Summary Cho phép Admin đăng xuất ra khỏi hệ thống
Goal Admin đăng xuất ra khỏi hệ thống thành công
Triggers Admin click chọn button đăng xuất
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Admin đăng xuất ra khỏi hệ thống thành công
Thất bại: Hệ thống thông báo lỗi xảy ra
1 Admin click chọn button Đăng xuất trong menu profile
2 Hệ thống sẽ điều hướng quay lại trang đăng nhập
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Use Case Name Delete Account
Summary Cho phép Admin vô hiệu hoá tài khoản của một user
Goal Tài khoản user bị vô hiệu hoá thành công
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Tài khoản user được chọn bị vô hiệu hoá
Thất bại: Hệ thống thông báo lỗi xảy ra
1 Admin truy cập vào trang quản lý người dùng thông qua menu profile
2 Hệ thống điều hướng sang trang quản lý người dùng
3 Admin chọn user cần xoá và click vào biểu tượng xoá
4 Hệ thống hiển thị thông báo người dùng có chắc chắn xoá
6 Tài khoản được chọn bị vô hiệu hoá
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 26 Delete Account d Manage Category
Use Case Name Create Category
Summary Cho phép Admin tạo danh mục sản phẩm mới
Goal Danh mục sản phẩm mới được tạo thành công
Triggers Admin click chọn button thêm danh mục sản phẩm
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ có thêm danh mục mới
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin click chọn button thêm danh mục sản phẩm
2 Giao diện thêm danh mục sẽ xuất hiện
3 Admin tiến thành nhập các thông tin: tên danh mục sản phẩm, slug, hình ảnh danh mục
4 Các thông tin đã nhập sẽ xuất hiện trên input
5 Admin click chọn button thêm danh mục
6 Hệ thống thông báo thêm danh mục thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Tên danh mục đã tồn tại, hệ thống sẽ thông báo cho người dùng Nếu người dùng để trống các thông tin input, hệ thống sẽ yêu cầu nhập đầy đủ các thông tin cần thiết.
Use Case Name Update Category
Summary Cho phép Admin cập nhật thông tin danh mục sản phẩm
Goal Admin có thể cập nhật danh mục sản phẩm trên hệ thống
Triggers Admin click vào icon cập nhật tại trang danh mục sản phẩm
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ cập nhật lại danh mục sản phẩm
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào biểu tượng cập nhật tại trang danh mục sản phẩm
2 Giao diện cập nhật sẽ xuất hiện
3 Admin thực hiện điều chỉnh các thông tin
4 Admin chọn button cập nhật danh mục sản phẩm
5 Hệ thống thông báo danh mục sản phẩm cập nhật thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Use Case Name Delete Category
Summary Cho phép Admin xoá danh mục danh mục sản phẩm
Goal Admin có thể xoá danh mục sản phẩm trên hệ thống
Triggers Admin click vào icon xoá tại trang danh mục sản phẩm
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ xoá danh mục sản phẩm ra khỏi hệ thống
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào biểu tượng xoá tại trang quản lý danh mục sản phẩm
2 Hệ thống thông báo xoá danh mục sản phẩm thành công và cập nhật lại danh sách danh mục sản phẩm
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Use Case Name Create Product
Summary Cho phép Admin thêm sản phẩm mới vào hệ thống
Goal Cho phép Admin thêm sản phẩm mới vào hệ thống
Triggers Admin click chọn button thêm sản phẩm
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ thêm sản phẩm mới trên hệ thống
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào biểu tượng thêm sản phẩm tại trang sản phẩm
2 Hệ thông sẽ điều hướng sang trang thêm sản phẩm
3 Admin thực hiện điều chỉnh các thông tin
4 Admin chọn button thêm sản phẩm
5 Hệ thống thông báo sản phẩm thêm thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
2a Điền thiếu thông tin 2b Hệ thống sẽ thông báo Vui lòng nhập đẩy đủ các thông tin
Use Case Name Update Product
Summary Cho phép Admin cập nhật thông tin sản phẩm trên hệ thống
Goal Cho phép Admin cập nhật thông tin sản phẩm trên hệ thống
Triggers Admin click chọn button cập nhật sản phẩm
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ cập nhật sản phẩm trên hệ thống
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào biểu tượng cập nhật sản phẩm tại trang sản phẩm
2 Hệ thông sẽ điều hướng sang trang cập nhật sản phẩm
3 Admin thực hiện điều chỉnh các thông tin
4 Admin chọn button cập nhật sản phẩm
5 Hệ thống thông báo sản phẩm cập nhật thành công
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
2a Điền thiếu thông tin 2b Hệ thống sẽ thông báo Vui lòng nhập đẩy đủ các thông tin
Use Case Name Delete Product
Summary Cho phép Admin xoá sản phẩm trên hệ thống
Goal Cho phép Admin xoá sản phẩm trên hệ thống
Triggers Admin click chọn button xoá sản phẩm
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ xoá sản phẩm ra khỏi hệ thống
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào biểu tượng xoá sản phẩm tại trang sản phẩm
2 Hệ thông sẽ thông báo xoá sản phẩm thành công và cập nhật lại danh sách sản phẩm
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 32 Delete Product f View List Order
Use Case Name View List Order
Summary Cho phép Admin xem danh sách đơn hàng trên hệ thống
Goal Cho phép Admin xem danh sách đơn hàng trên hệ thống
Triggers Admin click chọn tab hoá đơn trên menu profile
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống sẽ hiển thị danh sách hoá đơn trên hệ thống
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào tab xem danh sách hoá đơn trên menu profile
2 Hệ thông sẽ điều hướng sang trang hoá đơn và hiển thị danh sách hoá đơn
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 33 View List Order
Use Case Name Change Status Order
Summary Cho phép Admin cập nhật trạng thái đơn hàng trên hệ thống
Goal Cho phép Admin cập nhật trạng thái đơn hàng trên hệ thống
Triggers Admin click chọn tab hoá đơn trên menu profile
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Có tối thiểu một hoá đơn trên hệ thống và trạng thái hoá đơn khác complete
Post-conditions Thành công: Hệ thống sẽ hiển thị danh sách hoá đơn trên hệ thống
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào tab xem danh sách hoá đơn trên menu profile
2 Hệ thống hiển thị danh sách hoá đơn và đi kèm trạng thái của hoá đơn
3 Admin thực hiện click chọn trạng thái trên thanh chọn tại hoá đơn cần cập nhật
4 Admin thực hiện chọn button Confirm để thực hiện cập nhật
5 Hệ thống thực hiện cập nhật lại trạng thái hoá đơn
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 34 Change Status Order g Access Admin Page
Use Case Name Access Admin Page
Summary Cho phép Admin truy cập page admin trên hệ thống
Goal Admin truy cập page admin thành công
Triggers Admin click vào Trang quản lý trên menu profile
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống điều hướng admin sang trang admin
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
Main Success 1 Admin thực hiện click vào tab Trang quản lý tại menu
2 Hệ thống sẽ điều hướng sang trang admin
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
Bảng 35 Access Admin Page h View Statistic
Use Case Name View Statistic
Summary Cho phép Admin xem thống kê doanh thu cửa hàng
Goal Admin có thể xem thống kê doanh thu
Triggers Admin click vào button Statistic trên menu profile
Pre-conditions Admin đã đăng nhập thành công vào hệ thống
Post-conditions Thành công: Hệ thống hiển thị biểu đồ doanh thu
Thất bại: Hệ thống sẽ thông báo lỗi xảy ra
1 Admin thực hiện click vào tab Statistic tại menu profile
2 Hệ thống sẽ hiển thị biểu đồ doanh thu của cửa hàng
Exception 1a Không có kết nối internet
1b Hệ thống sẽ thông báo lỗi với nội dung: “Vui lòng kiểm tra lại đường truyền mạng!”
