Xây dựng website tour du lịch

TÍNH CẤP THIẾT CỦA ĐỀ TÀI

Trong thời đại Internet phổ biến, việc thiết kế website du lịch trở nên quan trọng đối với các doanh nghiệp trong ngành này Một công ty du lịch cần có website để quảng bá thương hiệu và thu hút khách hàng, không chỉ dựa vào chất lượng phục vụ Nhận thấy tiềm năng phát triển và khả năng áp dụng thực tế, nhóm quyết định chọn đề tài “Xây dựng website tour du lịch” làm khóa luận tốt nghiệp cho chuyên ngành “Công nghệ phần mềm”.

MỤC TIÊU CỦA ĐỀ TÀI

1 Xây dựng được website tour du lịch trong thời gian 3 tháng

2 Nâng cao khả năng làm việc nhóm và phân chia công việc giữa các thành viên

3 Xây dựng dựng web site Tour du lịch với những chức năng chính sau:

+ Đặt tour của khách hàng

+ Đăng ký của khách hàng

4 Ứng dụng công nghệ Jsp/servlet vào thực tiễn

5 Biết được công nghệ Hibernate cho phần xử lý database

6 Biết được cách phân tích, thiết kế, xử lý với các mục tiêu, tư duy logic về mặt chức năng đã đưa ra.

KHẢO SÁT HIỆN TRẠNG

KHẢO SÁT

2 Chương 2: Xác định yêu cầu

2.2 Mô tả công việc ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM

KHOA CÔNG NGHỆ THÔNG TIN

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự do – Hạnh phúc

3 Chương 3: Phân tích yêu cầu và thiết kế cơ sở dữ liệu

3.1 Mô hình hóa yêu cầu

3.2 Bảng mô tả cơ sở dữ liệu

4 Chương 4: Thiết kế giao diện và xử lý

5.2 Hệ quản trị cơ sở dữ liệu SQL Server

5.3 Sơ đồ package và lớp

(Công việc dự kiến) Sản phẩm Ghi chú

Tìm hiểu về Hibernate Framework

- Tìm hiểu về thư viện JQuery của Javascript

Xây dựng được giao diện cho trang web

21/04 Thiết kế cơ sở dữ liê ̣u

Load đươ ̣c cơ sở dữ liê ̣u lên trang web

Chỉnh sửa giao diê ̣n người dùng và giao diê ̣n admin hoàn chỉnh

Trang web chạy ổn đi ̣nh trên local

Hoàn thiê ̣n các chức năng cơ bản của trang web

Hoàn thành các chứ c năng cơ bản củ a trang web

Kiểm thử la ̣i trang web và sửa lỗi

Trang web đã qua chỉnh sửa

Bổ sung thêm các tính năng cho trang web: Lọc tour, tìm kiếm tour

Hoàn thành các chứ c năng

Trang web hoàn thành và cha ̣y ổn đi ̣nh

23/06 Hoàn thành báo cáo Báo cáo đã hoàn thành

Kiểm tra lại tổng thể trang web và báo cáo

Trang web chạy ổn đi ̣nh

Báo cáo đã chỉnh sử a

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 1

2 MỤC TIÊU CỦA ĐỀ TÀI 1

3.KẾT CẤU CỦA ĐỀ TÀI 2

CHƯƠNG 1: KHẢO SÁT HIỆN TRẠNG 3

1.2.1.Website https://travel.com.vn [1] 3

1.2.5.Website https://dulichviet.com.vn/[5] 7

CHƯƠNG 2: XÁC ĐỊNH YÊU CẦU 8

2.2.1.1 Bảng yêu cầu chức năng nghiệp vụ 9

2.2.1.2 Bảng quy định/công thức liên quan 9

CHƯƠNG 3: PHÂN TÍCH YÊU CẦU VÀ THIẾT KẾ CƠ SỞ DỮ LIỆU 24

3.1.MÔ HÌNH HÓA YÊU CẦU 24

3.1.1.Xét nghiệp vụ Đăng Ký 24

3.1.2.Xét nghiệp vụ Đăng Nhập 26

3.1.3.Xét nghiệp vụ Đăng Xuất 28

3.1.4.Xét nghiệp vụ xem danh sách Tour 30

3.1.5.Xét nghiệp vụ xem chi tiết Tour 33

3.1.6.Xét nghiệp vụ Đặt Tour 35

3.1.7.Xét nghiệp vụ Quản lý đặt Tour 39

3.1.8.Xét nghiệp vụ Quản lý Tour 43

3.1.9.Xét nghiệp vụ Quản lý Xe 47

3.1.10.Xét nghiệp vụ Quản lý User 51

3.2.BẢNG MÔ TẢ CƠ SỞ DỮ LIỆU 57

CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 60

4.1 GIAO DIỆN TỔNG QUÁT CỦA TRANG CHỦ 60

4.1.1 Thiết kế màn hình với tính đúng đắn 60

4.2 GIAO DIỆN TỔNG QUÁT CỦA ĐĂNG KÝ KHÁCH HÀNG 61

4.3 GIAO DIỆN TỔNG QUÁT CỦA ĐĂNG NHẬP 62

4.4 GIAO DIỆN TỔNG QUÁT CỦA DANH SÁCH TOUR 63

4.5 GIAO DIỆN TỔNG QUÁT CỦA THÔNG TIN VỀ TOUR 64

4.6 GIAO DIỆN TỔNG QUÁT CỦA ĐẶT TOUR 65

4.7 GIAO DIỆN TỔNG QUÁT CỦA TRANG ADMIN 66

4.8 GIAO DIỆN TỔNG QUÁT CỦA TRANG DUYỆT TOUR 68

4.9 GIAO DIỆN TỔNG QUÁT CỦA MODAL DUYỆT TOUR 69

4.10 GIAO DIỆN TỔNG QUÁT CỦA TRANG QUẢN LÝ ĐẶT TOUR 70

4.11 GIAO DIỆN TỔNG QUÁT CỦA QUẢN LÝ TOUR 73

4.12 GIAO DIỆN TỔNG QUÁT CỦA TRANG QUẢN LÝ XE 76

4.13 GIAO DIỆN TỔNG QUÁT CỦA TRANG QUẢN LÝ USER 79

5.1.1 Các ngôn ngữ được sử dụng 84

5.1.1.1 Giới thiệu về ngôn ngữ Java[6] 84

5.1.1.4 Giới thiệu về ngôn ngữ Javascript[9] 85

5.2 HỆ QUẢN TRỊ CƠ SỞ DỮ LIỆU SQL SERVER 86

5.3 SƠ ĐỒ PACKAGE VÀ LỚP 87

5.3.1 Sơ đồ lớp của package của website 87

5.3.2.2 vn.hcmute.core.persistence.entity 92

6.1 KIỂM THỬ CHỨC NĂNG ĐĂNG NHẬP 98

6.2 KIỂM THỬ CHỨC NĂNG ĐĂNG KÝ 98

6.3 KIỂM THỬ CHỨC NĂNG XEM TRANG CHỦ 99

6.4 KIỂM THỬ CHỨC NĂNG XEM DANH SÁCH TOUR 100

6.5 KIỂM THỬ CHỨC NĂNG QUẢN LÝ TOUR 101

Hình 1.1 Màn hình chính của website công ty du lịch Vietravel 3

Hình 1.2 Màn hình chính của website saigontourist.net 4

Hình 1.3 Màn hình chính của website mytour.vn 5

Hình 1.4 Màn hình chính của website yesgo.vn 6

Hình 1.5 Màn hình chính của website dulichviet.com.vn 7

Hình 2.1 Sơ đồ use case diagram 8

Hình 2.2 Biểu mẫu đăng ký của khách hàng 11

Hình 2.3 Biểu mẫu đăng nhập của khách hàng 12

Hình 2.4 Biểu mẫu xem danh sách tour 12

Hình 2.5 Biểu mẫu xem chi tiết tour 13

Hình 2.6 Biểu mẫu xem chi tiết tour phần nội dung tour 13

Hình 2.7 Biểu mẫu đặt tour 14

Hình 2.8 Biểu mẫu đăng nhập của admin 20

Hình 2.9 Biểu mẫu quản lý đặt tour 20

Hình 2.10 Biểu mẫu quản lý tour 21

Hình 2.11 Biểu mẫu quản lý user 21

Hình 2.12 Biểu mẫu quản lý duyệt tour 22

Hình 2.13 Biểu mẫu modal của quản lý duyệt tour 22

Hình 2.14 Biểu mẫu quản lý xe 23

Hình 3.1 Sơ đồ luồng dữ liệu chức năng đăng ký 24

Hình 3.2 Lược đồ tuần tự chức năng đăng ký 25

Hình 3.3 Cơ sở dữ liệu chức năng đăng ký với tính đúng đắn 25

Hình 3.4 Cơ sở dữ liệu chức năng đăng ký với tính tiến hóa 26

Hình 3.5 Sơ đồ luồng dữ liệu chức năng đăng nhập 26

Hình 3.6 Lược đồ tuần tự chức năng đăng nhập 27

Hình 3.7 Cơ sở dữ liệu chức năng đăng nhập với tính đúng đắn 28

Hình 3.8 Cơ sở dữ liệu chức năng đăng nhập với tính tiến hóa 28

Hình 3.9 Sơ đồ luồng dữ liệu chức năng đăng xuất 28

Hình 3.10 Lược đồ tuần tự chức năng đăng xuất 29

Hình 3.11 Cơ sở dữ liệu chức năng đăng xuất với tính đúng đắn 30

Hình 3.12 Cơ sở dữ liệu chức năng đăng xuất với tính tiến hóa 30

Hình 3.13 Sơ đồ luồng dữ liệu chức năng xem danh sách tour 31

Hình 3.14 Lược đồ tuần tự chức năng xem danh sách tour 31

Hình 3.15 Cơ sở dữ liệu chức năng xem danh sách tour với tính đúng đắn 32

Hình 3.16 Cơ sở dữ liệu chức năng xem danh sách tour với tính tiến hóa 33

Hình 3.17 Sơ đồ luồng dữ liệu chức năng xem chi tiết tour 33

Hình 3.18 Lược đồ tuần tự chức năng xem chi tiết tour 34

Hình 3.19 Cơ sở dữ liệu chức năng xem chi tiết tour với tính đúng đắn 35

Hình 3.20 Cơ sở dữ liệu chức năng xem chi tiết tour với tính tiến hóa 35

Hình 3.21 Sơ đồ luồng dữ liệu chức năng đặt tour 36

Hình 3.22 Lược đồ tuần tự chức năng đặt tour 37

Hình 3.23 Cơ sở dữ liệu chức năng đặt tour với tính đúng đắn 38

Hình 3.24 Cơ sở dữ liệu chức năng đặt tour với tính tiến hóa 39

Hình 3.25 Sơ đồ luồng dữ liệu chức năng quản lý đặt tour 39

Hình 3.26 Lược đồ tuần tự chức năng quản lý đặt tour 41

Hình 3.27 Cơ sở dữ liệu chức năng quản lý đặt tour với tính đúng đắn 42

Hình 3.28 Cơ sở dữ liệu chức năng quản lý đặt tour với tính tiến hóa 43

Hình 3.29 Sơ đồ luồng dữ liệu chức năng quản lý tour 43

Hình 3.30 Lược đồ tuần tự chức năng quản lý tour 45

Hình 3.31 Cơ sở dữ liệu chức năng quản lý tour với tính đúng đắn 46

Hình 3.32 Cơ sở dữ liệu chức năng quản lý tour với tính tiến hóa 47

Hình 3.33 Sơ đồ luồng dữ liệu chức năng quản lý xe 48

Hình 3.34 Lược đồ tuần tự chức năng quản lý xe 49

Hình 3.35 Cơ sở dữ liệu chức năng quản lý xe với tính đúng đắn 50

Hình 3.36 Cơ sở dữ liệu chức năng quản lý xe với tính tiến hóa 51

Hình 3.37 Sơ đồ luồng dữ liệu chức năng quản lý user 52

Hình 3.38 Lược đồ tuần tự chức năng quản lý user 54

Hình 3.39 Cơ sở dữ liệu chức năng quản lý user với tính đúng đắn 55

Hình 3.40 Cơ sở dữ liệu chức năng quản lý user với tính tiến hóa 56

Hình 3.41 Diagram cơ sở dữ liệu 57

Hình 4.1 Giao diện tổng quát của trang chủ 60

Hình 4.2 Giao diện tổng quát của đăng ký khách hàng 61

Hình 4.3 Giao diện tổng quát của trang đăng nhập 62

Hình 4.4 Giao diện tổng quát của trang danh sách tour 63

Hình 4.5 Giao diện tổng quát của trang thông tin chi tiết tour 64

Hình 4.6 Giao diện tổng quát của đặt tour 65

Hình 4.7 Giao diện tổng quát của trang admin 66

Hình 4.8 Giao diện tổng quát của trang duyệt tour 68

Hình 4.9 Giao diện tổng quát của modal duyệt tour 69

Hình 4.10 Giao diện tổng quát của trang quản lý đặt tour 70

Hình 4.11 Giao diện tổng quát của modal cập nhật đặt tour 71

Hình 4.12 Giao diện tổng quát của trang quản lý tour 73

Hình 4.13 Giao diện tổng quát của thêm/cập nhật tour 74

Hình 4.14 Giao diện tổng quát của trang quản lý xe 77

Hình 4.16 Giao diện tổng quát của dialog xóa xe 78

Hình 4.17 Giao diện tổng quát của trang quản lý user 80

Hình 4.19 Giao diện tổng quát của dialog xóa user 81

Hình 5.1 Kiến trúc Hibernate Framework 86

Hình 5.2 Sơ đồ package của website 87

Hình 5.3 Các lớp trong package vn.hcmute.core.common 91

Hình 5.4 Các lớp trong package vn.hcmute.core.persistence.entity 92

Hình 5.5 Các lớp trong package vn.hcmute.core.dto 93

Hình 5.6 Các lớp trong package vn.hcmute.core.data 93

Hình 5.7 Các lớp trong package vn.hcmute.core.dao 94

Hình 5.8 Các lớp trong package vn.hcmute.core.daoimpl 95

Hình 5.9 Các lớp trong package vn.hcmute.core.service 95

Hình 5.10 Các lớp trong package vn.hcmute.core.serviceimpl 96 Hình 5.11 Các lớp trong package vn.hcmute.core.utils 96 Hình 5.12 Các lớp trong package vn.hcmute.controller 97

Bảng 2.1 Bảng yêu cầu chức năng nghiệp vụ của User 9

Bảng 2.2 Bảng quy định/công thức liên quan của User 9

Bảng 2.3 Bảng yêu cầu chức năng nghiệp vụ của Admin 14

Bảng 2.4 Bảng quy định/công thức liên quan của Admin 15

Bảng 3.1 Mô tả dữ liệu Tour 57

Bảng 3.2 Mô tả dữ liệu User 58

Bảng 3.3 Mô tả dữ liệu Role 58

Bảng 3.4 Mô tả dữ liệu Xe 59

Bảng 3.5 Mô tả dữ liệu Đặt Tour 59

Bảng 4.1 Giao diện tổng quát của trang chủ với tính đúng đắn 60

Bảng 4.2 Danh sách xử lý giao diện tổng quát của trang chủ 60

Bảng 4.3 Giao diện tổng quát của trang đăng ký khách hàng với tính đúng đắn 62

Bảng 4.4 Danh sách xử lý giao diện của trang đăng ký khách hàng 62

Bảng 4.5 Giao diện tổng quát của trang đăng nhập với tính đúng đắn 63

Bảng 4.6 Danh sách xử lý giao diện tổng quát của trang đăng nhập 63

Bảng 4.7 Giao diện tổng quát của trang danh sách tour với tính đúng đắn 63

Bảng 4.8 Danh sách xử lý giao diện tổng quát trang danh sách tour 64

Bảng 4.9: Giao diện tổng quát của thông tin chi tiết tour với tính đúng đắn 65

Bảng 4.10: Danh sách xử lý giao diện tổng quát của trang thông tin chi tiết tour 65

Bảng 4.11 Giao diện tổng quát của đặt tour với tính đúng đắn 65

Bảng 4.12 Danh sách xử lý giao diện tổng quát của đặt tour 66

Bảng 4.13 Giao diện tổng quát của trang admin với tính đúng đắn 66

Bảng 4.14 Danh sách xử lý giao diện tổng quát của trang admin 67

Bảng 4.15 Giao diện tổng quát của trang duyệt tour với tính đúng đắn 68

Bảng 4.16 Danh sách xử lý giao diện tổng quát của trang duyệt tour 69

Bảng 4.17 Giao diện tổng quát của modal duyệt tour với tính đúng đắn 69

Bảng 4.18 Danh sách xử lý giao diện tổng quát của modal duyệt tour 70

Bảng 4.19 Giao diện tổng quát của trang quản lý đặt tour với tính đúng đắn 71

Bảng 4.20 Danh sách xử lý giao diện tổng quát của trang quản lý đặt tour 72

Bảng 4.21 Giao diện tổng quát của trang quản lý tour với tính đúng đắn 75

Bảng 4.22 Danh sách xử lý giao diện tổng quát của trang quản lý tour 76

Bảng 4.23 Giao diện tổng quát của trang quản lý xe với tính đúng đắn 78

Bảng 4.24 Danh sách xử lý giao diện tổng quát của trang quản lý xe 79

Bảng 4.25 Giao diện tổng quát của trang quản lý user với tính đúng đắn 81

Bảng 5.1 Bảng chức năng của các package 87

Bảng 5.2 Bảng chức năng của các lớp trong package 88

Bảng 5.3 Bảng mô tả thuộc tính và hàm của các lớp trong package core common 91

Bảng 5.4 Bảng mô tả thuộc tính và hàm của các lớp trong package core data 94

Bảng 6.1 Danh sách kiểm thử chức năng đăng nhập 98

Bảng 6.2 Danh sách kiểm thử chức năng đăng ký 98

Bảng 6.3 Danh sách kiểm thử chức năng xem trang chủ 100

Bảng 6.4 Danh sách kiểm thử chức năng xem danh sách tour 100 Bảng 6.5 Danh sách kiểm thử chức năng quản lý tour 101

1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI

Trong bối cảnh Internet ngày càng phổ biến trong các lĩnh vực kinh tế, chính trị và xã hội, việc thiết kế website du lịch trở nên cực kỳ quan trọng đối với các doanh nghiệp trong ngành này, đặc biệt là những công ty chưa có trang web Để thu hút khách hàng, các công ty du lịch không chỉ cần cung cấp dịch vụ chất lượng mà còn phải xây dựng thương hiệu trực tuyến qua website Nhận thấy tiềm năng phát triển và khả năng ứng dụng cao, nhóm đã quyết định chọn đề tài “Xây dựng website tour du lịch” làm khóa luận tốt nghiệp cho chuyên ngành “Công nghệ phần mềm”.

2 MỤC TIÊU CỦA ĐỀ TÀI

6 Biết được cách phân tích, thiết kế, xử lý với các mục tiêu, tư duy logic về mặt chức năng đã đưa ra

3 KẾT CẤU CỦA ĐỀ TÀI

Chương 1: Khảo sát hiện trạng.

XÁC ĐỊNH YÊU CẦU

MÔ TẢ CÔNG VIỆC

ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM

KHOA CÔNG NGHỆ THÔNG TIN

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự do – Hạnh phúc

3 Chương 3: Phân tích yêu cầu và thiết kế cơ sở dữ liệu

3.1 Mô hình hóa yêu cầu

3.2 Bảng mô tả cơ sở dữ liệu

Trong bối cảnh Internet ngày càng phổ biến trong mọi lĩnh vực, việc thiết kế website du lịch trở nên vô cùng quan trọng đối với các doanh nghiệp chưa có trang web Một công ty du lịch cần không chỉ cung cấp dịch vụ chất lượng mà còn phải có website để quảng bá thương hiệu và thu hút khách hàng Nhận thấy tiềm năng phát triển và khả năng ứng dụng thực tế cao, nhóm đã quyết định chọn đề tài “Xây dựng website tour du lịch” làm khóa luận tốt nghiệp cho chuyên ngành “Công nghệ phần mềm”.

Chương 1: Khảo sát hiện trạng

Chương 2: Xác định yêu cầu.

PHÂN TÍCH YÊU CẦU VÀ THIẾT KẾ CƠ SỞ DỮ LIỆU

BẢNG MÔ TẢ CƠ SỞ DỮ LIỆU

Trong thời đại Internet phát triển mạnh mẽ, việc thiết kế website du lịch trở nên thiết yếu cho các doanh nghiệp trong ngành Một công ty du lịch không chỉ cần cung cấp dịch vụ chất lượng mà còn phải có website để quảng bá thương hiệu và thu hút khách hàng Nhận thấy tiềm năng phát triển và khả năng ứng dụng thực tế cao, nhóm đã quyết định chọn đề tài “Xây dựng website tour du lịch” làm khóa luận tốt nghiệp cho chuyên ngành “Công nghệ phần mềm”.

Chương 1: Khảo sát hiện trạng

Chương 2: Xác định yêu cầu

Chương 3: Phân tích yêu cầu và thiết kế cơ sở dữ liệu.

THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ

GIAO DIỆN TỔNG QUÁT CỦA TRANG CHỦ

4.1.1 Thiết kế màn hình với tính đúng đắn

Hình 4.1 Giao diện tổng quát của trang chủ Bảng 4.1 Giao diện tổng quát của trang chủ với tính đúng đắn

Số ký hiệu Loại HTML Chức năng

1 Thẻ a Liên kết đến trang Đăng nhập

2 Thẻ a Liên kết đến trang Đăng ký

3 Thẻ a Liên kết đến Trang chủ

4 Thẻ a Liên kết đến trang Bài viết

5 Thẻ a Liên kết đến trang Liên hệ

6 Thẻ div Các input đầu vào để tìm kiếm

7 Thẻ button Thực hiện tìm kiếm

8 Thẻ button Liên kết đến trang Tour giá rẻ

9 Thẻ button Liên kết đến trang Giảm giá

Bảng 4.2 Danh sách xử lý giao diện tổng quát của trang chủ

STT Tên xử lý Điều kiện gọi Ghi chú

1 Đăng nhập Nhất vào nút “Đăng nhập”

2 Đăng ký Nhất nút “Đăng ký”

3 Trở về Trang chủ Nhất vào “Trang chủ”

4 Bài Viết Nhất vào “Bài viết”

5 Liên Hệ Nhất vào “Liên hệ”

6 Tìm Kiếm Nhấn nút “Tìm Kiếm”

7 Tour giá rẻ Nhấn nút “Tour giá rẻ”

8 Tour đang giảm giá Nhất nút “Tour đang giảm giá”

GIAO DIỆN TỔNG QUÁT CỦA ĐĂNG KÝ KHÁCH HÀNG

Hình 4.2 Giao diện tổng quát của đăng ký khách hàng

Bảng 4.3 Giao diện tổng quát của trang đăng ký khách hàng với tính đúng đắn

1 Thẻ input Nhập tên tài khoản

2 Thẻ input Nhập mật khẩu

3 Thẻ input Xác nhận mật khẩu

4 Thẻ input Nhập họ và tên

5 Thẻ input Nhập số điện thoại

6 Thẻ input Nhập số chứng minh nhân

9 Thẻ a Liên kết với đăng nhập

Bảng 4.4 Danh sách xử lý giao diện của trang đăng ký khách hàng

1 Đăng ký Nhấn vào nút “Đăng ký”

2 Chuyển qua Đăng nhập Nhấn vào “Đăng nhập”

GIAO DIỆN TỔNG QUÁT CỦA ĐĂNG NHẬP

Hình 4.3 Giao diện tổng quát của trang đăng nhập

Bảng 4.5 Giao diện tổng quát của trang đăng nhập với tính đúng đắn

1 Thẻ input Nhập tên tài khoản

2 Thẻ input Nhập mật khẩu

3 Thẻ button Thực hiện Đăng Nhập

Bảng 4.6 Danh sách xử lý giao diện tổng quát của trang đăng nhập

1 Đăng Nhập Nhấn vào nút “Login”

GIAO DIỆN TỔNG QUÁT CỦA DANH SÁCH TOUR

Hình 4.4 Giao diện tổng quát của trang danh sách tour Bảng 4.7 Giao diện tổng quát của trang danh sách tour với tính đúng đắn

1 Thẻ div Phân chia các Tour với nhau

2 Thẻ span Hiển thị tên Tour

3 Thẻ span Hiển thị giá Tour

4 Thẻ image Hiển thị hình ảnh Tour

5 Thẻ button Liên kết với trang Xem chi tiết Tour

Bảng 4.8 Danh sách xử lý giao diện tổng quát trang danh sách tour

1 Xem chi tiết tour Nhất vào nút “Xem chi tiết Tour”

GIAO DIỆN TỔNG QUÁT CỦA THÔNG TIN VỀ TOUR

Hình 4.5 Giao diện tổng quát của trang thông tin chi tiết tour

Bảng 4.9: Giao diện tổng quát của thông tin chi tiết tour với tính đúng đắn

1 Thẻ span Hiển thị tên Tour

2 Thẻ span Hiển thị giá Tour

3 Thẻ span Hiển thị ngày Khởi hành

4 Thẻ button Liên kết với trang Đặt Tour

5 Thẻ div Hiển thị thông tin chi tiết của tour

Bảng 4.10: Danh sách xử lý giao diện tổng quát của trang thông tin chi tiết tour

1 Đặt Tour Nhất vào nút “Đặt Tour”

GIAO DIỆN TỔNG QUÁT CỦA ĐẶT TOUR

Hình 4.6 Giao diện tổng quát của đặt tour Bảng 4.31 Giao diện tổng quát của đặt tour với tính đúng đắn

1 Thẻ input Nhập họ và tên

2 Thẻ input Nhập số điện thoại

3 Thẻ input Nhập số chứng minh nhân dân

4 Thẻ input Nhập địa chỉ

5 Thẻ input Nhập số ghế đặt

6 Thẻ input Nhập ghi chú

7 div Hiển thị thông tin Tour

Bảng 4.14 Danh sách xử lý giao diện tổng quát của đặt tour

1 Đặt Tour Nhất vào nút “Xác nhận Đặt Tour”

GIAO DIỆN TỔNG QUÁT CỦA TRANG ADMIN

Hình 4.7 Giao diện tổng quát của trang admin Bảng 4.53 Giao diện tổng quát của trang admin với tính đúng đắn

1 Thẻ header Tạo phần header cho trang

2 Thẻ div Tạo phần menu cho trang

3 Thẻ div Tạo phần footer cho trang

4 Thẻ div Tạo phần nội dung cho trang

5 Thẻ span Hiển thị thông tin username người dùng sau khi đăng nhập

6 Thẻ a Liên kết thoát ra trang chủ

7 Thẻ a Liên kết đến phần nội dung của duyệt tour

8 Thẻ a Liên kết đến phần nội dung của quản lý đặt

9 Thẻ a Liên kết đến phần nội dung của quản lý Tour

10 Thẻ a Liên kết đến phần nội dung của quản lý Xe

11 Thẻ a Liên kết đến phần nội dung của quản lý User

12 Thẻ a Liên kết đến phần nội dung của Thống kê

13 Thẻ button Thu nhỏ phần menu

Bảng 4.14 Danh sách xử lý giao diện tổng quát của trang admin

1 Thoát khỏi Admin Nhất vào “Thoát”

2 Duyệt Tour Nhấp vào “Duyệt Tour”

3 Quản lý Đặt Tour Nhấp vào “Quản lý Đặt Tour”

4 Quản lý Tour Nhấp vào “Quản lý Tour”

5 Quản lý Xe Nhấp vào “Quản lý Xe”

6 Quản lý User Nhấp vào “Quản lý User”

7 Thu nhỏ menu Nhấn vào button đóng Ký hiệu số 13

GIAO DIỆN TỔNG QUÁT CỦA TRANG DUYỆT TOUR

Hình 4.8 Giao diện tổng quát của trang duyệt tour

Bảng 4.65 Giao diện tổng quát của trang duyệt tour với tính đúng đắn

1 Thẻ ul, li Điều hướng nội dung trang

2 Thẻ i Thu nhỏ phần tìm kiếm

3 Thẻ input Nhập nội dung để tìm kiếm

4 Thẻ button Tìm kiếm với nội dung nhập vào ở số 3

5 Thẻ table Tạo danh sách khách hàng đã đặt tour chưa được duyệt

6 Thẻ th Phân chia nội dung cột trong table

7 Thẻ a Sắp xếp nội dung theo cột tăng hoặc giảm

8 Thẻ td Tạo nội dung các dòng của table

9 Thẻ a Liên kết đến Modal duyệt Tour

10 Thẻ span Hiển thị số dòng trong table và đang ở phân trang nào

11 Thẻ li Phân trang nội dung trong table

Bảng 4.16 Danh sách xử lý giao diện tổng quát của trang duyệt tour

1 Trở về trang chủ Admin Nhất vào “Trang chủ” Kí hiệu 1

2 Thu nhỏ tìm kiếm Nhấp vào icon thu nhỏ Kí hiệu 2

3 Tìm kiếm Khi thực hiện nhập nội dung tìm kiếm và nhấn vào button “Tìm kiếm”

4 Sắp xếp nội dung trong bảng Nhấp vào icon của cột muốn sắp xếp Kí hiệu 7

5 Mở modal duyệt Tour Nhấp vào icon của dòng thông tin khách hàng muốn duyệt ở cột action Kí hiệu 9

6 Xem nội dung danh sách tiếp theo Nhấp vào số ở phần phân trang muốn xem Kí hiệu 11

GIAO DIỆN TỔNG QUÁT CỦA MODAL DUYỆT TOUR

Hình 4.9 Giao diện tổng quát của modal duyệt tour Bảng 4.77 Giao diện tổng quát của modal duyệt tour với tính đúng đắn

2 Thẻ input Hiển thị thông tin tên khách hàng

3 Thẻ input Hiển thị số điện thoại

4 Thẻ input Hiển thị Số ghế đặt

5 Thẻ textarea Hiển thị phần ghi chú của khách hàng

6 Thẻ input Hiển thị số chứng minh nhân dân

7 Thẻ input Hiển thị phần địa chỉ

9 Thẻ button Thực hiện duyệt tour

Bảng 4.18 Danh sách xử lý giao diện tổng quát của modal duyệt tour

1 Thoát modal Nhất vào nút “Thoát”

2 Duyệt Tour khách hàng Nhấp vào nút “Duyệt Tour”

GIAO DIỆN TỔNG QUÁT CỦA TRANG QUẢN LÝ ĐẶT TOUR

Hình 4.10 Giao diện tổng quát của trang quản lý đặt tour

Hình 4.11 Giao diện tổng quát của modal cập nhật đặt tour

Bảng 4.89 Giao diện tổng quát của trang quản lý đặt tour với tính đúng đắn

5 Thẻ table Tạo danh sách khách hàng đã đặt tour

9 Thẻ a Liên kết đến Modal cập nhật thông tin khách hàng đặt Tour

10 Thẻ spaan Hiển thị số dòng trong table và đang ở phân trang nào

13 Thẻ input Hiển thị thông tin tên khách hàng

14 Thẻ input Hiển thị số điện thoại

15 Thẻ input Hiển thị Số ghế đặt

16 Thẻ textarea Hiển thị phần ghi chú của khách hàng

17 Thẻ input Hiển thị số chứng minh nhân dân

18 Thẻ input Hiển thị phần địa chỉ

20 Thẻ button Thực hiện cập nhật thông tin đặt tour của khách hàng

Bảng 4.20 Danh sách xử lý giao diện tổng quát của trang quản lý đặt tour

4 Sắp xếp nội dung trong bảng

Nhấp vào icon của cột muốn sắp xếp Kí hiệu 7

5 Mở modal cập nhập thông tin khách hàng đặt Tour

Nhấp vào icon của dòng thông tin khách hàng muốn cập nhập ở cột action

6 Xem nội dung danh sách tiếp theo

Nhấp vào số ở phần phân trang muốn xem Kí hiệu 11

8 Cập nhật thông tin đặt tour của khách hàng

Nhấp vào nút “Cập Nhật”

GIAO DIỆN TỔNG QUÁT CỦA QUẢN LÝ TOUR

Hình 4.12 Giao diện tổng quát của trang quản lý tour

Hình 4.13 Giao diện tổng quát của thêm/cập nhật tour

Bảng 4.21 Giao diện tổng quát của trang quản lý tour với tính đúng đắn

5 Thẻ table Tạo danh sách tour

9 Thẻ a Liên kết đến modal cập nhật tour

10 Thẻ div Khung của phần tìm kiếm

11 Thẻ span Hiển thị số dòng trong table và đang ở phân trang nào

13 Thẻ input Nhập hoặc hiển thị tên tour

14 Thẻ button Chọn hình ảnh tour

15 Thẻ image Hiển thị hình ảnh tour

16 Thẻ input Nhập hoặc hiển thị nơi khởi hành

17 Thẻ input Nhập hoặc hiển thị ngày bắt đầu

18 Thẻ input Nhập hoặc hiển thị thời gian khởi hành

19 Thẻ select Chọn xe cho tour

20 Thẻ input Nhập hoặc hiển thị số ngày đi

21 Thẻ select Chọn tài xế cho tour

22 Thẻ input Nhập hoặc hiển giá tour

23 Thẻ select Chọn tiếp viên cho tour

24 Thẻ textarea kết hợp ckeditor Nhập phần giới thiệu tour

25 Thẻ textarea kết hợp ckeditor Nhập phần lịch trình tour

26 Thẻ textarea kết Nhập phần ghi chú tour hợp ckeditor

27 Thẻ button Cập nhật hoặc tạo mới tour

Bảng 4.22 Danh sách xử lý giao diện tổng quát của trang quản lý tour

5 Mở modal cập nhập thông tin tour

Nhấp vào icon của dòng thông tin tour muốn cập nhập ở cột action

Nhấp vào số ở phần phân trang muốn xem Kí hiệu 11

8 Cập nhật thông tin đặt tour của khách hàng

Nhấp vào nút “Cập nhật lại”

GIAO DIỆN TỔNG QUÁT CỦA TRANG QUẢN LÝ XE

Hình 4.14 Giao diện tổng quát của trang quản lý xe

Hình 4.15 Giao diện tổng quát của thêm/cập nhật xe

Hình 4.16 Giao diện tổng quát của dialog xóa xe

Bảng 4.23 Giao diện tổng quát của trang quản lý xe với tính đúng đắn

5 Thẻ a Liên kết đến modal thêm xe

6 Thẻ a Liên kết đến modal xóa xe

7 Thẻ table Tạo danh sách xe

8 Thẻ checkbox Chọn tất cả các xe

11 Thẻ checkbox Chọn một xe

12 Thẻ a Liên kết đến modal cập nhật xe

14 Thẻ input Hiển thị hoặc nhập số xe

15 Thẻ input Hiển thị hoặc nhập thông tin số ghế

17 Thẻ button Cập nhật hoặc lưu thông tin

18 Thẻ button Xác nhận xóa

Bảng 4.24 Danh sách xử lý giao diện tổng quát của trang quản lý xe

5 Mở modal cập nhập thông tin khách hàng đặt Tour

Nhấp vào icon của dòng thông tin khách hàng muốn cập nhập ở cột action

Nhấp vào số ở phần phân trang muốn xem

8 Cập nhật thông tin hoặc xe Nhấp vào nút “Cập Nhật” hoặc “Lưu”

9 Chọn tất cả các xe Click vào checkbox ở cột đầu tiên của bảng

10 Chọn một xe Click vào checkbox ở dòng của bảng Kí hiệu 11

11 Mở dialog xóa xe Check vào một hoặc nhiều checkbox và nhấn icon xóa (kí hiệu 6)

12 Xóa xe Mở dialog xóa và nhấn “Xác Nhận”

CÀI ĐẶT

KIỂM THỬ

Định dạng
Số trang	121
Dung lượng	5,37 MB