Xây dựng trang website đặt phòng khách sạn

TỔNG QUAN

Lý do chọn đề tài

Trong bối cảnh cuộc sống hiện đại với nhu cầu di chuyển cao cho công việc và du lịch, dịch vụ lưu trú như nhà nghỉ, khách sạn và homestay trở nên thiết yếu Để đáp ứng nhu cầu này, chúng tôi quyết định xây dựng một trang web đặt phòng lưu trú, nhằm phục vụ những người có nhu cầu Trang web sẽ giúp chủ sở hữu chuỗi khách sạn quảng bá dịch vụ, thu hút khách hàng và cho phép người dùng thực hiện việc đặt phòng trực tuyến một cách đơn giản và nhanh chóng, từ đó gia tăng doanh thu cho chuỗi khách sạn.

Khảo sát hiện trạng

Ngành khách sạn tại Việt Nam đang phát triển nhanh chóng với sự xuất hiện của nhiều khách sạn và resort năm sao, đáp ứng nhu cầu lưu trú của du khách trong và ngoài nước Sự cạnh tranh trong lĩnh vực này đang gia tăng, buộc các khách sạn phải đa dạng hóa chi nhánh và xây dựng các chính sách ưu đãi hấp dẫn Việc cung cấp các dịch vụ tiện lợi sẽ giúp thu hút thêm khách hàng, từ đó tăng doanh thu và cải thiện vị thế của doanh nghiệp trên thị trường.

1.2.1 Trang web https://www.vinpearl.com/

Vinpearl là thương hiệu hàng đầu trong lĩnh vực dịch vụ du lịch nghỉ dưỡng và giải trí tại Việt Nam, sở hữu chuỗi khách sạn, resort và trung tâm hội nghị cao cấp Sau 15 năm phát triển, Vinpearl đã có 43 cơ sở với hơn 17.000 phòng trên toàn quốc và dự kiến sẽ mở rộng quy mô tại Việt Nam cũng như quốc tế trong tương lai.

Hình 1 1 Giao diện trang chủ của trang web – 1

Hình 1 2Giao diện trang chủ của trang web – 2

Hình 1 3Kết quả tìm kiếm hiển thị danh sách các chi nhánh theo điểm đến

Hình 1 4 Trang hiển thị danh sách các phòng theo chi nhánh

Hình 1 5 Trang nhập thông tin người đặt phòng và người lưu trú

Hình 1 6 Các phương thức thanh toán mà trang web cung cấp Ưu điểm:

Trang web sở hữu giao diện sinh động và thiết kế trực quan thân thiện với người dùng Nó cung cấp đầy đủ thông tin cần thiết cho khách hàng, bao gồm giới thiệu về khách sạn và các chương trình ưu đãi hấp dẫn.

- Khung tìm kiếm phòng được thiết kế rõ ràng, dễ sử dụng Hiển thị các kết quả tìm kiếm có hệ thống rõ ràng, trực quan

Quá trình đặt phòng trên trang web được tối ưu hóa với các bước cụ thể, giúp người dùng dễ dàng thực hiện thao tác ngay cả khi lần đầu sử dụng Trang web cũng cung cấp nhiều hình thức thanh toán đa dạng, mang lại sự thuận tiện cho người dùng.

Hình 1 7 Khung tìm kiếm phòng của trang web vinpearl.com

Nhược điểm: Thời gian truy xuất thông tin phòng lâu, gây ảnh hưởng đến trải nghiệm người dùng

Hình 1 8 Trang web phản hồi chậm

1.2.2 Trang web https://www.sixsenses.com/

Sixsense là thương hiệu hàng đầu trong ngành khách sạn và khu nghỉ dưỡng cao cấp, với hàng triệu lượt khách mỗi năm Thương hiệu này có nhiều chi nhánh trên toàn cầu, bao gồm cả Việt Nam, mang đến trải nghiệm nghỉ dưỡng đẳng cấp và dịch vụ tận tâm cho du khách.

Chương 1: Tổng quan 7 tên không xa lạ gì với các khách hàng có nhu cầu trải nghiệm các dịch vụ lưu trú, nghĩ dưỡng đạt chuẩn năm sao

Hình 1 9 Giao diện trang chủ của trang web

Hình 1 10 Hình khung tìm kiếm thông tin phòng của trang web

Hình 1 11 Hình trang hiển thị kết quả tìm kiếm phòng

Hình 1 12 Trang nhập thông tin người đặt phòng

Hình 1 13 Hình trang nhập thông tin phương thức thanh toán Ưu điểm:

- Thiết kế theo phong cách sang trọng, tối giản, phù hợp với đối tượng là khách du lịch thượng lưu, khách du lịch quốc tế

- Thiết kế các bước tìm kiếm phòng và đặt phòng một cách đơn giản, tường minh, thân thiện với người dùng

- Phương thức thanh toán đa dạng

- Việc tối giản trong thiết kế và sử dụng màu sắc (trắng, đen, tím) làm cho cái nhìn tổng quan trang web có phần kém sinh động, bắt mắt.

Mục tiêu đề tài

Tìm hiểu và nắm được nghiệp vụ của các trang web đặt phòng của các chuỗi khách sạn

Tìm hiểu công nghệ Vuejs version 2.x

Nghiên cứu và vận dụng Spring Restful API

Vận dụng những gì tìm hiểu nghiên cứu được vào việc xây dựng website đặt phòng khách sạn

CƠ SỞ LÝ THUYẾT

Tổng quan về REST và RESTful API

API (Giao diện lập trình ứng dụng) là một bộ quy tắc và cơ chế cho phép các ứng dụng tương tác, kết nối và thực hiện các thao tác truy xuất hoặc cập nhật dữ liệu.

Hình 2 1 Vị trí của API trong luồng giao tiếp của ứng dụng

REST (Representational State Transfer) was first introduced in 2000 in Thomas Fielding's doctoral dissertation as a set of constraints and conventions for system architecture.

RESTful API là việc áp dụng các tiêu chuẩn và nguyên tắc của REST trong thiết kế và xây dựng API, nhằm quản lý các thao tác liên quan đến tài nguyên ứng dụng một cách hiệu quả.

Hình 2 2 Thiết kế REST API

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

Khi một hệ thống đảm bảo các ràng buộc REST thì có thể gọi là RESTful Các ràng buộc REST bao gồm:

Kiến trúc client-server: Ứng dụng REST nên có kiến trúc Client-Server Trong đó

Client là nơi gửi yêu cầu thao tác với tài nguyên Server là nơi lưu trữ các tài nguyên

Client và server sẽ được phát triển một cách độc lập, trong đó client không cần nắm rõ logic kinh doanh, trong khi server không cần quan tâm đến giao diện người dùng.

Hình 2 3 Kiến trúc client-sever của REST

Stateless (phi trạng thái) là mô hình mà trong đó server và client không lưu trữ bất kỳ trạng thái nào của nhau trong suốt phiên làm việc Điều này giúp máy chủ không cần duy trì và cập nhật các trạng thái làm việc Mỗi yêu cầu (request) sẽ chứa đầy đủ thông tin cần thiết như query params, header và URI Tuy nhiên, điều này có thể trở thành một hạn chế khi client cần gửi một lượng lớn dữ liệu về server, dẫn đến việc tiêu tốn nhiều băng thông.

Cacheability là khả năng lưu trữ các phản hồi từ server, giúp giảm thời gian xử lý Để đảm bảo độ chính xác và tránh sai lệch do trùng lặp, mỗi request tương ứng với từng phản hồi cần phải có tính duy nhất.

Hệ thống phân lớp (layered system) được tổ chức thành nhiều lớp như repository, service và controller, giúp tách biệt các thành phần trong hệ thống Cấu trúc này không chỉ tạo điều kiện cho việc mở rộng mà còn hỗ trợ phát triển hệ thống một cách dễ dàng Mỗi lớp chỉ tương tác với lớp ngay trên hoặc dưới nó, đảm bảo tính linh hoạt và quản lý hiệu quả.

Hình 2 4 Ví dụ về cách thức phân lớp hệ thống trong REST

Giao diện đồng nhất (uniform interface) là yếu tố quyết định sự khác biệt giữa REST API và non-REST API Ràng buộc này yêu cầu các nhà thiết kế phải xây dựng cách giao tiếp giữa các ứng dụng theo một tiêu chuẩn nhất định, đảm bảo rằng cả nền tảng web lẫn di động đều có thể truy cập một cách dễ dàng.

Việc thiết lập các quy ước chuẩn trong giao tiếp giữa các thành phần trong hệ thống đã tạo điều kiện thuận lợi cho việc truy cập tài nguyên trên server Điều này đã dẫn đến sự phát triển của nhiều API dựa trên kiến trúc REST.

Requests are sent from the Client to the Server in the form of web URLs using methods such as HTTP GET, POST, PUT, and DELETE, which correspond to CRUD operations: creating, reading, updating, and deleting data The Server then responds with data in formats such as HTML, XML, Image, or JSON Currently, JSON is the most common data format returned in web service design.

Hình 2 5 Cách thức hoạt động của REST API

Hiệu năng (Performance): Sử dụng REST trong thiết kế giúp tăng hiệu năng của hệ thống

Tính khả biến (Modifiability) là yếu tố quan trọng trong các hệ thống yêu cầu thay đổi tài nguyên liên tục Việc áp dụng REST với các yêu cầu đơn giản sẽ giúp quá trình thực hiện các thay đổi trở nên dễ dàng và hiệu quả hơn.

Tính mở rộng (Scalability): nhờ vào ràng buộc Layered system chi hệ thống thành nhiều lớp nhỏ giúp cho hệ thống dễ dàng mở rộng hơn

Tính linh hoạt (Portability) của hệ thống được nâng cao nhờ việc chuẩn hóa giao diện (Uniform Interface), cho phép ứng dụng hoạt động hiệu quả trên nhiều nền tảng khác nhau như di động và web.

Trong sáng (Visibility): Các request rõ ràng, dễ hiểu Đơn giản (Simplicity): cách thức xây dựng rất đơn giản

Tính tin cậy (Realiability): khó để xảy ra lỗi trong giao tiếp giữa các thành phần trong hệ thống

So với SOAP (Simple Object Access Protocol) thì API có phần kém hơn về độ bảo mật

Do tính chất Stateless, trạng thái giữa client và server không được lưu trữ, dẫn đến việc tiêu tốn tài nguyên hệ thống khi khối lượng thông tin cần truyền tải lớn.

Chỉ hoạt động dựa trên giao thức HTTP.

Tổng quan về framework Vuejs

2.2.1 Giới thiệu về framework Vuejs

Vue.js là một framework JavaScript mạnh mẽ, cung cấp nhiều công cụ tùy chọn để xây dựng giao diện người dùng tương tác Về mặt kỹ thuật, Vue.js áp dụng mô hình MVVM (Model View View Model), tập trung vào việc kết nối giữa dữ liệu và giao diện một cách hiệu quả.

Lớp ViewModel trong mẫu MVVM đóng vai trò quan trọng trong việc kết nối View và Model thông qua các ràng buộc dữ liệu hai chiều Các thao tác DOM thực tế và định dạng đầu ra được trừu tượng hóa, giúp đơn giản hóa quá trình phát triển ứng dụng.

Vue.js là một công cụ mạnh mẽ giúp kết nối nhanh chóng với các API, không phải là một framework đầy đủ mà là một giải pháp linh hoạt để xây dựng lớp view đơn giản, phù hợp cho việc phát triển giao diện một cách nhanh chóng.

Hình 2 6 Mô hình MVVM trong Vuejs

Kích thước nhỏ gọn là yếu tố quan trọng quyết định tỷ lệ thành công của các framework JavaScript Framework có kích thước nhỏ sẽ mang lại nhiều tiện ích hơn cho người dùng Cụ thể, kích thước của Vue.js chỉ khoảng 18–21KB, giúp người dùng tải xuống và sử dụng nhanh chóng mà không tốn nhiều thời gian.

Vue.js là một framework dễ dàng để học và áp dụng trong phát triển ứng dụng Với cấu trúc đơn giản, người dùng có thể tích hợp Vue.js vào dự án website hiện tại một cách nhanh chóng Framework này hỗ trợ phát triển cả ứng dụng quy mô nhỏ và lớn Sự đơn giản trong cấu trúc của Vue.js cũng giúp người dùng dễ dàng nhận diện và khắc phục lỗi khi gặp vấn đề trong mã nguồn.

Vue.js là một framework phổ biến trong giới phát triển web nhờ vào khả năng tích hợp dễ dàng với các ứng dụng hiện có Sự tiện lợi này đến từ việc Vue.js được xây dựng trên nền tảng JavaScript, cho phép tích hợp một cách đơn giản vào các ứng dụng đã được phát triển bằng JavaScript.

Tài liệu chi tiết: hệ thống tài liệu về Vue.js đầy đủ và toàn diện giúp cho người học dễ tìm hiểu và tiếp cận

Vue.js mang đến tính linh hoạt cao, cho phép người dùng viết mẫu trực tiếp trong các tệp HTML Điều này không chỉ giúp các developer dễ dàng tiếp cận mà còn làm cho việc phát triển với các framework JavaScript khác như React.js và Angular.js trở nên dễ hiểu hơn.

Giao tiếp hai chiều trong Vue.js được hỗ trợ nhờ kiến trúc MVVM, giúp việc xử lý các khối HTML trở nên dễ dàng và hiệu quả.

Vuejs mặc dù có thể áp dụng vào các dự án lớn như không phù hợp

Mặc dù Vue.js ra đời muộn hơn so với các framework khác như React.js, nhưng sự phổ biến của nó vẫn đang gia tăng Tuy nhiên, do cộng đồng người dùng còn nhỏ, việc tìm kiếm hỗ trợ khi gặp vấn đề vẫn gặp một số khó khăn.

Tổng quan về Spring Framework

2.3.1 Giới thiệu về Spring Framework

Spring là một framework phổ biến trong cộng đồng lập trình viên Java, được sử dụng rộng rãi để phát triển các ứng dụng Java, đặc biệt là ứng dụng Web.

Spring Framework là một công cụ nhẹ, lý tưởng cho việc phát triển ứng dụng hiệu năng cao Nó cung cấp các tính năng giúp nhà phát triển thiết kế ứng dụng với khả năng tái sử dụng mã nguồn cao và hỗ trợ kiểm thử dễ dàng thông qua module Test của Spring.

Hình 2 7 Các modules và kiến trúc của Spring Framework

2.3.2 Ưu điểm của Spring Framework

Spring Framework cung cấp các template cho công nghệ như JDBC, Hibernate và JPA, giúp thao tác với cơ sở dữ liệu dễ dàng hơn Nhờ đó, lượng code cần viết được giảm đáng kể, vì Spring đã tối ưu hóa các bước cơ bản của những công nghệ này.

Spring Framework có tính loose coupling (liên kết lỏng lẻo) nhờ vào tính chất

Dependecy Injection Cũng nhờ vào tính chất này mà các ứng dụng Spring được phát triển nhanh chóng và dễ dàng kiểm thử hơn

Spring gọn nhẹ, Spring Framework không bắt buộc lập trình viên phải kế thừa bất kì lớp hoặc implement interface nào

Spring hỗ trợ cho nhà phát triển nhiều tính năng khác như: caching, validation, transactions, formatting,…

2.3.3 Spring Boot và Spring MVC

Bảng 2 1 So sánh Spring Boot và Spring MVC

Spring Boot là một module của Spring giúp xây dựng và đóng gói ứng dụng dễ dàng

Spring MVC là một framework web dựa trên mô hình Model-View-Controller sử dụng Spring framework

Cung cấp các cấu hình mặc định giúp dể dàng khởi tạo nên một dự án sử dụng

Cung cấp các tính năng để xây dựng nên một ứng dụng web

Nhà phát triển không cần phải cấu hình thủ công

Không cung cấp các cấu hình mặc định, nhà phát triển phải cấu hình thủ công Tốn ít thời gian để tạo và phát triển sản phẩm

Cần nhiều thời gian hơn cho việc tạo và phát triển sản phẩm

Tích hợp môi trường deploy bên ngoài là không bắt buộc vì Spring boot có tích hợp sẵn một server apache để deploy ứng dụng

 Run on Spring Boot App

Cần phải bắt buộc cài đặt và tích hợp môi trường deploy bên ngoài để chạy sản phẩm

Chương 3: Phân tích và mô hình hóa yêu cầu 18

Chương 3: PHÂN TÍCH VÀ MÔ HÌNH HÓA YÊU CẦU

Bảng 3 1 Yêu cầu người dùng

# Tiêu đề Tóm tắt yêu cầu

Giao diện của trang web được thiết kế đơn giản, sinh động và thân thiện với người dùng, giúp người truy cập dễ dàng làm quen và sử dụng ngay cả khi lần đầu tiên ghé thăm.

2 Các chức năng cơ bản phía khách hàng

Có các chức năng của một trang web đặt phòng khách sạn như: tìm kiếm thông tin chi nhánh, thông tin phòng, đặt phòng, thanh toán

Hệ thống quản lý khách sạn cung cấp các chức năng thiết yếu cho người quản lý, cho phép theo dõi và quản lý thông tin quan trọng như thông tin phòng, thông tin khách hàng và thông tin đặt phòng.

4 Các chức năng cho nhân viên lễ tân

Cung cấp các chức năng cho nhân viên như xem thông tin đặt phòng của khách hàng, xuất hóa đơn dựa trên thông tin đặt phòng của khách

5 Tích hợp thanh toán trực tuyến Tích hợp chức năng thanh toán bằng

PayPal cho trang web, hỗ trợ thao tác đặt phòng của khách hàng được nhanh chóng

Cho phép khách hàng đăng nhập vào trang web thông qua tài khoản facebook và tài khoản google

3.2.1 Các tác nhân trong hệ thống

Bảng 3 2 Mô tả các tác nhân

Khách hàng không đăng ký tài khoản vẫn có thể sử dụng tất cả các chức năng mà trang web cung cấp, bao gồm việc tìm kiếm thông tin về các chi nhánh và phòng Tuy nhiên, họ không thể thực hiện các chức năng như đặt phòng và thanh toán.

Chương 3: Phân tích và mô hình hóa yêu cầu 19 toán, quản lí thông tin tài khoản cá nhân, nhận các ưu đãi từ khách sạn

2 User (Khách hàng có đăng kí tài khoản trong hệ thống)

Khách hàng có thể tận hưởng đầy đủ các chức năng như đặt phòng, thanh toán, quản lý thông tin cá nhân và nhận các ưu đãi (nếu có) Tuy nhiên, họ không có quyền truy cập vào trang admin hoặc trang dành cho nhân viên.

Nhân viên sẽ có quyền truy cập vào các chức năng quản lý, bao gồm quản lý thông tin tài khoản cá nhân, quản lý thông tin đặt phòng, và quản lý danh sách cũng như xuất hóa đơn.

4 Người quản lí (Admin) Là tác nhân có quyền cao nhất được phép thực thi toàn bộ chức năng quản lí trong hệ thống

3.2.2 Chức năng của các tác nhân

Bảng 3 3 Chức năng của các tác nhân

4 Tìm kiếm thông tin chi nhánh x x

5 Tìm kiếm thông tin phòng x x

9 Quản lí thông tin tài khoản cá nhân x

10 Đăng nhập vào hệ thống x x

11 Quản lí thông tin đặt phòng x x

12 Quản lí thông tin hóa đơn x x

14 Quản lí tài khoản hệ thống x

15 Quản lí thông tin khách hàng x

16 Quản lí thông tin nhân viên trong khách sạn x

17 Quản lí thông tin các chi nhánh trong khách sạn x

18 Quản lí thông tin các phòng trong hệ thống x

19 Quản lí thông tin dịch vụ trong hệ thống x

20 Quản lí thông tin giường trong khách sạn x

Hình 3 1 Lược đồ chức năng của hệ thống

Bảng 3 4 Chi tiết lược đồ chức năng

UC01 Đăng kí tài khoản Đăng kí tài khoản người dùng

UC02 Đăng nhập trang chủ Đăng nhập vào trang chủ của website

UC03 Xem trang chủ Xem thông tin trên trang chủ

UC04 Tìm kiếm thông tin phòng

Tìm kiếm các thông tin phòng

UC05 Tìm kiếm thông tin chi nhánh

Tìm kiếm thông tin của các chi nhánh khách sạn

UC06 Quản lý thông tin tài khoản cá nhân

Quản lý thông tin tài khoản cá nhân của người dùng

UC07 Thanh toán Thanh toán tiền

UC08 Nhận ưu đãi Nhận ưu đãi của khách sạn

UC09 Đặt phòng Đặt phòng

Facebook Đăng nhập sử dụng tài khoản Facebook

Google Đăng nhập sử dụng tài khoản Google

UC12 Đăng nhập bằng tài khoản đăng kí Đăng nhập sử dụng tài khoản mà khách hàng đăng kí thủ công

UC13 Đăng nhập vào hệ thống Đăng nhập vào trang quản lí của hệ thống

UC14 Quản lí tài khoản hệ thống

Quản lí thông tin các tài khoản có trong hệ thống

UC15 Quản lí thông tin khách hàng

Quản lí các thông tin khách hàng trong hệ thống

UC16 Quản lí thông tin nhân viên

Quản lí thông tin nhân viên trong hệ thống

UC17 Quản lí thông tin chi nhánh

Quản lí các thông tin các chi nhánh trong hệ thống

UC18 Quản lí thông tin phòng

Quản lí thông tin phòng trong hệ thống

UC19 Quản lí thông tin các chính sách hủy phòng

Quản lí thông tin các chính sách chi nhánh trong hệ thống

UC20 Quản lí thông tin giường

Quản lí thông tin giường của khách sạn

UC21 Quản lí thông tin dịch vụ

Quản lí thông tin dịch vụ có trong khách sạn

UC22 Quản lí các chương trình khuyến mãi

Quản lí các chương trình khuyến mãi trong hệ thống

UC23 Quản lí thông tin cá nhân

Quản lí thông tin tài khoản cá nhân UC24 Xuất hóa đơn Xuất hóa đơn

3.3 Đặc tả usecase của các tính năng nổi bật

Bảng 3 5 Mô tả usecase quản lí tài khoản hệ thống (UC14)

Tên usecase Quản lý tài khoản hệ thống

Mô tả Xem sửa, vô hiệu hóa tài khoản

Chương 3: Phân tích và mô hình hóa yêu cầu 23 Điều kiện cần Có kết nối internet, đăng nhập với account có quyền: Admin

STT Chủ thể Phản hồi hệ thống

Chuyển sang trang quản lí tài khoản, hiển thị danh sách toàn bộ tài khoản trong hệ thống

Show modal chỉnh sửa thông tin tài khoản

Thực hiện chỉnh sửa thông tin và click

“Save Change” Đóng modal và thực hiện cập nhật thông tin tài khoản

Show modal xác nhận việc vô hiệu hóa tài khoản

5 Click button Disable trên modal Thực hiện vô hiệu hóa tài khoản Ngoại lệ Không có

Kết quả Hiển thị danh sách tài khoản trong hệ thống và thực hiện thao tác được chọn

Bảng 3 6 Mô tả usecase xuất hóa đơn (UC24)

Tên usecase Xuất hóa đơn (UC27)

Mô tả Xuất thông tin hóa đơn dưới dạng pdf

Truy cập vào trang quản lí thông tin hóa đơn

Chuyển sang trang quản lý hóa đơn, hiển thị danh sách hóa đơn

Click vào button có icon export trên dòng chứa hóa đơn cần xuất

Chuyển hướng sang trang chi tiết hóa đơn

Tạo file pdf chưa thông tin chi tiết hóa đơn và tải xuống Điều kiện cần Có kết nối internet, đăng nhập với account có quyền: Admin,

Kết quả Tạo và tải xuống được file dạng pdf chứa thông tin chi tiết của hóa đơn

Bảng 3 7 Mô tả usecase đăng nhập vào trang Admin (UC13)

Tên usecase Đăng nhập vào hệ thống

Mô tả Đăng nhập vào trang quản lí hệ thống

Nhập username, password vào form login của trang quản lí

Xác thực thông tin nhập liệu của người dùng

Khi người dùng nhập thông tin hợp lệ với quyền admin, hệ thống sẽ chuyển hướng đến giao diện trang Admin Dashboard Ngược lại, nếu thông tin hợp lệ với quyền employee, hệ thống sẽ dẫn đến giao diện trang Employee Dashboard.

Ngoại lệ Thông tin không hợp lệ thống show message báo lỗi “username hoặc password không hợp lệ” Điều kiện cần Có kết nối internet

Kết quả Đăng nhập được vào trang Admin Dashboard, Employee

Dashboard ứng với quyền tài khoản

Bảng 3 8 Mô tả chi tiết chức năng tìm kiếm thông tin phòng (UC04)

Tên usecase Tìm kiếm thông tin phòng

Mô tả Xem các phòng dựa theo các thông tin tìm kiếm đầu vào

1 Đang ở trang branch và click vào chi nhánh

Chuyển sang trang room hiển thị danh sách các phòng dựa theo thòi gian và chi nhánh với số người mà khách hàng chọn đang available

Danh sách các phòng có sẵn sẽ được hiển thị dựa trên thời gian và chi nhánh mặc định Để truy cập, người dùng cần có kết nối internet và vào trang chủ của khách sạn.

Kết quả Hiển thị danh sách các phòng theo thời gian và theo chi nhánh

Bảng 3 9 Mô tả chi tiết chức năng đăng kí tài khoản (UC01)

Tên usecase Đăng ký tài khoản

Mô tả Đăng ký tài khoản dùng để đăng nhập vào hệ thống

1 Click vào “Register” Chuyển sang trang register cho phép Guest đăng ký tài khoản

2 Click button Regsiter Thông báo cho guest sau khi thực hiện đăng ký Điều kiện cần Có kết nối internet, truy cập vào trang chủ của khách sạn

Kết quả Hiển thị trang đăng ký tài khoản co Guest

Bảng 3 10 Mô tả chi tiết chức năng quản lí thông tin tài khoản cá nhân (UC06)

Tên usecase Quản lí thông tin tài khoản cá nhân

Mô tả Quản lí, cập nhật thông tin tài khoản cá nhân

Thực hiện chuyển trang qua update thông tin và show các thông tin hiện có của User

Thực hiện update User và nhấn nút

Thông báo sau khi update thông tin Điều kiện cần Có kết nối internet, truy cập vào trang chủ của khách sạn

Kết quả Thực hiện update thông tin tài khoản cá nhân của user

Bảng 3 11 Mô tả chi tiết chức năng đặt phòng (UC09)

Mô tả Thực hiện chức đặt phòng online

Lựa chọn các thông tin tìm kiếm theo mong muốn

Chuyển qua trang hiển thị thông tin các chi nhánh tương ứng

Click vào chi nhánh trên trang hiển thị thông tin chi nhánh

Chuyển qua trang hiển thị phòng tương ứng với chi nhánh

3 Lựa chọn phòng mong muốn

Chuyển qua trang điền và xác nhận thông tin đặt phòng

Nhập thông tin cần thiết

Chuyển qua trang thanh toán

5 Chọn phương thức thực hiện thanh toán

Thực hiện điều hướng sang trang thực hiện việc thanh toán

6 Thực hiện nhập thông tin thanh toán

Để thực hiện thanh toán cho đơn đặt phòng, bạn cần có kết nối internet, truy cập vào trang chủ của khách sạn và sở hữu tài khoản người dùng tại khách sạn Sau khi hoàn tất các bước trên, bạn sẽ nhận được xác nhận về tính hợp lệ của việc đặt phòng cùng thông báo xác nhận đặt phòng.

Yêu cầu hệ thống

Chương 3: PHÂN TÍCH VÀ MÔ HÌNH HÓA YÊU CẦU

Bảng 3 1 Yêu cầu người dùng

# Tiêu đề Tóm tắt yêu cầu

Giao diện của trang web được thiết kế đơn giản, sinh động và thân thiện với người dùng, giúp người truy cập dễ dàng làm quen và sử dụng ngay cả khi là lần đầu tiên.

2 Các chức năng cơ bản phía khách hàng

Có các chức năng của một trang web đặt phòng khách sạn như: tìm kiếm thông tin chi nhánh, thông tin phòng, đặt phòng, thanh toán

Hệ thống quản lý khách sạn cung cấp các chức năng thiết yếu cho người quản lý, bao gồm việc quản lý thông tin phòng, thông tin khách hàng và thông tin đặt phòng, giúp tối ưu hóa quy trình vận hành và nâng cao trải nghiệm khách hàng.

4 Các chức năng cho nhân viên lễ tân

Cung cấp các chức năng cho nhân viên như xem thông tin đặt phòng của khách hàng, xuất hóa đơn dựa trên thông tin đặt phòng của khách

5 Tích hợp thanh toán trực tuyến Tích hợp chức năng thanh toán bằng

PayPal cho trang web, hỗ trợ thao tác đặt phòng của khách hàng được nhanh chóng

Cho phép khách hàng đăng nhập vào trang web thông qua tài khoản facebook và tài khoản google

3.2.1 Các tác nhân trong hệ thống

Bảng 3 2 Mô tả các tác nhân

Khách hàng không đăng ký tài khoản (guest) có thể sử dụng tất cả các chức năng mà trang web cung cấp, bao gồm việc tìm kiếm thông tin về các chi nhánh và phòng Tuy nhiên, họ không thể thực hiện các chức năng như đặt phòng và thanh toán.

Chương 3: Phân tích và mô hình hóa yêu cầu 19 toán, quản lí thông tin tài khoản cá nhân, nhận các ưu đãi từ khách sạn

2 User (Khách hàng có đăng kí tài khoản trong hệ thống)

Khách hàng có thể sử dụng đầy đủ các chức năng như đặt phòng, thanh toán, quản lý thông tin cá nhân và nhận các ưu đãi (nếu có) Tuy nhiên, họ không có quyền truy cập vào trang admin và trang nhân viên.

Nhân viên sẽ được cấp quyền truy cập vào các chức năng quản lý quan trọng, bao gồm quản lý thông tin tài khoản cá nhân, thông tin đặt phòng, danh sách hóa đơn và xuất hóa đơn.

4 Người quản lí (Admin) Là tác nhân có quyền cao nhất được phép thực thi toàn bộ chức năng quản lí trong hệ thống

3.2.2 Chức năng của các tác nhân

Bảng 3 3 Chức năng của các tác nhân

4 Tìm kiếm thông tin chi nhánh x x

5 Tìm kiếm thông tin phòng x x

9 Quản lí thông tin tài khoản cá nhân x

10 Đăng nhập vào hệ thống x x

11 Quản lí thông tin đặt phòng x x

12 Quản lí thông tin hóa đơn x x

14 Quản lí tài khoản hệ thống x

15 Quản lí thông tin khách hàng x

16 Quản lí thông tin nhân viên trong khách sạn x

17 Quản lí thông tin các chi nhánh trong khách sạn x

18 Quản lí thông tin các phòng trong hệ thống x

19 Quản lí thông tin dịch vụ trong hệ thống x

20 Quản lí thông tin giường trong khách sạn x

Lược đồ Usecase

Hình 3 1 Lược đồ chức năng của hệ thống

Bảng 3 4 Chi tiết lược đồ chức năng

UC01 Đăng kí tài khoản Đăng kí tài khoản người dùng

UC02 Đăng nhập trang chủ Đăng nhập vào trang chủ của website

UC03 Xem trang chủ Xem thông tin trên trang chủ

UC04 Tìm kiếm thông tin phòng

Tìm kiếm các thông tin phòng

UC05 Tìm kiếm thông tin chi nhánh

Tìm kiếm thông tin của các chi nhánh khách sạn

UC06 Quản lý thông tin tài khoản cá nhân

Quản lý thông tin tài khoản cá nhân của người dùng

UC07 Thanh toán Thanh toán tiền

UC08 Nhận ưu đãi Nhận ưu đãi của khách sạn

UC09 Đặt phòng Đặt phòng

Facebook Đăng nhập sử dụng tài khoản Facebook

Google Đăng nhập sử dụng tài khoản Google

UC12 Đăng nhập bằng tài khoản đăng kí Đăng nhập sử dụng tài khoản mà khách hàng đăng kí thủ công

UC13 Đăng nhập vào hệ thống Đăng nhập vào trang quản lí của hệ thống

UC14 Quản lí tài khoản hệ thống

Quản lí thông tin các tài khoản có trong hệ thống

UC15 Quản lí thông tin khách hàng

Quản lí các thông tin khách hàng trong hệ thống

UC16 Quản lí thông tin nhân viên

Quản lí thông tin nhân viên trong hệ thống

UC17 Quản lí thông tin chi nhánh

Quản lí các thông tin các chi nhánh trong hệ thống

UC18 Quản lí thông tin phòng

Quản lí thông tin phòng trong hệ thống

UC19 Quản lí thông tin các chính sách hủy phòng

Quản lí thông tin các chính sách chi nhánh trong hệ thống

UC20 Quản lí thông tin giường

Quản lí thông tin giường của khách sạn

UC21 Quản lí thông tin dịch vụ

Quản lí thông tin dịch vụ có trong khách sạn

UC22 Quản lí các chương trình khuyến mãi

Quản lí các chương trình khuyến mãi trong hệ thống

UC23 Quản lí thông tin cá nhân

Quản lí thông tin tài khoản cá nhân UC24 Xuất hóa đơn Xuất hóa đơn

Đặc tả usecase của các tính năng nổi bật

Bảng 3 5 Mô tả usecase quản lí tài khoản hệ thống (UC14)

Tên usecase Quản lý tài khoản hệ thống

Mô tả Xem sửa, vô hiệu hóa tài khoản

Chương 3: Phân tích và mô hình hóa yêu cầu 23 Điều kiện cần Có kết nối internet, đăng nhập với account có quyền: Admin

Chuyển sang trang quản lí tài khoản, hiển thị danh sách toàn bộ tài khoản trong hệ thống

Show modal chỉnh sửa thông tin tài khoản

Thực hiện chỉnh sửa thông tin và click

“Save Change” Đóng modal và thực hiện cập nhật thông tin tài khoản

Show modal xác nhận việc vô hiệu hóa tài khoản

5 Click button Disable trên modal Thực hiện vô hiệu hóa tài khoản Ngoại lệ Không có

Kết quả Hiển thị danh sách tài khoản trong hệ thống và thực hiện thao tác được chọn

Bảng 3 6 Mô tả usecase xuất hóa đơn (UC24)

Tên usecase Xuất hóa đơn (UC27)

Mô tả Xuất thông tin hóa đơn dưới dạng pdf

Truy cập vào trang quản lí thông tin hóa đơn

Chuyển sang trang quản lý hóa đơn, hiển thị danh sách hóa đơn

Click vào button có icon export trên dòng chứa hóa đơn cần xuất

Chuyển hướng sang trang chi tiết hóa đơn

Tạo file pdf chưa thông tin chi tiết hóa đơn và tải xuống Điều kiện cần Có kết nối internet, đăng nhập với account có quyền: Admin,

Kết quả Tạo và tải xuống được file dạng pdf chứa thông tin chi tiết của hóa đơn

Bảng 3 7 Mô tả usecase đăng nhập vào trang Admin (UC13)

Tên usecase Đăng nhập vào hệ thống

Mô tả Đăng nhập vào trang quản lí hệ thống

Nhập username, password vào form login của trang quản lí

Xác thực thông tin nhập liệu của người dùng

Khi người dùng nhập thông tin hợp lệ với quyền admin, hệ thống sẽ chuyển hướng đến giao diện trang Admin Dashboard Tương tự, nếu thông tin hợp lệ với quyền employee, hệ thống sẽ chuyển hướng đến giao diện trang Employee Dashboard.

Ngoại lệ Thông tin không hợp lệ thống show message báo lỗi “username hoặc password không hợp lệ” Điều kiện cần Có kết nối internet

Kết quả Đăng nhập được vào trang Admin Dashboard, Employee

Dashboard ứng với quyền tài khoản

Bảng 3 8 Mô tả chi tiết chức năng tìm kiếm thông tin phòng (UC04)

Tên usecase Tìm kiếm thông tin phòng

Mô tả Xem các phòng dựa theo các thông tin tìm kiếm đầu vào

1 Đang ở trang branch và click vào chi nhánh

Chuyển sang trang room hiển thị danh sách các phòng dựa theo thòi gian và chi nhánh với số người mà khách hàng chọn đang available

Danh sách các phòng có sẵn sẽ được hiển thị theo thời gian và chi nhánh mặc định Để truy cập, người dùng cần có kết nối internet và vào trang chủ của khách sạn.

Kết quả Hiển thị danh sách các phòng theo thời gian và theo chi nhánh

Bảng 3 9 Mô tả chi tiết chức năng đăng kí tài khoản (UC01)

Tên usecase Đăng ký tài khoản

Mô tả Đăng ký tài khoản dùng để đăng nhập vào hệ thống

1 Click vào “Register” Chuyển sang trang register cho phép Guest đăng ký tài khoản

2 Click button Regsiter Thông báo cho guest sau khi thực hiện đăng ký Điều kiện cần Có kết nối internet, truy cập vào trang chủ của khách sạn

Kết quả Hiển thị trang đăng ký tài khoản co Guest

Bảng 3 10 Mô tả chi tiết chức năng quản lí thông tin tài khoản cá nhân (UC06)

Tên usecase Quản lí thông tin tài khoản cá nhân

Mô tả Quản lí, cập nhật thông tin tài khoản cá nhân

Thực hiện chuyển trang qua update thông tin và show các thông tin hiện có của User

Thực hiện update User và nhấn nút

Thông báo sau khi update thông tin Điều kiện cần Có kết nối internet, truy cập vào trang chủ của khách sạn

Kết quả Thực hiện update thông tin tài khoản cá nhân của user

Bảng 3 11 Mô tả chi tiết chức năng đặt phòng (UC09)

Mô tả Thực hiện chức đặt phòng online

Lựa chọn các thông tin tìm kiếm theo mong muốn

Chuyển qua trang hiển thị thông tin các chi nhánh tương ứng

Click vào chi nhánh trên trang hiển thị thông tin chi nhánh

Chuyển qua trang hiển thị phòng tương ứng với chi nhánh

3 Lựa chọn phòng mong muốn

Chuyển qua trang điền và xác nhận thông tin đặt phòng

Nhập thông tin cần thiết

Chuyển qua trang thanh toán

5 Chọn phương thức thực hiện thanh toán

Thực hiện điều hướng sang trang thực hiện việc thanh toán

6 Thực hiện nhập thông tin thanh toán

Để thực hiện thanh toán cho đơn đặt phòng, bạn cần có kết nối internet, truy cập vào trang web của khách sạn và sở hữu tài khoản người dùng tại khách sạn Sau khi hoàn tất, bạn sẽ nhận được xác nhận về tính hợp lệ của việc đặt phòng và thông báo xác nhận đặt phòng.

THIẾT KẾ HỆ THỐNG

Thiết kế dữ liệu

Hình 4 1 Lược đồ thể hiện khái quát các bảng dữ liệu và mối quan hệ giữa các bảng

Chương 4: Thiết kế hệ thống 28

Hình 4 2 Lược đồ thể hiện chi tiết các thuộc tính của từng bảng

Bảng roles: lưu thông tin các quyền truy cập vào hệ thống

Mô tả Kiểu dữ liệu Ghi chú

1 roleid Định danh, phân biệt giữa các quyền

2 rolename Tên của từng role Varchar(255)

Bảng accounts: lưu thông tin các tài khoản trong hệ thống

1 accountid Định danh, phân biệt giữa các tài khoản

2 createby Thông tin người tạo tài khoản

3 createdate Ngày tạo tài khoản Datetime

4 modifiedby Người thay đổi thông tin tài khoản

5 modifieddate Ngày thay đổi thông tin tài khoản

6 username Tên tài khoản Varchar(50)

8 status Trạng thái tài khoản TinyInt(1) Trạng thái còn hoạt động hoặc bị khóa

Bảng acccount_role: lưu trữ thông tin tài khoản ứng với các role

Mô tả Kiểu dữ liệu

1 account_id Định danh, phân biệt giữa các tài khoản

BigInt Khóa chính, khóa ngoại

2 role_id Định danh, phân biệt giữa các role

Bảng promotions: lưu trữ thông tin các chương trình khuyến mãi

1 promoid Định danh, phân biệt giữa các khuyến mãi

2 custype Loại khách hàng được áp dụng chương trình khuyến mãi

3 startdate Ngày bắt đầu chương trình khuyến mãi

4 enddate Ngày kết thúc chương trình khuyến mãi

5 code Mã khuyến mãi Varchar(20)

6 percent Phần trăm ưu đãi Float

Bảng customers: lưu trữ thông tin khách hàng

STT Tên thuộc tính Mô tả Kiểu dữ liệu Ghi chú

1 customerid Định danh, phân biệt giữa các khách hàng

2 cuscode Mã khách hàng Varchar(20)

3 email Email khách hàng Varchar(100)

4 idcard Số chứng minh thư khách hàng

5 name Tên khách hàng Varchar(100)

6 phone Số điện thoại khách hàng

7 accountid Tài khoản tương ứng với thông tin khách hàng

BigInt Khóa ngoại đến bảng accounts

8 typecustomerid Loại khách hàng BigInt Khóa ngoại đến bảng customertypes

Bảng customertypes: lưu trữ thông tin các loại khách hàng

1 id Định danh, phân biệt giữa các loại khách hàng

2 typename Tên của từng loại khách hàng

Bảng employees: lưu trữ thông tin nhân viên

1 employeeid Định danh, phân biệt giữa các nhân viên

2 email Email của nhân viên Varchar(50)

3 empcode Mã nhân viên Varchar(20)

4 idcard Số chứng minh thư nhân viên

5 name Tên nhân viên Varchar(100)

6 phone Số điện thoại nhân viên

7 status Trạng thái của nhân viên

TinyInt(1) Còn làm việc hoặc đã nghỉ việc

8 accountid Tài khoản tương ứng với nhân viên

BigInt Khóa ngoại đến bảng accounts

9 branchid Chi nhánh nhân viên làm việc

BigInt Khóa ngoại đến bảng branchs

Bảng branchs: lưu thông tin các chi nhánh của khách sạn

1 branchid Định danh, phân biệt giữa các chi nhánh

2 address Địa chi chi tiết của chi nhánh

3 branchcode Mã chi nhánh Varchar(20)

4 description Mô tả chi nhánh Longtext

5 location Khu vực của các chi nhánh

Varchar(255) Thường là tên các thành phố lớn

6 name Tên chi nhánh Varchar(255)

7 rating Chỉ số đánh giá khách sạn

8 status Trạng thái của chi nhánh

Tinyint(1) Còn hoạt động hoặc ngừng hoạt động

Bảng branchimages: lưu trữ hình ảnh của từng chi nhánh

1 branchid Định danh, phân biệt giữa các chi nhánh

2 thumbnail Đường dẫn của từng hình ảnh tương ứng

Varchar(255) Những hình ảnh phụ của chi nhánh, mỗi chi nhánh được tối đa 3 hình phụ

Bảng services: lưu trữ thông tin các dịch vụ trong hệ thống

1 serviceid Định danh, phân biệt giữa các dịch vụ

2 createby Người tạo các dịch vụ Varchar(255)

3 createdate Ngày tạo các dịch vụ Datetime

4 modifiedby Người chỉnh sừa thông tin dịch vụ

5 modifieddate Ngày chỉnh sửa thông tin dịch vụ

6 description Mô tả dịch vụ Longtext

7 name Tên dịch vụ Varchar(255)

8 price Giá dịch vụ Double

9 servicecode Mã dịch vụ Varchar(20)

Bảng rooms: lưu trữ thông tin phòng

1 roomid Định danh, phân biệt giữa các phòng

2 description Mô tả chi tiết phòng Longtext

6 status Trạng thái phòng Tinyint(1) Còn hoạt động hoặc không còn hoạt động

7 policyid Chính sách đổi trả Int Khóa ngoại đến bảng cancelpolicy

8 branchid Chi nhánh chứa phòng

BigInt Khóa ngoại đến bảng branchs

9 amountpeople Số người trong từng phòng

Bảng roomimages: lưu trữ hình ảnh ứng với từng phòng

1 roomid Định danh, phân biệt giữa các phòng

BigInt Khóa ngoại đến bảng rooms

2 thumbnail Đường dẫn của từng hình ảnh tương ứng

Varchar(255) Lưu trữ đường dẫn của các hình

Chương 4: Thiết kế hệ thống 33 ảnh phụ của phòng, mỗi phòng được phép có tối đa 3 ảnh phụ

STT Tên thuộc tính Mô tả Kiểu dữ liệu

1 service_id Định danh, phân biệt giữa các dịch vụ

2 room_id Định danh, phân biệt giữa các phòng

Bảng bookings: lưu trữ thông tin đặt phòng của khách hàng

1 billid Hóa đơn chứa thông tin booking của khách hàng

BigInt Khóa ngoại đến bảng bills

2 bookdate Ngày đặt phòng Varchar(255)

3 checkindate Ngày nhận phòng Varchar(255)

4 roomid Phòng được đặt BigInt Khóa ngoại đến bảng rooms

5 checkoutdate Ngày trả phòng Varchar(255)

6 paidprice Số tiền đã thanh toán Double

Bảng bills: lưu trữ thông tin hóa đơn (một hóa đơn có thể chứa nhiều thông tin booking của khách hàng trong trường hợp khách hàng book nhiều phòng)

1 billid Định danh, phân biệt giữa các hóa đơn

2 promocode Mã khuyến mãi Varchar(255)

3 createdate Ngày tạo hóa đơn Datetime

4 status Trạng thái hóa đơn Tinyint(1)

5 totalprice Tổng tiền hóa đơn Double

6 customerid Khách hàng sở hữu hóa đơn

BigInt Khóa ngoại đến bảng customers

Bảng cancelpolicy: lưu trữ thông tin các chính sách hoàn tiền

1 id Định danh, phân biệt giữa các chính sách

2 code Mã của từng chính sách

3 daylong Số ngày có thể thực hiện trả phòng và nhận hoàn tiền

4 detail Chi tiết nội dung chính sách trả phòng

5 title Mô tả ngắn chính sách đổi trả

Bảng beds: lưu trữ thông tin các loại giường

1 bedid Định danh, phân biệt giữa các giường

2 amountpeople Số người tương ứng với từng giường

3 description Mô tả giường Varchar(255)

Bảng bed_room: lưu trữ thông tin giường tương ứng trong từng phòng

STT Tên thuộc tính Mô tả Kiểu dữ liệu

1 bed_id Định danh, phân biệt giữa các giuòng

BigInt Khóa chính khóa ngoại

2 room_id Tên của từng phòng BigInt Khóa chính, khóa ngoại

Kiến trúc hệ thống

Hình 4 3 Kiến trúc hệ thống

Về kiến trúc trang web chia làm hai thành phần chính là phần giao diện người dùng

(front-end), phần xử lí nghiệp vụ (back-end) thao tác với cơ sở dữ liệu

Trang web front-end được phân chia thành hai giao diện riêng biệt: một cho khách hàng và một cho bộ phận quản lý Cả hai giao diện này được xây dựng bằng các component Vue.js, kết hợp với các thư viện hỗ trợ như Bootstrap-Vue và MDBVue Quá trình điều hướng giữa các giao diện được quản lý hiệu quả thông qua Vue Router.

Khi người dùng cần thực hiện các hành động trên giao diện như truy cập hoặc đăng ký thông tin, front-end sẽ sử dụng axios, một HTTP client, để gọi các API từ server nhằm xử lý yêu cầu của người dùng.

Cấu trúc thư mục phía front-end gồm các thành phần như:

- Thư mục node_modules: chứa các gói thư viện cần dùng trong project

- Thư mục src: thư mục root của project

- Thư mục assets: chứa các tài nguyên tĩnh dùng trong project như hình ảnh, video,

- Thư mục components: chứa các component như các bảng, các form, các modal trong hệ thống

- Thư mục model: chứa các class thể hiện đối tượng dùng trong ứng dụng như user,

- Thư mục plugins: chứa các thư viện bổ sung cho vuejs như vuetify, …

- Thư mục router: chứa các cài đặt cấu hình điều hướng của trang web

- Thư mục services: chức các lớp dịch vụ, các lớp này sử dụng axios để gửi yêu cầu cũng như nhận kết quả trả về từ server

- Thư mục utils: chứa các biến, các phương thức dùng chung trong hệ thống

Hệ thống back-end được phát triển bằng Spring Boot, cho phép xây dựng các API xử lý yêu cầu từ người dùng Các REST API giữ vai trò tiếp nhận yêu cầu từ front-end, trong khi Spring JPA đảm nhiệm việc tương tác với cơ sở dữ liệu.

Khi nhận yêu cầu từ front-end, các lớp REST API sẽ gọi các dịch vụ đã được cài đặt để xử lý yêu cầu đó Sau khi các lớp dịch vụ hoàn tất việc xử lý, REST API sẽ phản hồi kết quả lại cho front-end.

Cấu trúc thư mục phía back-end gồm những thành phần như:

- Pakage api: chứa các lớp api tiếp nhận và trả kết quả phản hồi về phía front- end

Gói thực thể (Pakage entity) bao gồm các lớp thực thể đại diện cho các thực thể trong cơ sở dữ liệu, với mỗi lớp tương ứng với một bảng trong cơ sở dữ liệu.

- Pakage model: chứa các đối tượng có nhiệm vụ chứa dữ liệu đầu vào cũng như trả về cho phía front-end

- Pakage repository: chứa các interface kế thừa JpaRepository để tương tác trực tiếp với cơ sở dữ liệu

- Pakage security: chứa các lớp cấu hình về bảo mật hệt thống

Dịch vụ gói chứa các lớp xử lý nghiệp vụ cho hệ thống, thường gọi đến các phương thức trong repository để thực hiện các nghiệp vụ tương tác với dữ liệu như thêm, cập nhật, xóa và truy xuất.

- Pakage utils: chứa các lớp chứa các thuộc tính cũng như phương thức static dùng chung trong hệ thống

Thiết kế xử lí

4.3.1 Sequence Diagram (Lược đồ tuần tự)

Hình 4 4 Sequence diagram chức năng tìm kiếm thông tin của chi nhánh

Hình 4 5 Sequence diagram chức năng tìm kiếm phòng

Hình 4 6 Sequence diagram của chức năng đăng nhập

Hình 4 7 Sequence diagram của chức năng đăng kí tài khoản

Hình 4 8 Sequence diagram của chức năng tìm kiếm chi nhánh theo khu vực

Hình 4 9 Sequence diagram của chức năng tìm kiếm phòng trong từng chi nhánh

4.3.2 Class Diagram (Lược đồ lớp)

4.3.2.1 Class Diagram của các lớp Entity

Hình 4 10 Class diagram của pakage entity

4.3.2.2 Class diagram của các lớp Service

Hình 4 11 Class diagram của các lớp Service

4.2.3.3 Class diagram của các lớp api

Hình 4 12 Class diagram của các lớp api

4.3.2.4 Class Diagram của đối tượng Account

Hình 4 13 Class Diagram của đối tượng Account

4.3.2.5 Class Diagram của đối tượng booking

Hình 4 14 Class Diagram của đối tượng booking

Thiết kế giao diện

4.4.1 Screen flow giao diện phía người dùng là guest

Hình 4 15 Screen flow của nhóm người dùng guest

Bảng 4 1 Mô tả screen flow của nhóm người dùng guest

Màn hình hiển thị giao diện trang chủ SCG01 cung cấp thông tin nổi bật và cho phép người dùng dễ dàng tìm kiếm thông tin phòng theo nhu cầu của mình.

SCG02 Login Screen Màn hình đăng nhập

SCC03 Sign Up Screen Màn hình đăng ký

SCG04 Blog screen Màn hình hiển thị các bài viết về khách sạn

SCG05 Service Screen Màn hình hiển thị các dịch vụ nổi bật của khách sạn

SCG06 Branch Screen Màn hình hiển thị thông tin các chi nhánh của khách sạn

SCG07 Room Screen Màn hình hiển thị danh sách các phòng của khách sạn

SCG08 Promotion Screen Màn hình hiển thị thông tin các chương trình khuyến mãi, ưu đãi của khách sạn

SCG09 Contact Screen Màn hình hiển thị thông tin liên lạc và form cho phép người dùng nhập thông tin nhận thông báo từ khách sạn

4.4.2 Screen flow giao diện người dùng user

Hình 4 16 Screen flow nhóm người dùng user

Bảng 4 2 Mô tả screen flow của nhóm người dùng user

Màn hình hiển thị giao diện trang chủ của SCU01 cung cấp thông tin nổi bật và cho phép người dùng dễ dàng tìm kiếm thông tin phòng theo nhu cầu của mình.

SCU02 Login Screen Màn hình đăng nhập

SCU03 Sign Up Screen Màn hình đăng ký

SCU04 Blog screen Màn hình hiển thị các bài viết về khách sạn

SCU05 Service Screen Màn hình hiển thị các dịch vụ nổi bật của khách sạn

SCU06 Branch Screen Màn hình hiển thị thông tin các chi nhánh của khách sạn

SCU07 Room Screen Màn hình hiển thị danh sách các phòng của khách sạn

SCU08 Promotion Screen Màn hình hiển thị thông tin các chương trình khuyến mãi, ưu đãi của khách sạn

SCU09 Contact Screen Màn hình hiển thị thông tin liên lạc và form cho phép người dùng nhập thông tin nhận thông báo từ khách sạn

SCU10 User Information Màn hình cho phép user quản lí, cập nhật thông tin cá nhân

SCU11 Booking History Màn hình cho phép user quản lí, thông tin lịch sử đặt phòng

SCU12 Booking Screen Màn hình cho phép user thực hiện kiểm tra lại thông tin và đặt phòng

SCU13 Payment Màn hình cho phép user thực hiện lựa chọn phương thức thanh toán

4.4.3 Screen flow giao diện người dùng Admin

Hình 4 17 Screen flow giao diện người dùng admin

Bảng 4 3 Mô tả screen flow giao diện người dùng Admin

SCA01 Admin Dashboard Màn hình trang chủ trang quản lí admin

SCA02 Login Screen Màn hình đăng nhập

SCA03 Manage Account Màn hình quản lí thông tin tài khoản

SCA04 Manage Customer Màn hình quản lí thông tin khách hàng trong hệ thống

SCA05 Manage Bill Màn hình quản lí danh sách hóa đơn trong hệ thống

SCA06 Detail Bill Màn hình hiển thị thông tin chi tiết hóa đơn, cho phép người dùng export thông tin khi cần

SCA07 Manage Employee Màn hình cho phép quản lí thông tin nhân viên

SCA08 Edit Employee Màn hình cho phép chỉnh sửa thông tin nhân viên

SCA09 Add Employee Màn hình cho phép thêm thông tin nhân viên

SCA10 Manage Branch Màn hình quản lí danh sách các chi nhánh

SCA11 Add Branch Màn hình thêm mới chi nhánh

SCA12 Branch Detail Màn hình xem thông tin chi tiết của chi nhánh

SCA13 Manage Room Màn hình quản lí thông tin phòng trong hệ thống

SCA14 Add Room Màn hình thêm mới phòng

SCA15 Room Detail Màn hình hiển thị chi tiết thông tin phòng

SCA16 Manage Booking Màn hình quản lí danh sách thông tin đặt phòng trong hệ thống

SCA17 Manage Bed Màn hình quản lí thông tin giường trong hệ thống

SCA18 Manage Service Màn hình quản lí các dịch vụ trong hệ thống

SCA19 Manage Policy Màn hình quản lí các chính sách đổi trả trong hệ thống

4.4.3 Screen flow giao diện người dùng employee

Hình 4 18 Screen flow giao diện người dùng employee

Bảng 4 4 Mô tả screen flow giao diện người dùng employee

SCE01 Employee Dashboard Màn hình trang chủ trang quản lí của employee

SCE02 Login Screen Màn hình đăng nhập

Màn hình quản lí thông tin cá nhân của nhân viên

SCE04 Manage Booking Màn hình quản lí thông tin booking trong hệ thống

SCE05 Manage Bill Màn hình quản lí danh sách hóa đơn trong hệ thống

4.4.1 Giao diện quản lí của Admin

Hình 4 19 Giao diện trang quản lí thông tin tài khoản cá nhân của nhân viên

Bảng 4 5 Đặc tả chi tiết giao diện màn hình cập nhật thông tin tài khoản cá nhân

STT Tên Bắt buộc Định dạng Chú thích

1 Code Có Văn bản đầu vào

Hiển thị mã nhân viên hiện tại, chỉ có quyền xem không thể chỉnh sửa

2 ID Card Có Văn bản đầu vào

Khi nhấp, chỉnh sửa thông tin số Id Card

3 Name Có Văn bản đầu vào

Khi nhấp, chỉnh sửa thông tin tên nhân viên

4 Email Có Văn bản đầu vào

Khi nhấp, chỉnh sửa thông tin địa chỉ email

5 Phone Có Văn bản đầu vào

Khi nhấp, chỉnh sửa thông tin số điện thoại

PROFILE Có Nút Khi nhấp, lưu thành công các thay đổi và reload lại trang

Khi nhấp sẽ cho phép nhập thông tin mật khẩu cũ và mới để cập nhật mật khẩu cho tài khoản nhân viên

8 Old Password Có Văn bản đầu vào

Khi nhấp cho phép nhập vào mật khẩu trùng khớp với mật khẩu của tài khoản hiện tại

Password Có Văn bản đầu vào

Khi nhấp cho phép nhập vào mật khẩu muốn thay đổi

Khi nhấp cho phép nhập lại password khớp với trường số (9)

Hình 4 20 Giao diện trang quản lí chi nhánh

Bảng 4 6 Mô tả chi tiết giao diện trang quản lí chi nhánh

BRANCH Có Nút Khi nhấp, chuyển sang màn hình thêm mới thông tin chi nhánh

2 Search Có Văn bản đầu vào

Khi nhấp, cho phép nhập vào mã chi nhánh cần tìm

Khi nhấp, thực hiện tìm kiếm thông tin chi nhánh khớp với văn bản đầu vào (2)

4 Branch ID Có Văn bản ID của chi nhánh

5 Branch Code Có Liên kết

Mã của chi nhánh, khi nhấp chuyển hướng sang trang hiển thị thông tin hình, nhân viên trong chi nhánh

6 Address Có Văn bản Địa chỉ của chi nhánh

7 Description Có Văn bản Mô tả của chi nhánh

8 Branch Name Có Văn bản Tên của chi nhánh

9 Location Có Văn bản Khu vực cũa chi nhánh

10 Edit Có Nút Khi nhấp chuyển sang trang chỉnh sửa thông tin cơ bản của chi nhánh

11 Delete Có Nút Khi nhấp, vô hiệu hóa thông tin của chi nhánh tương ứng

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang đầu tiên

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang liền trước

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang có index tương ứng

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang liền sau

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang cuối cùng

Hình 4 21 Giao diện trang thông tin chi tiết của chi nhánh

Bảng 4 7 Mô tả chi tiết màn hình hiển thị thông tin chi tiết của chi nhánh

Code Có Văn bản Hiển thị mã nhân viên làm trong chi nhánh

2 Id Card Có Văn bản Hiển thị số CMND của nhân viên

Name Có Văn bản Hiển thị tên nhân viên

Phone Có Văn bản Hiển thị số điện thoại nhân viên

Email Có Văn bản Hiển thị email nhân viên

6 Username Có Văn bản Hiển thị Username nhân viên

Khi nhấp, chuyển hướng sang trang chỉnh sửa thông tin nhân viên

8 Delete Có Nút Khi nhấp, cho phép vô hiệu hóa nhân viên

9 Hình 1 Có Hình ảnh Hình ảnh chính của chi nhánh

Khi nhấp, cho phép chọn một hình ảnh bất kì trong máy thay thế hình ảnh 1 của chi nhánh

11 Hình 2 Không Hình ảnh Hình ảnh 2 của chi nhánh

Hình 4 22 Màn hình quản lí hóa đơn

Bảng 4 8 Đặc tả chi tiết màn hình quản lí hóa đơn

1 Search Có Văn bản đầu vào

Khi nhấp, cho phép nhập vào mã khách hàng

2 Icon Search Có Nút Khi nhấp thực hiện tìm kiếm các hóa đơn khớp với mã khách hàng

3 Bill Id Có Văn bản Hiển thị ID của hóa đơn

Code Có Văn bản Hiển thị mã khách hàng

Name Có Văn bản Hiển thị tên khách hàng

6 Create Date Có Văn bản Hiển thị ngày tạo hóa đơn

7 Promo Code Không Văn bản Hiển thị mã khuyến mãi áp dụng trong hóa đơn

8 Status Có Văn bản Hiển thị trạng thái của hóa đơn

9 Total Price Có Văn bản Hiển thị tổng giá trị hóa đơn

10 Export Có Nút Khi nhấp, chuyển hướng sang trang chi tiết hóa đơn

Khi nhấp chuyển hướng sang trang chỉnh sửa hóa đơn (thêm mã khuyến mãi)

12 Delete Có Nút Khi nhấp, cho phép hủy hóa đơn

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang đầu tiên

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang liền trước

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang có index tương ứng

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang liền sau

Khi nhấp chuyển trạng thái hiển thị danh sách giường ở trang cuối cùng

Hình 4 23 Màn hình hiển thị chi tiết hóa đơn

Bảng 4 9 Đặc tả màn hình chi tiết hóa đơn

1 OrderDate Có Văn bản Hiển thị ngày thanh toán

2 Room Id Có Văn bản Hiển thị Id phòng được đặt

3 Book Date Có Văn bản Hiển thị ngày đặt

Date Có Văn bản Hiển thị ngày nhận phòng

Date Có Văn bản Hiển thị ngày trả phòng

Paid Có Văn bản Hiển thị số tiền đã trả cho thông tin đặt phòng tương ứng

7 Subtotal Có Văn bản Hiển thị tổng số tiền của các lần đặt phòng

Price Có Văn bản Hiển thị số tiền được khuyến mãi

9 Total Price Có Văn bản Hiển thị tổng giá trị hóa đơn

10 EXPORT Có Nút Khi nhấp tiến hành xuất hóa đơn dạng pdf

Hình 4 24 Màn hình thêm thông tin nhân viên

Bảng 4 10 Đặc tả màn hình thêm thông tin nhân viên

Code Có Văn bản đầu vào

Khi nhấp cho phép nhập vào mã nhân viên

2 Id Card Có Văn bản đầu vào

Khi nhấp cho phép nhập vào Id Card của nhân viên

Name Có Văn bản đầu vào

Khi nhấp cho phép nhập vào tên nhân viên

4 Phone Có Văn bản đầu vào

Khi nhấp cho phép nhập vào số điện thoại nhân viên

5 Email Có Văn bản đầu vào

Khi nhấp cho phép nhập vào email nhân viên

Account Có Văn bản đầu vào

Khi nhấp cho phép nhập vào username của tài khoản cấp cho nhân viên

7 Password Có Văn bản đầu vào

Khi nhấp cho phép nhập vào mật khẩu của tài khoản cấp cho nhân viên

Khi nhấp cho phép nhập lại mật khẩu

Khi nhấp show ra danh sách mã chi nhánh có trong hệ thống, cho

Chương 4: Thiết kế hệ thống 60 phép chọn một chi nhánh cho nhân viên làm việc

EMPLOYEE Có Nút Khi nhấp tiến hành thêm mới nhân viên vào hệ thống

4.4.2 Giao diện phía người dùng

Hình 4 25 Giao diện trang chủ cho trang web

Bảng 4 11 Đặc tả màn hình trang chủ trang web

1 H2 Có Image Logo của trang web

Có Link Click vào sẽ redirect đến trang chủ của web

Có Link Click vào sẽ chuyển đến trang service của web

Có Link Click vào sẽ chuyển đến trang blog của web

Có Link Click vào sẽ chuyển đến tran branch của trang web

Link Click vào sẽ chuyển đến trang Promotion của trang web

Có Link Click vào sẽ chuyển đến trang contact của trang web

8 Login Có Link Click sẽ show popup Login

Có Link Click sẽ show popup

Có Button Click sẽ redirect đến trang

Select Click sẽ show ra danh sách các thành phố có chi nhánh của khách sạn

DateTimePicker Click vào sẽ hiển thị lịch cho người dùng lựa chọn ngày checkIn và check out

Text Click vào sẽ hiển thị form cho người dùng chọn số lượng phòng

14 Promotion Có Text Nhập mã khuyến mãi

Có Button Click vào sẽ redirect đến trang branch

Có Image Hiển thị avatả của những người từng đánh giá

17 Review Có Test Nội dug review

18 Ratting Có Icon Đánh giá

19 NameAuthor Có Text Tên người đánh giá

20 Image Blog Có Image Hình ảnh chính của blog

21 Title Blog Có Text Tiêu đề của Blog

22 Date Có Text Ngày upload

Icon Redirect đến các trang chính của khách sạn trên mạng xã hội

24 OurBranch Có Link Redirect đến trang branch

25 OurBestRoom Có Link Redirect đến trang room

26 Service Có Link Redirect đến trang service

Có Text Thông tin liên hệ đối với khách sạn

Có Text Nhập vào thông tin email cần tư vấn

Hình 4 26 Màn hình giao diện service

Bảng 4 12 Đặc tả chi tiết màn hình giao diện trang service

2 Image Service Có Image Image của một service

4 Name Service Có Text Hiển thị tên của service

5 Descreption Có Text Mô tả service

Có Button Hiển thị thêm thông tin chi tiết của service này

Hình 4 27 Màn hình hiển thị các chi nhánh

Bảng 4 13 Đặc tả chi tiết màn hình hiển thị chi nhánh

2 Image Branch Có Image Image của một service

3 Name Branch Có Lable Tên của branch

Branch Có Label Địa chỉ branch

5 Phone Có Label Số điện thoại

Hình 4 28 Màn hình hiển thị danh sách phòn

Bảng 4 14 Đặc tả chi tiết màn hình hiển thị thông tin phòng

2 Room Có Label column Room

3 Number Có Lable column number

4 Name Service Có Price column price

5 ImageRoom Có Image column image

6 nameRoom Có Label Thông tin tên của phòng

Có Label Tổng số lượng người lớn ở trong phòng

Có Label Thông tin loại giường của phòng và số giường

Có Label Liệt kệ các dịch vụ hỗ trợ của phòng

Có Select Hiển thị danh sách số lượng phòng còn trống

11 Price Có Label Thông tin giá phòng

12 Select Button Thực hiện cập nhập số phòng chọn bên form xác nhận

Label Cập nhập số lượng và loại phòng mà user chọn

17 Total Label Cập nhập tổng giá mà user chọn

Hình 4 29 Màn hình giao diện thông tin liên lạc

Bảng 4 15 Đặc tả màn hình giao diện thông tin liên lạc

2 Message Có Input Nhập tin nhắn message

3 Name Có Input Nhập tên khách hàng

4 Email Có Input Nhập email nhận thông tin

5 Phone Có Label Số điện thoại

Có Button Thực hiện gửi thông tin đã nhập cho khách sạn

7 Address Có Label Địa chỉ khách sạn

8 Phone Có Label Số điện thoại khách sạn

9 Email Có Label Địa chỉ email của khách sạn

Hình 4 30 Màn hình đăng kí

Bảng 4 16 Đặc tả chi tiết màn hình đăng kí

3 Name Có Text Tên full name

Có Text Nhập email dùng để đăng kí tài khoản

Có Text Nhập số điện thoại đăng kí tài khoản

6 Id Card Có Text Nhập IdCard

7 Password Có Text Nhập password

Có Button Call API Đăng ký tài khoản thực hiện đăng kí tài khoản

Có Button Call API Đăng ký Tài khoản bằng

Có Button Capp API Đăng ký tài khoản bằng

Hình 4 31 Mản hình login Bảng 4 17 Đặc tả màn hình login

3 Email Có Text Tên email/ username

4 Pass Có Text Nhập password của tài khoản

5 Remember me Có Check Box

6 Sign in Có Button Call API Đăng nhập

Có Link Đóng popup login, mở popup register

Có Button Call API Đăng nhập Tài khoản bằng facebook

Có Button Capp API Đăng nhập tài khoản bằng google

CÀI ĐẶT

Tiêu đề	Xây Dựng Website Đặt Phòng Khách Sạn
Tác giả	Phạm Thị Như Hảo, Nguyễn Thị Diệu Huyền
Người hướng dẫn	ThS. Lê Thị Minh Châu
Trường học	Trường Đạ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	2020
Thành phố	Tp. Hồ Chí Minh

Định dạng
Số trang	95
Dung lượng	6,97 MB