Chuyên đề thực tập: Xây dựng website kết nối các công ty du lịch theo hướng Single Page Application

MỞ ĐẦUMục tiêu của chuyên đề tốt nghiệp Mục tiêu của CHUYEN DE TOT nghiệp này là nhăm xây dựng một website theo chuân SPA kết nối các công ty du lịch thông qua đó: - C4 nhân, công ty có

TRƯỜNG ĐẠI HỌC KINH TE QUOC DAN VIEN CÔNG NGHỆ THONG TIN VÀ KINH TE SO

x\NH TẾ S¿

Ne”

XAY DUNG WEBSITE KET NOI CAC CONG TY DU LICH THEO

HUONG SINGLE PAGE APPLICATION

Giang vién huéng dan: TS Pham Minh Hoan

Sinh viên thực hiện: Nguyễn Tiến Dũng

Mã sinh viên: 11171002

Chuyên ngành: Công Nghệ Thông Tin

Lớp: Công Nghệ Thông Tin 59B

Hệ đào tạo: Chính Quy

HÀ NỘI, 4/2021

MỤC LỤC

\ 18900 9 1 TOM TAT NOI DUNG CHUYEN DE TOT NGHIEP seeesssseessssseeessseeeesneeeenees |

Nội dung 46 án: -5c- 25s SE EE2121127171121121111112112111111211 1111111 1 N01 2

Mục tiêu của chuyên đề tốt nghiỆp 2222 E+E+EE2EE2EEeEEerEzEerrkrrxee 2 Các nhiệm vụ cụ thể của CĐTN -c::-222vt2Extttttrrrtrtrrrtrrrirrrrrirrrrree 2

CHƯƠNG I: TONG QUAN VE DE TÀI - 2-52 52+S2‡E‡2EeEEeEEEEEEEEEErrxrreree 3

1.1 Tổng quan tình hình nghiên cứu thuộc lĩnh vực của đề tài 3

1.2 Thực tiễn của bài toán ++ttthErgrng gu 3

1.3 Đối tượng và phạm Vi bài toán - ¿22+ s+ExeEE2E2EEeEEerkerrkrrkerxee 4

1.3.1 Đối tượng: 2-2-27k2E2 E221 2112211221211 211 11erree 4

In an 4 1.4 M6 ta no na n :'"' 4

1.4.1 Khảo sát nghiỆp VỤ - Ăn ngư 5

1.4.2 Quy trình nghiỆp VỤ - Gv HHH HH HH nh Hy 5 1.4.3 Các yêu cầu về hệ thống -¿-¿ 2+k+£E2E2EE+Exerkrrerrserkees 6

Chương II: CO SỞ LÝ THUYÊTT - 2-2 2 E£2E£2EE+EE+EEtEEEEEESEEeEEerEerrerrkrred 8

2 Nội dung ChiNh eee eeeecsseeceneecseeescecececeeeesaecesaecescecsneeseaeeesaeseneeeeaees 8 2.1 Phương pháp phân tích và thiết kế hướng đối tượng UML 8

2.1.1 Hướng đối tượng là gì? 2¿©-+¿©2++2x2EESEECEEerkrerkrrrkerrree 8 2.1.2 Khái niệm phân tích hướng đối tượng (object Oriented Analysis —

99.90 8

2.1.3 Khái niệm thiết kế hướng đối tượng (Object Oriented Design — 99) § 2.1.4 Khai mi@m UML 8 P2N 0n 00/9 9

2.2.1 Khai niệm mô hình M C - (ch k* 9H 9 2.2.2 Ưu nhược điểm của mô hình MVC -¿- ccx+ccxvEzxerzrerxee 10 2.3 Laravel FraI€WOYK 5 1x HH ng c 10

2.3.1 Framework là gì ? HH TH HH HH key 10

2.3.2 ninh 10 2.3.3 Tại sao nên lựa chọn Laravel ? -++++cc<csvssssssseeeerrss 11

2.4 WueJs framework c- Ý 11

2.4.1 VueJs framework là gÌ” c- s vn HHnHn ngư, 11 2.4.2 Tại sao lại Chon Vue ? cccccccccssscccceesssseceeceeenssceeccesessseeeeeeesssaees 11 2.4.3 Xamp HH TH HH HH HH HH tr 11 Chương III: PHAN TÍCH VÀ THIET KE HE THÓNG . :- 12

SN (0i: — 12 3.1 Biểu đồ USerCase cc St St E211 111151 111151111151E111151 E11 sxe 12

3.1.1 Usercase tổng quất - - + k+Ek‡EkEE2EEEEEEEEEEEEEEEEkErkrrkrree 12

3.1.2 Biểu đồ usercase phân rã - -c++cx2E2EEEEEEEerErrrrrkerreee 13

3.1.3 Đặc tả chức năng Gà HH HH key 15 3.2 Biểu đồ tuần tự ¿22k k2 2112212121121 112121 19

3.2.1 Biểu đồ tuần tự đăng ký tài khoản -¿cs¿©ccccecrxesree 19 3.2.2 Biểu đồ tuần tự đăng nhập -¿-+¿©c++2x++rxrsrxrrrxerxesred 19 3.2.3 Biểu đồ tuần tự đăng xuất ©5¿22+c2cxcckerksrkrrrrerkrrree 20 3.2.4 Biểu đồ tuần tự tìm kiẾm - ¿2 + ©x+x+E+Exerkerrrrerrkerrees 20 3.2.5 Biểu đồ tuần tự quan tâm tour của cÔng ty - 5 s2 21 3.2.6 Biểu đồ tuần tự cập nhật thông tin (thêm, sửa, xóa) -. 21 3.2.7 Biểu đồ tuần tự lưu tour công ty - 22+ +xe+xerxsrserxrrssree 22 3.3 Biểu đồ thành phẩn -¿- 2-52 £+E£+E£EESEEEEEEEEEEE2E121121 21212 xe 22

3.4 Biểu đồ hoạt động -©2¿+2s+EE‡EEEE2E12212711211211 2111111211 xe 23

3.4.1 Biểu đồ hoạt động đăng nhập - 2 s+c++cxezzzrrrserxeee 23 3.4.2 Biểu đồ hoạt động đăng ký -©5¿+c2+ccEerkerrrrerkerreee 23

3.4.3 Biểu đồ hoạt động tìm kiếm -¿- 2¿©c++2x++cx++rxrrrxerresred 24 3.4.4 Biểu dồ hoạt động đăng bài -¿ 2¿©2+2c++cxccrxrrrxerresree 24 3.4.5 Biểu đồ hoạt động cập nhật thông tin ( thêm, sửa, xóa) 25 3.5 Phân tích hệ thống về dữ liệu -¿ -¿©s+++x++zx+zx+erxezrxrsrxez 25

3.5.1 _ Các thực thé và thuộc tính - - - c x+x+x+Ek+k+EeEEksEerertsxereresxee 25 3.5.2 Xác định mối quan hệ giữa các thực thê - 2 s+cs+cz+s+2 26

3.5.3 Thiết kế cơ sở đữ liệu :-©-¿+2++2EEc2EEEEEEEkrrrkrrrrerkerred 26 3.5.4 Thiết kế giao diện website - ¿+22 EEEerkerrrrkrrkerreee 28 CHƯƠNG IV: CÀI ĐẶT VÀ GIỚI THIỆU SAN PHÂM 33

4 Các bước chạy chương trình va gia0 điỆn - sc + ssessersrrs 33 4.1 Các bước chạy chương trÌnh - - - +s + ksxSvnnnHnHnHngg nệ, 33

4.1.1 BackEnd 2- 2kcckc2 2 E21 211211221 2121111 ctkcrei 33 4.1.2 FronfEnd -ĂĂc S S111 901 1 1 xxx ve 33

4.2 Giao diện của trang We€b c kg kg rr, 33

4.2.1 Màn hình đăng nhập - 5 cv kg 33

4.2.2 Man hinh dang kyo 34

4.2.3 Trang Chủ LG SH HH HH HH kh 35

4.2.4 Trang thông tin cá nhân - - <+« + + kSvk vn ng ngư 35

4.2.5 Trang đăng thông tin - Ăn HH gi, 36 4.2.6 Trang hiển thị danh sách tour và công ty .: -: s:-s+¿ 36 4.2.7 Trang hiển thị chi tiết thông tin tOur - 2 25c + s+£sz£zxzez 37 KET LUẬN VA HƯỚNG PHAT TRIEN -c¿cs+2cc+vrsvrxvererrrrree 38 TAI LIEU THAM KHẢO 2-2: S2 St+E+EEE+E+E5EEEESEEEEEESEEEEEESEEEEEEEEEEEEErkrrrreree 39

MỤC LUC HÌNH ANH

Hình 1: Mô tả về mô hình MVC 2- 2£ ©£©+++££+Ex++EEvrxeerxrrxeerxee 9 Hình 2: biểu đồ usercase tổng quát - 2-2-2 ©++E£+£2+E++E+Ex+rxersezes 13

Hình 3: Biểu đồ usercase phân rã cập nhật hồ sơ . 2-5: 14 Hình 4: Biểu đồ usercase phân rã cập nhật tOur 2-2 2 s2 s2 +: 15 Hình 5: Biểu đồ tuần tự đăng ký tài khoản 2 2©5s+cs+cxcrxcred 19

Hình 6: Biéu đồ tuần tự đăng nhập - 2-2522 22Ez+£crxerxerxered 19 Hình 7: Biểu đồ tuần tự đăng xuất 2-52-5222 2 2Eerxerkerrrrei 20 Hình 8: Biểu đồ tuần tự tìm kiếm 2-22 5©5£+xc£x+vExezzeerxeerxees 20 Hình 9: Biéu đồ tuần tự quan tâm tour của CONG ty -«« <<« 21 Hình 10: Biéu đồ tuần tự cập nhật thông tin 2-2 2 s2 21 Hình 11: Biểu đồ tuần tự lưu tour công ty 2- 2 2 s+zs+zxerxezed 22 Hình 12: Biểu đồ thành phan - 2-2 2 <+E+EE+EE£+E£2EE+EE+Exsrxerxered 22

Hình 13: Biểu đồ hoạt động đăng nhập 2-2-2 2 2 2+Ez£x+rszcxez 23 Hình 14: Biểu đồ hoạt động đăng ky 2-2 + + s+++E+Eerxsrszreee 23 Hình 15: Biểu đồ hoạt động tim kiếm 2-2-5 s2 s2 +2£+Ez£xsrxzcxez 24 Hình 16: Biểu đồ hoạt động đăng bài 2- 22522 2+£+rxsrxerseres 24 Hình 17: Biéu đồ hoạt động cập nhật thông tin -. 55555 «<5+<+ 25 Hình 18: Biéu đồ thực thé liên KẾ - - ¿6 + EE+E+EeEEEzEeEerxzverers 26 Hình 19: Màn hình thiết kế giao diện đăng nhâp - 5:52 28 Hình 20: Màn hình thiết kế giao diện đăng ký I -¿-5z=5¿ 29 Hình 21: Màn hình thiết kế giao diện đăng ký 2 - s52 29 Hình 22: Màn hình thiết kế giao điện trang chủ - 2-5-2 5+: 30

Hình 23: Màn hình thiết kê giao diện đăng thông tin - 30

Hình 24: Mà hình thiết kế giao diện thông tin cá nhân - 31

Hình 25: Màn hình thiết kế danh sách tour và công ty - 31

Hình 26: Màn hình thiết kế chi tiết thông tin tour -5z-52 32 Hình 27: Màn hình giao diện đăng nhập - 5 255555 *++sc+sessess 33 Hình 28: Màn hình giao diện đăng ký Ï 5555555 ++scc+sessess 34 Hình 29: Màn hình giao diện đăng ký 2 2¿- + ©cz+cxezzzvrxecrxeee 34 Hình 30: Màn hình giao diện trang chủ - s6 55s ++*+ssecsseessees 35 Hình 31: Màn hình giao diện trang thông tin cá nhân 35

Hình 32: Màn hình giao diện trang đăng thong tin ‹- «+ 36

Hình 33: Màn hình trang hién thị danh sách tour và công ty 36

Hình 34: Màn hình giao diện trang hiển thị chỉ tiết thông tin tour 37

TOM TAT NOI DUNG CHUYEN ĐÈ TOT NGHIỆP

Nội dung đồ án bao gồm việc tìm hiểu những lý thuyết về ngôn ngữ PHP, Javarscript dé lập trình webisite kết nối công ty du lịch Dau tiên là

tìm hiểu về phần BackEnd có PHP va framework Laravel, cơ sở dit liệuMysql, ngôn ngữ mô hình hóa UML phân tích thiết kế hệ thống Về phầnFrontEnd có Javascript và framework Vuejs, Boostrap Tiếp theo là quátrình xây dựng website kết nối các công ty du lịch của bản thân qua các

bước: Khảo sát, nắm bắt yêu cầu, phân tích thiết kế hệ thống, lập trình, cài

đặt thử nghiệm, đề xuất phương hướng trong tương lai.

Nội dung đồ án:

Toàn bộ nôi dung báo cáo của đô án gôm những nội dung chính sau:

- MỞ ĐẦU

- CHƯƠNG I: Tổng quan về dé tài

- CHƯƠNG II: Cơ sở lý thuyết

- CHƯƠNG III: Phân tích thiết kế hệ thống

- CHƯƠNG IV: Cai đặt và giới thiệu sản pham

- KÉT LUẬN VÀ HƯỚNG PHÁT TRIÊN

MỞ ĐẦU

Mục tiêu của chuyên đề tốt nghiệp

Mục tiêu của CHUYEN DE TOT nghiệp này là nhăm xây dựng một website theo chuân SPA kết nối các công ty du lịch thông qua đó:

- C4 nhân, công ty có thé tìm được một tour hoặc công ty phù hợp

cho chuyến du lịch của minh.

- _ Công ty có thé đăng tai các thông tin về tour du lịch cũng như của

công ty đó

- C4 nhân, công ty có thể lưu lại các tour hoặc công ty minh quan

tâm.

- Ca nhân, công ty đánh giá phản hôi đối tác qua việc trải nghiệm

thông qua website.

- _ Cá nhân, công ty có thé đăng ký nhận các email thông báo khi có

tour hoặc khách hàng có nhu cầu đi du lịch phù hợp với hồ sơ trên

trang web.

Các nhiệm vụ cụ thể của CĐTN

Nhiệm vụ cụ thể của CHUYÊN ĐỀ TÓT nghiệp là:

- Tìm hiểu các khái niệm, nghiệp vụ liên quan đến việc đăng tin,

tìm kiếm một tour du lịch.

- Lắng nghe yêu cầu thực tế từ khách hàng nằm rõ quy trình của

web công thông tin du lịch.

- Tìm hiểu phân tích thiết kế hệ thống website công thông tin du

lịch làm theo hướng đối tượng sử dụng ngôn ngữ UML.

- Thực hiện đồ án theo công nghệ VueJS framework, Laravel

framework theo mô hình MVC dap ứng được các yêu cầu chínhcủa hệ thông công thông tin du lịch

CHƯƠNG I: TONG QUAN VE DE TÀI

1.1 Tổng quan tinh hình nghiên cứu thuộc lĩnh vực của đề tài

Hiện nay, nền công nghiệp 4.0 đang ngày càng phát triển, thúc đâycác hoạt động phát triển theo, đặc biệt là các thông tin, tin tức về các ngànhnghề, lĩnh vực Và ngành du lịch cũng không phải là một ngoại lệ, vậy làm

thế nào để thông tin đến với mọi người, dễ dàng tìm kiếm, trao đổi hay

thương lượng về giá cả Nhu cầu tìm kiếm đi du lịch cao vì vậy mộtwebsite đăng tin giới thiệu về từng công ty là rất cần thiết dé cả khách hànglẫn công ty đều có thé tìm đến nhau một cách dễ dàng

Với nhu cầu tìm kiếm cũng như di du lịch tăng làm sao dé một cá

nhân, công ty muốn tìm những tour du lịch phù hợp hay lưu lại thông tin

công ty mà mình quan tâm, để việc quản lý các thông tin đó trở nên dễdàng tiện lợi nhất Book tour từ xa, chào giá tour trở nên thuận lợi và tiếtkiệm nhất

Các công ty đăng tin du lịch dé dàng quản ly được tour du lịch mình

đã đăng, xem các hồ sơ khách đã đặt tour một cách nhanh chóng và thuận

tiện Việc quan lý lưu trữ hay quan tâm tới các khách hàng tiềm năng phù

hợp với yêu cầu của công ty trở nên dé dàng Hay việc quản lý hạn đăng tintuyển dụng sẽ được tự động hóa

Hiện nay có khá nhiều trang website du lịch nhưng chủ yếu dànhcho riêng một công ty lữ hành và đa số là sẽ lớn Đối với các công ty nhỏ

hơn việc có một website giới thiệu cũng như quảng bá các tour du lịch của

công ty ra điều rất cần Vì vậy với website tìm kiếm du lịch này sẽ chú trọng vào đối tượng là tất các công ty có nhu cầu đăng tin và tìm kiếm

khách hàng Website sẽ giúp các công ty, dễ dàng tìm được các khách hàng

phụ hợp với mình để có thể đem lại cho họ những phút giây du lịch tuyệt

vời nhất.

1.2 Thực tiễn của bài toán

Trong quá trình khảo sát em thấy đa số sang web chỉ dành riêng cho

một công ty lữ hành nhất định Rat ít trang web đứng ra dé bao quát và tập

hợp toàn bộ các công ty lại để người dùng có thé dé dàng lựa chọn hơn Vì

vậy việc tham khảo giá cũng sẽ khá bắt tiện Vì vậy các công ty lữ hành sẽ

cần đến một trang web đề có thé đăng tải các gói du lịch mà mình đang cần

tìm khách hàng, đồng thời có thể chăm sóc được khách hàng qua mỗi lần

trải nghiệm Việc phát triển website đăng tin về công ty du lịch sẽ giúp các

công ty lữ hành, các cá nhân:

- Dễ dàng quản lý công việc, khách hàng

- Dé dàng đánh giá công ty qua mỗi lần trải nghiệm.

- Dễ dang tìm kiếm, quan tâm đến công ty, tour du lịch phù hợp

- Tạo nên một cộng đồng chia sẻ, cùng hợp tác và phát triển

Do vậy, em hy vọng sẽ tạo nên một website hoàn chỉnh nhất có

thê dé đáp ứng được yêu câu đặt ra cũng như ky vọng, nhiệt tình giúp

đỡ từ thây cô.

1.3 Đối tượng và phạm vi bài toán

1.3.1 Đối tượng:

Hệ thống website kết nối du lịch được xây dựng trên mục đích phục

vụ cho việc tìm kiếm những tour du lịch của các công ty khác nhau, từ đó

có thể đưa ra những quyết định phù hợp cho chuyến đi của mình Và các công ty du lịch cũng có thể đăng tin quảng bá về tour du lịch của mình trên

trang web I cách đơn giản nhất, và cũng có thể thêm sửa xóa bat cứ thôngtin gì về tour du lịch của công ty minh 1 cách dé dàng

1.3.2 Pham vi:

Pham vi được sử dung trên website đối với quan trị viên, người dùng làcông ty du lịch hoặc khách du lịch.

1.4 Mô tả bài toán

Một blog website về kết nối du lịch Đây là trang web giới thiệu vềtat cả những gi liên quan đến lĩnh vực du lịch của Việt Nam đến khách

hàng tham quan website, nhằm thu hút khách hàng tham quan website lần sau Chủ đạo của website là giới thiệu các điểm du lịch trong nước, các chương trình về tour, các công ty lữ hành.

Tại đây người dùng có thế tìm kiếm và xem tất cả các tour du lịch

mà mình quan tâm của tất cả những công ty lữ hành đã đăng ký và đăng tải

trên trang blog này Qua đó người dùng có cái nhìn tổng quan về giá, dịch

vụ của các tour, nói chung là các tiêu chí để có thể đưa ra những quyết

định phù hợp rằng là có chọn công ty này với dịch vụ và giá cả như thế nàyhay không hay là chọn công ty du lịch kia với giá thấp (cao) hơn Điều này

còn giúp người dùng không phải so sánh 1 cách bất tiện đó là tìm kiếm

từng website của từng công ty rồi phải qua từng trang dé nhìn giá

Người dùng có thé tìm kiếm bang việc tìm qua tên công ty du lịch.

Ví dụ người này đã từng trải nghiệm dịch vụ tour của công ty A thì sẽ

muốn quan tâm đến nhiều tour hơn của họ và muốn so sánh với dịch vụ

công ty B chăng hạn Hay việc các công ty có thé nhìn vào dich vụ của đối thủ mà muốn có thêm nhiều chiến lược thu hút khách hàng hơn Ngoài

ra còn có thé tìm theo chi nhánh của từng công ty tại điểm du lịch bạn sẽ

đến hoặc địa điểm xuất phát.

Sau khi đã tìm được tour phù hợp người dùng có thể liên hệ cho

công ty qua số điện thoại đã được đăng ký hoặc truy cập thăng đến website

của công ty đó dé đặt tour

Đối với người quản lý: Cần năm bắt được các thông tin về các công

ty du lịch đã đăng ký tour và xác nhận với công ty đó qua mail hoặc số điện

thoại đã được đăng ký Xác nhận các thông tin mà người đại diện công ty

đó đã đăng ký.

1.4.1 Khảo sát nghiệp vụ

1.411 Uu điểmHiện nay trên internet có rất nhiều website book tour du lịch như:mytour.vn, saigontourist.net, travel.com.vn đã triển khai tốt các nghiệp

vụ đăng tin, tìm kiếm tour vì vậy day cũng là một nguồn tham khảo cácnghiệp vụ tốt để em có thé áp dụng vao dé tài kết hợp với yêu cau bài toán.Song với đặc thù bài toán đặt ra là một trang web tìm kiếm công ty du lịchnên nó sẽ bao quát hơn chứ không chỉ giới thiệu về tour của 1 công ty Các

trang web book tour du lịch hiện có trên internet đã triển khai tốt các nội

dung như:

- _ Đăng tin về tour cho từng địa điểm

- Tim kiếm tour

Mỗi cá nhân người dùng muốn đăng nhập cần có một tài

khoản đẻ có thê truy cập và tương tác với trang web.

1.4.2.2 Đăng nhập

Khi người dùng đăng nhập thành công thông tin đã đăng ký thì sẽ

được truy cập và sẽ được cấp quyền tương tác trên trang web ứng với phân

loại của mỗi người

1.4.2.3 Xác thực thông tin

Sẽ gửi mail đến địa chỉ của công ty hoặc người quản lý có thé gọi điện

để xác nhận thông tin mà công ty đã đăng ký Nếu k đúng hoặc khôngchính xác có thé xóa bài va tài khoản

1.4.2.4 Quản ly bài đăngBài đăng sẽ được đăng lên nếu như người dùng là công ty du lịch Sẽ được đăng bài về từng tour của công ty và không được đăng đưới tên một

công ty khác tránh tình trạng mạo danh hay làm mắt uy tín của nhau Sẽ có

quyền thêm, sửa, xóa bai đăng của mình nhưng không được quyền thêm

sửa xóa của người khác

1.4.2.5 Xem bai dang

Moi người dùng đã đăng ký và đăng nhập thành công được vào hệ

thống có thể xem danh sách bài đăng của bất cứ công ty nào được đăng tải trên trang chính Ngoài ra có thé vào và xem chỉ tiết cụ thé từng bài đăng một như về: mô tả, giá cả, địa điểm xuất phát,

1.4.2.6 Quản ly người dùng

Người dùng sẽ được phân loại là người dùng bình thường với người

dùng là công ty du lịch Người dùng bình thương sẽ chỉ có quyền đăng

nhập, xem bài đăng, và bình luận Người dùng là công ty du lịch sẽ có thêm

quyền được đăng bài sửa bài, nhưng chỉ trong phạm vi là bai đăng của

chính công ty đó.

1.4.2.7 Quản lý đăng xuất

Người dùng không còn công việc cần thiết tại trang web nữa có thể

đăng xuất ra Hệ thống sẽ nhận biết và thoát quyền hoạt động của người

dùng đó trên trang web Và chờ lần truy cập tiếp theo dé có thé sử dụng

tiếp.

1.4.3 Các yêu cầu về hệ thống

1.4.3.1 Yêu cau về chức năng

Sau khi tìm hiểu vào khảo sát thì em thấy nên có nhưng chức

năng thiệt yêu như sau:

e Đăng ký, đăng nhập.

e Xem danh sách bai đăng.

e Xem chỉ tiết mỗi bai đăng mà minh quan tâm e_ Chức năng tìm kiếm bộ lọc kết quả

e Chức năng đăng ký nhận thông tin qua mail.

e Cập nhật chi tiết hồ sơ người dùng

e_ Cập nhật chi tiết hồ sơ của từng bài đăng trên web.

e Đăng tin quảng cáo về công ty

e Đánh giá công ty sau khi trải nghiệm dịch vụ.

e Thiết lập hồ sơ cho công ty.

1.4.3.2 Yêu câu về giao điện

e Vệ giao diện cân có những yêu câu như sau:

e Trang chủ giao diện đơn giản, thân thiện.

e Trang tìm kiếm, kết quả làm nổi bật các trường quan

trọng như: tên công ty, các gói du lịch, địa diém,

e Bô cục hài hòa, màu sac dé nhìn.

1.4.3.3 Yêu cau về hệ thong

e Hoạt động nhanh chính xác.

© Có thé cập nhật, bảo trì dé dàng.

Chương II: CƠ SỞ LÝ THUYET

2 Noi dung chính

Nội dung chính của chương 1 là giới thiệu các cơ sở lý thuyết, cáchthức hoạt động áp dụng vào đồ án xây dựng website tìm kiếm công ty dulịch Kết thúc chương 1 sẽ xác định đúng cơ sở lý thuyết để giải quyết yêu

cầu đồ án xây dựng website tìm kiếm công ty du lịch.

2.1 Phương pháp phân tích và thiết kế hướng đối tượng UML

2.1.1 Hướng đối tượng là gì?

Đối tượng là những sự vật, sự việc mà có những tính chất, đặc tính,

hành động giống nhau và ta gom góp lại thành đối tượng.

Ví dụ: Sinh viên là một đối tượng vì sinh viên có các đặc tính nhưtên, mã sinh viên, giới tính và những hành động như đi học, điểm

danh Mỗi sinh viên là thể hiện của đối tượng sinh viên.

2.1.2 Khái niệm phân tích hướng đối tượng (object Oriented

Analysis — OOA)

Phân tích hướng đối tượng là gia đoạn phát triển một mô hình chính

xác và súc tích của van dé, có thành phần là các đối tượng và khái niệm đời thự, deex hiểu đối với người sử dụng Sử dụng phương pháp đối tượng

chúng ta có thé mô hình hóa các thực thé thuộc một van dé có thực mà van

giữ được cấu trúc, quan hệ cũng như hành vi của chúng.

2.1.3 Khái niệm thiết kế hướng đối tượng (Object Oriented Design

—OOD)

Thiết kế hướng đối tượng là giai đoạn tổ chức chương trình thành các

tập hợp đối tượng cộng tác, mỗi đối tượng trong đó là thực thể của một lớp.Các lớp là thành viên của một cây cấu trúc với mối quan hệ thừa kế

Mục đích của giai đoạn OOD là tạo thiết kế dựa trên kết quả cua giai

đoạn OOA, dựa trên những quy định phi chức năng, những yêu cầu về môi trường, những yêu cầu về khả năng thực thi.

Trong giai đoạn OOD, nhà thiết kế định nghĩa các chức năng, thủ

tục, thuộc tính cũng như mối quan hệ của một hay nhiều lớp.

2.1.4 Khái niệm UML

Ngôn ngữ mô hình hóa thống nhất (Unifield Modeling Language UML) là một ngôn ngữ mô hình hóa thống nhất, có phần chính bao gồm

-những ký hiệu hình học, được các phương pháp hướng đối tượng sử dụng

dé thê hiện và miêu tả các thiết kế của một hệ thống UML là một ngôn ngữ

dé đặc tả, trực quan hóa, xây dựng, UML có thể được sử dụng làm công cụ

giao tiếp giữa người dùng, nhà phân tích, nhà thiết kế và nhà phát triển

phần mềm.

eUML được xây dung với chủ dich là:

e Mô hình hóa các hệ thống sử dụng các khái niệm đối tượng

e Thiêt lập một kêt nôi từ nhận thức cua con người đên các sự kiện can

mô hình hóa.

e Giải quyết van đề về mức độ kế thừa trong các hệ thống phức tạp, có

nhiều ràng buộc khác nhau

e Tạo một ngôn ngữ mô hình hóa có thé sử dụng bởi người và máy

2.2 Mô hình MVC

2.2.1 Khái niệm mô hình MVC

Controller

Database

MVC là chữ viết tắt của Model — View — Controller, đây là một mô

hình kiến trúc phần mềm được tạo ra với mục đích quản lý và xây dựng dự

án phần mềm có hệ thống hon Mô hình này được dùng khá rộng rãi và đặc

biệt là trong các ngôn ngữ lập trình web.

Trong mô hình này thì:

eModel: có nhiệm vụ thao tác với co sở dit liệu, nghĩa là nó sẽ chứa

tat cả các hàm, các phương thức truy vấn trực tiếp với dir liệu và controller

sẽ thông qua hàm, phương thức đó dé lay dữ liệu rồi gửi qua view

eView: có nhiệm vụ tiệp nhận dữ liệu từ controller và hiên thị nội

dung qua giao diện website.

e Controller: dong vai trò trung gian giữa model và view, có nhiệm vụ

tiếp nhận yêu cầu từ client sau đó xử lý request, load model tương ứng và gửi data qua view tương ứng rồi gửi trả kết quả về cho client.

2.2.2 Ưu nhược điểm của mô hình MVC

Uu điểm:

eHé thống phân ra từng phần nên dé dàng phát trién.

e Chia thành nhiêu modun nhỏ nên nhiều người có thể làm dự án

e Vẫn dé bảo trì nâng cấp dé dàng hon.

e Dễ dàng debug trong quá trình xây dựng

Laravel là một framework của ngôn ngữ PHP, được phát hành vào

6/2011, gồm những đặc điểm nổi bật như Eloquent ORM, localization,

models and relationship, routing, views, được tạo ra dé khac phục nhữngvan dé còn vướng mắc và thiếu sót của codeigniter còn gặp phải

Tại thời điểm hiện tại Laravel đã nâng cấp đến phiên bản 8.x, trong

đồ án lần này thì em sẽ dùng Laravel 7.x

10

2.3.3 Tai sao nên lựa chọn Laravel ?

= Được thừa hưởng những thế mạnh của các framework khác

= Có số lượng người dùng nhiều đồng nghĩa có nhiều thư viện hỗ trợ

= Document rõ rang, dé doc

= Các lệnh tương tác với co sở dữ liệu ngắn ngọn

= Route rat mạnh tiện lời cho việc điêu hướng

2.4 VueJs framework

2.4.1 Vuejs framework là gi?

Nếu như Laravel là framework của PHP thi Vue là framework của Javascipt sẽ được em dùng để thiết kế phần FrontEnd Là framework sinh sau dé muộn nhất nếu so với các AngularJs hay ReactJs Những framework

như vừa kể trên có thể giúp việc tạo ra một trang web theo chuẩn SPA(Single Page Application)

2.4.2 Tai sao lai chon Vue ?

= Dễ dàng xây dựng lên một Project mà ko cần quá nhiều bước

= Dễ dàng tạo cấu trúc source Project với Vue-CLI( em dùng trong đồ

án )

= Có nhiều các thư viện hỗ trợ lập trình viên

= Hệ sinh thái vững chắc với các add-on: vue-router, vuex,

vue-dev-tool,

2.4.3 Xampp

Xampp là phần mềm tạo máy chủ web server trên máy tính cá nhân

hiệu quả và thông dụng tích hợp nhiều công cụ hữu ích Nó tương thích vớivới nhiều hệ điều hành như: Windows, Linux, MacOS, Cross-platform và

Solaris Hoàn toàn miễn phí và dùng mã nguồn mở, cấu hình web servernhẹ.

Phiên ban trong đồ án là Xampp version 7.3.27 / PHP 7.3.27 dé tươngthích với phiên bản PHP 7.x.

11

Chương III: PHAN TÍCH VÀ THIET KE HE THONG

3 Noi dung chương

Trong chương nay: Phân tích thiết kế hệ thống, trình bày các quy trìnhnghiệp vụ, phân tích, thiết kế (dữ liệu, chức năng) của phần mềm, có các

user case, biểu đồ luồng dữ liệu, mô hình thực thé liên kết, bảng thiết kế chi

tiết cơ sở dữ liệu Đây là chương quan trọng nhằm xác định được các tác

nhân, chức năng cụ thể của hệ thống một cách chi tiết nhằm phục vụ cho

việc bắt tay vào viết chương trình

3.1 Biêu đô Usercase

3.1.1 Usercase tổng quátBảng kí hiệu:

Là một tác nhân trong hệ thông, có thê là người

dùng hoặc người quan tri viên có một vai trò Actor ¬ :

nhât định trong hệ thông, có thê thực hiện được

nhiều UseCase

: —<—— La thành phan co ban nhất của so đồ UseCase UseCase ( Usercase ) Được biéu diễn bằng hình elip Mỗi UseCase

>> | hiển thị một chức năng trong hệ thống.

¬ = Được dùng dé miêu tả mối quan hệ giữa các đối

Accociation tượng trong so đồ.

Dependency; - > Miêu tả su phụ thuộc giữa các đối tượng.

12

Gang ký nhân Đăng nhập bằng

3.1.2.1 Biểu đô usercase phân rã cập nhật hồ sơ

Người dùng có thé vào trang cá nhân dé xem thông tin, sửa thông tin hoặc đổi mật khẩu

13

Hình 3: Biéu đồ usercase phân rã cập nhật hồ sơ

3.1.2.2 Biểu đô usercase phân rã cập nhật tour

Công ty du lịch có thé vào phan thông tin tour và có thé sửa thông tin,hoặc xóa thông tin của tour

Hình 4: Biéu đồ usercase phân rã cập nhật tour3.1.3 Đặc ta chức năng

3.1.3.1 Đăng kyĐiều kiện: người dùng đã truy cập website và chưa có tài khoản hoặc muốn đăng ký tài khoản mới

Luéng su kién chinh:

BI Người dùng chon mục đăng ký.

B2 Nhập day đủ thông tin bắt buộc và click vào nút đăng ký

B3 Website đưa ra thông báo đăng ký thành công và đưa tới trang đăng nhập

BI Người dùng chọn chức năng đăng nhập.

B2 Người dùng nhập tên đăng nhập và mật khâu, click nút đăng nhập

B3 Website thông báo đăng nhập thành công và tiếp tục truy cậpwebsite.

B4 Kết thúc usecase

Luông sự kiện phụ

B2.1 Người dùng không điền day đủ thông tin đăng nhập, website đưa ra thông báo yêu cầu điền đầy đủ thông tin và quay lại B2.

B2.2 người dùng nhập sai thông tin đăng nhập, website đưa ra thông

báo yêu cầu nhập lại và quay lại B2.

B2.3 người dùng chọn đăng nhập bằng facebook, website yêu cầu

đăng nhập facebook và kiểm tra nếu có quyền đăng nhập facebook đưa ra thông báo đăng nhập thành công và tiếp tục B3, ngược lại không có quyền đăng nhập quay lại BI.

3.1.3.3 Đăng xuất

15

Điều kiện: người dùng đã truy cập vào website và đăng nhập hệ

thống

BI Người dùng chọn chức năng đăng xuất.

B2 Website xác nhận lại yêu cầu đăng xuất

B3 Website xóa thông tin đăng nhập và trở về trang chủ

B4 Kết thúc usecase

3.1.3.4 Tìm kiếm

Điều kiện: người dùng đã truy cập vào website và đăng nhập hệ

thống.

BI Người dùng bắm vào xem tour

B2 Nhập từ khóa vào | hoặc nhiều ô tìm kiếm tương ứng: tên công ty,chi nhánh, điểm bat dau

B3 Bam vào nút tìm kiếm.

B4 Website trả về kết quả tìm kiếm.

B5 Kết thúc usecase

3.1.3.5 Lưu quan tâm tour, công tyĐiều kiện: người dùng đã truy cập vào website và đăng nhập hệ

thống.

BI Người dùng bắm vào xem tour

B2 Nhập từ khóa vào 1 hoặc nhiều 6 tìm kiếm tương ứng: tên công ty,

chi nhánh, điểm bat dau

B3 Bam vào nút tìm kiếm

B4 Website trả về kết quả tìm kiếm.

BS Người dùng bam vào nút quan tâm công ty.

3.1.3.6 Cập nhật hô sơ cá nhân

Điều kiện: người dùng đã truy cập vào website và đăng nhập hệ thông.

BI Người dùng chọn chức năng xem hồ sơ (tên của người dùng gan nút đăng xuất).

16

B2 Người dùng click vào nút sửa thông tin.

B3 Người dùng điền đầy đủ thông tin hồ sơ và click vào nút cập nhật

hồ sơ

B4 Website đưa ra thông báo cập nhật thành công.

B5 Kết thúc usecase

3.1.3.7 Đăng thông tin vé tour

Điều kiện: người dùng đã truy cập vào website va đăng nhập vào hệ thông.

BI Chọn chức năng đăng tin về công ty

B2 Người dùng nhập đầy đủ thông tin yêu cầu và nhắn vào nút đăngtin.

B3 Website đưa ra thông đăng tin thành công và chuyển đến trang

xem danh sách tour đã đăng.

B4 Kết thúc usecase

3.1.3.8 Cáp nhật thông tin tour

BI Người dùng chọn chức năng xem chỉ tiết bài đăng

B2 Người dùng click vào nút sửa thông tin.

B3 Người dùng điền đầy đủ thông tin hồ sơ và click vào nút cập nhật

BI Người dùng bam nút xem chi tiết của bai đăng công ty đó

B2 Bam vào mục bình luận

B3 Điền các thông tin đánh giá và nhắn nút đánh giá

B4 Website đưa ra thông báo đánh giá thành công.

B5 Kết thúc usecase.

17