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

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

NGUYỄN TRUNG HIẾU - 19521508
NGUYỄN TIẾN DŨNG - 19521398

BÁO CÁO ĐỒ ÁN 1

XÂY DỰNG WEBSITE BÁN TOUR DU LỊCH CĨ HỖ
TRỢ THANH TỐN TRỰC TUYẾN
Building a website to sell tours with online payment support

GIẢNG VIÊN HƯỚNG DẪN
THS. THÁI THỤY HÀN UYỂN

TP. HỒ CHÍ MINH, 2022


ĐẠI HỌC QUỐC GIA TP.HCM

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

NGUYỄN TRUNG HIẾU – 19521508
NGUYỄN TIẾN DŨNG – 19521398

BÁO CÁO ĐỒ ÁN 1

XÂY DỰNG WEBSITE BÁN TOUR DU LỊCH CĨ

HỖ TRỢ THANH TỐN TRỰC TUYẾN
Building a website to sell tours with online payment support

GIẢNG VIÊN HƯỚNG DẪN
TH.S THÁI THỤY HÀN UYỂN

TP. HỒ CHÍ MINH, 2022


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

CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM

TRƯỜNG ĐẠI HỌC

Độc Lập – Tự Do – Hạnh Phúc

CÔNG NGHỆ THÔNG TIN

TP. HCM, ngày 15 tháng 6 năm 2022

ĐỀ CƯƠNG CHI TIẾT
Tên đề tài: Xây dựng website bán tour du lịch có hỗ trợ thay toán
Tên đề tài (tiếng Anh): Building a website to sell tours with online payment support
Cán bộ hướng dẫn: Th.s Thái Thụy Hàn Uyển
Sinh viên thực hiện:
Nguyễn Tiến Dũng – 19521398
Nguyễn Trung Hiếu - 19521508
Nội dung đề tài:
1. Mục tiêu

Xây dựng website bán tour du lịch với các chức năng:
• Phía bên client
o Xem thơng tin tour du lịch
o Tìm kiếm tour
o Đặt tour, thanh tốn
• Phía bên admin:
o Quản lý tour du lịch
o Quản lý các điểm đến
o Quản lý các đơn đặt tour

2. Phạm vi
• Phạm vi mơi trường: Xây dựng hệ thống trên mơi trường website
• Phạm vi chức năng:
o Đặt Tour


o Quản lý tour
o Quản lý điểm đến
o Quản lý đơn hàng
3. Đối tượng: Người có nhu cầu đi du lịch
4. Cơng nghệ
• Front-end: ReactJs
• Back-end: NodeJs, ExpressJs
• Database: MySQL
5. Phương pháp thực hiện
• Tìm hiểu về cơng nghệ
• Phân tích thiết kế hệ thống
• Xây dựng CSDL
• Xây dựng backend
• Xây dựng frontend

• Tiến hành kiểm thử và bảo trì
6. Kết quả mong đợi
• Xây dựng được ứng dụng với tất cả các yêu cầu được đặt ra
• Giao diện ứng dụng thân thiện, dễ sử dụng
• Ứng dụng dễ dàng phát triển và mở rộng trong tương lai
Kế hoạch thực hiện
Thời gian

Nội dung

Phân cơng

21/03/2022 - 11/03/2022

Tìm hiểu đề tài, đánh

Nguyễn Tiến Dũng

giá thị trường, xác định Nguyễn Trung Hiếu
các chức năng của hệ
thống
12/03/2022 - 26/03/2022

Tìm hiểu cơng nghệ

Nguyễn Tiến Dũng
Nguyễn Trung Hiếu


27/03/2022 – 16/04/2022 Phân tích thiết kế hệ

thống

Nguyễn Tiến Dũng
Nguyễn Trung Hiếu

17/04/2022 – 29/05/2022 Xây dựng website

Nguyễn Tiến Dũng: Xây
dựng frontend bên phía
client
Nguyễn Trung Hiếu: Xây
dựng frontend bên phía
admin, xây dựng backend

30/05/2022 – 08/06/2022 Kiểm thử và sửa lỗi

Nguyễn Tiến Dũng
Nguyễn Trung Hiếu

09/06/2022 – 15/06/2022 Hoàn thành báo cáo
Xác nhận của CBHD
(Ký tên và ghi rõ họ tên)

ThS. Thái Thụy Hàn Uyển

Nguyễn Tiến Dũng

TP. HCM ngày 15 tháng 6 năm 2022
Sinh viên
(Ký tên và ghi rõ họ tên)


Nguyễn Tiến

Nguyễn Trung

Dũng

Hiếu


LỜI CẢM ƠN
Để hồn thành được dự án cho mơn đồ án 1 này, chúng em xin gửi lời cảm ơn
chân thành đến Ths Thái Thụy Hàn Uyển đã tận tình hướng dẫn, giúp đỡ và định
hướng xuyên suốt quá trình hồn thành đồ án. Những lời góp ý, nhắc nhở của cô là
những hành trang và tiền đề cho chúng em trong quá trình học tập và phát triển bản
thân sau này.Chúng em cũng xin gửi lời càm ơn đến Khoa Công Nghệ Phần Mềm đã
tạo điều kiện cho chúng em được học tập trong môi trường tốt nhất.
Trong q trình làm đồ án này chúng em có thể vẫn cịn những thiết sót, mong
nhận được góp ý và chỉ dẫn cùa cô để đồ án của chúng em có thể hồn thiện hơn

TP. HCM, ngày 12 tháng 06 năm 2022

Sinh viên thực hiện

Sinh viên thực hiện

NGUYỄN TIẾN DŨNG

NGUYỄN TRUNG HIẾU



MỤC LỤC
Chương 1. MỞ ĐẦU ................................................................................................1
1.1.

Lý do chọn đề tài ..........................................................................................1

1.2.

Pham vi nghiên cứu .....................................................................................1

1.3.

Đối tượng nghiên cứu ..................................................................................1

Chương 2. CƠ SỞ LÝ THUYẾT ............................................................................2
2.1.

React .............................................................................................................2

2.1.1.

React là gì ..............................................................................................2

2.1.2.

Tại sao sử dụng React ...........................................................................2

2.1.3.


Một số khái niệm ...................................................................................2

2.1.4.

Một số React Hook phổ biến ................................................................5

2.1.5.

React Router Dom ................................................................................5

2.2.

NodeJs ...........................................................................................................5

2.2.1.

NodeJs là gì? ..........................................................................................5

2.2.2.

Tính năng vượt trội của NodeJs ..........................................................6

2.2.3.

Khi nào nên sử dụng NodeJs ...............................................................6

2.3.

ExpressJs ......................................................................................................6


2.3.1.

ExpressJs là gì .......................................................................................6

2.3.2.

ExpressJs được sử dụng làm gì? .........................................................7

2.4.

MySQL .........................................................................................................7

2.4.1.

MySQL là gì? ........................................................................................7

2.4.2.

Ưu điểm của MySQL ............................................................................8

2.5.

Các phần mềm và công nghệ khác .............................................................8

2.5.1.

Visual Studio Code................................................................................8

2.5.2.


GitHub ...................................................................................................8

2.5.3.

VietQR ...................................................................................................9

Chương 3. PHÂN TÍCH THIẾT KẾ HỆ THỐNG .............................................10
3.1.

Kiến trúc hệ thống .....................................................................................10

3.2.

Sơ đồ Use case ............................................................................................10


3.2.1.

Sơ đồ Usecase ......................................................................................10

3.2.2.

Danh sách Actor ..................................................................................12

3.2.3.

Danh sách Use case .............................................................................12

3.2.4.


Đặc tả use case .....................................................................................13

3.3.

Sơ đồ Sequence...........................................................................................25

3.4.

Cơ sở dữ liệu...............................................................................................40

3.4.1.

Lược đồ cơ sở dữ liệu..........................................................................40

3.4.2.

Chi tiết các bảng dữ liệu .....................................................................41

3.5.

Thiết kế giao diện .......................................................................................46

3.5.1.

Danh sách các trang trong hệ thống .................................................46

3.5.2.

Giao diện khách hàng .........................................................................48


3.5.3.

Giao diện quản lý ................................................................................53

Chương 4. KẾT LUẬN ..........................................................................................57
4.1.

Kết quả đạt được .......................................................................................57

4.1.1.

Về mặt nghiên cứu ..............................................................................57

4.1.2.

Về mặt sản phẩm.................................................................................57

4.2.

Ưu điểm ......................................................................................................57

4.3.

Nhược điểm ................................................................................................57

4.4.

Hướng phát triển .......................................................................................57



DANH MỤC HÌNH
Hình 2.1: Logo của React...........................................................................................2
Hình 2.2 React component lifecycle ..........................................................................4
Hình 2.3: Logo của NodeJs ........................................................................................6
Hình 2.4: ExpressJs ....................................................................................................6
Hình 2.5: MySQL.......................................................................................................8
Hình 3.1: Sơ đồ kiến trúc hệ thống ..........................................................................10
Hình 3.2: Sơ đồ use case tổng quát ..........................................................................10
Hình 3.3: Sơ đồ use case quản lý tour ......................................................................11
Hình 3.4: Sơ đồ use case quản lý điểm đến .............................................................11
Hình 3.5: Sơ đồ use case quản lý đơn hàng .............................................................12
Hình 3.6: Sequence Diagram use case “tìm kiếm tour” ...........................................26
Hình 3.7: Sequence Diagram use case “xem tour” ..................................................27
Hình 3.8: Sequence diagram use case “nhập thơng tin liên hệ” ..............................28
Hình 3.9: Sequence Diagram use case "Thanh tốn" ...............................................29
Hình 3.10: Sequence diagram use case "Đặt tour" ..................................................30
Hình 3.11: Sequence Diagram use case "Đăng nhập" .............................................30
Hình 3.12: Sequence diagram use case "Thêm điểm đến” ......................................31
Hình 3.13: Sequence diagram use case "Cập nhật điểm đến" .................................32
Hình 3.14: Sequence diagram use case “Xóa điểm đến" .........................................33
Hình 3.15: Sequence diagram use case “Thêm tour" ...............................................34
Hình 3.16: Sequence diagram use case “Cập nhật tour" ..........................................35
Hình 3.17: Sequence diagram use case “Xóa tour" .................................................36
Hình 3.18: Sequence diagram use case “Thêm ngày khởi hành" ............................37
Hình 3.19: Sequence diagram use case “Cập nhật ngày khởi hành" .......................38
Hình 3.20: Sequence diagram use case “xóa ngày khởi hành" ................................39
Hình 3.21: Sequence diagram use case “cập nhật đơn hàng” ..................................40
Hình 3.22: Cơ sở dữ liệu ..........................................................................................41
Hình 3.23: Giao diện màn hình trang chủ ................................................................48



Hình 3.24: Giao diện màn hình danh sách tour........................................................49
Hình 3.25: Giao diện màn hình chi tiết tour ............................................................50
Hình 3.26: Giao diện màn hình nhập thơng tin liên hệ ............................................51
Hình 3.27: Giao diện màn hình thanh tốn ..............................................................52
Hình 3.28: Giao diện trang khơng tồn tại.................................................................53
Hình 3.29: Giao diện màn hình đăng nhập ..............................................................53
Hình 3.30: Giao diện màn hình dashboard ..............................................................54
Hình 3.31: Giao diện màn hình quản lý tour............................................................55
Hình 3.32: Giao diện màn hình quản lý điểm đến ...................................................55
Hình 3.33: Giao diện màn hình quản lý thanh tốn .................................................56
Hình 3.34: Giao diện màn hình phân tích ................................................................56


DANH MỤC BẢNG
Bảng 3.1: Bảng danh sách các actor..........................................................................12
Bảng 3.2: Bảng mô tả ngắn các use case ..................................................................13
Bảng 3.3: Bảng đặc tả use case "tìm kiếm tour" .......................................................14
Bảng 3.4: Bảng đặc tả use case xem tour ..................................................................15
Bảng 3.5: Bảng đặc tả use case "nhập thông tin liên hệ" ..........................................16
Bảng 3.6: Bảng đặc tả use case "Thanh toán" ...........................................................17
Bảng 3.7: Bảng đặc tả use case "Đặt tour"................................................................17
Bảng 3.8: Bảng đặc tả use case đăng nhập ...............................................................18
Bảng 3.9: Bảng đặc tả use case thêm điểm đến ........................................................19
Bảng 3.10: Bảng đặc tả use case cập nhật điểm đến .................................................19
Bảng 3.11: Bản đặc tả use case xóa điểm đến ..........................................................20
Bảng 3.12: Bản đặc tả use case thêm tour.................................................................21
Bảng 3.13: Bản đặc tả use case cập nhật tour ...........................................................21
Bảng 3.14: Bảng đặc tả use case xóa tour .................................................................22
Bảng 3.15: Bảng đặc tả use case thêm ngày khởi hành ............................................23

Bảng 3.16: Bảng đặc tả use case cập nhật ngày khởi hành .......................................24
Bảng 3.17: Bảng đặc tả use case xóa ngày khởi hành ..............................................24
Bảng 3.18: Bảng đặc tả use case xem đơn đặt hàng .................................................25
Bảng 3.19: Bảng đặc tả use case cập nhật thanh toán ...............................................25
Bảng 3.20: Bảng mô tả các thông tin được lưu trữ ở CSDL .....................................41
Bảng 3.21: Bảng tours ...............................................................................................42
Bảng 3.22: Bảng detination .......................................................................................43
Bảng 3.23: Bảng chi tiết tour ....................................................................................43
Bảng 3.24: Bảng Lịch trình (Schedule) ....................................................................44
Bảng 3.25: Bảng payment .........................................................................................45
Bảng 3.26: Bảng user ................................................................................................46
Bảng 3.27: Bảng danh sách các màn hình ................................................................47


DANH MỤC TỪ VIẾT TẮT
STT

Từ viết tắt

Từ đầy đủ

1

CSDL

Cơ sở dữ liệu

Giải thích
Cơ sở dữ liệu


(Database)
2

DOM

Document Object

Mơ hình đối tượng tài

Model

liệu - một chuẩn được
định nghĩa bởi Tổ chức
Web toàn cầu.

3

URL

Uniform Resource
Locator

Địa chỉ của một tài
nguyên duy nhất trên
Web

4

CRUD


Create – Read –

Thêm, đọc, sửa và xóa

Update – Delete

dữ liệu trên cơ sở dữ liệu


Chương 1. MỞ ĐẦU
1.1.

Lý do chọn đề tài

Trong những năm vừa rồi tình hình dịch covid diễn biến phức tạp, người dân
trong nước khơng thể tự do ra ngồi. Cũng vì vậy, những hình thức mua bán trực
tuyến và thanh toán hàng online càng trở nên phổ biến và quen thuộc hơn. Vài
tháng trở lại đây, tình hình dịch đã nằm trong tầm kiểm soát, mọi hoạt động được
quay trở lại như bình thường. Sau một thời gian khơng được thoải mái ra đường,
nhu cầu được đi đây mai đó của mọi người cũng cao hơn. Hơn thế nữa, những thói
quen mua hàng trực tuyến vẫn cịn đó, vì vậy chúng em đã quyết định cho ra đời
một website cung cấp các tour du lịch với hình thức thanh tốn trực tuyến.

1.2.

Pham vi nghiên cứu

o Tìm hiểu bài tốn về cung cấp các tour du lịch đến khách hàng.
o Xây dựng website với phần frond-end sử dụng React, backend sử dụng
NodeJs và MySQL cho việc lưu trữ dữ liệu.


1.3.
-

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

Các cơng nghệ:
• Ngơn ngữ lập trình: Javascript, TypeScript
• JWT, React, NodeJs
• MySQL

-

Đối tượng:
• Khách hàng (người mua tour du lịch)
• Admin (Người cung cấp tour du lịch)

Trang 1


Chương 2. CƠ SỞ LÝ THUYẾT
2.1.

React

2.1.1.

React là gì

React là một thư viện JavaScript được phát triển bởi Facebook, được sử dụng

để phát triển giao diện người dùng (UI) có tính tương tác cao. React phát triển
giao diện bằng cách chia giao diện thành các thành phần (components), nhờ đó
các thành phần giao diện trùng lặp có thể tái sử dụng mà không cần phải code
lại. React hiện được sử dụng bởi rất nhiều công ty lớn trên thế giới, bao gồm
Neflix, Facebook, WhatsApp, Instagram…

Hình 2.1: Logo của React

2.1.2.

Tại sao sử dụng React

o React là một thư viện có mã nguồn mở, dễ sử dụng.
o React cho phép sử dụng lại components (Reusable Component) đã
được phát triển trước đó
o Có nhiều thư viện được xây dựng phù hợp cho các nhu cầu khác nhau
o Cộng động lớn
2.1.3.

Một số khái niệm

a. Virtual Dom
Virtual Dom là một DOM ảo, hoạt động tốt và đáng kể hơn so với DOM thực.
Một ứng dụng React sẽ được xây dựng từ nhiều các component. Các component

Trang 2


này sẽ chức hoặc không chứa những trạng thái (state). Khi trạng thái của một
component bị thay đổi, React sẽ so sánh phiên bản sau khi bị thay đổi và phiên

bản trước khi thay đổi và thực hiện cập nhật trên Virtual DOM. Quá trình này
gọi là “Diffing”.
b. JSX
JSX là một dạng ngôn ngữ cho phép viết các mã HTML trong JavaScript với
nhiều tính năng hỗ trợ lập trình viên:
• Tốc độ nhanh: JSX thực hiện tối ưu hóa trong khi biên dịch sang mã
JavaScript. Các mã này cho thời gian thực hiện nhanh hơn nhiều so với
việc viết một mã tương đương trực tiếp bằng JavaScript.
• An tồn: JSX là kiểu statically-typed, nghĩa là nó được biên dịch trước
khi chạy. Vì thế các lỗi sẽ được phát hiện ngay trong q trình biên
dịch.
• Dễ dàng hơn: JSX kế thừa dựa trên Javascript, vì vậy rất dễ dàng để
cho các lập trình viên Javascripts có thể sử dụng
c. Props và State
Props là một từ viết ngắn gọn của properties. Trong React, props là một đối
tượng lưu trữ giá trị được truyền từ bên ngoài vào bên trong component, thường
là truyền từ componet cha đến component con.
Khác với props, state được dùng để lưu trữ dữ liệu của chính component đó,
giá trị của state có thể thay đổi và sẽ component sẽ được render lại ngay sau khi
state thay đổi.
d. Component Lifecycle

Trang 3


Hình 2.2 React component lifecycle

Để lập trình một ứng dụng React, thì việc nắm rõ vịng đời của một
component sẽ giúp lập trình viên lập trình quản lí dữ liệu tốt hơn. Vòng đời của
một component sẽ bao gồm ba nhóm chính:

• Mouting: là giai đoạn mà component được khởi tạo và mount on the
DOM (chèn vào DOM)
• Updating: giai đoạn các state của componet thay đổi, component sẽ
render lại.
• Unmouting: component được unmout DOM (xóa khỏi DOM)
d. React Hook
Những người mới tiếp xúc với React lần đầu, sẽ cảm thấy rất bối rối trong
việc làm quen với lifecycle của component. Hơn thế, việc sử dụng các
component với các hàm trong lifecycle cũng khiến nhiều lập trình viên dù đã có
kinh nghiệm những vẫn sẽ gặp nhiều khó khăn. Nhận thấy điều này, React đã
cho ra đời React Hook. Với Hook, lập trình viên có thể dễ dàng quản lý state
mà không cần sử dụng đến class.

Trang 4


2.1.4.

Một số React Hook phổ biến

a. UseState
UseState là một hàm nhận vào một tham số là giá trị khởi tạo của state và trả
về một mảng gồm hai phần tử. Phần tử thứ nhất là state hiện tại. phần tử thứ 2
là một hàm sử dụng để cập nhật state.
b. UseEffect
UseEffect là một hàm nhận vào hai tham số. Tham số thứ nhất là một hàm,
tạm gọi là callback. Tham số thứ hai sẽ là một mảng mảng hoặc không có gì cả.
Callback sẽ được gọi mặc dịnh lần đầu tiên khi component được mout vào
DOM, sau khi render xong component. Nếu như không truyền tham số thứ hai
cho useEffect, callback sẽ được gọi mỗi khi component rerender. Nếu như tham

số thứ 2 là mảng, callback được gọi mỗi khi mảng đó thay đổi.
c. UseContext
UseContext được sinh ra để giải quyết việc chia sẻ các state giữa các
component. UseContext có thể giúp lưu trữ các state ở toàn cục, giúp cho tất cả
các component con bên trong context đều có thể lấy state ở bất kỳ đâu.
2.1.5.

React Router Dom

React không tích hợp sẵn router, nhưng chúng ta có thể làm điều này bằng
cách cài đặt thư viện React Router Dom. Thư viên này cho phép thay đổi URL
của trình duyệt và render ra giao diện tương ứng.

2.2.

NodeJs

2.2.1.

NodeJs là gì?

Nodejs là một nền tảng (Platform) phát triển độc lập được xây dựng trên V8
JavaScript Engine – một trình thơng dịch thực thi mã JavaScript. NodeJS có thể
chạy trên nhiều nền tảng hệ điều hành khác nhau từ Windows cho tới Linux,
MacOs nên đó cũng là một lợi thế. NodeJs hỗ trợ nhiều thư viện giúp việc lập
trình trở nên đơn giản hóa.

Trang 5



Hình 2.3: Logo của NodeJs

2.2.2.

Tính năng vượt trội của NodeJs

• Thực thi các sự kiện không đồng bộ, cho phép xử lí nhiều yều cầu đồng
thời
• Nodejs được xây dựng dựa vào nền tảng V8 Javascript Engine nên việc
thực thi chương trình rất nhanh
2.2.3.

Khi nào nên sử dụng NodeJs

• Xây dựng ứng dụng Restful API
• Các ứng dụng cần về thời gian thực
• Các chương trình upload file với tốc độ cao

2.3.

ExpressJs

2.3.1.

ExpressJs là gì

ExpressJs là một framework mã nguồn mở miễn phí cho NodeJs. ExpressJs
được sử dụng trong thiết kế và xây dựng các ứng dụng web một cách đơn giản
và nhanh chóng. Để hiểu và sử dụng ExpressJs, lập trình viên chỉ cần biết về
JavaScript, do đó việc xây dựng website sẽ càng dễ dàng hơn đối với các lập

trình viên đã biết về JavaScript trước đó.

Hình 2.4: ExpressJs

Trang 6


2.3.2.

ExpressJs được sử dụng làm gì?

ExpressJS sẽ giúp bạn tổ chức kiến trúc back-end của mình. ExpressJs có thể
triển khai website với mơ hình MVC – một mơ hình web phổ biến, giúp cho
việc bảo trì tương đối dễ dàng.
Một số tính năng của ExpressJs:
• Phát triển máy chủ nhanh hơn: cung cấp cho bạn nhiều tính năng phổ
biến của Node.js dưới dạng hàm có thể dễ dàng sử dụng ở bất kỳ đâu
trong chương trình. Điều này sẽ giúp rút ngắn thời gian để viết code.
• Định tuyến: cung cấp cơ chế định tuyến cao giúp duy trì trạng thái của
trang web.
• Khn mẫu: cung cấp các cơng cụ tạo khuôn mẫu cho phép các nhà phát
triển tạo nội dung động trên các trang web bằng việc xây dựng các mẫu
HTML ở phía máy chủ.
• Gỡ lỗi: cung cấp một cơ chế có khả năng xác định chính xác phần ứng
dụng web có lỗi.

2.4.

MySQL


2.4.1.

MySQL là gì?

MySQL là một hệ thống quản trị cơ sở dữ liệu mã nguồn mở (gọi tắt là
RDBMS) hoạt động theo mơ hình client-server. Với RDBMS là viết tắt của
Relational Database Management System.
MySQL được đánh giá cao nhờ việc tích hợp với Apache và PHP. Khơng chỉ
vậy, việc có tính tương thích với nhiều trình duyệt, với nhiều hệ điều hành tiêu
biểu như Ubuntu, Linux, macOS, Windows càng giúp việc sử dụng MySQL
được tin tưởng và ưa chuộng nhiều hơn.

Trang 7


Hình 2.5: MySQL

2.4.2.

Ưu điểm của MySQL

MySQL được ưa chuộc trong các ứng dụng website nhờ một số ưu điểm sau:
o MySQL là một cơ sở dữ liệu tốc độ cao, ổn định dễ sử dụng và có thể
hoạt động được trên nhiều hệ điều hành khác nhau.
o MySQL có độ bảo mật cao, thích hợp cho các ứng dụng truy cập CSDL
trên internet.
o Có khả năng xử lý rất nhiều dữ liệu và có thể mở rộng nếu cần thiết.
o MySQL hồn tồn miễn phí sử dụng

2.5.


Các phần mềm và cơng nghệ khác

2.5.1.

Visual Studio Code

Visual Studio Code là một trình soạn thảo mã nguồn được phát triển bởi
Microsoft dành cho Windows, Linux và macOS. Nó hỗ trợ chức năng debug, đi
kèm với Git, có chức năng nổi bật cú pháp (syntax highlighting), tự hồn thành
mã thơng minh, snippets, và cải tiến mã nguồn. Nó cũng cho phép tùy chỉnh, do
đó, người dùng có thể thay đổi theme, phím tắt, và các tùy chọn khác. Nó miễn
phí và là phần mềm mã nguồn mở theo giấy phép MIT, mặc dù bản phát hành
của Microsoft là theo giấy phép phần mềm miễn phí.
2.5.2.

GitHub

GitHub là một hệ thống quản lý dự án và phiên bản code, GitHub
được coi giống như một mạng xã hội dành riêng cho các lập trình

Trang 8


viên. Với GitHub, các lập trình viên có thể clone lại mã nguồn từ một
repository. Nó cũng là một dịch vụ máy chủ repository giúp lưu trữ
code và mỗi người có thể tạo tài khoản trên đó để tạo ra các kho chứa
của riêng mình để làm việc.
Github có đầy đủ tính năng của Git, ngồi ra nó cịn bổ sung những
tính năng về social giúp các developer có thể tương tác với nhau.

GitHub giống như một trang mạng xã hội dành riêng cho lập trình
viên cung cấp các chức năng social networking như feeds, follower
và network graph để các lập trình viên học hỏi kinh nghiệm từ lịch
sử commit.
2.5.3. VietQR
VietQR là nhận diện thương hiệu chung cho các dịch vụ thanh toán, chuyển
khoản bằng mã QR được xử lý qua mạng lưới Napas, các Ngân hàng thành viên,
Trung gian thanh toán, các đối tác thanh toán tại Việt Nam và quốc tế của Napas
Mã QR sử dụng tuân thủ theo tiêu chuẩn thanh toán QR của EMV Co. và Tiêu
chuẩn cơ sở cho mã QR do Ngân hàng Nhà nước Việt Nam ban hành.
Chuyển khoản bằng mã QR: là phương thức chuyển tiền giữa tài khoản/thẻ
ngân hàng thông qua hình thức qt mã QR. Thơng tin thanh tốn được mã hóa
trong mã QR gồm: Số tài khoản/thẻ, Mã hiệu ngân hàng, Số tiền, Nội dung
thanh tốn, Thơng tin đơn hàng và các thơng tin liên quan khác (nếu có) giúp
việc khởi tạo lệnh thanh tốn được thực hiện Chính xác, Nhanh chóng và An
tồn.).

Trang 9


Chương 3. PHÂN TÍCH THIẾT KẾ HỆ THỐNG
3.1.

Kiến trúc hệ thống

Hình 3.1: Sơ đồ kiến trúc hệ thống

3.2.

Sơ đồ Use case


3.2.1.

Sơ đồ Usecase

Hình 3.2: Sơ đồ use case tổng quát

Trang 10


Hình 3.3: Sơ đồ use case quản lý tour

Hình 3.4: Sơ đồ use case quản lý điểm đến

Trang 11


Hình 3.5: Sơ đồ use case quản lý đơn hàng

3.2.2.
STT
1

Danh sách Actor
Tên Actor

Mơ tả

Guest


Khách hàng, người đặt và thanh tốn các tour
trên hệ thống.

2

Quản trị viên, người thực hiện quản lý các dịch

Admin

vụ trên website
Bảng 3.1: Bảng danh sách các actor
3.2.3.

Mã

Danh sách Use case

Tên Use case

Actor

UC01 Tìm kiếm tour

Guest

UC02 Xem tour

Guest

UC03


Nhập thơng tin
liên hệ

UC04 Thanh tốn

Guest
Guest

Mơ tả ngắn
Tìm kiếm các tour dựa trên nơi xuất phát,
điểm đến, giá tiền,…
Hiển thị thông tin chi tiết của một tour
Nhập các thông tin cơ bản để tiến hành
đặt tour
Quét mã VietQR để thanh toán.

Trang 12


Sau khi hồn tất phần nhập thơng tin liên
UC05 Đặt tour

Guest

hệ và thanh tốn, gửi email thơng báo về
đơn hàng.

UC06 Đăng nhập


Admin

Đăng nhập để thực hiện các nghiệp vụ
quản lý

UC07 Thêm điểm đến Admin Thêm một điểm đến
UC08

Cập nhật điểm
đến

Admin Cập nhật thơng tin điểm đến

UC09 Xóa điểm đến

Admin Xóa thông tin của điểm đến

UC10 Thêm tour

Admin Thêm tour

UC11 Cập nhật tour

Admin Cập nhật thơng tin tour

UC12 Xóa Tour

Admin Xóa thông tin tour

UC13


UC14

UC15

UC16

UC17

Thêm ngày

Admin Thêm ngày khởi hành của tour

khởi hành
Cập nhật ngày
khởi hành
Xóa ngày khởi
hành
Xem thơng tin
thanh tốn
Cập nhật thơng
tin thanh tốn

Admin

Cập nhật các thơng tin về ngày khởi hành
của tour

Admin Xóa thơng tin khởi hành của tour


Admin Xem thông tin các đơn đặt tour

Admin Cập nhật thông tin thanh tốn tour.

Bảng 3.2: Bảng mơ tả ngắn các use case
3.2.4.

Đặc tả use case

ID

UC01

Name

Tìm kiếm tour

Trang 13