Bối cảnh và vấn đề nghiên cứu

Trong bối cảnh cuộc Cách mạng Công nghiệp 4.0 phát triển mạnh mẽ, nhu cầu số hóa thông tin và giao dịch trực tuyến trong ngành du lịch ngày càng gia tăng. Khảo sát thực tế của tác giả cho thấy phần lớn các trang web du lịch hiện nay được xây dựng độc lập cho từng công ty lữ hành lớn (chẳng hạn như Mytour), trong khi các công ty lữ hành vừa và nhỏ gặp nhiều khó khăn trong việc xây dựng hệ thống riêng để quảng bá tour và tìm kiếm khách hàng. Về phía người dùng, việc tìm kiếm, so sánh giá cả và chất lượng dịch vụ giữa nhiều đơn vị lữ hành đòi hỏi phải truy cập thủ công vào từng trang web riêng lẻ, gây bất tiện và tốn thời gian.

Xuất phát từ thực tiễn trên, đề tài "Xây dựng website kết nối các công ty du lịch theo hướng Single Page Application" được thực hiện nhằm giải quyết bài toán kết nối trung gian giữa khách du lịch và nhiều công ty lữ hành trên một nền tảng tập trung.

Mục tiêu tổng quát của đề tài là xây dựng một website theo kiến trúc ứng dụng đơn trang (Single Page Application - SPA) hỗ trợ các chức năng chính:

  • Cho phép khách hàng tìm kiếm tour hoặc công ty du lịch phù hợp cho chuyến đi.
  • Cho phép các công ty du lịch đăng tải thông tin quảng bá về doanh nghiệp và các gói tour.
  • Cung cấp tính năng lưu trữ các tour hoặc công ty du lịch mà người dùng quan tâm.
  • Hỗ trợ người dùng gửi đánh giá, phản hồi sau khi trải nghiệm dịch vụ.
  • Thiết lập cơ chế đăng ký nhận thông báo qua email khi có tour hoặc nhu cầu phù hợp.

Nhiệm vụ nghiên cứu cụ thể của đề tài bao gồm:

  1. Tìm hiểu các khái niệm, quy trình nghiệp vụ liên quan đến việc đăng tin và tìm kiếm tour du lịch.
  2. Khảo sát yêu cầu thực tế của người dùng và các công ty lữ hành đối với cổng thông tin du lịch.
  3. Phân tích và thiết kế hệ thống theo phương pháp hướng đối tượng, sử dụng ngôn ngữ mô hình hóa UML.
  4. Lập trình và cài đặt thử nghiệm hệ thống sử dụng Vue.js (phía FrontEnd) và Laravel (phía BackEnd) theo mô hình MVC.

Đối tượng và phạm vi nghiên cứu:

  • Đối tượng nghiên cứu: Hệ thống website kết nối và chia sẻ thông tin tour du lịch giữa khách hàng và các công ty lữ hành.
  • Phạm vi nghiên cứu: Mô hình áp dụng cho 3 nhóm đối tượng gồm quản trị viên hệ thống (Admin), đại diện các công ty lữ hành và khách du lịch tại thị trường Việt Nam.

Cơ sở lý thuyết và phương pháp tiếp cận

Khung lý thuyết và công nghệ sử dụng

Đề tài dựa trên nền tảng kỹ thuật công nghệ phần mềm hiện đại và phương pháp phát triển hệ thống thông tin:

  • Phân tích và thiết kế hướng đối tượng (OOA & OOD): Sử dụng các nguyên lý hướng đối tượng để mô hình hóa các thực thể thực tế thành các lớp (classes), xác định thuộc tính, phương thức và quan hệ kế thừa/phụ thuộc.
  • Ngôn ngữ mô hình hóa thống nhất (UML): Công cụ trực quan hóa hệ thống thông qua biểu đồ ca sử dụng (Use Case Diagram), biểu đồ tuần tự (Sequence Diagram), biểu đồ hoạt động (Activity Diagram) và biểu đồ thành phần (Component Diagram).
  • Kiến trúc Model - View - Controller (MVC): Tách biệt ứng dụng thành ba thành phần: Model (xử lý dữ liệu và truy vấn cơ sở dữ liệu), View (giao diện hiển thị cho người dùng), và Controller (tiếp nhận request, điều phối dữ liệu giữa Model và View).
  • Kiến trúc Single Page Application (SPA): Sử dụng JavaScript để cập nhật động nội dung trang web mà không cần tải lại toàn bộ trang, giúp tối ưu tốc độ phản hồi và trải nghiệm người dùng.

Công nghệ phát triển hệ thống

  • BackEnd: Ngôn ngữ PHP kết hợp Framework Laravel 7.x (sử dụng Eloquent ORM, hệ thống Routing và các cơ chế quản lý dữ liệu).
  • FrontEnd: Ngôn ngữ JavaScript kết hợp Framework Vue.js (Vue-CLI, Vue Router, Vuex, Vue DevTools) và thư viện Bootstrap để xây dựng giao diện.
  • Cơ sở dữ liệu: Hệ quản trị cơ sở dữ liệu quan hệ MySQL.
  • Môi trường máy chủ cục bộ: XAMPP phiên bản 7.2.7 (tích hợp Apache, PHP 7, MySQL, phpMyAdmin).

Phân tích và thiết kế hệ thống

Phân quyền và ca sử dụng hệ thống

Hệ thống phân định rõ ràng quyền hạn giữa các nhóm tác nhân (Actors):

Nhóm tác nhân Chức năng và quyền hạn
Khách du lịch (User thường) Đăng ký, đăng nhập (hệ thống/Facebook/Gmail), xem danh sách tour, xem chi tiết bài đăng, tìm kiếm/lọc tour, lưu tour quan tâm, bình luận/đánh giá dịch vụ công ty, cập nhật hồ sơ cá nhân.
Công ty lữ hành Toàn bộ quyền của người dùng cơ bản; bổ sung quyền tạo hồ sơ công ty, đăng tải thông tin tour mới, cập nhật/sửa/xóa bài đăng của chính công ty mình, phản hồi đánh giá của khách hàng.
Quản trị viên (Admin) Xác thực thông tin đăng ký của các công ty (qua email/điện thoại), quản lý danh sách người dùng, quản lý danh sách tin đăng, xóa tài khoản/bài viết vi phạm, xuất báo cáo thống kê theo ngày/tháng/năm.

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

Hệ thống được thiết kế gồm 6 bảng thực thể chính để lưu trữ dữ liệu nghiệp vụ:

Tên bảng Các trường dữ liệu (Thuộc tính) Khóa chính / Ràng buộc
tblDangky ID (Bigint), Email (Varchar 255), Password (Varchar 255), companyname (Varchar 255, Nullable), Firstname (Varchar 255), Lastname (Varchar 255), Tel (Integer) ID (Khóa chính), các trường bắt buộc không rỗng
tblDangnhap ID (Bigint), Email (Varchar 255), Password (Varchar 255), Remember_Token (Varchar 110) ID (Khóa chính)
tblUser ID (Bigint), Email (Varchar 255), Password (Varchar 255), companyname (Varchar 255, Nullable), Firstname (Varchar 255), Lastname (Varchar 255), Tel (Integer), Remember_Token (Varchar 110) ID (Khóa chính)
tblVaitro ID (Bigint), Role (BIT) ID (Khóa chính), phân định vai trò người dùng
tblBinhluan ID (Bigint), content (Varchar 255), Remember_Token (Varchar 110) ID (Khóa chính)
tblBaidang ID (Bigint), Name (Varchar 255), Branch (Varchar 255), Begin (Varchar 255), Price (Integer), Tel (Integer), Content (Varchar 255) ID (Khóa chính)

Cài đặt và triển khai thực nghiệm

Quy trình khởi chạy hệ thống

  1. Phía BackEnd (Laravel):
    • Khởi động bảng điều khiển XAMPP Control Panel để bật dịch vụ Apache và MySQL.
    • Mở thư mục mã nguồn BackEnd trong môi trường dòng lệnh (Terminal / VS Code).
    • Chạy lệnh khởi tạo máy chủ phát triển: 
      php artisan serve
  2. Phía FrontEnd (Vue.js):
    • Mở thư mục mã nguồn FrontEnd trên Terminal / VS Code.
    • Khởi chạy ứng dụng Vue.js bằng lệnh: 
      npm run serve
    • Truy cập giao diện ứng dụng thông qua trình duyệt web tại địa chỉ: http://localhost:8080.

Giao diện và luồng tương tác thực tế

  • Màn hình Đăng ký / Đăng nhập: Cho phép người dùng tùy chọn vai trò (Khách du lịch hoặc Công ty lữ hành) với các trường thông tin tương ứng, đồng thời hỗ trợ ghi nhớ phiên đăng nhập.
  • Trang chủ và Trang danh sách: Hiển thị danh sách các bài đăng về tour, banner giới thiệu tiếp cận khách hàng tiềm năng, danh sách khách sạn và các địa điểm được ưa chuộng (như Đà Nẵng, Hải Châu).
  • Trang Đăng tin & Quản lý: Dành riêng cho tài khoản doanh nghiệp để tải tệp hình ảnh (Logo/ảnh tour), nhập điểm khởi hành, giá tour, số điện thoại liên hệ và nội dung mô tả chi tiết.
  • Trang Chi tiết tour & Hồ sơ cá nhân: Hiển thị toàn bộ thông tin gói dịch vụ, giá tiền, thông tin công ty lữ hành và cho phép chỉnh sửa thông tin cá nhân.

Nội dung chính theo từng chương

Mở đầu

Giới thiệu tính cấp thiết của đề tài, mục tiêu tổng quát, 4 nhiệm vụ nghiên cứu cụ thể và cấu trúc tổng quan gồm 4 chương của chuyên đề tốt nghiệp.

Chương I: Tổng quan về đề tài

Trình bày chi tiết bối cảnh ứng dụng công nghệ 4.0 vào ngành du lịch, phân tích thực trạng các website du lịch hiện hành, xác định đối tượng phục vụ và phạm vi hoạt động của hệ thống. Đồng thời, tác giả khảo sát các nghiệp vụ điển hình từ các nền tảng thực tế (như Mytour), chỉ ra các điểm hạn chế trong việc liên kết đa doanh nghiệp, từ đó xây dựng các yêu cầu chức năng, yêu cầu phi chức năng và yêu cầu giao diện cho hệ thống website mới.

Chương II: Cơ sở lý thuyết

Trình bày các kiến thức nền tảng phục vụ phân tích, thiết kế và phát triển phần mềm:

  • Phương pháp phân tích hướng đối tượng (OOA), thiết kế hướng đối tượng (OOD) và ngôn ngữ mô hình hóa UML.
  • Kiến trúc phần mềm MVC, phân tích ưu điểm về tính module hóa, khả năng bảo trì và nhược điểm về thời gian thiết lập ban đầu.
  • Tổng quan về PHP, Framework Laravel 7.x, Vue.js, Vue-CLI và môi trường máy chủ XAMPP 7.2.7.

Chương III: Phân tích và thiết kế hệ thống

Đây là nội dung trọng tâm của đồ án, tập trung vào:

  • Xây dựng biểu đồ Use Case tổng quát và các biểu đồ Use Case phân rã (cập nhật hồ sơ, cập nhật tour).
  • Đặc tả chi tiết 11 luồng sự kiện chính và phụ (đăng ký, đăng nhập thường/Facebook, đăng xuất, tìm kiếm, lưu tour, cập nhật hồ sơ, đăng bài, bình luận, phản hồi, quản trị người dùng/bài đăng, xuất báo cáo).
  • Xây dựng hệ thống biểu đồ tuần tự (Sequence Diagrams) và biểu đồ hoạt động (Activity Diagrams) cho từng chức năng.
  • Mô hình hóa thực thể liên kết (ERD) và thiết kế chi tiết cấu trúc 6 bảng dữ liệu trong MySQL.
  • Thiết kế mẫu giao diện (Wireframes/Mockups) cho các trang chức năng.

Chương IV: Cài đặt và giới thiệu sản phẩm

Mô tả các bước cấu hình, cài đặt môi trường và câu lệnh vận hành mã nguồn BackEnd (php artisan serve) và FrontEnd (npm run serve). Trình bày ảnh chụp màn hình giao diện thực tế của hệ thống sau khi triển khai, bao gồm các trang đăng ký, đăng nhập, trang chủ, hồ sơ cá nhân, đăng bài và xem chi tiết tour du lịch.

Kết quả và đóng góp của đề tài

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

  • Hoàn thành việc khảo sát, phân tích và mô hình hóa thành công hệ thống kết nối công ty du lịch bằng các công cụ hướng đối tượng chuẩn UML.
  • Xây dựng thành công ứng dụng web theo mô hình Single Page Application (SPA), tích hợp hoàn chỉnh hai nền tảng công nghệ: Laravel 7 đóng vai trò RESTful API/BackEnd và Vue.js đóng vai trò FrontEnd.
  • Hiện thực hóa các tính năng nghiệp vụ cốt lõi: phân loại tài khoản (khách/công ty), đăng ký, đăng nhập, đăng tin tour du lịch, tìm kiếm thông tin và xem chi tiết tour.

Đóng góp thực tiễn

  • Đưa ra giải pháp xây dựng cổng thông tin tập trung, giúp các doanh nghiệp lữ hành quy mô vừa và nhỏ tiếp cận khách hàng mà không cần đầu tư chi phí lớn xây dựng website độc lập.
  • Giúp người dùng tiết kiệm thời gian so sánh giá cả và lựa chọn dịch vụ tour từ nhiều nhà cung cấp khác nhau trên cùng một nền tảng.

Hạn chế và hướng phát triển

Hạn chế được ghi nhận

Theo đánh giá của tác giả tại phần kết luận, đồ án còn tồn tại một số hạn chế do giới hạn về mặt thời gian và kinh nghiệm thực tế:

  • Hệ thống phân quyền người dùng chưa đạt mức độ bảo mật tuyệt đối.
  • Module quản lý người dùng phía quản trị viên chưa hoàn chỉnh.
  • Website chưa tích hợp tính năng đặt tour (booking) và thanh toán trực tuyến trực tiếp trên hệ thống (hiện tại người dùng chỉ xem thông tin và liên hệ qua số điện thoại/website riêng của công ty lữ hành).
  • Giao diện người dùng cần tiếp tục được tinh chỉnh để nâng cao tính thẩm mỹ.
  • Các chức năng nâng cao như xuất báo cáo thống kê, lưu trữ tour yêu thích và theo dõi công ty quan tâm chưa được hoàn thiện toàn diện.

Hướng phát triển trong tương lai

  • Hoàn thiện triệt để các chức năng còn thiếu: xuất báo cáo, lưu tour quan tâm và xây dựng luồng đặt tour trực tiếp.
  • Nâng cấp và tối ưu lại giao diện người dùng theo hướng hiện đại, thân thiện hơn.
  • Bổ sung các gói dịch vụ quảng cáo trả phí dành cho các công ty du lịch có nhu cầu nổi bật bài đăng trên website.
  • Tối ưu hóa mã nguồn và nâng cao tính năng bảo mật để phục vụ vận hành thực tế.

Giá trị tham khảo

Tài liệu chuyên đề tốt nghiệp này là nguồn tham khảo hữu ích cho:

  • Sinh viên ngành Công nghệ Thông tin, Hệ thống Thông tin Quản lý: Tham khảo phương pháp phân tích thiết kế hệ thống phần mềm hướng đối tượng sử dụng UML (từ Use Case, Sequence Diagram, Activity Diagram đến thiết kế CSDL).
  • Lập trình viên web định hướng Full-stack: Tham khảo mô hình phân tách độc lập giữa BackEnd (Laravel Framework) và FrontEnd (Vue.js theo kiến trúc SPA).
  • Người nghiên cứu các nền tảng thương mại dịch vụ du lịch: Tham khảo quy trình khảo sát nghiệp vụ và xây dựng các chức năng phân loại người dùng trong cổng thông tin trung gian.

Câu hỏi thường gặp

Đề tài sử dụng kiến trúc và công nghệ gì để phát triển website?

Website được xây dựng theo kiến trúc Single Page Application (SPA) và mô hình MVC. Phía BackEnd sử dụng ngôn ngữ PHP với Laravel Framework (phiên bản 7.x) kết hợp hệ quản trị CSDL MySQL; phía FrontEnd sử dụng ngôn ngữ JavaScript với Vue.js Framework (kết hợp Vue-CLI, Vue Router, Vuex) và Bootstrap.

Hệ thống phân loại những nhóm người dùng nào và sự khác biệt về quyền hạn là gì?

Hệ thống phân loại thành 3 nhóm người dùng:

  1. Khách du lịch: Được đăng ký, đăng nhập, tìm kiếm tour, xem chi tiết bài đăng, lưu tour, bình luận và cập nhật hồ sơ cá nhân.
  2. Công ty lữ hành: Có toàn bộ quyền của khách du lịch, kèm theo quyền đăng bài giới thiệu tour, chỉnh sửa/xóa bài đăng của công ty mình và phản hồi ý kiến khách hàng.
  3. Quản trị viên (Admin): Xác thực thông tin công ty đăng ký, quản lý người dùng, kiểm duyệt bài đăng và xuất báo cáo.

Hệ thống cơ sở dữ liệu của đồ án gồm những bảng nào?

Cơ sở dữ liệu của hệ thống được thiết kế gồm 6 bảng thực thể: tblDangky, tblDangnhap, tblUser, tblVaitro, tblBinhluan và tblBaidang.

Các câu lệnh chính để khởi chạy hệ thống trong môi trường thử nghiệm là gì?

Để chạy hệ thống trên môi trường máy chủ cục bộ (Localhost):

  • BackEnd: Chạy lệnh php artisan serve thông qua Terminal sau khi đã khởi động Apache và MySQL trên XAMPP.
  • FrontEnd: Chạy lệnh npm run serve thông qua Terminal và truy cập vào địa chỉ http://localhost:8080.

Website đã hỗ trợ đặt tour trực tuyến trực tiếp trên hệ thống chưa?

Chưa. Theo báo cáo của tác giả, website hiện mới dừng lại ở việc cung cấp thông tin, bảng giá, mô tả chi tiết tour và số điện thoại liên hệ; tính năng book tour trực tiếp trên website là một trong những hạn chế và được đưa vào định hướng phát triển trong tương lai.

Kết luận

Chuyên đề tốt nghiệp "Xây dựng website kết nối các công ty du lịch theo hướng Single Page Application" của sinh viên Nguyễn Tiến Dũng (Trường Đại học Kinh tế Quốc dân) đã hoàn thành mục tiêu xây dựng một nền tảng web kết nối thông tin giữa du khách và các đơn vị lữ hành. Đồ án áp dụng bài bản quy trình công nghệ phần mềm từ khảo sát nghiệp vụ, phân tích thiết kế hệ thống bằng UML đến triển khai thực tế trên nền tảng Vue.js và Laravel. Mặc dù còn một số hạn chế về tính năng đặt tour trực tiếp và giao diện quản trị, tài liệu đã cung cấp đầy đủ bức tranh kỹ thuật và đóng vai trò là một tài liệu tham khảo có giá trị trong việc xây dựng các ứng dụng web SPA hiện đại.