1. Trang chủ
  2. » Giáo Dục - Đào Tạo

(Đồ án tốt nghiệp) xây dựng website du lịch

184 9 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây Dựng Website Du Lịch
Tác giả Nguyễn Quang Huy, Lê Tấn Khang
Người hướng dẫn ThS. Mai Tuấn Khôi
Trường học Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh
Chuyên ngành Công Nghệ Thông Tin
Thể loại Đồ án tốt nghiệp
Năm xuất bản 2019
Thành phố Tp. Hồ Chí Minh
Định dạng
Số trang 184
Dung lượng 5,61 MB

Cấu trúc

  • 3.1.8 Nghiệp vụ View place visited (71)
  • 3.1.9 Nghiệp vụ Share Map (73)
  • 3.1.10 Nghiệp vụ Save Feeling (74)
  • 3.1.11 Nghiệp vụ Logout (79)
  • 3.1.12 Nghiệp vụ Save album (80)
  • 3.1.13 Nghiệp vụ Search tourist destination (84)
  • 3.1.14 Nghiệp vụ Search regional tourist destination (86)
  • 3.2 Mô tả cơ sở dữ liệu (6)
    • 3.2.1 Lược đồ ERD (88)
    • 3.2.2 Chi tiết các bảng dữ liệu (89)
  • CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ (6)
    • 4.1 Màn hình giao diện và xử lý bên client (6)
      • 4.1.1 Giao diện trang chủ/ trang Intro (giới thiệu) (96)
      • 4.1.2 Giao diện trang Login with facebook (101)
      • 4.1.3 Giao diện trang danh mục album của một địa điểm (102)
      • 4.1.4 Giao diện trang danh mục album của một tỉnh (106)
      • 4.1.5 Giao diện trang map đánh dấu những nơi bạn đi (110)
      • 4.1.6 Giao diện trang tìm kiếm (113)
      • 4.1.7 Giao diện trang rating một địa danh (115)
      • 4.1.8 Giao diện map – view a region (118)
      • 4.1.9 Giao diện trang thêm một bài post (121)
      • 4.1.10 Giao diện trang thêm album (122)
    • 4.2 Màn hình giao diện và xử lý bên Admin (6)
      • 4.2.1 Giao diện trang danh sách User (125)
      • 4.2.2 Giao diện trang chi tiết về User (129)
      • 4.2.3 Giao diện trang danh sách bài post của User (131)
      • 4.2.4 Giao diện trang danh sách Region (134)
      • 4.2.5 Giao diện trang chi tiết Region (0)
      • 4.2.6 Giao diện trang danh sách Place của Region (139)
      • 4.2.7 Giao diện trang chi tiết Place (142)
      • 4.2.8 Giao diện trang cập nhật Place (144)
      • 4.2.9 Giao diện trang thêm Place (147)
  • CHƯƠNG 5: CÀI ĐẶT (6)

Nội dung

Nghiệp vụ View place visited

3.1.8.1 Sơ đồ luồng dữ liệu

Hình 3 24: Sơ đồ luồng dữ liệu view place visited

D1: Nhận thông tin view từ User.

D3: Danh sách thông tin từ tbl_places gồm id, svgPath, name, title, latitude, longtitude, placeStatus và thông tin từ tbl_regions gồm id, name, title

D6: Thông tin về số nơi mà đã đi từ tbl_places gồm svgPath, name, title, latitude, longtitude, placeStatus và thông tin từ tbl_regions gồm name, title

B1: Mở kết nối cơ sở dữ liệu.

Để bắt đầu, bạn hãy truy cập trang chủ và chọn khu vực trên bản đồ Tại đây, thông tin về tên các địa danh sẽ được hiển thị, và những địa danh mà bạn đã từng ghé thăm sẽ được đánh dấu trên màn hình.

Hình 3 25: View place visited – Lược đồ tuần tự 3.1.8.5 Thiết kế cơ sở dữ liệu

Không có thuộc tính mới.

Nghiệp vụ Share Map

3.1.9.1 Sơ đồ luồng dữ liệu

Hình 3 26: Sơ đồ luồng dữ liệu Share Map

D1: Tín hiệu share map từ User.

D3: Thông tin về map và về user gồm: placeVisited, regionvisited, roleId, name(tên tỉnh), title, name(tên địa danh), latitude, longtitude

D6: Xuất hiện giao diện chia sẻ của Facebook về map.

B1: Chọn vào icon share map.

B2: Tiến hành ghi nội dung vào form đăng bài của Facebook.

• Trả về giao diện trang chủ sau khi đăng bài thành công.

• Trường hợp thất bại sẽ thông báo lỗi.

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

Không có thuộc tính mới

Nghiệp vụ Save Feeling

3.1.10.1 Sơ đồ luồng dữ liệu

Hình 3 27: Sơ đồ luồng dữ liệu Save Feelings

D1: Tín hiệu save Feeling từ User.

D3: Thông tin về tbl_fee;ings gồm topic,content.

D4: topic, content, id, userId, regionId, placeId

• Thông báo thêm thành công ➔

Dữ liệu được lưu trong cơ sở dữ liệu và trả về trang chủ.

• Thông báo thêm không thành công ➔

Vẫn ở lại trang đăng bài post.

B1: User nhập thông tin của địa post(topic, content) thông qua form.

B2: Thực hiện validate các field trong form gồm kiểm tra các trường bắt buộc phải nhập và kiểm tra tên địa danh đã tồn tại hay chưa.

- Trường hợp mà validate thành công ➔ chuyển đến B3

- Trường hợp mà validate không thành công ➔ quay lại B1

B3: Sau khi nhấn button “Submit”

- Lưu thành công và show thông báo ➔ chuyển đến B4

- Lưu thất bại thì sẽ show thông báo ➔ chuyển đến B1

B4: Trả trang về trang chủ.

Hình 3 28: Save post – lược đồ tuần tự 3.1.10.5 Thiết kế cơ sở dữ liệu

• Danh sách các thuộc tính mới: userRegionId, placeUserId

• Thiết kế cơ sở dữ liệu với tính đúng đắn:

Hình 3 29: Bản thông tin UserRegion và PlaceUser với tính đúng đắn

• Thuộc tính trừu tượng: userId, regionId, placeId

• Thiết kế dữ liệu với tính tiến hóa:

Hình 3 30: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa

Hình 3 31: Sơ đồ logic UserRegion và PlaceUser

Nghiệp vụ Logout

3.1.11.1 Sơ đồ luồng dữ liệu

Hình 3 32: Sơ đồ luồng dữ liệu Logout 3.1.11.2 Mô tả dữ liệu

D1: Tín hiệu đăng xuất từ User of Admin

D6: Trả về giao diện trang Guest

B2: Trả về giao diện trang Guest.

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

Không có thuộc tính mới

Nghiệp vụ Save album

3.1.12.1 Sơ đồ luồng dữ liệu

Hình 3 33: Sơ đồ luồng dữ liệu save albums

D1: Thông tin thêm albums gồm: name(tên album), image

D2: Chọn hình ảnh từ thiết bị.

D3: Danh sách thông tin từ tbl_Album(name, image, albumStatus) D4: name, image, albumStatus, userRegionId, placeUserId

Thông báo ➔ dữ liệu được cập nhật trong tbl_albums của cơ sở dữ liệu.

Thông báo ➔ vẫn ở lại trang ➔ cơ sở dữ liệu không thay đổi.

B1: Nhập nội dung chọn hình ảnh từ thiết bị

B2: Thực hiện validate các field trong form gồm kiểm tra các trường bắt buộc phải nhập và kiểm tra tên địa danh đã tồn tại hay chưa.

- Trường hợp mà validate thành công ➔ chuyển đến B3

- Trường hợp mà validate không thành công ➔ quay lại B1

B3: Sau khi nhấn button “Save”

- Lưu thành công và show thông báo ➔ chuyển đến B5

- Lưu thất bại thì sẽ show thông báo ➔ chuyển đến B1

B4: Trả trang về danh sách các place.

Hình 3 34: Save albums – Lược đồ tuần tự 3.1.12.5 Thiết kế cơ sở dữ liệu

• Danh sách các thuộc tính mới: userRegionId, placeUserId

• Thiết kế cơ sở dữ liệu với tính đúng đắn:

Hình 3 35: Bản thông tin UserRegion và PlaceUser với tính đúng đắn

• Thuộc tính trừu tượng: userId, regionId, placeId

• Thiết kế dữ liệu với tính tiến hóa:

Hình 3 36: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa

Hình 3 37: Sơ đồ logic UserRegion và PlaceUser

Nghiệp vụ Search tourist destination

3.1.13.1 Sơ đồ luồng dữ liệu

Hình 3 38: Sơ đồ luồng dữ liệu Search tourist destination

D1: Thông tin tìm kiếm là namePlace.

D3: Danh sách name từ tbl_Place.

D4: Thông tin tìm kiếm gồm name(tên của địa danh).

D6: Trả về địa danh theo thông tin mà Guest muốn tìm kiếm.

B1: Nhập name(tên của địa danh ).

B2: Lấy danh sách name của tbl_places

• Nếu name cần tìm phù hợp với danh sách name trong tbl_places

➔ hiển thị kết quả cho Guest.

• Nếu name cần tìm không có trong danh sách name trong tbl_places

➔ hiển thị kết quả “no result”.

Hình 3 39: Search – Lược đồ tuần tự

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

Không có thuộc tính mới.

Mô tả cơ sở dữ liệu

Lược đồ ERD

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

CÀI ĐẶT

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

Nguyễn Quang Huy Mai Tuấn Khôi

Chúng em xin chân thành cảm ơn những người đã hỗ trợ và đồng hành cùng nhóm trong quá trình hoàn thành khóa luận tốt nghiệp kỹ sư CNTT và xây dựng website du lịch Sự giúp đỡ và động viên của mọi người là nguồn động lực lớn lao giúp chúng em vượt qua những khó khăn.

Ban giám hiệu trường Đại Học Sư Phạm Kỹ Thuật TP.HCM đã đầu tư cơ sở vật chất hiện đại, bao gồm phòng học sạch đẹp, máy chiếu và wifi, nhằm đáp ứng nhu cầu học tập và giảng dạy của sinh viên và giảng viên.

Chúng em xin gửi lời cảm ơn chân thành đến Quý Thầy Cô Khoa Công Nghệ Thông Tin Trường Đại Học Sư Phạm Kỹ Thuật Tp.HCM đã hỗ trợ và tạo điều kiện thuận lợi cho chúng em trong quá trình thực hiện đề tài khóa luận tốt nghiệp.

Giảng viên Mai Tuấn Khôi đã tận tâm hướng dẫn và chỉ bảo chúng em trong suốt quá trình thực hiện khóa luận tốt nghiệp, giúp chúng em giải đáp thắc mắc một cách kịp thời để hoàn thành bài luận một cách xuất sắc.

Xin chân thành cảm ơn các anh, chị khóa trên và bạn bè đã hỗ trợ và giúp đỡ tôi rất nhiều trong quá trình học tập và nghiên cứu khóa luận tốt nghiệp Sự ủng hộ của mọi người là nguồn động lực lớn giúp tôi hoàn thành nhiệm vụ này.

Do còn thiếu kinh nghiệm, tôi không thể tránh khỏi một số thiếu sót và hạn chế trong đề tài này Rất mong nhận được ý kiến đóng góp từ thầy cô để giúp tôi hoàn thiện hơn nữa.

Tp Hồ Chí Minh, ngày 02 tháng 01 năm 2019

Nhóm sinh viên thực hiện

Lê Tấn KhangNguyễn Quang Huy

MỤC LỤC DANH MỤC CÁC HÌNH ẢNH

1.Tính cấp thiết của đề tài

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

1.2 Khảo sát những website khác

1.2.1Gody 1.2.2Mytour 1.2.3 Dulichviet 1.2.4Datviettour 1.2.5Fiditour 1.2.6Travel CHƯƠNG 2: LẬP DANH SÁCH YÊU CẦU

2.2 Danh sách yêu cầu chức năng của phần mềm

Chương 2.2.1 trình bày các yêu cầu chức năng của Admin, bao gồm quyền quản lý và giám sát hệ thống Tiếp theo, Chương 2.2.2 mô tả các chức năng nghiệp vụ của Guest, nhấn mạnh vào khả năng truy cập thông tin cơ bản và tham gia vào các hoạt động của nền tảng Cuối cùng, Chương 2.2.3 đề cập đến chức năng nghiệp vụ của User, cho phép người dùng tương tác và sử dụng các dịch vụ một cách hiệu quả Chương 3 sẽ tiến hành phân tích yêu cầu và thiết kế cơ sở dữ liệu nhằm đáp ứng các chức năng đã nêu.

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

This article covers essential operations related to managing places, including adding, editing, and deleting places It also discusses the process of deleting feelings and accounts, as well as viewing information such as images and videos related to a place Additionally, it outlines the procedure for logging in using Facebook, ensuring seamless access to these functionalities.

3.1.8 Nghiệp vụ View place visited 56

3.1.13 Nghiệp vụ Search tourist destination 69

3.1.14 Nghiệp vụ Search regional tourist destination 71

3.2 Mô tả cơ sở dữ liệu 73

3.2.2 Chi tiết các bảng dữ liệu 74

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

4.1 Màn hình giao diện và xử lý bên client 81

4.1.1 Giao diện trang chủ/ trang Intro (giới thiệu) 81

4.1.2 Giao diện trang Login with facebook 86

4.1.3 Giao diện trang danh mục album của một địa điểm 87

4.1.4 Giao diện trang danh mục album của một tỉnh 91

4.1.5 Giao diện trang map đánh dấu những nơi bạn đi 95

4.1.6 Giao diện trang tìm kiếm 98

4.1.7 Giao diện trang rating một địa danh 100

4.1.8 Giao diện map – view a region 103

4.1.9 Giao diện trang thêm một bài post 106

4.1.10 Giao diện trang thêm album 107

4.2 Màn hình giao diện và xử lý bên Admin 110

4.2.1 Giao diện trang danh sách User 110

4.2.2 Giao diện trang chi tiết về User 114

4.2.3 Giao diện trang danh sách bài post của User 116

4.2.4 Giao diện trang danh sách Region 119

4.2.5 Giao diện trang chi tiết Region 122

4.2.6 Giao diện trang danh sách Place của Region 124

4.2.7 Giao diện trang chi tiết Place 127

4.2.8 Giao diện trang cập nhật Place 129

4.2.9 Giao diện trang thêm Place 132

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

5.1.2 Các công nghệ được sử dụng

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

1.3.2 Mô tả sơ đồ lớp

6.1.2 Màn hình danh sách Place

6.1.4 Màn hình danh sách bài Post

6.1.5 Màn hình danh sách User

KẾT LUẬN 1.Kết quả đạt được

DANH MỤC CÁC HÌNH ẢNH

Hình 1 1: Giao diện chức năng Travel Map của website gody.vn 13

Hình 1 2: Giao diện trang của của website gody.vn 14

Hình 1 3: Hình ảnh về Blog thành viên của website gody.vn 14

Hình 1 4: Website du lịch mytour.vn 15

Hình 1 5: Địa điểm phổ biến trong website du lịch mytour.vn 16

Hình 1 6: Trang chủ website du lịch dulichviet.com.vn 17

Hình 1 7: Danh sách các tour du lịch của website dulichviet.com.vn 17

Hình 1 8: Trang chủ của website datviettour.com.vn 18

Hình 1 9: Danh sách các tour du lịch trong website datviettour.com.vn 18

Hình 1 10: Trang chủ website fiditour.com 19

Hình 1 11: Danh sách các tour du lịch của website fiditour.com 19

Hình 1 12: Trang chủ website travel.com.vn 20

Hình 2 1: Sơ đồ Use case 21

Hình 2 2: Biểu mẫu thêm địa danh mới 26

Hình 2 3: Biểu mẫu chỉnh sửa thông tin địa danh 27

Hình 2 4: Biểu mẫu xóa user 27

Hình 2 5: Biểu mẫu xóa địa danh 28

Hình 2 6: Biểu mẫu xóa bài post 28

Hình 2 7: Biểu mẫu search và xem thông tin 30

Hình 2 8: Biểu mẫu xem thông tin 32

Hình 2 9: Biểu mẫu search và xem thông tin 35

Hình 2 10: Hình biểu mẫu đánh dấu nơi đã đi 36

Hình 2 11: Biểu mẫu thêm bài post 37

Hình 2 12: Biểu mẩu view info 37

Hình 2 13: Biểu mẫu thêm album 38

Hình 2 14: Biểu mẫu đăng xuất 38

Hình 3 1: Sơ đồ luồng dữ liệu Add Place 39

Hình 3 2: Add Place – Lược đồ tuần tự 41

Hình 3 3: Bản thông tin Place với tính đúng đắn 42

Hình 3 4: Bảng thông tin Place với tính tiến hóa 42

Hình 3 5: Sơ đồ logic với bảng Place 42

Hình 3 6: Sơ đồ luồng dữ liệu 43

Hình 3 7: Update Place – Lược đồ tuần tự 44

Hình 3 8: Sơ đồ luồng dữ liệu Delete Place 45

Hình 3 9: Delete Place – Lược đồ tuần tự 46

Hình 3 10: Sơ đồ luồng dữ liệu Delete Feeling 47

Hình 3 11: Delete Feeling – Lược đồ tuần tự 48

Hình 3 12: Bảng thông tin Feeling với tính đúng đắn 49

Hình 3 13: Bảng thông tin Feeling với tính tiến hóa 49

Hình 3 14: Sơ đồ logic với bảng Feeling 50

Hình 3 15: Sơ đồ luồng dữ liệu Delete Account 50

Hình 3 16: Delete Account – Lược đồ tuần tự 51

Hình 3 17: Bảng thông tin Role với tính đúng đắn 52

Hình 3 18: Bảng thông tin Role với tính tiến hóa 52

Hình 3 19: Sơ đồ logic với bảng Role 53

Hình 3 20: Sơ đồ luồng dữ liệu View Info 53

Hình 3 21: View Info – Lược đồ tuần tự 54

Hình 3 22: Sơ đồ luồng dữ liệu Login with Facebook 55

Hình 3 23: Login – Lược đồ tuần tự 56

Hình 3 24: Sơ đồ luồng dữ liệu view place visited 57

Hình 3 25: View place visited – Lược đồ tuần tự 58

Hình 3 26: Sơ đồ luồng dữ liệu Share Map 58

Hình 3 27: Sơ đồ luồng dữ liệu Save Feelings 60

Hình 3 28: Save post – lược đồ tuần tự 61

Hình 3 29: Bản thông tin UserRegion và PlaceUser với tính đúng đắn 62

Hình 3 30: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa 63

Hình 3 31: Sơ đồ logic UserRegion và PlaceUser 64

Hình 3 32: Sơ đồ luồng dữ liệu Logout 64

Hình 3 33: Sơ đồ luồng dữ liệu save albums 65

Hình 3 34: Save albums – Lược đồ tuần tự 67

Hình 3 35: Bản thông tin UserRegion và PlaceUser với tính đúng đắn 68

Hình 3 36: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa 69

Hình 3 37: Sơ đồ logic UserRegion và PlaceUser 69

Hình 3 38: Sơ đồ luồng dữ liệu Search tourist destination 70

Hình 3 39: Search – Lược đồ tuần tự 71

Hình 3 40: Sơ đồ luồng dữ liệu Search region tourist destination 72

Hình 3 41: Search – Lược đồ tuần tự 73

Hình 4 1: Màn hình đối tượng trang chủ/ trang Intro 82

Hình 4 2: Màn hình xử lý trang chủ/ trang Intro 85

Hình 4 3: Màn hình đối tượng trang Login with facebook 86

Hình 4 4: Màn hình xử lý trang Login with facebook 87

Hình 4 5: Màn hình đối tượng trang danh mục album của một địa điểm 89

Hình 4 6: Màn hình xử lý trang danh mục album của một địa điểm 91

Hình 4 7: Màn hình đối tượng trang danh mục album của một tỉnh 92

Hình 4 8: Màn hình xử lý trang danh mục album của một tỉnh 94

Hình 4 9: Màn hình đối tượng trang map đánh dấu những nơi bạn đi 96

Hình 4 10: Màn hình xử lý trang đánh dấu những nơi bạn đi 97

Hình 4 11: Màn hình đối tượng trang khám phá 99

Hình 4 12: Màn hình xử lý trang khám phá 100

Hình 4 13: Màn hình đối tượng trang rating một địa danh 101

Hình 4 14: Màn hình xử lý trang rating một địa danh 102

Hình 4 15: Màn hình đối tượng trang map – view a region 103

Hình 4 16: Màn hình xử lý trang map – view a region 104

Hình 4 17: Màn hình đối tượng trang thêm một bài post 106

Hình 4 18: Màn hình xử lý trang thêm một bài post 107

Hình 4 19: Màn hình đối tượng trang thêm album 108

Hình 4 20: Màn hình xử lý trang thêm album 109

Hình 5 1: Bảy modules của Spring 137

Hình 5 3: Hình mô tả Hibernate Framework 139

Hình 5 4: Hình về Virtual DOM 141

Hình 5 5: Hình biểu đồ sử dụng thư viện amcharts

Hình 5 6: Sơ đồ RESTful API Hình 5 7: Sơ đồ lớp tầng Model Hình 5 8: Sơ đồ lớp tầng Repository Hình 5 9: Sơ đồ lớp tầng Controller

Bảng 2 1: Bảng về chức năng nghiệp vụ của Admin 22

Bảng 2 2: Bảng Chi tiết quy định/ công thức liên quan của Admin 26

Bảng 2 3: Bảng về chức năng nghiệp vụ của Guest 29

Bảng 2 4: Bảng Chi tiết quy định/ công thức liên quan của Guest 30

Bảng 2 5: Bảng về chức năng nghiệp vụ của User 32

Bảng 2 6: Bảng Chi tiết quy định/ công thức liên quan của User 35

Bảng 4 1: Bảng chi tiết đối tượng trang chủ/ trang Intro 83

Bảng 4 2: Bảng chi tiết xử lý trang chủ/ trang Intro 86

Bảng 4 3: Bảng chi tiết đối tượng trang Login with facebook 86

Bảng 4 4: Bảng chi tiết xử lý trang Login with facebook 87

Bảng 4 5: Bảng chi tiết đối tượng trang danh mục album của một địa điểm 89

Bảng 4 6: Bảng chi tiết xử lý trang danh mục album của một địa điểm 91

Bảng 4 7: Bảng chi tiết đối tượng trang danh mục album của một tỉnh 93

Bảng 4 8: Bảng chi tiết xử lý trang danh mục album của một tỉnh 95

Bảng 4 9: Bảng chi tiết đối tượng trang Your Adventure (chưa login) 97

Bảng 4 10: Bảng chi tiết xử lý trang đánh dấu những nơi bạn đi 98

Bảng 4 11: Bảng chi tiết đối tượng trang khám phá 99

Bảng 4 12: Bảng chi tiết xử lý trang khám phá 100

Bảng 4 13: Bảng chi tiết đối tượng trang rating một địa danh 101

Bảng 4 14: Bảng chi tiết xử lý trang rating một địa danh 102

Bảng 4 15: Bảng chi tiết đối tượng trang map – view a region 104

Bảng 4 16: Bảng chi tiết xử lý trang map – view a region 105

Bảng 4 17: Bảng chi tiết đối tượng trang thêm một bài post 106

Bảng 4 18: Bảng chi tiết xử lý trang thêm một bài post 107

Bảng 4 19: Bảng chi tiết đối tượng trang thêm album 108

Bảng 4 20: Bảng chi tiết xử lý trang thêm album 109

Bảng 4 21: Bảng chi tiết đối tượng trang danh sách User 111

Bảng 4 22: Bảng chi tiết xử lý trang danh sách User 114

Bảng 4 23: Bảng chi tiết đối tượng trang chi tiết User 115

Bảng 4 24: Bảng chi tiết xử lý trang chi tiết User 116

Bảng 4 25: Bảng chi tiết đối tượng trang danh sách bài Post của User 117

Bảng 4 26: Bảng chi tiết xử lý trang danh sách bài Post của User 119

Bảng 4 27: Bảng chi tiết đối tượng trang danh sách Region 121

Bảng 4 28: Bảng chi tiết xử lý trang danh sách Region 122

Bảng 4 29: Bảng chi tiết đối tượng trang chi tiết Region 123

Bảng 4 30: Bảng chi tiết xử lý trang chi tiết Region 124

Bảng 4 31: Bảng chi tiết đối tượng trang danh sách Place của Region 126

Bảng 4 32: Bảng chi tiết xử lý trang danh sách Place của Region 127

Bảng 4 33: Bảng chi tiết đối tượng trang chi tiết Place 128

Bảng 4 34: Bảng chi tiết xử lý trang chi tiết Place 129

Bảng 4 35: Bảng chi tiết đối tượng trang cập nhật Place 131

Bảng 4 36: Bảng chi tiết xử lý trang cập nhật Place 132

Bảng 4 37: Bảng chi tiết đối tượng trang thêm Place 134

Bảng 4 38: Bảng chi tiết xử lý trang thêm Place 136

Bảng 5 1: Bảng mô tả sơ đồ lớp Place 148

Bảng 5 2: Bảng mô tả sơ đồ lớp Region 149

Bảng 5 3: Bảng mô tả sơ đồ lớp User 151

Bảng 5 4: Bảng mô tả sơ đồ lớp Role 151

Bảng 5 5: Bảng mô tả sơ đồ lớp Feeling 152

Bảng 5 6: Bảng mô tả sơ đồ lớp UerRegion 153

Bảng 5 7: Bảng mô tả sơ đồ lớp PlaceUser 154

Bảng 6 1: Test màn hình add place 155

9Bảng 6 2: Test màn hình danh sách Place

Table 6.3 presents the test results for the update place screen, while Table 6.4 details the testing of the post list screen Table 6.5 outlines the user list screen tests, and Table 6.6 focuses on the homepage testing Additionally, Table 6.7 covers the exploration screen tests, Table 6.8 highlights the place information screen tests, and finally, Table 6.9 reviews the map screen testing results.

1 Tính cấp thiết của đề tài

Nhu cầu du lịch ngày càng tăng cao, đặc biệt là trong giới trẻ, những người thích khám phá và chia sẻ trải nghiệm của mình Ứng dụng này giúp người dùng tìm hiểu thông tin về địa điểm du lịch sắp tới, đánh giá mức độ thú vị của nó Bên cạnh đó, người dùng có thể lưu giữ những khoảnh khắc đẹp và chia sẻ trên mạng xã hội Không chỉ phục vụ nhu cầu cá nhân, ứng dụng còn góp phần quảng bá các địa danh nổi tiếng, thu hút khách du lịch và hỗ trợ phát triển ngành du lịch của đất nước.

• Tìm hiểu về các công nghệ sử dụng: Spring MVC, Spring Security, Hibernate, ReactJs.

• Sử dụng các công nghệ trên để xây dựng website.

• Website du lịch có các tính năng như sau:

- Đánh dấu lại những nơi mà mình đã đi du lịch.

- Đánh giá được du khách đi bao nhiêu phần trăm của đất nước Việt Nam.

- Lưu lại cảm xúc, hình ảnh về nơi mà mình đi du lịch.

- Lưu album hình ảnh về những chuyến đi theo địa danh và theo tỉnh.

- Cho phép người dùng rating qua những nơi mà họ đã đi du lịch.

- Người dùng có thể xem các bài chia sẻ cảm nghĩ về những người đã đi du lịch nơi đó rồi post lên.

- Khách đi du lịch có thể xem thông tin về địa danh mà mình chuẩn bị đi.

- Tìm kiếm địa danh hay tìm kiếm lại bài viết album thông qua mục khám phá.

- Chia sẻ bản đồ thu nhỏ về các nơi mà bạn đã đi du lịch lên mạng xã hội (Facebook).

Kết cấu đề tài gồm các chương sau:

Danh mục các hình ảnh

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

Chương 2: Lập danh sách yêu cầu

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

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

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

Trong những năm gần đây, đời sống con người tại Việt Nam đã được cải thiện đáng kể, dẫn đến sự gia tăng nhu cầu du lịch, cả từ người dân trong nước lẫn du khách quốc tế Chúng tôi đã tạo ra một website du lịch nhằm giúp người dùng lưu giữ những kỷ niệm đẹp, hình ảnh và cảm xúc tuyệt vời trong mỗi chuyến đi Bên cạnh đó, website còn hỗ trợ người dùng theo dõi tỷ lệ phần trăm các địa điểm đã khám phá và cung cấp những kinh nghiệm quý báu từ những du khách đi trước về các điểm đến.

1.2 Khảo sát những website khác

Gody gody.vn là một trang web du lịch nổi bật, cung cấp dịch vụ cho thuê Homestay và chia sẻ blog kinh nghiệm về các điểm đến trong nước và quốc tế Trang web còn có tính năng TravelMap, cho phép người dùng đánh dấu những địa điểm đã thăm và lưu giữ hình ảnh, đồng thời chia sẻ lên Facebook.

Hình 1 1: Giao diện chức năng Travel Map của website gody.vn

Hình 1 2: Giao diện trang của của website gody.vn

Hình 1 3: Hình ảnh về Blog thành viên của website gody.vn

- Website cho phép người dùng biết được các kinh nghiệm khi đi du lịch thông qua các blog.

- Giao diện đẹp, responsive tốt.

- Website hỗ trợ người dùng đặt homestay.

- Chức năng Travel Map chỉ đánh dấu được tỉnh chưa đánh dấu trực tiếp tại địa danh mà chúng ta đi.

- Chức năng Travel Map chưa cho lưu video về địa danh.

Mytour.vn là một trang web hướng dẫn du lịch, cung cấp dịch vụ đặt phòng và tìm kiếm khách sạn cho người dùng Trang web này cũng cho phép người dùng xem các bài đánh giá về những địa điểm du lịch nổi tiếng, tham gia tour và tìm hiểu cẩm nang du lịch về các địa điểm hấp dẫn trong và ngoài nước.

Hình 1 4: Website du lịch mytour.vn

Hình 1 5: Địa điểm phổ biến trong website du lịch mytour.vn

- Giao diện trực quan sinh động, người dùng dễ thao tác.

- Có hình ảnh minh họa cho khách sạn và thông tin chi tiết về giá vé cũng như các dịch vụ ở khách sạn.

- Có hỗ trợ người dùng đặt tour du lịch trong nước lẫn ngoài nước.

- Có sự liên kết đến các trang khác để cung cấp thông tin cho khách hàng.

- Có cẩm nang du lịch giúp cho người dùng biết được các kinh nghiệm khi đi du lịch.

- Không có chức năng đánh dấu lại nơi mà đã đi du lịch rồi.

Dulichviet (dulichviet.com.vn) là website chuyên cung cấp dịch vụ tour du lịch, giúp người dùng dễ dàng tìm kiếm và đặt các tour du lịch ưa thích Ngoài ra, trang web còn hỗ trợ người dùng trong việc tìm kiếm khách sạn, làm visa và đặt vé máy bay, mang đến trải nghiệm du lịch trọn vẹn và thuận tiện.

Hình 1 6: Trang chủ website du lịch dulichviet.com.vn

Hình 1 7: Danh sách các tour du lịch của website dulichviet.com.vn

- Cung cấp khá nhiều chức năng cho người dùng thích đi tour.

- Hỗ trợ cho người dùng đặt vé xe, vé máy bay, tìm khách sạn.

- Hỗ trợ làm visa cho khách đi du lịch.

- Chưa đánh dấu được những nơi mà chúng ta đã đi du lịch rồi.

1.2.4 Datviettour datviettour.com.vn [4]: Website đặt tour du lịch

Hình 1 8: Trang chủ của website datviettour.com.vn

Hình 1 9: Danh sách các tour du lịch trong website datviettour.com.vn

- Cung cấp các tour đi du lịch trong nước lần ngoài nước.

- Hỗ trợ làm visa cho khách đi du lịch nước ngoài.

- Giao diện nhìn bắt mắt.

- Hỗ trợ cho thuê xe và chơi team building.

- Chưa đánh dấu được những nơi mà chúng ta đã đi du lịch rồi.

1.2.5 Fiditour fiditour.com [5]: Website đặt tour đi du lịch chất lượng cao.

Hình 1 10: Trang chủ website fiditour.com

Hình 1 11: Danh sách các tour du lịch của website fiditour.com

- Cung cấp đầy đủ các tour đi du lịch trong nước lần ngoài nước.

- Giao diện được responsive đẹp.

- Có chat bot hỗ trợ người dùng.

- Có những chỗ nhìn khá là nhiều chữ và rối mắt.

- Chưa có tính năng đánh dấu những nơi đã đi.

1.2.6 Travel travel.com.vn [6] : Website đặt tour đi du lịch

Hình 1 12: Trang chủ website travel.com.vn

- Hỗ trợ người dùng tìm các tour trong nước và ngoài nước.

- Bố cục trang web đơn giản, gọn gàng và đầy đủ.

- Có hỗ trợ người dùng đặt phòng.

- Chưa có tính năng đánh dấu những nơi đã đi.

CHƯƠNG 2: LẬP DANH SÁCH YÊU CẦU

Hình 2 1: Sơ đồ Use case

2.2 Danh sách yêu cầu chức năng của phần mềm

2.2.1 Yêu cầu chức năng của Admin

2.2.1.1 Chức năng nghiệp vụ của Admin

Bảng 2 1: Bảng về chức năng nghiệp vụ của Admin 2.2.1.2 Chi tiết quy định/ công thức liên quan

Bảng 2 2: Bảng Chi tiết quy định/ công thức liên quan của Admin 2.2.1.3 Biểu mẫu liên quan

Hình 2 2: Biểu mẫu thêm địa danh mới

Hình 2 3: Biểu mẫu chỉnh sửa thông tin địa danh

Hình 2 4: Biểu mẫu xóa user

Hình 2 5: Biểu mẫu xóa địa danh

Hình 2 6: Biểu mẫu xóa bài post

2.2.2 Chức năng nghiệp vụ của Guest

2.2.2.1 Chức năng nghiệp vụ của Guest

(Image, Video, Info about Place)

Bảng 2 3: Bảng về chức năng nghiệp vụ của Guest 2.2.2.2 Chi tiết quy định/ công thức liên quan

Bảng 2 4: Bảng Chi tiết quy định/ công thức liên quan của Guest

Hình 2 7: Biểu mẫu search và xem thông tin

Hình 2 8: Biểu mẫu xem thông tin

2.2.3 Chức năng nghiệp vụ của User

2.2.3.1 Chức năng nghiệp vụ của User

(Image, Video, Info about Place)

Bảng 2 5: Bảng về chức năng nghiệp vụ của User

2.2.3.2 Chi tiết quy định/ công thức liên quan

6 QD_Save_alb um hình ảnh ở menu bên trái map rồi tiến hành select image from device.

- Sau khi select image xong thì nhấn vào button “Đăng”

Bảng 2 6: Bảng Chi tiết quy định/ công thức liên quan của

User 2.2.3.3 Biểu mẫu liên quan

Hình 2 9: Biểu mẫu search và xem thông tin

Hình 2 10: Hình biểu mẫu đánh dấu nơi đã đi

Hình 2 11: Biểu mẫu thêm bài post

Hình 2 12: Biểu mẩu view info

Hình 2 13: Biểu mẫu thêm album

Hình 2 14: Biểu mẫu đăng xuất

CHƯƠNG 3: PHÂN TÍCH YÊU CẦU VÀ

THIẾT KẾ CƠ CỞ DỮ LIỆU

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

3.1.1.1 Sơ đồ luồng dữ liệu

Hình 3 1: Sơ đồ luồng dữ liệu Add Place 3.1.1.2 Mô tả dữ liệu

D1: Thông tin địa danh gồm (name, title, svgPath, regionId, latitude, longitude).

D3: Danh sách place từ lbl_Place (name, title, svgPath, regionId, latitude, longitude)

D4: name, title, svgPath, regionUid, latitude, longitude D5: Không có

• Thông báo thêm thành công ➔

Dữ liệu được lưu trong cơ sở dữ liệu và trả về danh sách Place của Region.

• Thông báo thêm không thành công ➔

Dữ liệu không bị thay đổi và trả về trang add Place.

B1: Admin nhập thông tin của địa danh(name, title, svgPath, latitude, longitude) thông qua form.

B2: Thực hiện validate các field trong form gồm kiểm tra các trường bắt buộc phải nhập và kiểm tra tên địa danh đã tồn tại hay chưa.

- Trường hợp mà validate thành công ➔ chuyển đến B3

- Trường hợp mà validate không thành công ➔ quay lại B1

B3: Sau khi nhấn button “Submit”

- Lưu thành công và show thông báo ➔ chuyển đến B4

- Lưu thất bại thì sẽ show thông báo ➔ chuyển đến B1

B4: Trả trang về danh sách các place.

Hình 3 2: Add Place – Lược đồ tuần tự

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

• Danh sách các thuộc tính mới: name, title, svgPath, latitude, longitude

• Thiết kế cơ sở dữ liệu với tính đúng đắn:

Hình 3 3: Bản thông tin Place với tính đúng đắn

• Thuộc tính trừu tượng: id, placeStatus,regionId

• Thiết kế dữ liệu với tính tiến hóa:

Hình 3 4: Bảng thông tin Place với tính tiến hóa

Hình 3 5: Sơ đồ logic với bảng Place

3.1.2.1 Sơ đồ luồng dữ liệu

Hình 3 6: Sơ đồ luồng dữ liệu

D1: Thông tin về place(name, title, svgPath, regionId, latitude, longitude, placeStatus)

D3: Danh sách place từ lbl_Place (name, title, svgPath, regionId, latitude, longitude, placeStatus)

D4: name, title, svgPath, regionId, latitude, longitude, placeStatus

• Thông báo cập nhật thành công ➔

Dữ liệu được lưu trong cơ sở dữ liệu và trả về danh sách Place của Region.

• Thông báo thêm không thành công ➔

Dữ liệu không bị thay đổi và trả về trang danh sách Place của Region.

B1: Admin cập nhập thông tin của địa danh( name, title, svgPath, latitude, longitude, placeStatus) thông qua form.

B2: Thực hiện validate các field trong form gồm kiểm tra các trường bắt buộc phải nhập và kiểm tra tên địa danh đã tồn tại hay chưa.

- Trường hợp mà validate thành công ➔ chuyển đến B3

- Trường hợp mà validate không thành công ➔ quay lại B1

B3: Sau khi nhấn button “Submit”

- Lưu thành công và show thông báo ➔ chuyển đến B4

- Lưu thất bại thì sẽ show thông báo ➔ chuyển đến B1

B4: Trả trang về danh sách các place.

Hình 3 7: Update Place – Lược đồ tuần tự

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

Không có thuộc tính phát sinh

3.1.3.1 Sơ đồ luồng dữ liệu

Hình 3 8: Sơ đồ luồng dữ liệu Delete Place 3.1.3.2 Mô tả dữ liệu

D1: Thông tin xóa place gồm placeId

• Xóa thành công ➔ show thông báo ➔ dữ liệu được cập nhật trong bảng tbl_places.

• Không xóa trực tiếp trong database mà chỉ thay đổi trạng thái của User từ “AVAILABLE” sang “UNAVAILABLE”.

• Xóa thất bại ➔ show thông báo ➔ cơ sở dữ liệu không thay đổi.

B1: Admin chọn mã place cần xóa.

• Nếu xóa thất bại thì thông báo ➔ quay lại B1.

• Nếu xóa thành công ➔ chuyển đến B3

B3: Thông báo xóa thành công

B4: Lưu thay đổi vào bảng tbl_places trong cơ sở dữ liệu.

B5: Cập nhật lại danh sách place.

Hình 3 9: Delete Place – Lược đồ tuần tự 3.1.3.5 Thiết kế cơ sở dữ liệu

Không có thuộc tính mới.

3.1.4.1 Sơ đồ luồng dữ liệu

Hình 3 10: Sơ đồ luồng dữ liệu Delete Feeling

D1: Thông tin xóa Feeling gồm postId

• Xóa thành công ➔ show thông báo ➔ dữ liệu được cập nhật trong bảng tbl_feelings.

• Không xóa trực tiếp trong database mà chỉ thay đổi trạng thái của User từ “ACCEPTED” sang “UNACCEPTED”.

• Xóa thất bại ➔ show thông báo ➔ cơ sở dữ liệu không thay đổi.

B1: Admin chọn mã feeling cần xóa.

B2: Thực hiện xóa bài feelling

• Nếu xóa thất bại thì thông báo ➔ quay lại B1.

• Nếu xóa thành công ➔ chuyển đến B3

B3: Thông báo xóa thành công

B4: Lưu thay đổi vào bảng tbl_feelings trong cơ sở dữ liệu.

B5: Cập nhật lại danh sách feeling.

Hình 3 11: Delete Feeling – Lược đồ tuần tự 3.1.4.5 Thiết kế cơ sở dữ liệu

• Danh sách các thuộc tính mới: feelingId

• Thiết kế cơ sở dữ liệu đúng đắn

Hình 3 12: Bảng thông tin Feeling với tính đúng đắn

• Thuộc tính trừu tượng: id, topic, content, feelingStatus

• Thiết kế cơ sở dữ liệu tiến hóa

Hình 3 13: Bảng thông tin Feeling với tính tiến hóa

Hình 3 14: Sơ đồ logic với bảng Feeling 3.1.5 Nghiệp vụ Delete Acount

3.1.5.1 Sơ đồ luồng dữ liệu

Hình 3 15: Sơ đồ luồng dữ liệu Delete Account 3.1.5.2 Mô tả dữ liệu

D1: Thông tin xóa User gồm userId

• Xóa thành công ➔ show thông báo ➔ dữ liệu được cập nhật trong bảng tbl_users.

• Không xóa trực tiếp trong database mà chỉ thay đổi trạng thái của User từ “ACTIVE” sang “LOCKED”.

• Xóa thất bại ➔ show thông báo ➔ cơ sở dữ liệu không thay đổi.

B1: Admin chọn mã User cần xóa.

• Nếu xóa thất bại thì thông báo ➔ quay lại B1.

• Nếu xóa thành công ➔ chuyển đến B3

B3: Thông báo xóa thành công

B4: Lưu thay đổi vào bảng tbl_users trong cơ sở dữ liệu.

B5: Cập nhật lại danh sách user.

Hình 3 16: Delete Account – Lược đồ tuần tự

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

• Danh sách các thuộc tính mới:userId, roleId

• Thiết kế cơ sở dữ liệu đúng đắn

Hình 3 17: Bảng thông tin Role với tính đúng đắn

• Thuộc tính trừu tượng: id, roleName, roleStatus

• Thiết kế cơ sở dữ liệu tiến hóa

Hình 3 18: Bảng thông tin Role với tính tiến hóa

Hình 3 19: Sơ đồ logic với bảng Role 3.1.6 Nghiệp vụ View Info (Image, Video, Info about Place)

3.1.6.1 Sơ đồ luồng dữ liệu

Hình 3 20: Sơ đồ luồng dữ liệu View Info 3.1.6.2 Mô tả dữ liệu

D1: Thông tin bài post, video image

D3: Danh sách post từ tbl_feelings, video từ tbl_videos, image từ tbl_albums, name từ tbl_places, name_tbl_regions.

D4: topic, content, video, image, name(tên của place), name(tên của region)

• Không hiển thị thông tin

B1: Chọn vào region hoặc chọn vào place bên trong region của map: hiển thị các thông tin tên địa danh, tên tỉnh, video, image, post

B2: Hiển thị kết thông tin trên màn hình.

Hình 3 21: View Info – Lược đồ tuần tự 3.1.6.5 Thiết kế cơ sở dữ liệu

Không có thuộc tính mới.

3.1.7 Nghiệp vụ Login with Facebook

3.1.7.1 Sơ đồ luồng dữ liệu

Hình 3 22: Sơ đồ luồng dữ liệu Login with

Facebook 3.1.7.2 Mô tả dữ liệu

D1: email, password(email và password của Facebook)

D3: Danh sách name từ tbl_users.

D4: Thông tin id, email, password, userID, avatar, userName, roleId D5: Không có

• Đăng nhập thành công ➔ vào được trang chủ của User.

• Đăng nhập thất bạ ➔ vẫn ở lại trang đăng nhập.

B1: Nhập tài khoản email và password

B2: Lấy danh sách user từ tbl_users và so sánh với tài khoản nhập. B3:

• Nếu tài khoản không tồn tại thì hệ thống sẽ tự động tạo tài khoản

➔ lưu user mới trong cơ sở dữ liệu.

• Nếu tài khoản đó tồn tại ➔ trả về trang chủ User.

Hình 3 23: Login – Lược đồ tuần tự 3.1.7.5 Thiết kế cơ sở dữ liệu

Không có thuộc tính mới

3.1.8 Nghiệp vụ View place visited

3.1.8.1 Sơ đồ luồng dữ liệu

Hình 3 24: Sơ đồ luồng dữ liệu view place visited

D1: Nhận thông tin view từ User.

D3: Danh sách thông tin từ tbl_places gồm id, svgPath, name, title, latitude, longtitude, placeStatus và thông tin từ tbl_regions gồm id, name, title

D6: Thông tin về số nơi mà đã đi từ tbl_places gồm svgPath, name, title, latitude, longtitude, placeStatus và thông tin từ tbl_regions gồm name, title

B1: Mở kết nối cơ sở dữ liệu.

Truy cập trang chủ và chọn khu vực trên bản đồ để hiển thị thông tin về tên địa danh Những địa danh mà bạn đã từng ghé thăm sẽ được đánh dấu rõ ràng trên màn hình.

Hình 3 25: View place visited – Lược đồ tuần tự 3.1.8.5 Thiết kế cơ sở dữ liệu

Không có thuộc tính mới.

3.1.9.1 Sơ đồ luồng dữ liệu

Hình 3 26: Sơ đồ luồng dữ liệu Share Map

D1: Tín hiệu share map từ User.

D3: Thông tin về map và về user gồm: placeVisited, regionvisited, roleId, name(tên tỉnh), title, name(tên địa danh), latitude, longtitude

D6: Xuất hiện giao diện chia sẻ của Facebook về map.

B1: Chọn vào icon share map.

B2: Tiến hành ghi nội dung vào form đăng bài của Facebook.

• Trả về giao diện trang chủ sau khi đăng bài thành công.

• Trường hợp thất bại sẽ thông báo lỗi.

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

Không có thuộc tính mới

3.1.10.1 Sơ đồ luồng dữ liệu

Hình 3 27: Sơ đồ luồng dữ liệu Save Feelings

D1: Tín hiệu save Feeling từ User.

D3: Thông tin về tbl_fee;ings gồm topic,content.

D4: topic, content, id, userId, regionId, placeId

• Thông báo thêm thành công ➔

Dữ liệu được lưu trong cơ sở dữ liệu và trả về trang chủ.

• Thông báo thêm không thành công ➔

Vẫn ở lại trang đăng bài post.

B1: User nhập thông tin của địa post(topic, content) thông qua form.

B2: Thực hiện validate các field trong form gồm kiểm tra các trường bắt buộc phải nhập và kiểm tra tên địa danh đã tồn tại hay chưa.

- Trường hợp mà validate thành công ➔ chuyển đến B3

- Trường hợp mà validate không thành công ➔ quay lại B1

B3: Sau khi nhấn button “Submit”

- Lưu thành công và show thông báo ➔ chuyển đến B4

- Lưu thất bại thì sẽ show thông báo ➔ chuyển đến B1

B4: Trả trang về trang chủ.

Hình 3 28: Save post – lược đồ tuần tự 3.1.10.5 Thiết kế cơ sở dữ liệu

• Danh sách các thuộc tính mới: userRegionId, placeUserId

• Thiết kế cơ sở dữ liệu với tính đúng đắn:

Hình 3 29: Bản thông tin UserRegion và PlaceUser với tính đúng đắn

• Thuộc tính trừu tượng: userId, regionId, placeId

• Thiết kế dữ liệu với tính tiến hóa:

Hình 3 30: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa

Hình 3 31: Sơ đồ logic UserRegion và PlaceUser

3.1.11.1 Sơ đồ luồng dữ liệu

Hình 3 32: Sơ đồ luồng dữ liệu Logout 3.1.11.2 Mô tả dữ liệu

D1: Tín hiệu đăng xuất từ User of Admin

D6: Trả về giao diện trang Guest

B2: Trả về giao diện trang Guest.

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

Không có thuộc tính mới

3.1.12.1 Sơ đồ luồng dữ liệu

Hình 3 33: Sơ đồ luồng dữ liệu save albums

D1: Thông tin thêm albums gồm: name(tên album), image

D2: Chọn hình ảnh từ thiết bị.

D3: Danh sách thông tin từ tbl_Album(name, image, albumStatus) D4: name, image, albumStatus, userRegionId, placeUserId

Thông báo ➔ dữ liệu được cập nhật trong tbl_albums của cơ sở dữ liệu.

Thông báo ➔ vẫn ở lại trang ➔ cơ sở dữ liệu không thay đổi.

B1: Nhập nội dung chọn hình ảnh từ thiết bị

B2: Thực hiện validate các field trong form gồm kiểm tra các trường bắt buộc phải nhập và kiểm tra tên địa danh đã tồn tại hay chưa.

- Trường hợp mà validate thành công ➔ chuyển đến B3

- Trường hợp mà validate không thành công ➔ quay lại B1

B3: Sau khi nhấn button “Save”

- Lưu thành công và show thông báo ➔ chuyển đến B5

- Lưu thất bại thì sẽ show thông báo ➔ chuyển đến B1

B4: Trả trang về danh sách các place.

Hình 3 34: Save albums – Lược đồ tuần tự 3.1.12.5 Thiết kế cơ sở dữ liệu

• Danh sách các thuộc tính mới: userRegionId, placeUserId

• Thiết kế cơ sở dữ liệu với tính đúng đắn:

Hình 3 35: Bản thông tin UserRegion và PlaceUser với tính đúng đắn

• Thuộc tính trừu tượng: userId, regionId, placeId

• Thiết kế dữ liệu với tính tiến hóa:

Hình 3 36: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa

Hình 3 37: Sơ đồ logic UserRegion và PlaceUser

3.1.13 Nghiệp vụ Search tourist destination

3.1.13.1 Sơ đồ luồng dữ liệu

Hình 3 38: Sơ đồ luồng dữ liệu Search tourist destination

D1: Thông tin tìm kiếm là namePlace.

D3: Danh sách name từ tbl_Place.

D4: Thông tin tìm kiếm gồm name(tên của địa danh).

D6: Trả về địa danh theo thông tin mà Guest muốn tìm kiếm.

B1: Nhập name(tên của địa danh ).

B2: Lấy danh sách name của tbl_places

• Nếu name cần tìm phù hợp với danh sách name trong tbl_places

➔ hiển thị kết quả cho Guest.

• Nếu name cần tìm không có trong danh sách name trong tbl_places

➔ hiển thị kết quả “no result”.

Hình 3 39: Search – Lược đồ tuần tự

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

Không có thuộc tính mới.

3.1.14 Nghiệp vụ Search regional tourist destination

3.1.14.1 Sơ đồ luồng dữ liệu

Hình 3 40: Sơ đồ luồng dữ liệu Search region tourist destination

D1: Thông tin tìm kiếm là name(tên của region)

D3: Danh sách name từ tbl_regions.

D4: Thông tin tìm kiếm gồm name(tên của region).

D6: Trả về region theo thông tin mà Guest muốn tìm kiếm.

B1: Nhập name(tên của region).

B2: Lấy danh sách name của tbl_regions

• Nếu name cần tìm phù hợp với danh sách name trong tbl_regions

➔ hiển thị kết quả cho Guest.

• Nếu name cần tìm không có trong danh sách name trong tbl_regions ➔ hiển thị kết quả “no result”.

Hình 3 41: Search – Lược đồ tuần tự

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

Không có thuộc tính mới.

3.2 Mô tả cơ sở dữ liệu

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

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

4.1 Màn hình giao diện và xử lý bên client

4.1.1 Giao diện trang chủ/ trang Intro (giới thiệu)

Hình 4 1: Màn hình đối tượng trang chủ/ trang Intro

STT Tên đối tượng Kiểu đối tượng Mô tả Ghi chú

Bảng 4 1: Bảng chi tiết đối tượng trang chủ/ trang Intro

Hình 4 2: Màn hình xử lý trang chủ/ trang Intro 4.1.1.3 Danh sách xử lý

1 Chuyển đến trang chủ (Intro page)

6 Menu icon mạng xã họi tương ứng

Bảng 4 2: Bảng chi tiết xử lý trang chủ/ trang Intro

4.1.2 Giao diện trang Login with facebook

Hình 4 3: Màn hình đối tượng trang Login with facebook

2 Button Google hành đăng nhập với Google

Bảng 4 3: Bảng chi tiết đối tượng trang Login with facebook

Hình 4 4: Màn hình xử lý trang Login with facebook

Bảng 4 4: Bảng chi tiết xử lý trang Login with facebook

4.1.3 Giao diện trang danh mục album của một địa điểm

Hình 4 5: Màn hình đối tượng trang danh mục album của một địa điểm

Bảng 4 5: Bảng chi tiết đối tượng trang danh mục album của một địa điểm

Hình 4 6: Màn hình xử lý trang danh mục album của một địa điểm

Bảng 4 6: Bảng chi tiết xử lý trang danh mục album của một địa điểm

4.1.4 Giao diện trang danh mục album của một tỉnh

Hình 4 7: Màn hình đối tượng trang danh mục album của một tỉnh

Bảng 4 7: Bảng chi tiết đối tượng trang danh mục album của một tỉnh

Hình 4 8: Màn hình xử lý trang danh mục album của một tỉnh

Bảng 4 8: Bảng chi tiết xử lý trang danh mục album của một tỉnh

4.1.5 Giao diện trang map đánh dấu những nơi bạn đi

Hình 4 9: Màn hình đối tượng trang map đánh dấu những nơi bạn đi

Bảng 4 9: Bảng chi tiết đối tượng trang Your Adventure (chưa login)

Hình 4 10: Màn hình xử lý trang đánh dấu những nơi bạn đi

STT Tên xử lý Điều kiện gọi thực hiện

Bảng 4 10: Bảng chi tiết xử lý trang đánh dấu những nơi bạn đi

4.1.6 Giao diện trang tìm kiếm

Hình 4 11: Màn hình đối tượng trang khám phá

Bảng 4 11: Bảng chi tiết đối tượng trang khám phá

Hình 4 12: Màn hình xử lý trang khám phá

4.1.7 Giao diện trang rating một địa danh

Hình 4 13: Màn hình đối tượng trang rating một địa danh

Bảng 4 13: Bảng chi tiết đối tượng trang rating một địa danh

Hình 4 14: Màn hình xử lý trang rating một địa danh

Bảng 4 14: Bảng chi tiết xử lý trang rating một địa danh

4.1.8 Giao diện map – view a region

Hình 4 15: Màn hình đối tượng trang map – view a region

Bảng 4 15: Bảng chi tiết đối tượng trang map – view a region

Hình 4 16: Màn hình xử lý trang map – view a region

Bảng 4 16: Bảng chi tiết xử lý trang map – view a region

4.1.9 Giao diện trang thêm một bài post

Hình 4 17: Màn hình đối tượng trang thêm một bài post

Bảng 4 17: Bảng chi tiết đối tượng trang thêm một bài post

Hình 4 18: Màn hình xử lý trang thêm một bài post

Bảng 4 18: Bảng chi tiết xử lý trang thêm một bài post

4.1.10 Giao diện trang thêm album

Hình 4 19: Màn hình đối tượng trang thêm album

2 Button “Chọn ảnh từ thiết bị”

Bảng 4 19: Bảng chi tiết đối tượng trang thêm album

“Chọn ảnh từ thiết bị”

Bảng 4 20: Bảng chi tiết xử lý trang thêm album

4.2 Màn hình giao diện và xử lý bên Admin

4.2.1 Giao diện trang danh sách User

Hình 0.1: Màn hình đối tượng trang danh sách User

Bảng 4 21: Bảng chi tiết đối tượng trang danh sách User

Hình 0.2: Màn hình xử lý trang danh sách User

1 Chuyển đến trang chủ Admin (Dashboard page)

3 Chuyển đến trang quản lý Users

4 Chuyển đến trang quản lý Regions

5 Chuyển đến trang thêm Place

6 Tìm kiếm dữ liệu trong bảng

8 Chuyển đến trang thông tin người dùng

10 Chọn kích thước mỗi trang

Bảng 4 22: Bảng chi tiết xử lý trang danh sách User

4.2.2 Giao diện trang chi tiết về User

Hình 0.3: Màn hình đối tượng trang chi tiết User

Bảng 4 23: Bảng chi tiết đối tượng trang chi tiết User

Hình 0.4: Màn hình xử lý trang chi tiết User

STT Tên xử lý Điều kiện gọi thực hiện

Bảng 4 24: Bảng chi tiết xử lý trang chi tiết User

4.2.3 Giao diện trang danh sách bài post của User

Hình 0.5: Màn hình đối tượng trang danh sách bài Post của User

STT Tên đối tượng Kiểu đối tượng Mô tả Ghi chú

Bảng 4 25: Bảng chi tiết đối tượng trang danh sách bài Post của User

Hình 0.6: Màn hình xử lý trang danh sách bài Post của User

1 Tìm kiếm dữ liệu trong bảng

3 Xóa bài post của user

4 Chọn kích thước mỗi trang

Bảng 4 26: Bảng chi tiết xử lý trang danh sách bài Post của User

4.2.4 Giao diện trang danh sách Region

Hình 0.7: Màn hình đối tượng trang danh sách Region

STT Tên đối tượng Kiểu đối tượng Mô tả Ghi chú

13 Intro text Text Text hiển thị tác giả

Bảng 4 27: Bảng chi tiết đối tượng trang danh sách Region

Hình 0.8: Màn hình xử lý trang danh sách

1 Tìm kiếm dữ liệu trong bảng

G ia o di ện tr a n g ch i ti ết

Hình 0.9: Màn hình đối tượng trang chi tiết Region

Bảng 4 29: Bảng chi tiết đối tượng trang chi tiết Region

Hình 0.10: Màn hình xử lý trang chi tiết Region

1 Điều hướng đến Place list page

Bảng 4 30: Bảng chi tiết xử lý trang chi tiết Region

4.2.6 Giao diện trang danh sách Place của Region

Hình 0.11: Màn hình đối tượng trang danh sách Place của Region

Bảng 4 31: Bảng chi tiết đối tượng trang danh sách Place của Region

Hình 0.12: Màn hình xử lý trang danh sách Place của Region

STT Tên xử lý Điều kiện gọi thực hiện

1 Tìm kiếm dữ liệu trong bảng

2 Sắp xếp theo Place name

3 Chuyển đến trang thông tin place

5 Chọn kích thước mỗi trang

Bảng 4 32: Bảng chi tiết xử lý trang danh sách Place của Region

4.2.7 Giao diện trang chi tiết Place

Hình 0.13: Màn hình đối tượng trang chi tiết Place

Bảng 4 33: Bảng chi tiết đối tượng trang chi tiết Place

Hình 0.14: Màn hình xử lý trang chi tiết Place

1 Quay lại trang Place list page

Bảng 4 34: Bảng chi tiết xử lý trang chi tiết Place

4.2.8 Giao diện trang cập nhật Place

Hình 0.15: Màn hình đối tượng trang cập nhật Place

Bảng 4 35: Bảng chi tiết đối tượng trang cập nhật Place

Hình 0.16: Màn hình xử lý trang cập nhật Place

Bảng 4 36: Bảng chi tiết xử lý trang cập nhật Place

4.2.9 Giao diện trang thêm Place

Hình 0.17: Màn hình đối tượng trang thêm Place

Bảng 4 37: Bảng chi tiết đối tượng trang thêm Place

Hình 0.18: Màn hình xử lý trang thêm Place

2 Quay về map ban đầu

Bảng 4 38: Bảng chi tiết xử lý trang thêm Place

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

- Website được viết sử dụng các ngôn ngữ là: Java, Javascript, CSS

5.1.2 Các công nghệ được sử dụng

5.1.2.1 Giới thiệu về Spring MVC

Ngày đăng: 27/12/2021, 08:49

HÌNH ẢNH LIÊN QUAN

Hình 1. 1: Giao diện chức năng Travel Map của website gody.vn - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 1. 1: Giao diện chức năng Travel Map của website gody.vn (Trang 25)
Hình 1. 5: Địa điểm phổ biến trong website du lịch mytour.vn - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 1. 5: Địa điểm phổ biến trong website du lịch mytour.vn (Trang 28)
Hình 3. 2: Add Place – Lược đồ tuần tự - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 2: Add Place – Lược đồ tuần tự (Trang 56)
Hình 3. 7: Update Place – Lược đồ tuần tự - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 7: Update Place – Lược đồ tuần tự (Trang 59)
Hình 3. 9: Delete Place – Lược đồ tuần - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 9: Delete Place – Lược đồ tuần (Trang 61)
Hình 3. 10: Sơ đồ luồng dữ liệu Delete Feeling - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 10: Sơ đồ luồng dữ liệu Delete Feeling (Trang 62)
Hình 3. 16: Delete Account – Lược đồ tuần tự - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 16: Delete Account – Lược đồ tuần tự (Trang 66)
Hình 3. 22: Sơ đồ luồng dữ liệu Login with - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 22: Sơ đồ luồng dữ liệu Login with (Trang 70)
Hình 3. 23: Login – Lược đồ tuần - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 23: Login – Lược đồ tuần (Trang 71)
Hình 3. 25: View place visited – Lược đồ tuần tự 3.1.8.5 Thiết kế cơ sở dữ liệu - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 25: View place visited – Lược đồ tuần tự 3.1.8.5 Thiết kế cơ sở dữ liệu (Trang 73)
Hình 3. 27: Sơ đồ luồng dữ liệu Save Feelings - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 27: Sơ đồ luồng dữ liệu Save Feelings (Trang 75)
Hình 3. 28: Save post – lược đồ tuần - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 28: Save post – lược đồ tuần (Trang 76)
Hình 3. 29: Bản thông tin UserRegion và PlaceUser với tính đúng đắn - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 29: Bản thông tin UserRegion và PlaceUser với tính đúng đắn (Trang 77)
Hình 3. 30: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 30: Bảng thông tin UserRegion và PlaceUser với tính tiến hóa (Trang 78)
Hình 3. 31: Sơ đồ logic UserRegion và PlaceUser - (Đồ án tốt nghiệp) xây dựng website du lịch
Hình 3. 31: Sơ đồ logic UserRegion và PlaceUser (Trang 79)

TỪ KHÓA LIÊN QUAN

w