đồ án 1 xây dựng ứng dụng di động kinh doanh thiết bị điện tử

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TINKHOA CÔNG NGHỆ PHẦN MỀM

ĐÀO XUÂN HUY – 21520913TRẦN THANH HIỀN – 21520230

BÁO CÁO ĐỒ ÁN 1

XÂY DỰNG ỨNG DỤNG DI ĐỘNG KINH DOANH THIẾT BỊ ĐIỆN TỬ

GIẢNG VIÊN HƯỚNG DẪNTHS TRẦN THỊ HỒNG YẾN

TP HỒ CHÍ MINH, 2023

LỜI CẢM ƠN

Sau quá trình học tập và rèn luyện tại khoa Công nghệ Phần mềm trường Đạihọc Công nghệ Thông tin – ĐHQG TP.HCM, chúng em đã được trang bị các kiếnthức cơ bản cùng các kỹ năng thực tế để có thể hoàn thành Đồ án 1 của mình.

Để hoàn thành đồ án này, với lòng biết ơn sâu sắc chúng em xin gửi lời cảmơn chân thành đến cô Trần Thị Hồng Yến vì đã tận tình giúp đỡ, định hướng cách tưduy và hướng làm việc khoa học Bước đầu tiếp cận các công nghệ mới, nhóm cònnhiều thiếu sót về mặt kiến thức cũng như kinh nghiệm thực tiễn nên không tránhkhỏi nhiều sai sót Những nhận xét, góp ý chân tình của cô là hết sức quý báu khôngchỉ trong quá trình thực hiện đồ án mà còn là hành trang tiếp bước cho nhóm trongquá trình học tập và làm việc sau này.

Trong suốt thời gian thực hiện, nhóm đã tự tìm hiểu các công nghệ mới và kếthợp với những kiến thức nền tảng trong quá trình học tập, nghiên cứu và vận dụngđể thực hiện đề tài này Với quỹ thời gian có hạn cũng như kinh nghiệm xây dựngsản phẩm còn thiếu, sản phẩm đồ án cuối cùng có thể sẽ mắc phải một số sai sót vàchúng em rất mong sẽ nhận được những góp ý của cô để bổ sung, cải tiến sản phẩmcũng như nâng cao kiến thức để xây dựng các sản phẩm tiếp theo sẽ chỉn chu vàhoàn thiện hơn, và tích luỹ thêm cho mình những kinh nghiệm quý giá để đáp ứngtốt cho những công việc thực tế trong tương lai.

Sau cùng, xin chúc cô cũng như các giáo viên tại trường Công nghệ Thông tinnói chung thật dồi dào sức khỏe, niềm tin để tiếp tục truyền đạt kiến thức cho cácbạn sinh viên.

Sinh viên

Đào Xuân HuyTrần Thanh Hiền

NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN

ThS Trần Thị Hồng Yến

1.4 Đối tượng nghiên cứu 2

1.5 Phương pháp nghiên cứu 2

3.2 Xác định chức năng, yêu cầu 10

3.2.1 Yêu cầu chức năng 10

3.2.1.1 Yêu cầu lưu trữ 10

3.2.1.2 Yêu cầu hiển thị 11

3.2.2 Yêu cầu phi chức năng 13

3.3.1.2 Mô tả các thành phần trong kiến trúc hệ thống 16

3.3.2 Sơ đồ Use case 17

3.3.2.1 Sơ đồ Use case tổng quát 17

3.3.2.2 Sơ đồ Use case chi tiết 18

3.3.2.3 Danh sách Actor 20

3.3.2.4 Danh sách Usecase 20

3.3.3 Đặc tả Use case 23

3.3.3.1 Đặc tả use case Đăng nhập 23

3.3.3.2 Đặc tả use case Đăng ký 24

3.3.3.3 Đặc tả use case Xem thông tin cá nhân 26

3.3.3.4 Đặc tả use case Chỉnh sửa thông tin cá nhân 26

3.3.3.5 Đặc tả use case Xem địa chỉ giao hàng 27

3.3.3.6 Đặc tả use case Thêm địa chỉ giao hàng 28

3.3.3.7 Đặc tả use case Sửa địa chỉ giao hàng 29

3.3.3.8 Đặc tả use case Xem sản phẩm 30

3.3.3.9 Đặc tả use case Tìm kiếm sản phẩm 31

3.3.3.10 Đặc tả use case Lọc sản phẩm 32

3.3.3.11 Đặc tả use case Xem danh mục sản phẩm 32

3.3.3.12 Đặc tả use case Tìm kiếm danh mục sản phẩm 33

3.3.3.13 Đặc tả use case Xem sản phẩm trong danh sách yêu thích 34

3.3.3.14 Đặc tả use case Thêm sản phẩm vào danh sách yêu thích 35

3.3.3.15 Đặc tả use case Xóa sản phẩm khỏi danh sách yêu thích 35

3.3.3.16 Đặc tả use case Xem sản phẩm trong giỏ hàng 36

3.3.3.17 Đặc tả use case Thêm sản phẩm vào giỏ hàng 37

3.3.3.18 Đặc tả use case Xóa sản phẩm khỏi giỏ hàng 38

3.3.3.20 Đặc tả use case Xem tổng số lượng sản phẩm trong giỏ hàng 39

3.3.3.21 Đặc tả use case Xem tổng giá trị sản phẩm trong giỏ hàng 40

3.3.3.22 Đặc tả use case Đặt hàng 40

3.3.3.23 Đặc tả use case Xem sản phẩm trong đơn hàng 41

3.3.3.24 Đặc tả use case Thanh toán 42

3.3.3.25 Đặc tả use case Đánh giá sản phẩm 43

3.3.3.26 Đặc tả use case Xem lịch sử đặt hàng 44

3.3.3.27 Đặc tả use case Xem tình trạng đơn hàng 45

3.3.3.28 Đặc tả use case Xem phương thức thanh toán 46

4.6 Màn hình Chi tiết loại sản phẩm 62

YHình 3 1 Sơ đồ kiến trúc hệ thống 15

Hình 3 2 Sơ đồ Use case User tổng quát 17

Hình 3 3 Sơ đồ Use case chi tiết quản lý tài khoản 18

Hình 3 4 Sơ đồ Use case chi tiết quản lý danh mục yêu thích 18

Hình 3 5 Sơ đồ Use case chi tiết cho quản lý giỏ hàng 19

Hình 3 6 Sơ đồ Use case chi tiết cho quản lý đơn hàng 20

Hình 4 10 Code thiết kế màn hình Danh mục sản phẩm 61

Hình 4 11 Màn hình Chi tiết loại sản phẩm 62

Hình 4 12 Code thiết kế màn hình Chi tiết loại sản phẩm 63

Hình 4 13 Màn hình Chi tiết sản phẩm 64

Hình 4 14 Thiết kế màn hình chi tiết sản phẩm 65

Hình 4 15 Màn hình Thông báo 66

Hình 4 26 Code thiết kế màn hình Tài khoản 77

Hình 4 27 Màn hình Chỉnh sửa tài khoản 78

Hình 4 28 Code thiết kế màn hình Chỉnh sửa tài khoản 79

Hình 4 29 Màn hình Lịch sử đặt hàng 79

Hình 4 30 Code thiết kế màn hình Lịch sử đặt hàng 81

DANH MỤC BẢNG

Bảng 3 1 Bảng mô tả các thành phần trong kiến trúc hệ thống 16

Bảng 3 2 Danh sách các Actor 20

Bảng 3 3 Bảng danh sách các Use case 20

Bảng 3 4 Bảng đặc tả Use case Đăng nhập 23

Bảng 3 5 Bảng đặc tả Use case Đăng ký 24

Bảng 3 6 Bảng đặc tả Use case xem thông tin cá nhân 26

Bảng 3 7 Bảng đặc tả Use case Chỉnh sửa thông tin cá nhân 26

Bảng 3 8 Bảng đặc tả Use case Xem địa chỉ giao hàng 27

Bảng 3 9 Bảng đặc tả Use case Thêm địa chỉ giao hàng 28

Bảng 3 10 Bảng đặc tả Use case sửa địa chỉ giao hàng 29

Bảng 3 11 Bảng đặc tả Use case xem sản phẩm 30

Bảng 3 12 Bảng đặc tả Use case tìm kiếm sản phẩm 31

Bảng 3 13 Bảng đặc tả Use case Lọc sản phẩm 32

Bảng 3 14 Bảng đặc tả Use case xem danh mục sản phẩm 32

Bảng 3 15 Bảng đặc tả Use case tìm kiếm danh mục sản phẩm 33

Bảng 3 16 Bảng đặc tả Use case xem sản phẩm trong danh sách yêu thích 34

Bảng 3 17 Bảng đặc tả Use case thêm sản phẩm vào danh sách yêu thích 35

Bảng 3 18 Bảng đặc tả Use case xóa sản phẩm khỏi danh sách yêu thích 35

Bảng 3 19 Bảng đặc tả Use case xem sản phẩm trong giỏ hàng 36

Bảng 3 20 Bảng đặc tả Use case thêm sản phẩm vào giỏ hàng 37

Bảng 3 21 Bảng đặc tả Use case xóa sản phẩm khỏi giỏ hàng 38

Bảng 3 22 Bảng đặc tả Use case xóa sản phẩm khỏi giỏ hàng 38

Bảng 3 23 Bảng đặc tả Use case xem tổng số lượng sản phẩm trong giỏ hàng 39

Bảng 3 24 Bảng đặc tả Use case xem tổng giá trị sản phẩm trong giỏ hàng 40

Bảng 3 25 Bảng đặc tả Use case đặt hàng 41

Bảng 3 26 Bảng đặc tả Use case xem sản phẩm trong đơn hàng 42

Bảng 3 27 Bảng đặc tả Use case thanh toán 42

Bảng 3 29 Bảng đặc tả Use case xem lịch sử đặt hàng 44

Bảng 3 30 Bảng đặc tả Use case xem tình trạng đơn hàng 45

Bảng 3 31 Bảng đặc tả Use case xem phương thức thanh toán 46

CHƯƠNG 1.Giới thiệu đề tài1.1.Lý do chọn đề tài

Thiết bị điện tử đang đóng vai trò vô cùng quan trọng trong cuộc sống hiệnđại, ảnh hưởng đến nhiều khía cạnh của chúng ta từ công việc, giáo dục, giao tiếpđến giải trí và nhu cầu hàng ngày Chính vì sự phổ biến và tiến bộ liên tục của cácthiết bị điện tử đã mở ra nhiều cơ hội mới trong lĩnh vực kinh doanh và giải trí Thịtrường thiết bị điện tử được xem là một trong những thị trường lớn và phát triểnnhanh nhất thế giới

Bên cạnh đó, mua sắm trực tuyến đang trở thành một phần không thể thiếutrong cuộc sống hàng ngày của mọi người Khách hàng ngày càng tìm kiếm sự tiệnlợi và trải nghiệm mua sắm tốt hơn qua điện thoại di động của họ Việc xây dựngứng dụng mua bán thiết bị điện tử cũng mang lại cơ hội tối ưu hóa trải nghiệmngười dùng thông qua việc tích hợp các tính năng tiện ích như tìm kiếm sản phẩm,đánh giá, bình luận, và thanh toán trực tuyến Ngoài ra, chúng ta còn có thể sử dụngdữ liệu thu thập từ người dùng để tùy chỉnh và đề xuất các sản phẩm phù hợp với sởthích và nhu cầu của họ, tạo nên một trải nghiệm mua sắm cá nhân và hấp dẫn

Chính vì những lợi ích đáng kể và đáp ứng phần lớn nhu cầu mua hàng onlinetrong cuộc sống, chúng em quyết định chọn thực hiện đề tài “Xây dựng ứng dụng diđộng bán thiết bị điện tử” Cửa hàng có thể đưa các sản phẩm lên ứng dụng củamình và quản lý chúng, khách hàng có thể thỏa thích chọn lựa mẫu mã và tiến hànhđặt mua hàng mà không cần đến cửa hàng Đồng thời, cửa hàng còn có thể thôngqua ứng dụng để quảng bá tốt hơn về các sản phẩm mà mình bán ra.

1.2.Mục tiêu đề tài

- Tạo trải nghiệm mua sắm thuận tiện và dễ dàng: Ứng dụng tối ưu giao

diện người dùng và trải nghiệm mua sắm để người dùng có thể dễ dàng tìmkiếm, xem thông tin sản phẩm và thực hiện thanh toán một cách thuận tiện

- Theo dõi và đánh giá hiệu quả: Thiết lập các hệ thống theo dõi hiệu quả

của ứng dụng dành cho quản trị viên, bao gồm số lượt tải xuống, doanh sốbán hàng, đánh giá và phản hồi từ khách hàng, để đánh giá và cải thiện quytrình kinh doanh và trải nghiệm người dùng.

- Tìm hiểu công nghệ xây dựng ứng dụng di động gồm: Figma, Flutter,Nodejs, MongoDB.

- Khảo sát phần mềm bán hàng trên thị trường, đặc biệt là các phần mềm bánthiết bị điện tử, từ đó tiến hành phân tích, xác định yêu cầu, tính năng cụ thểcho đề tài.

- Phân tích, thiết kế hệ thống ứng dụng.- Thiết kế:

 Thiết kế đối tượng. Thiết kế dữ liệu. Thiết kế giao diện.- Cài đặt.

- Triển khai và kiểm thử.- Hoàn thiện sản phẩm.

- Chức năng giỏ hàng, mua hàng, theo dõi đơn hàng, lịch sử mua hàng.- Chức năng thanh toán kết hợp các cổng thanh toán điện tử.

1.7.Công nghệ sử dụng

- Công cụ thiết kế UI/UX: Figma.- Xây dựng ứng dụng: Android, IOS.- Front-end:

 Ngôn ngữ sử dụng: Dart  Thư viện sử dụng: Flutter.- Back-end:

 Ngôn ngữ sử dụng: Javascript  Thư viện sử dụng: Nodejs.- Database: MongoDB.

- Source Control: Github.

CHƯƠNG 2.Tìm hiểu cơ sở lý thuyết2.1.Tổng quan về flutter

2.1.1 Giới thiệu

- Flutter là một nền tảng UI mã nguồn mở và miễn phí, do Google tạo ra và

ra mắt vào tháng 5 năm 2017 Flutter giúp người dùng xây dựng các ứngdụng gốc cho di động, có giao diện đẹp và chất lượng cao, chỉ với mộtcodebase duy nhất cho iOS và Android

- Flutter bao gồm hai thành phần chính là:

 Một SDK (Bộ công cụ phát triển phần mềm): Bao gồm các công cụ hỗtrợ người dùng trong quá trình phát triển ứng dụng Nó cũng có cáccông cụ biên dịch code thành code gốc cho iOS và Android.

 Một Framework (Thư viện UI dựa trên widget): Bao gồm các thànhphần giao diện người dùng có thể sử dụng lại như slider, button, giúp người dùng tùy biến theo ý muốn.

2.1.2 Ưu điểm

- Hot Reload và Hot Restart, cho phép bạn xem ngay lập tức các thay đổi

trong mã nguồn mà không cần khởi động lại ứng dụng.

- Hiệu năng gốc, cho phép ứng dụng chạy mượt mà và nhanh chóng trên

các thiết bị di động, web, máy tính để bàn và nhúng.

- Giao diện đẹp, cho phép bạn tùy biến và sử dụng lại các widget, hiệu

ứng, hoạt hình và ứng dụng Flutter.

Hình 2 1 Flutter

2.1.3 Nhược điểm

- Bộ nhớ sử dụng cao, do Flutter sử dụng bộ render UI riêng, không dựa

trên UI có sẵn của nền tảng gốc.

- Ngôn ngữ Dart khó học, do Dart là một ngôn ngữ mới và khác biệt với

các ngôn ngữ phổ biến khác như Java, Kotlin, Swift, JavaScript.

2.2.Tổng quan về Bloc – State management2.2.1 Giới thiệu

- Bloc là một thư viện dùng để điều khiển các State trong các ứng dụngFlutter Bloc dựa trên RxDart, sử dụng “event” làm Input và “state” làmOutput.

- Đặc điểm của State Management này là có thể phân chia các Bloc thànhcác Component riêng biệt, mỗi Component chỉ đảm nhiệm một BusinessLogic, nhờ vậy sẽ không gây xung đột, rối loạn với các Code Logic khác.

- Bloc không sử dụng UI có sẵn của framework native, mà tự render UI

riêng, dẫn đến tốn nhiều bộ nhớ và không thể tận dụng các tính năng củaOS.

2.3.Tổng quan về Nodejs2.3.1 Giới thiệu

- NodeJs là một môi trường chạy JavaScript mã nguồn mở và đa nền tảng,

cho phép bạn thực thi mã JavaScript bên ngoài trình duyệt web

- NodeJs hoạt động trên nền tảng V8 JavaScript engine, một công nghệ

của Google để biên dịch và tối ưu hóa mã JavaScript

- Hiệu suất khi xử lý các tác vụ máy tính nặng bị giảm, do NodeJs được

viết bằng C++ và JavaScript nên phải thông qua một trình biên dịch củaNodeJs

- API đôi lúc không ổn định, do NodeJs là một nền tảng mới và đang liên

tục cập nhật, nên có thể có những thay đổi không tương thích với các

Hình 2 3 NodeJS

phiên bản trước Bạn cần theo dõi và cập nhật API thường xuyên đểtránh gặp lỗi.

2.4.Tổng quan về MongoDB2.4.1 Giới thiệu

- MongoDB là một hệ quản trị cơ sở dữ liệu NoSQL mã nguồn mở đa nền

tảng viết bằng C++ Bản ghi trong MongoDB được lưu trữ dạng một dữliệu văn bản (Document), là một cấu trúc dữ liệu bao gồm các cặp giá trịvà trường tương tự như các đối tượng JSON.

- MongoDB có nhiều tính năng nổi bật, như:

 Mô hình dữ liệu tài liệu, cho phép bạn lưu trữ dữ liệu dưới dạng cáctài liệu có cấu trúc động, không cần định nghĩa sơ đồ trước.

 Giao diện truy vấn đa dạng, cho phép bạn thực hiện các thao tác trêndữ liệu như tìm kiếm, lọc, sắp xếp, nhóm, phân tích,… bằng cách sửdụng một API truy vấn thống nhất và hỗ trợ nhiều ngôn ngữ lậptrình.

2.4.2 Ưu điểm

- MongoDB cho phép bạn lưu trữ các loại dữ liệu khác nhau với cấu trúc

linh hoạt, không cần định nghĩa lược đồ trước.

- MongoDB có khả năng mở rộng cao, có thể phân tán dữ liệu trên nhiều

nút để tăng dung lượng lưu trữ và khả năng chịu tải.

Hình 2 4 MongoDB

2.4.3 Nhược điểm

- MongoDB không phù hợp cho các ứng dụng có yêu cầu độ chính xác

cao, ví dụ như ngân hàng, bảo hiểm, do không có ràng buộc và giaodịch.

- MongoDB sử dụng nhiều bộ nhớ RAM để lưu trữ và truy xuất dữ liệu,

do đó có thể gặp khó khăn khi hoạt động với các hệ thống có bộ nhớ hạnchế.

2.5.Tổng quan về ExpressJS2.5.1 Giới thiệu

- Expressjs là một framework được xây dựng trên nền tảng của Nodejs Nó

cung cấp các tính năng mạnh mẽ để phát triển web hoặc mobile.Expressjs hỗ trợ các method HTTP và midleware tạo ra API vô cùngmạnh mẽ và dễ sử dụng.

- Tổng hợp một số chức năng chính của Expressjs như sau:

 Thiết lập các lớp trung gian để trả về các HTTP request.

 Define router cho phép sử dụng với các hành động khác nhau dựatrên phương thức HTTP và URL.

 Cho phép trả về các trang HTML dựa vào các tham số.

2.5.2 Ưu điểm

- Đơn giản và dễ sử dụng: ExpressJS có cú pháp đơn giản và dễ hiểu, giúplập trình viên dễ dàng nắm bắt và triển khai các tính năng.

Hình 2 5 ExpressJS

- Hỗ trợ middleware: ExpressJS hỗ trợ middleware, cho phép bạn thêmcác chức năng trung gian vào quy trình xử lý yêu cầu và phản hồi.Middleware giúp xác thực người dùng, ghi log, xử lý lỗi, nén dữ liệu vàthực hiện nhiều tác vụ khác một cách linh hoạt.

- Hỗ trợ mô hình MVC: ExpressJS hỗ trợ phát triển ứng dụng theo môhình MVC (Model-View-Controller), giúp tách biệt logic và giao diện,tăng tính bảo mật và khả năng tái sử dụng code.

2.5.3 Nhược điểm

- Thiếu cấu trúc: Do ExpressJS không áp đặt một cấu trúc nghiêm ngặt,việc tổ chức dự án và quản lý mã nguồn có thể trở nên khó khăn, đặc biệtkhi ứng dụng phát triển lớn và phức tạp.

- Khả năng mở rộng: Khi ứng dụng phát triển lớn và phức tạp, việc quảnlý mã nguồn và mở rộng có thể trở nên khó khăn với ExpressJS.

CHƯƠNG 3.Phân tích thiết kế hệ thống3.1.Khảo sát hiện trạng

Thực tế hiện nay, Việt Nam đã có nhiều ứng dụng mua sắm trên thiết bị di độngquen thuộc có thể kể đến như: Shopee, Lazada, Tiki, Sendo,… Các ứng dụng nàyđều có sự tương đồng về chức năng nhưng ngoài ra cũng có một số khuyết điểmnhư có những chức năng không cần thiết, giao diện chưa thân thiện với ngườidùng, có thể cải tiến để hướng đến sự đơn giản, tiện lợi và thân thiện hơn chongười dùng.

3.2.Xác định chức năng, yêu cầu3.2.1 Yêu cầu chức năng

3.2.1.1.Yêu cầu lưu trữ- Thông tin đăng nhập

+ Hệ thống cần bảo đảm tính bảo mật trong việc lưu trữ các thông tinriêng tư về địa chỉ giao hàng, thông tin cá nhân, đơn hàng của từngngười dùng Vì vậy để có thể truy cập và sử dụng ứng dụng, cần phảicó số email để đăng nhập vào ứng dụng.

+ Các thông tin đăng nhập cần lưu trữ gồm: Email.

- Thông tin đăng ký

+ Hệ thống cần đảm bảo tính bảo mật trong việc lưu trữ thông tinriêng tư của người dùng Vì vậy để đăng ký ứng dụng cần phải có sốđiện thoại, email và username.

+ Các thông tin đăng ký cần lưu trữ: Email, Số điện thoại vàusername.

- Thông tin người dùng

+ Các thông tin của người dùng cần lưu trữ bao gồm: mã ID,username, số điện thoại, email, ảnh đại diện, giới tính, ngày sinh, cácsản phẩm yêu thích và vai trò.

- Thông tin sản phẩm

+ Các thông tin sản phẩm cần lưu trữ bao gồm: mã ID, tên sản phẩm,giá thường ngày, giá giảm giá, số lượng, màu sắc, hình ảnh, mô tảsản phẩm, thương hiệu, danh mục sản phẩm, tổng số lượng đánh giá,trung bình đánh giá,

- Thông tin danh mục sản phẩm

+ Các thông tin danh mục sản phẩm cần lưu trữ bao gồm: mã ID, têndanh mục, số lượng thương hiệu, số lượng sản phẩm, ảnh bìa.

- Thông tin mã giảm giá

+ Các thông tin mã giảm giá cần lưu trữ bao gồm: mã ID, mã code,tiêu đề, giá trị giảm giá, ảnh bìa

- Thông tin địa chỉ giao hàng

+ Các thông tin địa chỉ giao hàng cần lưu trữ bao gồm: mã ID, mãngười dùng, tên người nhận, số điện thoại người nhận, địa chỉ chitiết, quận, thành phố, quốc gia.

- Thông tin đánh giá sản phẩm

+ Các thông tin đánh giá sản phẩm cần lưu trữ bao gồm: mã ID, nộidung, số sao đánh giá, mã sản phẩm, mã người dùng.

- Thông tin giỏ hàng

+ Các thông tin giỏ hàng cần lưu trữ bao gồm: mã ID, mã ngườidùng, các sản phẩm, tổng số lượng sản phẩm, tổng giá trị.

- Thông tin đơn hàng

+ Các thông tin đơn hàng cần lưu trữ bao gồm: mã ID, mã ngườidùng, sản phẩm trong đơn hàng, tổng số lượng sản phẩm, tổng giá trịđơn hàng, tổng giá trị sau giảm giá, địa chỉ giao hàng, phí giao hàng,phương thức thanh toán, trạng thái đơn hàng.

3.2.1.2.Yêu cầu hiển thị

- Hiển thị sản phẩm theo từng danh mục

+ Chức năng hiển thị sản phẩm theo từng danh mục được thực hiệnkhi người dùng có nhu cầu tìm kiếm sản phẩm theo danh mục mongmuốn.

+ Chức năng này sẽ lọc sản phẩm theo từng danh mục, hỗ trợ ngườidùng xem sản phẩm theo danh mục mong muốn một cách trực quan.+ Kết quả hiển thị sản phẩm ứng với danh mục mà người dùng chọn.

- Hiển thị danh mục yêu thích

+ Chức năng hiển thị danh mục yêu thích được thực hiện khi ngườidùng có nhu cầu theo dõi các sản phẩm đã yêu thích.

+ Chức năng này hỗ trợ người dùng xem trực tiếp các sản phẩmđược yêu thích và thay đổi sản phẩm trong danh mục yêu thích mộtcách trực quan.

+ Kết quả hiển thị danh mục yêu thích ứng với sản phẩm người dùngthêm vào danh mục yêu thích hoặc xóa khỏi danh mục yêu thích.

+ Kết quả hiển thị giỏ hàng ứng với các sản phẩm người dùng thêmvào giỏ hàng hoặc xóa sản phẩm khỏi giỏ hàng.

- Hiển thị địa chỉ giao hàng

+ Chức năng hiển thị địa chỉ giao hàng được thực hiện khi ngườidùng có nhu cầu quản lý các địa chỉ giao hàng trong tài khoản.

+ Chức năng này hỗ trợ người dùng xem trực tiếp các địa chỉ giaohàng hiện có ở trong tài khoản.

+ Kết quả hiển thị địa chỉ giao hàng tương ứng với các địa chỉ giaohàng người dùng đã thêm vào.

- Hiển thị thông tin cá nhân

+ Chức năng hiển thị thông tin cá nhân được thực hiện khi ngườidùng có nhu cầu quản lý thông tin cá nhân.

+ Chức năng này hỗ trợ người dùng xem trực tiếp các thông tin cánhân trong tài khoản một cách trực quan.

+ Kết quả hiển thị thông tin cá nhân tương ứng với thông tin ngườidùng đã đăng ký hoặc chỉnh sửa trong tài khoản.

3.2.2 Yêu cầu phi chức năng3.2.2.1.Tính khả dụng

- Hệ điều hành phải từ Android 5.0 trở lên đối với các thiết bị Android

và IOS 13.0 trở lên đối với các thiết bị IOS.

- Thiết bị phải có kết nối Internet3.2.2.2.Tính ổn định

- Ứng dụng hoạt động liên tục 24/7, hạn chế tối đa các sự cố.

- Thực hiện xử lý sự cố chặt chẽ để giảm thiểu ảnh hưởng đến trải

nghiệm người dùng Gửi thông báo cho người dùng khi có sự cố vàcung cấp thông tin chi tiết để người dùng hiểu tình trạng.

- Phát triển một quy trình phục hồi dữ liệu linh hoạt để khôi phục dữ

liệu nhanh chóng sau sự cố.

- Theo dõi các bản vá bảo mật và cập nhật hệ thống định kỳ.

- Mọi tương tác người dùng đều được xử lý một cách mượt mà và

không gây sự cố.

3.2.2.3.Hiệu suất

- Hệ thống cho phép thao tác và hiển thị kết quả nhanh chóng.

- Truy vấn cơ sở dữ liệu và hiển thị kết quả không quá 10 giây (yêu

cầu kết nối Internet)

3.2.2.4.Tính bảo mật

- Các thông tin đăng nhập như mật khẩu phải được mã hóa.

- Ứng dụng phải có cơ chế đảm bảo tính toàn vẹn của cơ sở dữ liệu.- Phải đảm bảo bảo mật dữ liệu người dùng, tránh sự tấn công của bên

- Đảm bảo người dùng không có quyền chỉnh sửa thông tin của người

dùng khác hay truy cập vào những dữ liệu không thuộc quyền sở hữucủa mình.

3.2.2.5.Ràng buộc thiết kế

- Ứng dụng phải cung cấp giao diện linh hoạt dựa trên hệ điều hành

Android và IOS.

3.3.Thiết kế hệ thống3.3.1 Kiến trúc hệ thống

3.3.1.1.Sơ đồ kiến trúc hệ thống

3.3.1.2.Mô tả các thành phần trong kiến trúc hệ thống

Widget Hiển thị thành phần giao diện người dùng

Bloc Xử lý logic kinh doanh và quản lý trạng thái của ứng dụng.

Use cases

Chứa các use case sử dụng các đối tượng entities để thực hiện logic kinh doanh cụ thể.

Entities Chứa đối tượng cốt lõi của ứng dụng, như các đối tượng có liên quan đến dữliệu và logic kinh doanh.

Thành phần trung gian giữa Domain Layer và Data Layer, thực hiện lưu trữvà truy cập dữ liệu.

Cấu trúc dữ liệu phản ánh cách dữ liệu được lưu trữ hoặc truyền vào ứng dụng từ nguồn bên ngoài như API hoặc cơ sở dữ liệu.

Raw Data Dữ liệu gốc khi được trả về khi gọi API.API Nơi thực hiện kết nối giữa Frontend

3.3.2 Sơ đồ Use case

3.3.2.1.Sơ đồ Use case tổng quát

3.3.2.2.Sơ đồ Use case chi tiết

Hình 3 2 Sơ đồ Use case User tổng quát

Hình 3 3 Sơ đồ Use case chi tiết quản lý tàikhoản

Hình 3 4 Sơ đồ Use case chi tiết quản lý danh mục yêuthích

Hình 3 5 Sơ đồ Use case chi tiết cho quản lý giỏ hàng

Hình 3 6 Sơ đồ Use case chi tiết cho quản lý đơn hàng

Bảng 3 2 Danh sách các Actor

Bảng 3 3 Bảng danh sách các Use case

đăng kýUC0

Tạo một tài khoản mới để sử dụng ứng dụng.

3 Xem thông tin cá nhân User

Xem chi tiết các thông tin cá nhân của người dùng hiện tại.UC0

4 Chỉnh sửa thông tin cá nhân User

Cập nhật thông tin cá nhân của người dùng hiện tại.

5 Xem địa chỉ giao hàng User

Xem các địa chỉ giao hàng đang có trong tài khoản hiện tại.

6 Thêm địa chỉ giao hàng User

Thêm địa chỉ giao hàng vào danh sách địa chỉ của tài khoản hiện tại.

7 Sửa địa chỉ giao hàng User

Cập nhật địa chỉ giao hàng của tài khoản hiện tại.

2 Tìm kiếm danh mục sản phẩm User

Tìm kiếm danh mục sản phẩm dựa theo tên danh mục.

3 Xem sản phẩm trong danh sách yêu thích User

Xem các sản phẩm trong danh sách yêu thích của tài khoản hiện tại.

Thêm sản phẩm vào danh

Thêm sản phẩm vào danh sách yêu thích của tài khoản hiện tại.UC1

5 Xóa sản phẩm khỏi danh sách yêu thích User

Xóa sản phẩm khỏi danh mục yêu thích của tài khoản hiện tại.UC1 Xem sản phẩm trong giỏ Xem các sản phẩm ở trong giỏ

1 Xem tổng giá trị của các sảnphẩm User

Xem tổng giá trị của các sả phẩm trong giỏ hàng của tài khoản hiện tại.

Đặt hàng dựa trên sản phẩm đã chọn của tài khoản hiện tạiUC2

3 Xem sản phẩm trong đơn hàng User

Xem các sản phẩm ở trong đơn hàng của tài khoản hiện tạiUC2

Đánh giá các sản phẩm sau khi thanh toán thành công trong tài khoản hiện tại

Tên Use Case Đăng nhập

Mô tả Cho phép người dùng đăng nhập vào ứng dụng để sử dụng

dịch vụ từ ứng dụng.

Primary Actor User

Secondary Actor Không cóPriority Quan trọng

Trigger Người dùng muốn đăng nhập vào ứng dụng.

Tiền điều kiện- Người dùng đã có tài khoản trong ứng dụng.- Thiết bị có kết nối internet.

Bảng 3 4 Bảng đặc tả Use case Đăng nhập

dụng và sử dụng dịch vụ.

- Nếu thất bại, thông báo đến người dùng và tiến hành

đăng nhập lại.

Diễn biến chính

1 Người dùng truy cập vào ứng dụng.

2 Người dùng nhập đầy đủ thông tin gồm Email và mậtkhẩu.

2 Người dùng nhập tài khoản Google.

4a Google xác thực thông tin đăng nhập thành công.

2b Người dùng chọn phương thức đăng nhập bằng tài khoản Facebook.

1 Hệ thống chuyển sang màn hình đăng nhập tài khoảnFacebook.

2 Người dùng nhập tài khoản Facebook.

4b Facebook xác thực thông tin đăng nhập thành công.

Ngoại lệ 4c Hệ thống xác thực thông tin đăng nhập không thành công và hiển thị thông báo.

1 Người dùng nhập lại thông tin tài khoản.2 Quay lại bước 3.

3.3.3.2.Đặc tả use case Đăng ký

Bảng 3 5 Bảng đặc tả Use case Đăng ký

Tên Use Case Đăng ký

Mô tả Cho phép người dùng đăng ký tài khoản để truy cập vào ứng

Primary Actor User

Secondary Actor Không cóPriority Quan trọng

Trigger Người dùng muốn đăng ký tài khoản.

Tiền điều kiện Thiết bị có kết nối internet.

Hậu điều kiện

- Nếu thành công, người dùng có thể đăng nhập vào ứng

dụng và sử dụng dịch vụ.

- Nếu thất bại, thông báo đến người dùng và tiến hành

đăng ký lại.

Diễn biến chính

7 Người dùng truy cập vào ứng dụng.

8 Người dùng nhập đầy đủ thông tin gồm Email, số điệnthoại và mật khẩu.

9 Người dùng chọn đăng ký.

10 Hệ thống xác thực thông tin đăng ký thành công.

11 Hệ thống cho phép người dùng đăng nhập và truy cậpvào ứng dụng.

12 Hệ thống ghi nhận hoạt động đăng ký thành công.

Diễn biến phụ 2a Người dùng chọn phương thức đăng ký bằng tài khoản Google.

1 Hệ thống chuyển sang màn hình đăng ký bằng tàikhoản Google.

2 Người dùng nhập tài khoản Google.

4a Google xác thực thông tin đăng ký thành công.

2b Người dùng chọn phương thức đăng ký bằng tài khoản Facebook.

1 Hệ thống chuyển sang màn hình đăng ký bằng tài