hệ thống quản lý cửa hàng cho thuê xe ô tô (co code demo )

HỌC VIỆN CƠNG NGHỆ BƯU CHÍNH VIỄN THƠNG

KHOA CƠNG NGHỆ THÔNG TIN 1
----------

BÁO CÁO TỔNG HỢP
KIẾN TRÚC VÀ THIẾT KẾ PHẦN MỀM

Hà Nội, 5/2023


LỜI CẢM ƠN
Em xin gửi lời cảm ơn chân thành đến thầy Nguyễn Mạnh Hùng - giảng viên
môn Kiến trúc và thiết kế phần mềm, trường Học viện Công nghệ Bưu chính –
Viễn thơng đã trang bị giúp em những kỹ năng cơ bản và kiến thức cần thiết để
hoàn thành được bài tập lớn này.
Tuy nhiên, trong quá trình làm bài tập lớn do kiến thức chuyên ngành của
em cịn hạn chế nên khơng thể tránh khỏi một vài thiếu sót khi trình bày và đánh
giá vấn đề. Rất mong nhận được sự góp ý, đánh giá của thầy để đề tài của em thêm
hoàn thiện hơn.
Em xin chân thành cảm ơn!


MỤC LỤC
I.

Thiết kế thực thể ......................................................................................................... 1

II.

Thiết kế cơ sở dữ liệu .............................................................................................. 2

III.

Chức năng “Quản lý xe ô tô cho thuê” .................................................................. 2

1. Hoạt động của module ............................................................................................ 2
2. Giao diện phía client................................................................................................ 3
3. Biểu đồ lớp chi tiết: ................................................................................................. 5
a.

Client: Sử dụng ReactJS ........................................................................................ 5

b. Server: Sử dụng Express ........................................................................................ 6
4. Biểu đồ tuần tự: ....................................................................................................... 6
a.

Client: ..................................................................................................................... 6

b. Server ..................................................................................................................... 8
Chức năng “Khách hàng đặt xe online” .............................................................. 10

IV.

1. Hoạt động của module .......................................................................................... 10
2. Giao diện bên client:.............................................................................................. 11
3. Biểu đồ lớp chi tiết: ............................................................................................... 13
a.

Client: sử dụng ReactJS ....................................................................................... 13

b. Server: sử dụng Express ....................................................................................... 13
4. Biểu đồ tuần tự: ..................................................................................................... 14
a.

Client: ................................................................................................................... 14

b. Server: .................................................................................................................. 15
V. Chức năng “Nhận trả xe và thanh toán từ khách hàng” ...................................... 16
1. Hoạt động của module .......................................................................................... 16
2. Giao diện bên client:.............................................................................................. 17
3. Biểu đồ lớp chi tiết: ............................................................................................... 18
a.

Client: sử dụng ReactJS ....................................................................................... 18

b. Server: sử dụng Express ....................................................................................... 19
4. Biểu đồ tuần tự: ..................................................................................................... 20
a.

Client: ................................................................................................................... 20

b. Server: .................................................................................................................. 21


I.

Thiết kế thực thể

- Các danh từ liên quan đến người: User, Staff, Customer
+ User: username, password, name, role, phoneNumber, address, email

+ Staff, Customer kế thừa User
- Các danh từ liên quan đến vật: Car, CarBooking, PenaltyError
+ Car: name, price, feature, type, description
+ CarBooking: car, customer, rentalDate, returnDate, deposit, totalFee
+ PenaltyError: name, penaltyPrice
+ CarReturning: carBooking, Staff, penaltyError
- Xác định quan hệ số lượng giữa các lớp thực thể:
+ 1 Customer có thể có nhiều CarBooking -> quan hệ 1-n
+ 1 Car có thể có nhiều CarBooking -> quan hệ 1-n
+ 1 CarBooking sẽ có 1 CarReturning -> quan hệ 1-1
+ 1 CarReturning có thể có nheieuf PenaltyError -> quan hệ 1-n
+ 1 Staff có thể xử lý nhiều CarReturning -> quan hệ 1-n
- Xác định quan hệ đối tượng giữa các lớp thực thể:
+ Staff, Customer kế thừa User
+ Customer là thành phần của CarBooking
+ CarBooking là thành phần của Car
+ PenaltyError là thành phần của CarReturning
+ Staff là thành phần của CarReturning
- Thiết kế lớp thực thể:
+ Bổ sung id cho các lớp không kế thừa từ lớp khác: User,
CarBooking, Car, PenaltyError, CarReturning
+ Thuộc tính các lớp được bổ sung theo kiểu của ngôn ngữ Javascript
+ Bổ sung các thuộc tính thành phần của quan hệ hợp thành/ gắn chặt
1


➔ Thực thể hệ thống:

II. Thiết kế cơ sở dữ liệu
- Mỗi lớp thực thể đề xuất thành 1 bảng

- Bỏ qua các thuộc tính kiểu đối tượng
- Các thực thể quan hệ 1-n và 1-1 giữ nguyên quan hệ
- Khóa chính được thiết lập với thuộc tính id của bảng: tblUser, tblCarBooking,
tblCar, tblPenaltyError, tblCarReturning

III. Chức năng “Quản lý xe ô tô cho thuê”
Hoạt động của module
Nhân viên đăng nhập vào hệ thống, giao diện trang chủ phía client hiện lên
Nhân viên chọn button thêm xe, giao diện thêm xe hiện lên
Nhân viên nhập thông tin của xe và nhấn button Thêm xe gọi tới
CarService.js
- Lớp CarService.js gửi request thêm xe tới server thông qua http request
1.
-

2


- Server nhận request và thêm thông tin xe vào database rồi trả lại response
cho client
- Phía client hiển thị thêm xe thành công
- Nhân viên chọn button sửa xe, giao diện tìm kiếm xe hiện lên
- Nhân viên nhập từ khóa vào ơ input và nhấn button search gọi tới lớp
CarService.js
- Lớp CarService.js gửi request tới server
- Server nhận request tìm kiếm thơng tin theo từ khóa và trả về cho client
- Phía client hiển thị thơng tin tìm kiếm trên giao diện tìm kiếm xe
+ Nhân viên chọn sửa 1 xe, gọi tới lớp CarService.js gửi request hiển thị
thơng tin xe theo id tới server
• Server nhận request và trả về thơng tin xe theo id cho client

• Client hiển thị thông tin xe trên giao diện cập nhật xe
• Nhân viên cập nhật thơng tin mới và nhấn Cập nhật, lớp
CarService.js gửi request cập nhật xe tới server
• Server nhận request và cập nhật thơng tin xe rồi trả về response
thành cơng cho client
• Client hiển thị cập nhật thành cơng
+ Nhân viên chọn xóa 1 xe, gọi tới lớp CarService.js gửi request u
cầu xóa xe
• Server nhận request và xóa xe trong database , trả về response
thành cơng cho phía client
• Client hiển thị thơng báo xóa thành cơng cho nhân viên
2. Giao diện phía client

Đăng nhập
Username:
Password:
Đăng nhập

3


Trang chủ nhân viên
Quản lý xe ô tô

Quản lý xe ô tô
Thêm ô tô
Sửa ô tô
Xóa ô tô
Trang chủ

Thêm xe
Tên xe
Gía th
Tính năng
Loại xe
Mơ tả
Thêm xe

4


Tìm kiếm
Tìm kiếm

Mã xe

Tên xe

Mơ tả

Sửa
(click để
sửa)

Xóa
(click để
xóa)

Trở lại

Sửa thơng tin xe
Tên xe

Toyota

Gía th

10000000

Tính năng

Xe chạy nhanh

Loại xe

Toyota

Mơ tả
Cập nhật

3. Biểu đồ lớp chi tiết:
a. Client: Sử dụng ReactJS
5


- Tầng giao diện có trang: LoginView.js, HomeStaffView.js,
ManagementView.js, AddCarView.js, SearchCarView.js, UpdateCarView.js
- Tầng call api phía server: UserService.js, CarService.js
- Tầng thực thể: User, Car

b.
-

Server: Sử dụng Express
Tầng định danh url api: Server.js
Tầng thao tác với cơ sở dữ liệu: UserController.js, CarController.js
Tầng thực thể: User, Car

4. Biểu đồ tuần tự:
a. Client:

6


Tại giao diện đăng nhập, nhân viên đăng nhập vào hệ thống
Lớp LoginView.js gọi hàm checkLogin() để yêu cầu đăng nhập
Hàm checkLogin() gọi đến lớp UserService.js
Lớp UserService.js gọi hàm fetchCheckLogin() để call api đến server kiểm
tra đăng nhập
5. Hàm fetchCheckLogin() trả về kết quả đăng nhập cho lớp LoginView.js
6. Đăng nhập thành công, lớp LoginView.js gọi lớp HomeStaffView.js
7. Lớp HomeStaffView.js hiển thị cho nhân viên
8. Nhân viên chọn quản lý xe
9. Lớp HomeStaffView.js gọi lớp ManagementCarView.js
10.Lớp ManagementCarView.js hiển thị cho nhân viên
11.Nhân viên chọn thêm xe
12.Lớp ManagementCarView.js gọi lớp AddCarView.js
13.Lớp AddCarView.js hiển thị cho nhân viênn
14.Nhân viên nhập thông tin của xe và nhấn vào button Thêm xe
15.Lớp AddCarView.js gọi hàm addCar() yêu cầu thêm xe vào cơ sở dữ liệu

16.Hàm addCar() gọi lớp CarService.js
17.Lớp CarService.js gọi hàm fetchAddCar() để call api thêm xe vào cơ sở dữ
liệu
1.
2.
3.
4.

7


18.Hàm fetchAddCar() trả về kết quả cho lớp AddCarView.js
19.Lớp AddCarView.js trả kết quả cho lớp ManagementCarView.js
20.Lớp ManagementCarView.js hiển thị thêm xe thành công cho nhân viên
21.Nhân viên chọn cập nhật xe
22.Lớp ManagementCarView.js gọi lớp SearchCarView.js
23.Lớp SearchCarView.js hiển thị cho nhân viên
24.Nhân viên nhập từ khóa vào ơ input và nhấn nút tìm kiếm
25.Lớp SearchCarView.js gọi hàm searchCar() yêu cầu tìm kiếm
26.Lớp hàm searchCar() gọi lớp CarService.js
27.Lớp CarService.js gọi hàm fetchSearchCar() để call api tìm kiếm
28.Hàm fetchSearchCar() trả kết quả tìm kiếm về cho lớp SearchCarView.js
29.Lớp SearchCarView.js hiển thị kết quả tìm kiếm cho nhân viên
30.Nhân viên chọn xe muốn chỉnh sửa thông tin
31.Lớp SearchCarView.js gọi lớp UpdateCarView.js
32.Lớp UpdateCarView.js hiển thị cho nhân viên
33.Nhân viên chỉnh sửa thông tin và nhấn nút Chỉnh sửa
34.Lớp UpdateCarView.js gọi hàm updateCar() yêu cầu chỉnh sửa
35.Hàm updateCar() gọi lớp CarService.js
36.Lớp CarService.js gọi hàm fetchUpdateCar() call api chỉnh sửa

37.Hàm fetchUpdateCar() trả kết quả về cho lớp UpdateCarView.js
38.Lớp UpdateCarView.js trả kết quả về cho SearchCarView.js
39.Lớp SearchCarView.js hiển thị cập nhật thành công cho nhân viên
40.Nhân viên chọn xóa một xe trong kết quả tìm kiếm
41.Lớp SearchCarView.js gọi hàm deleteCar() u cầu xóa thơng tin xe
42.Hàm deleteCar() gọi lớp CarService.js
43.Lớp CarService.js gọi hàm fetchDeleteCar() call api xóa thơng tin xe
44.Hàm fetchDeleteCar() trả kết quả về cho lớp SearchCarView.js
45.Lớp SearchCarView() hiển thị xóa thành cơng cho nhân viên.
b. Server

8


1. Client gửi yêu cầu đăng nhập tới
2. Lớp Server.js gọi lớp UserController.js
3. Lớp UserController.js gọi lớp User
4. Lớp User đóng goi thực thể User
5. Lớp User trả về kết quả cho lớp UserController.js
6. Lớp UserController.js gọi hàm checkLogin() để kiểm tra đăng nhập
7. Lớp UserController.js trả kết quả cho lớp Server.js
8. Lớp Server.js trả kết quả cho client
9. Client gửi yêu cầu tìm kiếm
10.Lớp Server.js gọi lớp CarController.js
9


11.Lớp CarController.js gọi hàm searchCar() để tìm kiếm thơng tin xe
12.Lớp CarController.js gọi lớp Car
13.Lớp Car đóng gói thơng tin thực thể

14.Lớp Car trả kết quả về cho lớp CarController.js
15.Lớp CarController.js trả kết quả về cho lớp Server.js
16.Lớp Server.js trả kết quả cho client
17.Client gửi yêu cầu thêm thông tin xe
18.Lớp Server.js gọi lớp CarController.js
19.Lớp CarController.js gọi hàm addCar() để thêm thơng tin xe
20.Lớp CarController.js gọi lớp Car
21.Lớp Car đóng gói thơng tin thực thể
22.Lớp Car trả kết quả về cho lớp CarController.js
23.Lớp CarController.js trả kết quả về cho lớp Server.js
24.Lớp Server.js trả kết quả cho client
25.Client gửi yêu cầu sửa thông tin xe
26.Lớp Server.js gọi lớp CarController.js
27.Lớp CarController.js gọi hàm updateCar() để sửa thông tin xe
28.Lớp CarController.js gọi lớp Car
29.Lớp Car đóng gói thơng tin thực thể
30.Lớp Car trả kết quả về cho lớp CarController.js
31.Lớp CarController.js trả kết quả về cho lớp Server.js
32.Lớp Server.js trả kết quả cho client
33.Client gửi u cầu xóa thơng tin xe
34.Lớp Server.js gọi lớp CarController.js
35.Lớp CarController.js gọi hàm deleteCar() để xóa thơng tin xe
36.Lớp CarController.js gọi lớp Car
37.Lớp Car đóng gói thơng tin thực thể
38.Lớp Car trả kết quả về cho lớp CarController.js
39.Lớp CarController.js trả kết quả về cho lớp Server.js
40.Lớp Server.js trả kết quả cho client

IV. Chức năng “Khách hàng đặt xe online”
1. Hoạt động của module

- Khách hàng đăng nhập thành công vào hệ thống, giao diện trang chủ khách
hàng hiện ra
- Khách hàng chọn đặt xe, giao diện tìm kiếm xe hiện ra
- Khách hàng chọn loại xe, giá xe và nhấn tìm kiếm
- Lớp CarService,js gửi yêu cầu tìm kiếm xe tới server
10


- Server nhận request, tìm kiếm trong cơ sở dữ liệu và trả về kết quả tìm kiếm
cho client
- Phía client hiển thị danh sách tìm kiếm cho khách hàng trên giao diện tìm
kiếm
- Khách hàng chọn 1 xe và chọn Đặt xe
- Lớp CarBookingService.js gửi request đặt xe tới server
- Server nhận request, xử lý và trả kết quả về cho client
- Phía client hiển thị đặt xe thành công cho khách hàng
2. Giao diện bên client:

Trang chủ khách hàng
Đặt xe
Xem đơn hàng

Tìm kiếm
Loại xe

Select

Gía xe tối đa

Select

Tìm kiếm

Mã xe

Tên xe

Mô tả

Chọn
(click để
chọn )

11


Thơng tin xe
Tên xe

abc

Gía th

123

Tính năng

nhanh

Loại xe

xyz

Mơ tả

abcxyz

Ngày th

select

Ngày trả

select

Địa điểm nhận xe

select
Đặt xe

Hợp đồng thuê xe
Tên xe

abc

Ngày thuê

x/y/z

Gía thuê

123

Ngày trả

a/b/c

Tính năng

nhanh

Địa điểm nhận xe

qưe

Loại xe

xyz

Mơ tả

abcxyz

Người th

Nguyen van a

12


Tiền cọc

2000

Xác nhận CCCD

1234567

Tiền th tạm tính

2000

Xác nhận blx

1243445

Tổng tiền

4000

Hình thức thanh toán

select
Xác nhận đặt xe

3. Biểu đồ lớp chi tiết:
a. Client: sử dụng ReactJS
- Tầng giao diện có các trang: HomeCustomerView.js, OrderView.js,
SearchRentalCarView.js, CarInformationView.js, CarBookingView.js
- Tầng call api phía server: CarService.js, CarBookingService.js
- Tầng thực thể: Car, CarBooking

b.
-

Server: sử dụng Express
Tầng định danh url api: Server.js
Tầng thao tác với cơ sở dữ liệu: CarBookingController.js, CarController.js
Tầng thực thể: CarBooking, Car

13


4. Biểu đồ tuần tự:
a. Client:

1.
2.
3.
4.
5.
6.

Tại giao diện HomeCustomerView.js, khách hàng chọn nút đặt xe
Lớp HomeCustomerView.js gọi lớp SearchRentalCarView.js
Lớp SearchRentalCarView.js hiển thị cho khách hàng
Khách hàng chọn loại xe và giá xe rồi nhấn button Tìm kiếm
Lớp SearchRentalCarView.js gọi hàm searchRentalCar() yêu cầu tìm kiếm
Lớp SearchRentalCarView.js gọi lớp CarService.js
14

7. Lớp CarService.js gọi hàm fetchSearchRentalCar() call api tìm kiếm
8. Lớp CarService.js trả kết quả tìm kiếm cho lớp SearchRentaCarView.js
9. Lớp SearchRentalCarView.js hiển thị kết quả tìm kiếm cho khách hàng
10.Khách hàng click vào một xe
11.Lớp SearchRentalCarView.js gọi lớp CarInformationView.js
12.Lớp CarInformationView.js gọi hàm getCar() để yêu cầu lấy thông tin của xe
được chọn
13.Lớp CarInformationCarView.js gọi lớp CarService.js
14.Lớp CarService.js gọi hàm fetchGetCar() call api lấy thông tin
15.Lớp CarService.js trả kết quả cho lớp CarInformationView.js
16.Lớp CarInformationView.js hiển thị cho khách hàng
17.Khách hàng chọn ngày bắt đầu thuê, ngày kết thúc thuê, địa điểm nhận xe và
chọn nút Đặt xe
18.Lớp CarInformationView.js gọi lớp CarBookingView.js
19.Lớp CarBookingView.js hiển thị thông tin cho khách hàng
20.Khách hàng chọn hình thức thanh tốn và nhấn chọn Xác nhận đặt xe
21.Lớp CarInformationView.js gọi hàm BookingCar() yêu cầu đặt xe
22.Lớp CarInformationView.js gọi lớp CarBookingService.js
23.Lớp CarBookingService.js gọi hàm fetchBookingCar() call api đặt xe
24.Lớp CarBookingService.js trả kết quả cho lớp CarBookingView.js
25.Lớp CarBookingService.js trả kết quả về cho lớp HomeCustomerView.js
26.Lớp HomeCustomerView.js hiển thị đặt xe thành công
b. Server:

15


1. Client gửi yêu cầu tìm kiếm
2. Lớp Server.js gọi lớp CarController.js

3. Lớp CarController.js gọi hàm searchRentalCar() để tìm kiếm
4. Lớp CarController.js gọi lớp Car để đóng gói
5. Lớp Car đóng gói thực thể
6. Lớp Car trả kết quả về cho lớp CarController.js
7. Lớp CarController.js trả kết quả về cho Server.js
8. Lớp Server.js trả kết quả cho client
9. Client gửi yêu cầu lấy thông tin xe cụ thể
10.Lớp Server.js gọi lớp CarController.js
11.Lớp CarController.js gọi hàm getCar() để lấy thông tin xe
12.Lớp CarController.js gọi lớp Car để đóng gói
13.Lớp Car đóng gói thực thể
14.Lớp Car trả kết quả về cho lớp CarController.js
15.Lớp CarController.js trả kết quả về cho Server.js
16.Lớp Server.js trả kết quả cho client
17.Client gửi yêu cầu đặt xe
18.Lớp Server.js gọi lớp CarBookingController.js
19.Lớp CarBookingController.js gọi hàm BookingCar()
20.Lớp CarBookingController.js gọi lớp CarBooking để đóng gói
21.Lớp CarBooking đóng gói thực thể
22.Lớp CarBooking trả kết quả về cho lớp CarBookingController.js
23.Lớp CarBookingController.js trả kết quả về cho Server.js
24.Lớp Server.js trả kết quả cho client

V.

Chức năng “Nhận trả xe và thanh toán từ khách hàng”

1. Hoạt động của module
- Khách hàng đến cửa hàng và yêu cầu trả xe
- Nhân viên đăng nhập vào hệ thống thành công, giao diện trang chủ nhân viên

hiện ra
- Nhân viên chọn Trả xe, giao diện tìm kiếm hiện ra
- Nhân viên tìm kiếm hợp đồng xe của khách hàng để tiến hàng trả xe
- Sau khi có kết quả tìm kiếm, nhân viên nhấn vào xem chi tiết hợp đồng
- Nhân viên xác nhận với khách hàng về thơng tin, giá th và tiền hồn trả
- Khách hàng xác nhận đúng thông tin
- Nhân viên hỏi khách hàng hình thức thanh tốn hợp đồng
- Khách hàng chọn hình thức tiền mặt
- Nhân viên chọn button Trả xe trên giao diện Trả xe
- Nhân viên thanh toán hợp đồng và gửi biên lai cho khách hàng
16


2. Giao diện bên client:

Trang chủ nhân viên
Tiếp nhận trả xe

Tìm kiếm
Tìm kiếm

Mã hợp
đồng

Tên

Mơ tả

Trả xe
(click để chọn)

Trở lại

17


Hợp đồng trả xe
Tên xe

abc

Ngày thuê

x/y/z

Gía thuê

123

Ngày trả

a/b/c

Tính năng

nhanh

Địa điểm nhận
xe

qưe

Loại xe

xyz

Mô tả

abcxyz

Người thuê

nguyen van a

Tiền cọc

2000

Xác nhận CCCD

1234567

Tiền thuê tạm tính

2000

Xác nhận blx

1243445

Tổng tiền

4000

Các lỗi hỏng phạt

Select

Phí phạt

500

Tiền thuê thực tế

1500

Hồn trả

2000

Hình thức

Select

Trả xe

3. Biểu đồ lớp chi tiết:
a. Client: sử dụng ReactJS
- Tầng giao diện có các trang: HomeStaffView.js, SearchReturnCarView.js,
CarReturningView.js

- Tầng call api phía server: CarReturnService.js
- Tầng thực thể: CarReturning, PenaltyError, Staff, CarBooking

18


b.
-

Server: sử dụng Express
Tầng định danh url api: Server.js
Tầng thao tác với cơ sở dữ liệu: CarReturnController.js
Tầng thực thể: CarReturning, PenaltyError, Staff, CarBooking

19


4. Biểu đồ tuần tự:
a. Client:

20


1. Khách hàng yêu cầu trả xe với nhân viên
2. Tại giao diện HomeStaffView.js, nhân viên chọn nút Trả xe
3. Lớp HomeStaffView.js gọi lớp SearchReturnCarView.js
4. Lớp SearchReturnCarView.js hiển thị cho nhân viên
5. Nhân viên nhập từ khóa vào ơ input và nhấn nút tìm kiếm
6. Lớp SearchReturnCarView.js gọi hàm searchCarReturn() yêu cầu tìm kiếm
7. Lớp SearchReturnCarView.js gọi lớp CarReturnService.js

8. Lớp CarReturnService.js gọi hàm fetchSearchCarReturn() call api tìm kiếm
9. Lớp CarReturnService.js trả kết quả cho lớp SearchReturnCarView.js
10.Lớp SearchReturnCarView.js hiển thị cho nhân viên
11.Nhân viên click chọn CarReturning
12.Lớp SearchReturnCarView.js gọi lớp CarReturningView.js
13.Lớp CarReturningView.js gọi hàm caculateFee() để tính tốn chi phí hợp
đồng
14.Lớp CarReturningView.js hiển thị kết quả cho nhân viên
15.Nhân viên xác nhận thông tin với khách hàng
16.Khách hàng xác nhận là đúng thông tin
17.Nhân viên kiểm tra xe và thêm các lỗi hỏng phạt
18.Lớp CarReturningView.js gọi hàm caculateFee() để tính tốn lỗi hỏng phạt
và số tiền hoàn trả
19.Lớp CarReturningView.js hiển thị cho nhân viên
20.Nhân viên xác nhận lại với khách hàng
21.Khách hàng xác nhận là đúng
22.Nhân viên hỏi khách hàng hình thức thanh toán hợp đồng
23.Khách hàng chọn tiền mặt
24.Nhân viên nhấn nút Trả xe để trả xe trên giao diện CarReturningView.js
25.Lớp CarReturningView.js gọi hàm ReturnCar() yêu cầu trả xe
26.Lớp CarReturningView.js gọi lớp CarReturnService.js
27.Lớp CarReturnService.js gọi hàm fetchReturnCar() call api trả xe
28.Lớp CarReturnService.js trả kết quả về cho lớp CarReturningView.js
29.Lớp CarReturningView.js trả kết quả cho lớp SearchReturnCarView.js
30.Lớp SearchReturnCarView.js hiển thị trả xe thành cơng nhân viên
31.Nhân viên thanh tốn hợp đồng và gửi biên lai cho khách hàng
b. Server:

21

1. Client gửi yêu cầu tìm kiếm tới server
2. Lớp Server.js gọi lớp CarReturnController.js
3. Lớp CarReturnController.js gọi hàm SearchCarReturn() để tìm kiếm
4. Lớp CarReturnController.js gọi lớp CarRetuning để đóng gói
5. Lớp CarReturning đóng gói thực thể
6. Lớp CarReturning trả kết quả cho lớp CarReturnController.js
7. Lớp CarReturnController.js trả kết quả cho lớp Server.js
8. Lớp Server.js trả kết quả cho client
9. Client gửi yêu cầu trả xe tới server
10.Lớp Server.js gọi lớp CarReturnController.js
11.Lớp CarReturnController.js gọi hàm ReturnCar() để thực hiện trả xe
12.Lớp CarReturnController.js gọi lớp CarRetuning để đóng gói
13.Lớp CarReturning đóng gói thực thể
14.Lớp CarReturning trả kết quả cho lớp CarReturnController.js
15.Lớp CarReturnController.js trả kết quả cho lớp Server.js
16.Lớp Server.js trả kết quả cho client

22