MSSV: 18110112 Chuyên ngành: Công nghệ phần mềm Tên đề tài: Xây dựng hệ thống quản lý du lịch Nội dung thực hiện: Lý thuyết: - Tìm hiểu về công nghệ Reactjs, React Native - Tìm hiểu về l
BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH ĐỒ ÁN TỐT NGHIỆP NGÀNH CÔNG NGHỆ THÔNG TIN XÂY DỰNG HỆ THỐNG QUẢN LÝ DU LỊCH GVHD: ThS LÊ THỊ MINH CHÂU SVTH: NGUYỄN ĐỨC HẢO NGUYỄN THANH HOÀNG SKL009613 Tp Hồ Chí Minh, tháng năm 2022 TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƯỢNG CAO NGÀNH CƠNG NGHỆ THƠNG TIN KHĨA LUẬN TỐT NGHIỆP BÁO CÁO XÂY DỰNG HỆ THỐNG QUẢN LÝ DU LỊCH GVHD: Th.S Lê Thị Minh Châu Sinh viên thực Nguyễn Đức Hảo 18110104 Nguyễn Thanh Hoàng 18110112 Tp Hồ Chí Minh, tháng năm 2022 ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HỒ CHÍ MINH CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM KHOA ĐÀO TẠO CHẤT LƯỢNG CAO Độc lập – Tự – Hạnh phúc NHIỆM VỤ THỰC HIỆN KHÓA LUẬN TỐT NGHIỆP Họ tên SV: Nguyễn Đức Hảo….…………………MSSV: 18110104 Họ tên SV: Nguyễn Thanh Hồng……………… MSSV: 18110112 Chun ngành: Cơng nghệ phần mềm Tên đề tài: Xây dựng hệ thống quản lý du lịch Nội dung thực hiện: Lý thuyết: - Tìm hiểu cơng nghệ Reactjs, React Native - Tìm hiểu lập trình backend với Nodejs - Tìm hiểu RESTful API Thực hành: Xây dựng lên ứng dụng di động giúp cho người dùng tìm kiếm địa điểm du lịch lên lịch trình du lịch trang web quản lý thông tin du lịch quản lý người dùng -Xây dựng ứng dụng hỗ trợ du lịch o Xem thông tin du lịch o Xem lịch trình du lịch o Đánh giá địa điểm du lịch o Tìm kiếm địa điểm xung quanh o Gửi thư góp ý -Xây dựng trang web quản lý o Quản lý người dùng o Quản lý địa điểm du lịch o Quản lý lịch trình o Gửi thơng báo o Xem góp ý -Xây dụng API Server cho ứng dụng NodeJs Thời gian thực hiện: Bắt đầu từ 07/03/2022 đến 18/06/2022 Chữ ký SV: …………………………………………………………… Chữ ký SV: …………………………………………………………… TP.HCM, Ngày… tháng… năm … TRƯỞNG NGÀNH (Ký ghi rõ họ tên) GIẢNG VIÊN HƯỚNG DẪN (Ký ghi rõ họ tên) CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh phúc *** -PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Họ tên sinh viên: Nguyễn Đức Hảo Nguyễn Thanh Hoàng MSSV: 18110104 Lớp: 18110CLST1 MSSV: 18110112 Lớp: 18110CLST2 Ngành: Công nghệ thông tin Tên đề tài: Xây dựng Hệ thống quản lý du lịch Họ và tên giáo viên hướng dẫn: ThS Lê Thị Minh Châu NHẬN XÉT Về nội dung đề tài & khối lượng thực hiện: ……………………………………………………………………………………… ……………………………………………………………………………………… Ưu điểm: ……………………………………………………………………………………… ……………………………………………………………………………………… Khuyế t điểm: ……………………………………………………………………………………… ……………………………………………………………………………………… Đề nghị cho bảo vệ hay không : ……………………………………………………………………………………… Đánh giá loại: ……………………………………………………………………………………… Điểm: ….…… (Bằ ng chữ: .) Tp Hồ Chí Minh, ngày tháng Giáo viên hướng dẫn (Ký & ghi rõ họ tên) năm 20… CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh phúc *** -PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN Họ tên sinh viên: Nguyễn Đức Hảo Nguyễn Thanh Hoàng MSSV: 18110104 Lớp: 18110CLST1 MSSV: 18110112 Lớp: 18110CLST2 Ngành: Công nghệ thông tin Tên đề tài: Xây dựng Hệ thống quản lý du lịch Họ tên giáo viên phản biện: ThS Nguyễn Minh Đạo NHẬN XÉT Về nội dung đề tài & khối lượng thực hiện: ……………………………………………………………………………………… ……………………………………………………………………………………… Ưu điểm: ……………………………………………………………………………………… ……………………………………………………………………………………… Khuyế t điểm: ……………………………………………………………………………………… ……………………………………………………………………………………… Đề nghi cho ̣ bảo vệ hay không? ……………………………………………………………………………………… Đánh giá loại: ……………………………………………………………………………………… Điểm: ….…… (Bằ ng chữ: .) Tp Hồ Chí Minh, ngày tháng Giáo viên phản biện (Ký & ghi rõ họ tên) năm 20 MỤC LỤC DANH MỤC BẢNG HIỆU DANH MỤC HÌNH ẢNH DANH MỤC TỪ VIẾT TẮT LỜI CẢM ƠN TÓM TẮT CHƯƠNG 1: TỔNG QUAN 1.1 Lý chọn đề tài 1.2 Mục tiêu 1.3 Công nghệ sử dụng CHƯƠNG 2: CƠ SỞ LÝ THUYẾT 10 2.1 React Native 10 2.1.1 Lịch sử 10 2.1.2 Giới thiệu React Native 10 2.1.3 Ưu điểm 10 2.1.4 Nhược điểm 10 2.1.5 Lý chọn React Native 11 2.2 NodeJS 11 2.1.1 Lịch sử 11 2.1.2 Giới thiệu NodeJS 11 2.1.3 Ưu điểm 11 2.1.4 Nhược điểm 11 2.1.5 Lý chọn NodeJS 11 2.3 Mysql 12 2.3.1 Giới thiệu Mysql 12 2.3.2 Lý chọn Mysql 12 2.4 Expo 12 2.5 RESTful API 13 CHƯƠNG 3: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 14 3.1 Khảo sát trạng 14 3.1.1 MeTrip 14 3.1.2 Tripadvisor 15 3.1.3 Dong Nai Guide 17 3.1.4 Kết luận 18 3.2 Xác định yêu cầu 18 3.2.1 Nghiệp vụ 18 3.2.2 Phạm vi 19 3.3 Đánh giá lựa chọn công nghệ 19 3.3.1 Mục tiêu đề tài 19 3.3.2 Nội dung 19 3.3.3 Hiện thực hệ thống 21 3.3.4 Phương pháp nghiên cứu 21 3.3.5 Ý nghĩa khoa học thực tiễn 21 CHƯƠNG 4: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 22 4.1 Mơ hình hóa hệ thống 22 4.1.1 Danh sách Actor 22 4.1.2 Lược đồ usecase 22 4.1.3 Mô tả sơ đồ usecase 23 4.2 Đặc tả usecase 27 4.2.1 Đăng nhập 27 4.2.2 Đăng ký 28 4.2.3 Đăng xuất 28 4.2.4 Quản lý lịch trình 29 4.2.5 Quản lý tài khoản 30 4.2.6 Xem Thông tin cá nhân 31 4.2.7 Đổi mật 31 4.2.8 Quản lý thông tin địa điểm 32 4.2.9 Quản lý thông tin dịch vụ 33 4.2.10 Quản lý thông báo 34 4.2.11 Chỉnh sửa thông tin tài khoản 35 4.2.12 Xem thông báo 36 4.2.13 Gửi thư góp ý 36 4.2.14 Xem góp ý 37 4.2.15 Tìm kiếm địa điểm xung quanh 38 4.2.16 Xem lịch trình 38 4.2.17 Xem thông tin du lịch 39 4.3 Lược đồ 40 4.3.1 Chức xem thông tin du lịch 40 4.3.2 Chức vô hiệu hóa địa điểm du lịch 41 4.3.3 Chức tìm kiếm địa điểm 42 4.3.4 Chức thêm dịch vụ 42 4.3.5 Chức thêm địa điểm 43 4.3.6 Chức thêm lịch trình 43 4.3.7.Chức quản lý tài khoản 44 4.3.8 Chức tìm kiếm xung quanh 45 4.3.9 Chức xem lịch trình 46 4.4 Lược đồ sở liệu 48 4.5 Lược đồ ERD 48 4.6 Thiết kế giao diện 49 4.6.1 Danh sách giao diện 49 4.6.2 Mô tả giao diện 52 CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ 98 5.1 Cài đặt 98 5.2 Các bước chạy hệ thống 98 5.3 Kiểm thử 98 5.3.1 Kiểm thử chức đăng ký 98 5.3.2 Kiểm thử chức đăng nhập 99 5.3.3 Kiểm thử chức thêm địa điểm du lịch 100 5.3.4 Kiểm thử chức tìm kiếm xung quanh 101 5.3.5 Kiểm thử chức gửi góp ý 102 5.3.6 Kiểm thử chức gửi thông báo 103 5.3.7 Kiểm thử chức xem chi tiết địa điểm du lịch 104 5.3.8 Kiểm thử chức xóa bình luận 105 5.3.9 Kiểm thử chức vơ hiệu hóa lịch trình 106 5.3.10 Kiểm thử chức cập nhật thông tin dịch vụ 107 5.3.11 Kiểm thử chức cập nhật thông tin địa điểm 109 Chương 6: Kết luận Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên Ấn vào thơng Màn hình chuyển sang hình As Expected báo quản lý thơng báo Ấn thêm Hộp thoại dùng để thêm thông As Expected Pass Pass Pass Pass báo Nhập tiêu đề Màn hình hiển thị nội dung tiêu đề As Expected Pass nhập Nhập nội Màn hình hiển thị nội dung thơng As Expected dung thơng báo báo nhập 10 Ấn đồng ý Thông báo vừa nhập xuất As Expected Pass Pass danh sách thông báo 5.3.7 Kiểm thử chức xem chi tiết địa điểm du lịch Bảng 50 Kiểm thử chức xem chi tiết địa điểm du lịch TestCase DetaiPlace TestTitle Xem chi tiết địa điểm du lịch TestData Tên đăng nhập : admin Mật : 123456 Tìm kiếm tỉnh thành: Thành phố Hồ Chí Minh Step Expected Result Actual Result Mở ứng dụng ứng dụng mở hình đăng As Expected nhập 104 Status Pass Chương 6: Kết luận Nhập tên Tên đăng nhập nhập hiển thị lên As Expected đăng nhập hình Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên Ấn chọn Màn hình hiển thị kết địa As Expected Thành Phố Hồ điểm, dịch vụ Thành Phố Hồ Chí Chí Minh Minh Chọn Nhà Màn hình trang chủ chuyển đến As Expected Thờ Đức Bà hình thông tin chi tiết địa điểm Pass Pass Pass Pass Pass Nhà Thờ Đức Bà 5.3.8 Kiểm thử chức xóa bình luận Bảng 51 Kiểm thử chức xóa bình luận TestCase DeleteComment TestTitle Xóa bình luận TestData Tên đăng nhập : admin Mật : 123456 Step Expected Result Actual Result Status Mở trang Trang web mở As Expected Pass web quản trị viên 105 Chương 6: Kết luận Nhập tên Tên đăng nhập nhập hiển thị lên As Expected đăng nhập hình Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên 6.Ấn vào địa Trang chọn chức quản trị viên As Expected điểm chuyển sang hình quản lý địa Pass Pass Pass Pass điểm Ấn vào bình Màn hình quản lý địa điểm chuyển As Expected luận thác sang hình quản lý bình luận Pass giang điền Ấn vào icon Bình luận ấn icon xóa khơng As Expected xóa bình cịn hiển thị hình quản lý bình luận luận Pass 5.3.9 Kiểm thử chức vơ hiệu hóa lịch trình Bảng 52 Kiểm thử chức vơ hiệu hóa lịch trình TestCase DeleteTrip TestTitle Vơ hiệu hóa lịch trình TestData Tên đăng nhập : admin Mật : 123456 Step Expected Result Actual Result 106 Status Chương 6: Kết luận Mở trang Trang web mở As Expected Pass Nhập tên Tên đăng nhập nhập hiển thị lên As Expected Pass đăng nhập hình Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên 6.Ấn vào lịch Trang chọn chức quản trị viên As Expected trình chuyển sang hình quản lý lịch web quản trị viên Pass Pass Pass trình Ấn vào icon Màn hình hiển thị hộp thoại vơ hiệu As Expected xóa lịch hóa thành cơng trình cần vơ hiệu hóa 5.3.10 Kiểm thử chức cập nhật thông tin dịch vụ Bảng 53 Kiểm thử chức cập nhật thông tin dịch vụ TestCase EditService TestTitle Cập nhật thông tin dịch vụ TestData Tên đăng nhập : admin Mật : 123456 Hình ảnh : 107 Pass Chương 6: Kết luận Step Expected Result Actual Result Status Mở trang Trang web mở As Expected Pass Nhập tên Tên đăng nhập nhập hiển thị lên As Expected Pass đăng nhập hình Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên 6.Ấn vào dịch Trang chọn chức quản trị viên As Expected vụ chuyển sang hình quản lý dịch web quản trị viên vụ 108 Pass Pass Pass Chương 6: Kết luận Ấn vào icon Màn hình quản lý địa điểm chuyển As Expected chỉnh sửa sang hình chỉnh sửa địa điểm HAPPYSON thác HAPPYSON Hotel Pass Hotel Ấn vào ô Hiển thị hộp thoại mở file ảnh As Expected Pass Hình ảnh chọn thêm vào As Expected Pass Hiển thị hộp thoại chỉnh sửa thành As Expected Pass thêm ảnh Chọn hình ảnh cần thêm vào Ấn chỉnh sửa công 5.3.11 Kiểm thử chức cập nhật thông tin địa điểm Bảng 54 Kiểm thử chức cập nhật thông tin địa điểm TestCase Editplace TestTitle Cập nhật thông tin địa điểm TestData Tên đăng nhập : admin Mật : 123456 Địa : 104/4 Khu Công Nghiệp Giang Điền, Giang Điền, Trảng Bom, Đồng Nai Step Expected Result Actual Result Status Mở trang Trang web mở As Expected Pass Nhập tên Tên đăng nhập nhập hiển thị lên As Expected Pass đăng nhập hình web quản trị viên 109 Chương 6: Kết luận Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên 6.Ấn vào địa Trang chọn chức quản trị viên As Expected điểm chuyển sang hình quản lý địa Pass Pass Pass điểm Ấn vào icon Màn hình quản lý địa điểm chuyển As Expected chỉnh sửa thác sang hình chỉnh sửa địa điểm gian điền thác Giang Điền Điền vào Ơ trống địa hiển thị liệu As Expected địa “104/4 nhập vào Pass Pass Khu Công Nghiệp Giang Điền, Giang Điền, Trảng Bom, Đồng Nai” Ấn chỉnh sửa Hiển thị hộp thoại chỉnh sửa thành As Expected công 5.3.12 Kiểm thử chức đổi mật Bảng 55 Kiểm thử chức đổi mật TestCase ChangePassword TestTitle Đổi mật TestData Tên đăng nhập : admin Mật : 123456 Mật : 123123 110 Pass Chương 6: Kết luận Nhập lại mật : 123123 Step Expected Result Actual Result Status Mở ứng dụng Trang web mở As Expected Pass Nhập tên Tên đăng nhập nhập hiển thị lên As Expected Pass đăng nhập hình Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên Ấn vào tài Màn hình chuyển sang hình tài As Expected khoản khoản Ấn vào thông Màn hình chuyển sang hình As Expected tin bạn thơng tin tài khoản Ấn đổi mật Màn hình chuyển sang hình đổi As Expected mật nhập mật Mật nhập hiển thị dạng As Expected bảo vệ nhập mật Mật nhập hiển thị dạng As Expected Pass Pass Pass Pass Pass Pass Pass bảo vệ 10 nhập lại mật Mật nhập hiển thị dạng As Expected bảo vệ 11 Ấn xác nhận Màn hình hiển thị hộp thoại thơng As Expected báo đổi mật thành công 5.3.13 Kiểm thử chức xem lịch trình Bảng 56 Kiểm thử chức xem lịch trình TestCase Trip TestTitle Xem lịch trình 111 Pass Pass Chương 6: Kết luận TestData Tên đăng nhập : admin Mật : 123456 Lịch trình theo tỉnh thành: Thành phố Hồ Chí Minh Step Expected Result Actual Result Status Mở ứng dụng Trang web mở As Expected Pass Nhập tên Tên đăng nhập nhập hiển thị lên As Expected Pass đăng nhập hình Nhập mật Mật nhập hiển thị dạng As Expected bảo vệ Ấn đăng Màn hình đăng nhập chuyển sang As Expected nhập trang chọn chức quản trị viên Ấn vào lịch Màn hình chuyển sang hình lịch As Expected trình trình Ấn chọn lịch Hiển thị lịch trình tỉnh thành As Expected trình theo tỉnh Thành phố Hồ Chí Minh Pass Pass Pass Pass thành “Thành phố Hồ Chí Minh” Chọn lịch Màn hình chuyển sang hình chi As Expected trình “ Trải tiết lịch trình lịch trình chọn nghiệm TP HCM ngày đêm” 112 Pass Chương 6: Kết luận CHƯƠNG 6: KẾT LUẬN 6.1 Kết đạt Trong thời gian bắt đầu nhận đề tài đến trải qua việc phân tích tìm kiếm hướng giải để thực đề tài nhìn chung nhóm hoàn thành mục tiêu mong muốn ban đầu đặt Qua việc tự học tìm kiếm thơng tin qua mạng để thực đề tài, nhóm em biết hiểu quy trình xây dựng ứng dụng cách sử dụng công cụ hỗ trợ cho việc lập trình, cách phân tích sở liệu, việc giải vấn đề… Qua giúp nhóm em cải thiện nhiều kỹ có thêm nhiều kinh nghiệm 6.1.1 Về mặt lý thuyết Sau thời gian học tập thực nhóm hiểu về: - Cách hoạt động sử dụng Reactjs, Nodejs - Cách tạo, sử dụng sở liệu MySQL - Biết cách tích hợp cơng nghệ để xây dựng thành ứng dụng quản lý du lịch với chức 6.1.2 Về mặt thực ❖ Đối với khách chưa đăng nhập: - Chức đăng ký (Sử dụng lại chức môn học trước) ❖ Đối với người dùng : - Chức đăng nhập (Sử dụng lại chức môn học trước) - Chức xem thông tin du lịch - Xem thông tin dịch vụ - Chức tìm kiếm địa điểm gần - Chức xem lịch trình - Chức gửi thư góp ý - Chức xem thông báo (Sử dụng lại chức môn học trước) - Chức Quản lý thông tin cá nhân 113 Chương 6: Kết luận ❖ Đối với quản trị viên: - Chức đăng nhập - Chức đăng xuất - Chức quản lý thông tin dịch vụ - Chức quản lý người dùng - Chức quản lý thông tin địa điểm du lịch - Chức quản lý lịch trình - Chức quản lý thông báo - Chức xem góp ý người dùng 6.1.3 Về mặt kỹ mềm Sau thời gian học tập thực nhóm phát triển kỹ kỹ mềm: - Kỹ làm việc nhóm - Kỹ giao tiếp - Kỹ giải vấn đề 6.2 Ưu điểm - Ứng dụng thiết kế đơn giản, dễ sử dụng - Có tương tác với người dùng nhờ vào chức bình luận góp ý - Có sử dụng token để xác thực người dùng - Có thể tìm kiếm địa điểm theo vị trí người dùng - Tìm hiểu nhiều thơng tin địa điểm, xem lịch trình gợi ý từ ứng dụng 6.3 Hạn chế - Các hình địa điểm chưa có thích - Phần góp ý chưa có hình ảnh quản trị viên chưa phản hồi ngược lại với người dùng - Ứng dụng kiểm thử hệ điều hành android 114 Chương 6: Kết luận 6.4 Hướng phát triển - Thêm thích cho hình ảnh - Thêm phần đăng hình ảnh phần góp ý với quản trị viên bổ sung phần phản hồi quản trị viên với người dùng - Kiểm thử sửa lỗi hệ điều hành iOS - Thêm chức lưu địa điểm qua 115 Tài liệu tham khảo TÀI LIỆU THAM KHẢO [1] Thanh1908, React Native, https://vi.wikipedia.org/wiki/React_Native [2] Trung Quân, Một nhìn tổng quan Nodejs, https://viblo.asia/p/mot-cai-nhintong-quan-nhat-ve-nodejs-Ljy5VeJ3lra [3] TopDev, RESTful API gì? Cách thiết kế RESTful API, https://topdev.vn/blog/restful-api-la-gi/ [4] Nguyen Dai, ứng dụng metrip, https://apps.apple.com/vn/app/metrip-trip-planner/id1424156060?l=vi [5] Tripadvisor, ứng dụng Tripadvisor, https://apps.apple.com/vn/app/tripadvisor-kh%C3%A1ch-s%E1%BA%A1n-nh%C3%A0h%C3%A0ng/id284876795?l=vi [7] Oleg Kopachovets, advantages of using nodeJs, https://procoders.tech/blog/advantages-of-using-node-js/ [8] Cấn Khắc Nguyên, React Native- Những khái niệm bản, https://viblo.asia/p/react-native-nhung-khai-niem-co-ban-can-biet-khi-bat-dau4dbZNq1mKYM [9] GeekRank, Build RESTful API with Nodejs, Express and MySQL | Node MySQL RESTful API Crash Course | CURD API, https://www.youtube.com/watch?v=zgQqgNvKH0 [10] Bezckoder, Node.js Express: JWT example | Token Based Authentication & Authorization,https://www.bezkoder.com/node-js-jwt-authentication-mysql/, 08/12/2021 [11] Nguyen Duc Hoang, Tự học React Native v0.49, 116 Tài liệu tham khảo https://www.youtube.com/watch?v=kNHuLOXR5T0&list=PLWBrqglnjNl31S91FFE63D tuRc9v9LSGl [12] Fgnievinski, Haversine formula, https://en.wikipedia.org/wiki/Haversine_formula, 02/05/2022 117