ĐẠ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 : 19021368 - K64 T-CLC

- BÙI HOÀNG NAM : 19021334 - K64 T-CLC
- NGUYỄN BÁ ANH TUẤN : 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

Để hoà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, luôn luôn độ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ể hoà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 quý thầy cô tiếp tục, bổ sung góp ý để
đề tài được hoà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 quát ................................................................................... 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 hoà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
 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

1.4. 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 soá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à hoà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 yê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 toà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 Tính năng Giao diện
năng thực hiện

Quản lí tài Đăng ký tài khoản Đăng ký

khoản

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

Guest
Tìm kiếm sản Xem chi tiết sản phẩm Sản phẩm
phẩm
Xem danh sách khuyến Trang chủ
mãi, gợi ý

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

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

12
Actor Nhóm chức Tính năng Giao diện
năng thực hiện

Quản lí tài Đăng ký tài khoản Đăng ký

khoản

Xem danh sách sản phẩm Trang chủ

Tìm kiếm sản Xem chi tiết sản phẩm Sản phẩm
phẩm
Xem danh sách khuyến Trang chủ
mãi, gợi ý

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

Quản lí giỏ Thêm, xóa sản phẩm khỏi Sản phẩm

hàng giỏ hàng

User Thay đổi số lượng sản Giỏ hàng

phẩm

Áp dụng mã giảm giá Giỏ hàng

Đặt đơn và thanh toán Giỏ hàng

Quản lí tài Thay đổi chi tiết tài khoản Tài khoản
khoản
Xóa tài khoản Tài khoản

Quản lí đơn Xem lịch sử mua hàng Đơn hàng

hàng cá nhân
Xem chi tiết đơn hàng Đơn hàng

Hủy đơn hàng Đơn hàng

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

13
Actor Nhóm chức Tính năng Giao diện
năng thực hiện

Quản lí tài Đăng ký tài khoản Admin

khoản

Thêm sản phẩm Admin

Quản lí sản Xóa sản phẩm Admin

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

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

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

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

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

Quản lí đơn Kiểm tra đơn hàng Admin

hàng

Quản lí tài Reset mật khẩu tài khoản Admin

khoản
Disable tài khoản Admin

Xóa tài khoản Admin

Xem lịch sử tài khoản 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 toán và đặt, và đã
hoà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 quát

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
4.1.5. Giao diện thanh toán

Hình 4.1.5. : Giao diện thanh toán

Giao diện thanh toán gồm có địa chỉ giao hàng, ở đây người dùng sẽ chọn quốc gia,
điền mã Zipcode của khu vực đang sinh sống và địa chỉ hiện tại để nhận hàng. Sau đó
người dùng có thể xem lại giá tiền, tổng các sản phẩm thanh toán và áp dụng mã
giảm giá phù hợp để được giảm giá tiền phải thanh toán.

Sau khi đã thỏa mãn, người dùng sẽ tiến đến mục thanh toán.Ở đây sẽ có 2 lựa
chọn giữa thanh toán chuyển khoản qua PayPal hoặc thanh toán bằng hình thức
Shipcod. Khi đã lựa chọn xong và nhấn chọn Tiếp tục thanh toán, đơn hàng của
người dùng sẽ được gửi cho phía server xử lí và tiếp nhận.

26
4.2. Thiết kế giao diện Admin

4.2.1. Giao diện trang chủ Admin

Hình 4.2.1. : Giao diện Admin

Giao diện Admin để quản lí trang web được tạo sẵn bởi Django giúp người dùng
giảm thiểu thời gian thiết lập mà có thể dễ dàng quản lí. Giao diện được chia làm
nhiều phần tùy thuộc vào nhóm mục đích. Admin có thể thay đổi thông tin người
dùng, thêm xóa sản phẩm hay quản lí đơn hàng một cách dễ dàng.

27
 4.2.2. Giao diện Admin thêm sản phẩm

Hình 4.2.2. : Giao diện thêm sản phẩm

Để thêm 1 sản phẩm mới vào website, người quản lí chỉ cần điền đẩy đủ thông tin
sản phẩm vào các trường thông tin. Từ tên sản phẩm, giá sản phẩm, phân loại và nhãn
của sản phẩm. Mục slug sẽ giúp khởi tạo 1 đường link riêng để dẫn đến sản phẩm
đang tạo. Sau đó điền thông tin sản phẩm và hình ảnh của sản phẩm giúp người dùng
hiểu được rõ hơn về sản phẩm. Cuối cùng là lưu lại sản phẩm để được hiển thị trên
trang web.

28
 4.2.3. Giao diện Admin quản lí tài khoản

Hình 4.2.3. : Giao diện quản lí ngƣời dùng

Danh sách người dùng, admin và thông tin của họ sẽ được hiển thị dưới dạng
bảng. Nhà quản lí có thể thấy được những người dùng đã đăng kí trên trang web của
họ, cũng như là địa chỉ email, họ tên. Admin cũng có thể chỉnh sửa để cấp các quyền
khác nhau cho người dùng.

29
PHẦN V : ĐÁNH GIÁ KẾT QUẢ VÀ HƢỚNG PHÁT TRIỂN

5.1. Kết quả đạt đƣợc

Đề tài “xây dựng Website bán hàng trực tuyến” cũng xuất phát từ thực tế ngày nay
nhằm tạo một nền tảng cơ sở ban đầu để có thể hỗ trợ thêm cho các bạn muốn thiết kế
một Website cho công ty hay một Website cá nhân.

Mặc dù đã có nhiều cố gắng, tìm hiểu các kiến thức đã học, kết hợp tra cứu các tài
liệu chuyên ngành nhưng do hạn chế về thời gian cũng như khả năng và kinh nghiệm
của các thành viên trong nhóm nên không thể tránh khỏi những thiếu sót nhất định do
đó báo cáo đã hoàn thành ở mức độ sau.

Những kết quả đạt được

 Về công nghệ

+ Tìm hiểu chung về lập trình web, các ngôn ngữ được sử dụng

+ Tìm hiểu được về Framework Django, từ đó mở ra các hướng đi mới hiệu

quả hơn liên quan đến việc lập trình và quản lí website

+ Biết được cách thiết kế 1 website động cũng như cách tổ chức 1 cơ sở dữ
liệu trên SQLite

 Về ứng dụng

+ Giới thiệu các sản phẩm, mặt hàng kinh doanh tới khách hàng

+ Cho phép khách hàng tra cứu, tìm kiếm sản phẩm

+ Khách hàng có thể đặt mua sản phẩm online mà không cần trực tiếp đi xem
sản phẩm

30
 5.2. Hƣớng nghiên cứu và phát triển

Tìm hiểu sâu hơn về hệ quản trị cơ sở dữ liệu SQLite và Framework Django, từ đó
phát huy được tối đa tiềm năng mà cơ sở dữ liệu và framework này đem lại.

Tìm hiểu thêm một số ngôn ngữ, các phần mềm ứng dụng để nâng cao giao diện
đồ họa cho thêm phần sinh động, đẹp mắt, thu hút người dùng.

Tiến hành xây dựng các chức năng như tư vấn, chăm sóc khách hàng sử dụng
chatbot, quản lí đánh giá của khách hàng và tăng cường bảo mật, tránh các trường
hợp kẻ xấu lợi dụng để làm ảnh hưởng đến trang web.

PHẦN VI : KẾT LUẬN

Mục tiêu của nghiên cứu là để có được những hiểu biết chung về thiết kế một
website bán hàng cũng như áp dụng những hiểu biết đó vào thực tiễn để xây dựng một
sản phẩm hoàn chỉnh. Ta nhận thấy Framework Django kết hợp với hệ quản trị cơ sở
dữ liệu SQLite đã cho phép chúng ta xây dựng, thiết kế một trang web đơn giản nhưng
vô cùng hiệu quả, có khả năng áp dụng vào thực tiễn cao. Trong thời đại công nghệ số,
mua sắm online gần như đã trở thành một phần không thể thiếu trong cuộc sống của
mỗi chúng ta, việc một công ty hay cá nhân tổ chức bán hàng trên mạng là một
phương pháp tối ưu để bán hàng, có thể giảm thiểu thời gian và các chi phí khác của
khách hàng và công ty. Trong quá trình thực hiện đề tài này không thể tránh khỏi
những thiếu sót. Kính mong sự thông cảm, góp ý và bổ sung của các thầy cô và các
bạn để Website ngày càng hoàn thiện hơn.

Chúng em xin chân thành cảm ơn!

31
PHẦN VII : TÀI LIỆU THAM KHẢO VÀ SỬ DỤNG

Jon Duckett. Web Design with HTML, CSS, JavaScript and jQuery Set 1st Edition.

William S. Vincent. Django for Beginners : Build Website With Python & Django.

Daniel and Audrey Feldroy. A wedge of Django : The Django tutorial by the authors
of The Two Scoops of Django.

Và các tài liệu tham khảo trên Internet và Youtube

32