BÁO CÁO HỌC PHẦN MÔN DỰ ÁN CÔNG NGHỆ Đề tài : Xây dƣng website bán hàng tiêu dùng qua mạng

ĐẠI HỌC QUỐC GIA HÀ NỘI
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ
------------------------------------------

BÁO CÁO HỌC PHẦN MÔN DỰ ÁN CÔNG NGHỆ

Đề tài : Xây dƣng website bán hàng tiêu dùng qua mạng

GIẢNG VIÊN HƯỚNG DẪN

: VŨ THỊ HỒNG NHẠN

NHÓM SINH VIÊN THỰC HIỆN :
- NGUYỄN CƠNG THÀNH
- BÙI HỒNG NAM
- NGUYỄN BÁ ANH TUẤN

: 19021368 - K64 T-CLC
: 19021334 - K64 T-CLC
: 19020128 - K64 CA-CLC4

HỌC PHẦN : DỰ ÁN CÔNG NGHỆ - 2122I_INT3132_20

Hà Nội - 2021


Lời Cảm Ơn
Để hồn thành đề tài này, nhóm chúng em xin trân trọng gửi lời cảm ơn đến cô Vũ
Thị Hồng Nhạn và các thầy cô trong khoa Hệ thống thông tin đã giảng dạy, cung cấp kiến
thức, tận tình hướng dẫn, ln ln động viên chúng em những lúc gặp khó khăn, tạo
điều kiện giúp đỡ em về mọi mặt để chúng em có thể hồn thành đề tài này.

Thêm vào đó, chúng em xin gửi lời cảm ơn sâu sắc đến gia đình, bạn bè, những
người thân đã luôn theo sát, giúp đỡ và ủng hộ về mặt tinh thần. Mặc dù có nhiều cố
gắng nhưng do hạn chế về mặt thời gian cũng như kinh nghiệm thực tế nên đề tài khơng
tránh khỏi những thiếu sót nhất định. Kính mong q thầy cơ tiếp tục, bổ sung góp ý để
đề tài được hồn thiện hơn.
Một lần nữa chúng em xin chân thành cảm ơn!

2


Mục lục
Danh mục bảng biểu và hình ảnh sử dụng ....................................................................... 4
Phần I : Tổng quan về đề tài .................................................................................................. 5
1.1. Đặt vấn đề......................................................................................................................... 5
1.2. Mục tiêu ý nghĩa của đề tài ......................................................................................... 5
1.3. Phương pháp nghiên cứu ........................................................................................... 5
1.4. Phạm vi ứng dụng.......................................................................................................... 6
Phần II : Cơ sở lý thuyết ......................................................................................................... 6
2.1. Khái niệm website thương mại ................................................................................ 6
2.2. Ngơn ngữ lập trình front-end HTML, CSS và JAVASCRIPT ............................... 7
2.3. Khái niệm và mục đích sử dụng của Django ......................................................... 7
2.4. Tìm hiểu về mơ hình MVC của Django .................................................................... 9
2.5. Cơ sở dữ liệu SQLite .................................................................................................. 10
Phần III : Phân tích thiết kế hệ thống ............................................................................. 11
3.1. Các nhóm Actor và chức năng ................................................................................ 11
3.2. Biểu đồ Usecase tổng quát của hệ thống............................................................. 17
3.3. Biểu đồ tuần tự ............................................................................................................ 18
3.4. Biểu đồ trạng thái của đối tượng giỏ hàng ........................................................ 20
3.5. Cơ sở dữ liệu tổng quan của hệ thống ................................................................. 20
Phần IV : Tiến hành xây dựng website bán hàng ........................................................ 30

4.1. Thiết kế giao diện người dùng ............................................................................... 22
4.2. Thiết kế giao diện Admin ......................................................................................... 27
Phần V : Đánh giá kết quả và hướng phát triển .......................................................... 30
5.1. Đánh giá kết quả ......................................................................................................... 30
5.2. Hướng nghiên cứu và phát triển ........................................................................... 31
Phần VI : Kết luận .................................................................................................................. 31
Phần VII : Tài liệu tham khảo và sử dụng ...................................................................... 32

3


Danh mục bảng biểu
3.1.1. Bảng Guest và các tính năng ................................................................................. 12
3.1.2. Bảng User và các tính năng ................................................................................... 13
3.1.3. Bảng Admin và các tính năng ............................................................................... 14

Danh mục hình ảnh
2.4.1. Phương thức hoạt động mơ hình MVC ............................................................. 10
3.2.1. Mơ hình Usecase tổng qt ................................................................................... 17
3.3.1. Biểu đồ tuần tự đăng nhập ................................................................................... 18
3.3.2. Biểu đồ tuần tự thêm giỏ hàng ............................................................................ 18
3.3.3. Biểu đồ tuần tự gửi đơn đặt hàng ...................................................................... 19
3.4.1. Biểu diễn trạng thái của đối tượng giỏ hàng .................................................. 20
3.5.1. Mơ hình ERD của hệ thống .................................................................................... 20
4.1.1. Giao diện trang chủ ................................................................................................. 22
4.1.2. Giao diện đăng nhập ............................................................................................... 23
4.1.3. Giao diện sản phẩm ................................................................................................. 24
4.1.4. Giao diện giỏ hàng ................................................................................................... 25
4.1.5. Giao diện thanh toán .............................................................................................. 26
4.2.1. Giao diện Admin ....................................................................................................... 27

4.2.2. Giao diện thêm sản phẩm ..................................................................................... 28
4.2.3. Giao diện quản lí người dùng .............................................................................. 29

4


PHẦN I : TỔNG QUAN VỀ ĐỀ TÀI
1.1.

Đặt vấn đề

Internet hiện nay đang là xu hướng của thời đại, nó đã và đang lại những lợi ích to lớn
cho cả các cá nhân và tổ chức. Theo thống kê của Bộ thơng tin, tính đến tháng 12 năm
2021, đã có hơn 4,5 tỉ người dùng trên thế giới đã truy cập vào mạng Internet và con số
này dự tính sẽ khơng ngừng tăng lên hàng ngày. Có 75% khách hàng tìm hiểu thơng tin
về sản phẩm trước khi mua, 43% khách hàng mua sắm có ảnh hường đến Internet. Điều
này có nghĩa là thói quen mua sắm của mọi người đã thay đổi, họ khơng phải lịng vịng
đi đâu đó để tìm kiếm sản phẩm mà thay vào đó chỉ việc ngồi nhà, sử dụng điện thoại,
máy tính là có thể tìm kiếm sản phẩm mà họ ưa thích. Thêm vào đó, với việc dịch bệnh
đang hồnh hành, việc mua sắm tại nhà đã và đang trở nên cần thiết hơn bao giờ hết.
Vì thế, các doanh nghiệp đều hướng tới đối tượng khách hàng thông qua các trang
mua sắm online. Cơng việc duy nhất cần làm đó là thiết kế một website có tính tự động
cao, một website đủ mạnh và hiệu quả với các tính năng đơn giản nhưng có sự tương tác
với người dùng cao sẽ giúp doanh nghiệp vượt xa các đối thủ cạnh tranh.
Với mong muốn hoàn thiện hơn các kiến thức đã học ở trường, đồng thời rèn luyện kỹ
năng của bản thân, nhóm chúng em đã lựa chọn đề tài “ Xây dựng website bán hàng tiêu
dùng qua mạng.”

1.2.

Ý nghĩa và mục tiêu của đề tài

Website được xây dựng để áp dụng cho các công ty muốn quảng bá, giới thiệu sản
phẩm tới mọi người. Với giao diện đơn giản, dễ dùng, bất kì ai cũng có thể tiến hành mua
sắm các sản phẩm trên website. Trong thời đại thương mại điện tử đang ngày càng phát
triển, việc ứng dụng vào hoạt động website bán hàng trực tuyến đã mang lại nhiều ý
nghĩa như:
 Đỡ tốn nhiều thời gian cho người tiêu dùng cũng như nhà quản lý trong
việc tham gia vào hoạt động mua bán
 Giúp người tiêu dùng có được giá cả, hình ảnh và đánh giá sản phẩm 1 cách
chính xác
 Giúp doanh nghiệp điều hành dễ dàng hơn trong việc quản lý sản phẩm

1.3.

Phƣơng pháp nghiên cứu
 Tìm hiểu kĩ thuật lập trình, cách thức hoạt động và các đối tượng trong 1
5







1.4.

website bán hàng
Tìm hiểu về web, ngơn ngữ HTML, CSS, JAVASCRIPT
Tìm hiểu về ngơn ngữ Python

Tìm hiểu về cơ sở dữ liệu SQLite
Dùng các trang HTML và CSS thông qua ngôn ngữ JAVASCRIPT để xây
dựng front-end của website. Sử dụng Django làm back-end. Sử dụng
SQLite được tích hợp sẵn trong Django làm cơ sở dữ liệu

Phạm vi ứng dụng

Do tính thuận tiện, bất kì ai cũng có thể tiến hành giao dịch qua website để mua
sắm sản phẩm. Qua phân tích nhu cầu thực tế, nhóm chúng em có thể tập trung khai
thác, quảng bá sản phẩm tâm lý khách hàng thơng qua một số đối tượng chính sau đây:
 Những người có cơng việc bận rộn, ít có thời gian đi mua sắm
 Học sinh, sinh viên với nhu cầu mua sắm qua mạng
 Tìm kiếm những sản phẩm khơng có ở các cửa hàng lân cận
 Tìm kiếm sản phẩm với mức giá ưu đãi
 Tìm hiểu về sản phẩm, đặc điểm, chức năng, giá thành và đánh giá của
người tiêu dùng về sản phẩm đó

PHẦN II : CƠ SỞ LÝ THUYẾT
Nội dung trọng tâm của phần này sẽ là trình bày các khái niệm của lập trình
website thương mại điện tử, các ngôn ngữ được sử dụng và Django framework.
2.1.

Khái niệm website thƣơng mại điện tử

Thương mại điện tử là hoạt động mua-bán sản phẩm (hoặc dịch vụ) thông qua các
hệ thống điện tử như Internet và các mạng máy tính. Thương mại điện tử cịn được gọi
là E-commerce, nghĩa là Electronic Commerce.
Trong những năm qua, cùng với sự phát triển mạnh mẽ của công nghệ thông
6

tin, những doanh nghiệp lớn cũng như những doanh nghiệp đang phát triển đã nhận
thấy được những tiềm năng lớn vào việc triển khai, khai thác công nghệ vào doanh
nghiệp kinh doanh của mình. Chúng ta có thể thấy được Internet đã và đang chi phối
hầu như tất cả mọi lĩnh vực. Vì vậy, các hoạt động như giao lưu, giải trí, văn hóa,
thương mại dần dần được trao đổi trên Internet và nó đã khẳng định được tính hiệu
quả của việc chia sẻ thông tin qua Internet.

2.2.

Ngôn ngữ lập trình front-end HTML, CSS và JAVASCRIPT

Một ngơn ngữ lập trình là cách chúng ta giao tiếp với phần mềm. Những người sử
dụng ngơn ngữ lập trình thường được gọi là lập trình viên hoặc nhà phát triển. Những
điều chúng ta nói với phần mềm bằng ngơn ngữ lập trình là làm cho trang web trơng y
như những gì ta muốn. Về cơ bản, phần giao diện của 1 web thường được tạo bởi 3
ngôn ngữ sau :
 HTML cung cấp cấu trúc cơ bản của các trang web, được cải tiến và sửa đổi
bởi các công nghệ khác như CSS và JavaScript.
 CSS được sử dụng để kiểm sốt trình bày, định dạng và bố cục.
 JavaScript được sử dụng để kiểm soát hành vi của các yếu tố khác nhau.
2.3.

Khái niệm và mục đích sử dụng của Django

2.3.1. Django là gì
Django là một trong số các web framework bậc cao miễn phí, là mã nguồn mở được
tạo dựa trên ngơn ngữ Python theo mơ hình MVC (Model - View - Control). Lợi thế
của Django là khả năng thiết kế, tạo lập website và các ứng dụng nhanh chóng đến bất
ngờ. Mục tiêu chính của Django là đơn giản hóa việc tạo các website phức tạp có sử

dụng cơ sở dữ liệu. Django tập trung vào tính năng “có thể tái sử dụng” và “có thể tự
chạy” của các component, tính năng phát triển nhanh, khơng làm lại những gì đã làm.
Một số website phổ biến được xây dựng từ Django là Pinterest, Instagram, Mozilla, và
Bitbucket.
2.3.2. Ƣu điểm của Django
7


Django có những ưu điểm sau :
 Bảo mật tốt : Khi làm việc với Django, lập trình viên có thể tránh được nhiều
lỗi bảo mật phổ biến bằng cách cung cấp framework có khả năng tự bảo vệ
trang.
 Nhanh : Django giúp đẩy nhanh quy trình từ việc xây dựng web đến lúc hoàn
thành sản phẩm rất nhiều
 Linh hoạt : Django có thể được sử dụng để xây dựng hầu hết các trang web-từ
hệ thống quản lý nội dung, các trang tin tức, mạng xã hội và cả bán hàng.
Framework này còn cung cấp các tùy chọn khác nhau cho hầu hết các chức
năng như tạo template tự động, cơ sở dữ liệu phổ biến.
 Độ hoàn thiện cao : Django cung cấp hầu hết mọi thứ mà các developer có thể
muốn để phát triển web theo hướng mình muốn. Tất cả các phần trong
framework hoạt động liền mạch với nhau, tuân theo một nguyên tắc thiết kế
nhất quán.
 Khả năng mở rộng tốt : Do có thể mở rộng bằng cách nâng cấp phần cứng nên
rất nhiều các trang web, ứng dụng sử dụng Django để có thể mở rộng nhanh
chóng và linh hoạt từ đó đáp ứng nhu cầu, lượng truy cập lớn.
2.3.3. Tiến hành cài đặt Django và cái dependencies
Django là một framework Python, vì thế Python cần phải được cài đặt. Tại thời
điểm viết báo cáo, Python 3.9 là phiên bản mới nhất. Sau đó cài đặt package manager
pip
Khởi tạo mơi trường giả lập. Bới lẽ khi làm việc với nhiều dự án khác nhau cần

những phiên bản khác nhau của Python cũng như các thư viện. Việc sử dụng môi
trường giả lập sẽ giúp đảm bảo tính độc lập và hồn thiện của dự án. Với dự án này
nhóm em sử dụng env được tích hợp trong Python.
Để khởi tạo mơi trường giả lập cho dự án, ta dùng câu lệnh trong command line
path\> py -m venv project-name
Để khởi động môi trường giả lập, ta dùng câu lệnh
8


path\> project-name\Scripts\activate.bat
Cài đặt và khởi tạo 1 project Django
...\> py -m pip install Django
…\>django-admin startproject project-name
2.4.

Tìm hiểu về mơ hình MVC của Django

Khi sử dụng Django, một web ứng dụng sẽ nhận HTTP được u cầu từ trình
duyệt, sau đó hệ thống sẽ tìm ra yêu cầu cần thực hiện dựa trên URL và thông tin
trong POST dữ liệu hoặc GET dữ liệu. Tùy thuộc vào yêu cầu và thông tin đọc vào, hệ
thống sẽ đọc, ghi thông tin từ cơ sở dữ liệu hoặc thực hiện các tác vụ khác nhau để đáp
ứng yêu cầu khách hàng.
Khi xử lý xong yêu cầu, kết quả sẽ được trả về View. Tại View sẽ tạo mã HTML
thành giao diện và trả về hiển thị trên trình duyệt.
Các thành phần của mơ hình MVC :
 Model (M) : Là bộ phận có chức năng lưu trữ toàn bộ dữ liệu của ứng dụng. Bộ
phận này là một cầu nối giữa 2 thành phần bên dưới là View và Controller. Sơ đồ
phương thức hoạt động của mơ hình MVC :
 View (V) : Đây là phần giao diện dành cho người sử dụng. Người dùng có thể
lấy được dữ liệu của MVC thơng qua các thao tác truy vấn như tìm kiếm hoặc sử dụng

thơng qua website. View khơng có mối liên hệ trực tiếp với Controller, không lấy dữ
liệu trực tiếp từ Controller mà chỉ hiện thị yêu cầu rồi chuyển yêu cầu đó qua cho
Controller xử lý.
 Controller (C) : Đây là bộ phận có chức năng xử lý các yêu cầu người dùng đưa
đến thơng qua View, từ đó đưa ra dữ liệu phù hợp với người dùng lấy được từ Model

9


Hình 2.4.1 : Phƣơng thức hoạt động của mơ hình MVC

2.5.

Cơ sở dữ liệu SQLite

SQLite là hệ quả trị cơ sở dữ liệu quan hệ tương tự như Mysql, ... Đặc điểm nổi bật
của SQLite so với các cơ sở dữ liệu quan hệ khác là gọn, nhẹ, đơn giản, đặt biệt khơng
cần mơ hình server-client, khơng cần cài đặt, cấu hình hay khởi động nên khơng có
khái niệm user, password hay quyền hạn trong SQLite Database. Dữ liệu cũng được
lưu ở một file duy nhất.
SQLite thường không được sử dụng với các hệ thống lớn nhưng với những hệ
thống ở quy mơ vùa và nhỏ thì SQLite khơng thua các cơ sở dữ liệu khác về chức
năng hay tốc độ. Vì khơng cần cài đặt hay cấu hình nên SQLite được sử dụng nhiều
trong việc phát triển, thử nghiệm … vì tránh được những rắc rối trong quá trình cài
10


đặt.
Ưu điểm của cơ sở dữ liệu SQLite :
 SQLite không yêu cầu một hệ thống máy chủ riêng để hoạt động

 Khơng cần cấu hình, có nghĩa là khơng cần thiết lập, quản lý
 Các transaction trong SQLite tuân thủ theo mơ hình ACID, cho phép truy cập
an tồn từ nhiều tiến trình
 Độ phổ biến cao, hỗ trợ cho nhiều nền tảng và ngơn ngữ truy vấn
Chính vì thế, rất nhiều app, ứng dụng đã và đang sử dụng SQLite làm cơ sở dữ liệu
chính. Ở cài đặt mặc định, Django sử dụng SQLite, không cần cài đặt thêm gì cả

PHẦN III : PHÂN TÍCH THIẾT KẾ HỆ THỐNG
Ở phần này nhóm chúng em sẽ tiến hành nghiên cứu, xây dựng các Actor chính
của website và chức năng của chúng. Sau đó phân tích thiết kế các mơ hình Usecase
tổng quát, các Activity được xây dựng và thiết kế một lược đồ ERD mô tả chi tiết cơ
sở dữ liệu.
3.1.

Các nhóm Actor và chức năng

Hệ thống được chia làm 3 Actor chính là Guest (những khách hàng chưa đăng kí
thành viên), User (những khách hàng đã đăng kí thành viên ) và Admin (quản lí
website). Cụ thể về vai trò, chức năng như sau :

11


Actor

Nhóm chức
năng

Tính năng

Giao diện
thực hiện

Quản lí tài
khoản

Đăng ký tài khoản

Đăng ký

Xem danh sách sản phẩm,

Trang chủ

Xem chi tiết sản phẩm

Sản phẩm

Xem danh sách khuyến
mãi, gợi ý

Trang chủ

Lọc,tìm kiếm sản phẩm

Tìm kiếm

Guest
Tìm kiếm sản
phẩm

Bảng 3.1.1. : Nhóm Guest và các tính năng

12


Actor

Nhóm chức
năng

Tính năng

Giao diện
thực hiện

Quản lí tài
khoản

Đăng ký tài khoản

Đăng ký

Xem danh sách sản phẩm

Trang chủ

Xem chi tiết sản phẩm

Sản phẩm

Xem danh sách khuyến
mãi, gợi ý

Trang chủ

Lọc,tìm kiếm sản phẩm

Tìm kiếm

Xem đánh giá về sản phẩm

Sản phẩm

Thêm, xóa sản phẩm khỏi
giỏ hàng

Sản phẩm

Thay đổi số lượng sản
phẩm

Giỏ hàng

Áp dụng mã giảm giá

Giỏ hàng

Đặt đơn và thanh tốn

Giỏ hàng

Quản lí tài
khoản

Thay đổi chi tiết tài khoản

Tài khoản

Xóa tài khoản

Tài khoản

Quản lí đơn
hàng cá nhân

Xem lịch sử mua hàng

Đơn hàng

Xem chi tiết đơn hàng

Đơn hàng

Hủy đơn hàng

Đơn hàng

Tìm kiếm sản
phẩm

Quản lí giỏ
hàng
User

Bảng 3.1.2. : Nhóm User và các tính năng
13


Actor

Nhóm chức
năng

Tính năng

Giao diện
thực hiện

Quản lí tài
khoản

Đăng ký tài khoản

Admin

Thêm sản phẩm

Admin

Xóa sản phẩm

Admin

Thay đổi chi tiết sản phẩm

Admin

Thêm, xóa sản phẩm vào
nhóm sản phẩm

Admin

Thêm nhóm sản phẩm

Admin

Xóa nhóm sản phẩm

Admin

Quản lí đơn
hàng

Kiểm tra đơn hàng

Admin

Quản lí tài
khoản

Reset mật khẩu tài khoản

Admin

Disable tài khoản

Admin

Xóa tài khoản

Admin

Xem lịch sử tài khoản

Admin

Quản lí sản
phẩm
Quản lí nhóm
sản phẩm

Admin

Bảng 3.1.3. : Nhóm Admin và các chức năng

14


Mơ tả các tính năng của các nhóm chức năng thuộc người dùng :

 Đăng ký tài khoản : Cho phép người dùng mới của trang web đăng ký trở thành
thành viên đã đăng ký của web để tham gia mua sắm
 Xem danh sách sản phẩm : Hiển thị danh sách các sản phẩm, cho phép người
dùng nhấn vào để chuyển sang giao diện chi tiết của sản phẩm tương ứng
 Xem danh sách khuyến mãi, gợi ý : Hiển thị các sản phẩm đang được giảm giá,
các ưu đãi giới hạn thời gian
 Xem chi tiết sản phẩm : Cho phép người dùng xem chi tiết về sản phẩm, bao
gồm: Ảnh, Tên sp, Giá bán, Mô tả, Đánh giá
 Lọc / tìm kiếm sản phẩm : Lọc sản phẩm theo công ty cung cấp, tên sản phẩm,
loại sản phẩm, khoảng giá, đánh giá
 Xem đánh giá về sản phẩm : Xem các đánh giá của người dùng khác đã từng
mua sản phẩm
 Thêm, xóa sản phẩm vào giỏ hàng : Thêm, xóa sản phẩm tùy ý vào giỏ hàng
 Thay đổi số lượng sản phẩm : Thay đổi số lượng muốn mua của 1 sản phẩm
 Áp dụng mã giảm giá : Áp dụng mã giảm giá ở đơn hàng
 Đặt đơn và thanh toán : Thêm địa chỉ giao hàng, thanh toán hàng
 Thay đổi chi tiết tài khoản : Cho phép người dùng thay đổi tên hiển thị, địa chỉ
giao hàng thường dùng, thông tin thanh toán, mật khẩu tài khoản, email
 Xoá tài khoản : Cho phép người dùng xoá tài khoản
 Xem lịch sử mua hàng : Xem chi tiết các đơn hàng đã thanh tốn và đặt, và đã
hồn thành
 Xem chi tiết đơn hàng : Xem các sản phẩm bên trong đơn hàng
 Huỷ đơn hàng : Huỷ các đơn hàng chưa hoàn thành
15


Mơ tả các tính năng của các nhóm chức năng thuộc admin :
 Thêm, xóa sản phẩm : Thêm,xóa sản phẩm
 Thay đổi chi tiết sản phẩm : Thay đổi chi tiết về sản phẩm, như mô tả, giá,
ảnh, ...

 Thêm, xóa sản phẩm vào nhóm sản phẩm : Chỉnh sửa danh sách các sản phẩm
thuộc nhóm sản phẩm
 Thêm, xóa nhóm sản phẩm : Thêm,xóa nhóm sản phẩm
 Kiểm tra đơn hàng : Duyệt và kiểm tra đơn hàng (trạng thái thanh toán, ...) và
duyệt đơn hàng để bắt đầu giao hàng
 Reset mật khẩu tài khoản : Reset lại mật khẩu của tài khoản khách khác trên
website
 Disable tài khoản : Không cho phép người sử dụng tài khoản đăng nhập vào hệ
thống
 Xóa tài khoản : Xóa sự tồn tại của tài khoản khỏi hệ thống
 Xem lịch sử tài khoản : Xem lịch sử mua hàng, giỏ hàng của tài khoản

16


3.2.

Biểu đồ Usecase tổng quát của hệ thống

Biểu đồ 3.2.1. : Mơ hình Usecase tổng qt

17


3.3.

Biểu đồ tuần tự
3.3.1. Biểu đồ tuần tự cho Usecase đăng nhập

Biểu đồ 3.3.1. : Biểu đồ tuần tự đăng nhập

3.3.2. Biểu đôt tuần tự cho Usecase thêm giỏ hàng

Biểu đồ 3.3.2. : Biểu đồ tuần tự thêm giỏ hàng
18


3.3.3. Biểu đồ tuần tự cho Usecase gửi đơn đặt hàng

Biểu đồ 3.3.3. : Biểu đồ tuần tự gửi đơn đặt hàng

19


3.4.

Biểu đồ trạng thái của đối tƣợng giỏ hàng

Biểu đồ 3.4.1. : Biểu diễn trạng thái đối tƣợng giỏ hàng
3.5.

Cơ sở dữ liệu tổng quan của hệ thống
3.5.1. Biểu đồ Class Diagram

Biểu đồ 3.5.1. : Mơ hình ERD hệ thống
20


3.5.2. Mô tả chi tiết cơ sở dữ liệu của hệ thống
 Item : title, price, discount_price, category, label, slug (ID) (Khóa chính),

description, image
 OrderItem : (1-nhiều với Item) user (khóa phụ tới user) (Khóa chính),
ordered, item (khóa phụ tới item) (Khóa chính), quantity
 Order : order_ID (Khóa chính), user (khóa phụ tới user), ref_code, items
(nhiều-nhiều với orderItem), start_date, ordered_date, ordered,
shipping_address (khóa phụ tới addresses), billing_address (khóa phụ tới
addresses), payment (khóa phụ tới payment), coupon (khóa phụ tới coupon),
being_delivered, received, refund_requested, refund_granted
 User : user_ID (Khóa chính), user_name, user_email, user_address,
user_phone
 Address : address_ID (Khóa chính), user (khóa phụ tới user), street_address,
apartment_address, country, zip, address_type, default
 Payment : stripe_charge_id (Khóa chính), user (khóa phụ tới user), amount,
timestamp
 Coupon : coupon_ID (Khóa chính), code, amount
 Refund : refund_ID (Khóa chính), order (khóa phụ tới order), reason,
accepted, email

21


PHẦN IV : TIẾN HÀNH XÂY DỰNG WEBSITE BÁN HÀNG
Ta sẽ bắt đầu tiến hành xây dựng website bán hàng sử dụng Django
4.1.

Thiết kế giao diện ngƣời dùng

4.1.1. Giao diện trang chủ

Hình 4.1.1. : Giao diện trang chủ

Khi người dùng bắt đầu truy cập, trang web sẽ hiển thị danh sách các sản phẩm.
Một trang sản phẩm sẽ bao gồm 16 sản phẩm, người dùng có thể di chuyển sang
trang kế tiếp để xem và tìm kiếm sản phẩm. Ở thanh navigation sẽ là danh mục các
sản phẩm và mục tìm kiếm giúp người dùng tìm kiếm sản phẩm theo tên.
Phía trên cùng sẽ là icon giỏ hàng với số lượng mặt hàng hiện đang có mặt trong
giỏ và nút đăng nhập/đăng xuất.
22


4.1.2. Giao diện đăng nhập

Hình 4.1.2. : Giao diện đăng nhập
Giao diện đăng nhập/ đăng ký gồm các trường Username, tài khoản, email. Người
dùng đăng ký sử dụng email sẽ cần xác minh tài khoản để có thể sử dụng các chức
năng liên quan đến quản lí tài khoản như đổi mật khẩu, tên đăng nhập, quên mật khẩu.
Khi đăng nhập, người dùng có thể tích vào ơ ghi nhớ mật khẩu để có thể dễ dàng
truy cập vào lần đăng nhập kế tiếp. Mật khẩu sẽ được lưu vào cache của cơng cụ tìm
kiếm mà người dùng hiện đang sử dụng.

23


4.1.3. Giao diện sản phẩm

Hình 4.1.3. : Giao diện sản phẩm
Giao diện sản phẩm gồm có hình ảnh sản phẩm, loại mà sản phẩm đó thuộc về,
giá tiền và giá giảm giá. Sau đó sẽ là phần mơ tả sản phẩm giúp người dùng có thêm
thơng tin, nắm rõ hơn về sản phẩm đang tìm hiểu.
Phía dưới sẽ là 2 nút thêm và xóa sản phẩm khỏi giỏ hàng. Mọi cập nhật đều sẽ

được hiển thị ở icon Giỏ hàng.

24


4.1.4. Giao diện giỏ hàng

Hình 4.1.4. : Giao diện giỏ hàng
Giao diện giỏ hàng gồm các sản phẩm trong giỏ, giá tiền mỗi sản phẩm và tổng giá
tiền các sản phẩm. Người dùng có thể thấy được giá tiền sau khi giảm giá cũng như số
tiền đã tiết kiệm được khi mua sắm trên web. Người dùng cũng có thể tăng, giảm
lượng sản phẩm muốn mua hoặc xóa sản phẩm khỏi giỏ hàng. Sau đó người dùng có
thể lựa chọn giữa tiếp tục mua sắm hoặc chuyển đến khu thanh toán. Nếu chọn tiếp tục
mua sắm, người dùng sẽ được đưa lại trang chủ để tiếp tục thêm sản phẩm vào giỏ
hàng.

25