(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM

(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM(Đồ án tốt nghiệp) Xây dựng website quản lý tham quan của phòng Quan hệ doanh nghiệp tại Trường Đại học Sư phạm Kỹ thuật TP.HCM

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP HỒ CHÍ MINH

KHOA ĐÀO TẠO CHẤT LƯỢNG CAO

Ngành: CÔNG NGHỆ THÔNG TIN

GVHD: THS NGUYỄN MINH ĐẠO

i

LỜI CẢM ƠN

Lời đầu tiên, cho phép nhóm em được gửi lời cảm ơn chân thành đến thầy Nguyễn Minh Đạo, người đã phụ trách hướng dẫn nhóm chúng em trong việc thực hiện và hoàn thành bài báo cáo một cách tốt và hiệu quả nhất Những sự chỉ dạy, nhật xét, đóng góp ý kiến từ thầy đã góp phần rất quan trọng trong việc giúp chúng em hoàn hành đề tài một cách hoàn thiện nhất Cảm ơn các thầy cô trong khoa Công Nghệ Thông Tin đã luôn nhiệt tình, cống hiến, tận tình giải đáp các thắc mắc của chúng em Bên cạnh đó, chúng em xin được cảm ơn các bạn cùng khóa, các anh chị khóa trên đã không ngần ngại chia sẻ các thông tin, kinh nghiệm bổ ích giúp chúng

em hoàn thiện hơn đề tài của mình Báo cáo được thực hiện trong một khoảng thời gian có hạn, cùng với những hạn chế về mặt kiến thức nên việc sai sót là điều không thể tránh khỏi trong quá trình thực hiện Chúng em kính mong nhận được những lời nhận xét, ý kiến đóng góp quý báo từ quý Thầy Cô để chúng em có thêm kinh nghiệm

và hoàn thành tốt hơn những đề tài sau này

Chúng em xin chân thành cảm ơn!

- Tìm hiểu về nghiệp vụ quản lý tham quan

2 Các vấn đề phát sinh

- Phía khách hàng thay đổi một số nghiệp vụ trong quá trình xây dựng website

- Không hiểu rõ mong muốn của khách hàng

3 Các phương pháp giải quyết vấn đề

- Tái sử dụng và thêm một số chức năng để phù hợp với nghiệp vụ thay đổi

- Tiến hành nhiều cuộc thảo luận để giải quyết vần đề được đưa ra

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

- Website quản lý tham quan

- Xây dựng được hệ thống dễ dàng bảo trì, phát triển và mở rộng

- Learn about tour management profession

2 Problems arise

- The client side changes some operations during the construction of the website

- Not understanding what the customer wants

3 Problem Solving Methods

- Reuse and add some functionality to accommodate changing business

- Conduct a lot of discussions to solve the problem raised

4 Results achieved

- Website management visit

- Build a system that is easy to maintain, develop and expand

iv

MỤC LỤC

LỜI CẢM ƠN i

TÓM TẮT BẰNG TIẾNG VIỆT ii

TÓM TẮT BẰNG TIẾNG ANH iii

MỤC LỤC iv

DANH MỤC TỪ VIẾT TẮT viii

DANH MỤC BẢNG ix

DANH MỤC HÌNH ẢNH xiii

CHƯƠNG 1 TỔNG QUAN 1

1.1 Tính cấp thiết và mục tiêu của đề tài 1

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

1.1.2 Mục đích của đề tài 1

1.2 Đối tượng, phạm vi và phương pháp thực hiện 2

1.2.1 Đối tượng nghiên cứu 2

1.2.2 Phạm vi 2

1.2.3 Phương pháp thực hiện 2

1.3 Kết quả dự kiến đạt được 2

CHƯƠNG 2 CƠ SỞ LÝ THUYẾT 3

2.1 Spring Framework 3

2.1.1 Một số khái niệm chính 3

2.1.2 Các module 6

2.2 Spring Boot 7

2.2.1 Tổng quan về Spring Boot 7

2.2.2 Tạo một Spring Boot Application 8

v

2.3 Angular 8

2.3.1 Tổng quan về Angular 8

2.3.2 Mô tả 8

2.3.3 Mô hình 8

2.4 MongoDB 10

2.4.1 Mô hình 10

2.4.2 Đặc trưng 11

2.4.3 Ưu điểm 12

2.4.4 Nhược điểm 12

2.5 Các công nghệ và thư viện khác 12

2.5.1 JSON Web Token 12

2.5.2 Ant Design of Angular 13

CHƯƠNG 3 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 14

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

3.2 Xác định yêu cầu 15

3.2.1 Yêu cầu chức năng 15

3.2.2 Yêu cầu phi chức năng 18

CHƯƠNG 4 ĐẶC TẢ CHỨC NĂNG 19

4.1 Định nghĩa usecase 19

4.1.1 Actor 19

4.1.2 Usecase 20

4.2 Lược đồ use case 24

4.3 Đặc tả use case 28

4.3.1 Quản lý lĩnh vực 28

vi

4.3.2 Quản lý chuyến tham quan 31

CHƯƠNG 5 THIẾT KẾ ỨNG DỤNG 44

5.1 Thiết kế dữ liệu 44

5.1.1 Sơ đồ thiết kế dữ liệu 44

5.1.2 Mô tả sơ đồ thiết kế dữ liệu 45

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

5.3 Sơ đồ tuần tự (Sequence Diagram) 63

5.3.1 Sequence Hủy đăng ký dẫn đoàn 63

5.3.2 Sequence Đăng ký chuyến 64

5.3.3 Sequence Đăng ký dẫn đoàn 65

5.3.4 Sequence Thực hiện khảo sát 66

5.3.5 Sequence Thêm mới sinh viên vào chuyến bằng form 67

5.3.6 Sequence Thêm mới lĩnh vực 67

5.3.7 Sequence Cập nhật lĩnh vực 68

5.3.8 Sequence Thay đổi trạng thái lĩnh vực 69

5.4 Thiết kế giao diện 69

5.4.1 Phía người dùng 69

5.4.2 Phía admin 72

5.4.3 Phía cộng tác viên 92

5.4.4 Phía giảng viên 103

5.4.5 Phía sinh viên, doanh nghiệp 115

CHƯƠNG 6 CÀI ĐẶT VÀ KIỂM THỬ ỨNG DỤNG 118

6.1 Cài đặt ứng dụng 118

6.1.1 Thư viện và môi trường phát triển 118

vii

6.1.2 Lệnh cài đặt và chạy chương trình 118

6.1.3 Các bước cài đặt 118

6.2 Kiểm thử phần mềm 119

6.2.1 Chức năng thêm mới cộng tác viên 119

6.2.2 Chức năng đăng ký, hủy đăng ký dẫn đoàn 120

6.2.3 Chức năng đăng ký chuyến tham quan quyền giảng viên 121

CHƯƠNG 7 KẾT LUẬN 123

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

7.2 Ưu điểm và nhược điểm 123

7.2.1 Ưu điểm 123

7.2.2 Nhược điểm 123

7.2.3 Khó khăn 124

7.3 Kinh nghiệm đạt được 124

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

TÀI LIỆU THAM KHẢO 126

viii

DANH MỤC TỪ VIẾT TẮT

DI: Depedency Injection

IoC: Inversion of Control

JWT: JSON Web Token

HTTP: Hyper Text Transfer Protocol

API: Application Programming Interface

MIT: Massachusetts Institute of Technology

ix

DANH MỤC BẢNG

Bảng 2.1 Ưu khuyết điểm của DI 5

Bảng 4.1 Actor 19

Bảng 4.2 Usecase 20

Bảng 4.3 Đặc tả use case "Xem danh sách lĩnh vực" 28

Bảng 4.4 Đặc tả use case "Cập nhật lĩnh vực" 29

Bảng 4.5 Đặc tả use case "Thay đổi trạng thái lĩnh vực" 29

Bảng 4.6 Đặc tả use case "Tìm kiếm lĩnh vực" 30

Bảng 4.7 Đặc tả use case "Thêm mới lĩnh vực" 30

Bảng 4.8 Đặc tả use case "Xem danh sách chuyến tham quan theo trạng thái" 31

Bảng 4.9 Đặc tả use case "Tìm kiếm chuyến tham quan" 32

Bảng 4.10 Đặc tả use case "Xem theo trạng thái chờ duyệt" 32

Bảng 4.11 Đặc tả use case "Xem theo trạng thái đang xử lý" 33

Bảng 4.12 Đặc tả use case "Xem theo trạng thái sẵn sàng chưa có đợt" 33

Bảng 4.13 Đặc tả use case "Xem theo trạng thái sẵn sàng" 34

Bảng 4.14 Đặc tả use case "Xem theo trạng thái hủy" 35

Bảng 4.15 Đặc tả use case "Upload file quyết định của BGH" 35

Bảng 4.16 Đặc tả use case "Xem danh sách cộng tác viên" 36

Bảng 4.17 Đặc tả use case "Xét duyệt cộng tác viên" 36

Bảng 4.18 Đặc tả use case "Xem danh sách sinh viên tham quan" 37

Bảng 4.19 Đặc tả use case "Thêm mới sinh viên tham quan" 37

Bảng 4.20 Đặc tả use case "Import danh sách sinh viên" 38

Bảng 4.21 Đặc tả use case "Điểm danh bù sinh viên" 39

Bảng 4.22 Đặc tả use case "Filter chuyến tham quan" 41

Bảng 4.23 Đặc tả use case "Thêm mới chuyến tham quan" 42

Bảng 4.24 Đặc tả use case "Lưu trữ hồ sơ" 42

Bảng 4.25 Đặc tả use case "Xem timeline graphic" 43

Bảng 5.1 Mô tả collection bai-viet 45

Bảng 5.2 Mô tả collection banner 46

x

Bảng 5.3 Mô tả collection cau-hinh-he-thong 46

Bảng 5.4 Mô tả collection chuyen-tham-quan 46

Bảng 5.5, Mô tả collection cong-tac-vien 48

Bảng 5.6 Mô tả collection doanh-nghiep 48

Bảng 5.7 Mô tả collection dot-tham-quan 49

Bảng 5.8 Mô tả collection file-huong-dan 50

Bảng 5.9 Mô tả collection giang-vien 50

Bảng 5.10 Mô tả collection hoc-ham 51

Bảng 5.11 Mô tả collection hoc-vi 51

Bảng 5.12 Mô tả collection ket-qua-khao-sat-cong-tac-vien 52

Bảng 5.13 Mô tả collection ket-qua-khao-sat-doanh-nghiep 52

Bảng 5.14 Mô tả collection ket-qua-khao-sat-sinh-vien 53

Bảng 5.15 Mô tả collection khoa 53

Bảng 5.16 Mô tả collection my-file 53

Bảng 5.17 Mô tả collection nganh 54

Bảng 5.18 Mô tả collection side-banner 54

Bảng 5.19 Mô tả collection sinh-vien 55

Bảng 5.20 Mô tả collection tai-khoan 55

Bảng 5.21 Mô tả collection van-ban-bieu-mau 56

Bảng 5.22 Mô tả collection xac-thuc-token 56

Bảng 5.23 Mô tả document cau-hoi-khao-sat-cong-tac-vien 56

Bảng 5.24 Mô tả document cau-hoi-khao-sat-doanh-nghiep 58

Bảng 5.25 Mô tả document cau-hoi-khao-sat-sinh-vien 58

Bảng 5.26 Mô tả document cong-tac-vien-dan-doan 59

Bảng 5.27 Mô tả document dia-diem 59

Bảng 5.28 Mô tả document GPS 60

Bảng 5.29 Mô tả document ket-qua-khao-sat 60

Bảng 5.30 Mô tả document linh-vuc 60

Bảng 5.31 Mô tả document phuong-tien 60

xi

Bảng 5.32 Mô tả document sinh-vien-tham-quan 61

Bảng 5.33 Mô tả màn hình phía admin 69

Bảng 5.34 Mô tả màn hình đăng nhập 70

Bảng 5.35 Mô tả màn hình quên mật khẩu 71

Bảng 5.36 Mô tả màn hình phía admin 72

Bảng 5.37 Mô tả màn hình danh sách chuyến tham quan 73

Bảng 5.38 Mô tả màn hình thêm mới chuyến tham quan 76

Bảng 5.39 Mô tả màn hình chỉnh sửa danh sách sinh viên 80

Bảng 5.40 Mô tả màn hình thêm sinh viên tham quan 81

Bảng 5.41 Mô tả màn hình điểm danh bù 82

Bảng 5.42 Mô tả màn hình nhập danh sách sinh viên 83

Bảng 5.43 Mô tả màn hình chỉnh sửa danh sách cộng tác viên 85

Bảng 5.44 Thêm cộng tác viên dẫn đoàn 86

Bảng 5.45, Mô tả màn hình chỉnh sửa chuyến tham quan 87

Bảng 5.46 Mô tả màn hình uploadfile quyết định của BGH 91

Bảng 5.47 Mô tả màn hình phía cộng tác viên 92

Bảng 5.48 Mô tả màn hình chính phía cộng tác viên 94

Bảng 5.49 Mô tả màn hình xem thông tin chuyến tham quan 95

Bảng 5.50 Mô tả màn hình xác nhận đăng ký chuyến tham quan 96

Bảng 5.51 Mô tả màn hình điểm danh chuyến 97

Bảng 5.52 Mô tả màn hình checkin/ checkout 98

Bảng 5.53 Màn hình điểm danh sinh viên 99

Bảng 5.54 Mô tả màn hình điểm danh bằng QR code 100

Bảng 5.55 Mô tả màn hình điểm danh nhập liệu 101

Bảng 5.56 Mô tả màn hình khảo sát 102

Bảng 5.57 Mô tả màn hình thực hiện khảo sát 102

Bảng 5.58 Mô tả màn hình phía giảng viên 103

Bảng 5.59 Mô tả màn hình chính của giảng viên 105

Bảng 5.60 Mô tả màn hình thêm mới chuyến tham quan 106

xii

Bảng 5.61 Mô tả màn hình thêm mới doanh nghiệp 109

Bảng 5.62 Mô tả màn hình chỉnh sửa chuyến tham quan 112

Bảng 5.63 Mô tả màn hình phía sinh viên, doanh nghiệp 115

Bảng 5.64 Mô tả màn hình chính phía sinh viên doanh nghiệp 116

Bảng 5.65 Mô tả màn hình thực hiện khảo sát 117

Bảng 6.1 Danh sách thư viện và môi trường phát triển cần thiết trong sản phẩm 118 Bảng 6.2 Danh sách các lệnh cài đặt và chạy chương trình 118

Bảng 6.3 Kiểm thử chức năng thêm mới cộng tác viên 119

Bảng 6.4 Kiểm thử chức năng đăng ký, hủy đăng ký dẫn đoàn 120

Bảng 6.5 Kiểm tra chức năng đăng ký chuyến tham quan quyền giảng viên 121

Bảng 7.1 Các khó khăn về công nghệ 124

Bảng 7.2 Các khó khăn về quy trình thực hiện 124

xiii

DANH MỤC HÌNH ẢNH

Hình 2.1 Mô hình ứng dụng áp dụng IoC 4

Hình 2.2 Các module của Spring Framework 6

Hình 2.3 Các thành phần cơ bản trong angular 9

Hình 2.4 Cách hoạt động giữa các thành phần trong Angular 9

Hình 2.5 Cấu trúc Json Web Token 13

Hình 4.1 Lược đồ usecase tổng quan 24

Hình 4.2 Lược đồ use case actor Admin 25

Hình 4.3 Lược đồ use case actor Cộng tác viên 26

Hình 4.4 Lược đồ use case actor Doanh nghiệp 27

Hình 4.5 Lược đồ use case actor Sinh viên 27

Hình 4.6 Use case quản lý lĩnh vực 28

Hình 4.7 Use case quản lý chuyến tham quan 31

Hình 5.1 Sơ đồ thiết kế dữ liệu (1) 44

Hình 5.2 Sơ đồ thiết kế dữ liệu (2) 45

Hình 5.3 Lược đồ lớp 62

Hình 5.4 Sequence Hủy đăng ký dẫn đoàn 63

Hình 5.5 Sequence Đăng ký chuyến 64

Hình 5.6 Sequence Đăng ký dẫn đoàn 65

Hình 5.7 Sequence Thực hiện khảo sát 66

Hình 5.8 Sequence Thêm mới sinh viên vào chuyến bằng form 67

Hình 5.9 Sequence Thêm mới lĩnh vực 67

Hình 5.10 Sequence Cập nhật lĩnh vực 68

Hình 5.11 Sequence Thay đổi trạng thái lĩnh vực 69

Hình 5.12 Màn hình đăng nhập 70

Hình 5.13 Màn hình quên mật khẩu 71

Hình 5.14 Màn hình danh sách chuyến tham quan 73

Hình 5.15 Màn hình thêm mới chuyến tham quan 76

Hình 5.16 Màn hình chỉnh sửa danh sách sinh viên 80

xiv

Hình 5.17 Màn hình thêm sinh viên tham quan 81

Hình 5.18 Màn hình điểm danh bù 82

Hình 5.19 Màn hình nhập danh sách sinh viên 83

Hình 5.20 Màn hình chỉnh sửa danh sách cộng tác viên 84

Hình 5.21 Thêm cộng tác viên dẫn đoàn 85

Hình 5.22 Màn hình chỉnh sửa chuyến tham quan 86

Hình 5.23 Màn hình upload file quyết định của BGH 91

Hình 5.24 Màn hình chính phía cộng tác viên 93

Hình 5.25 Màn hình xem thông tin chuyến tham quan 95

Hình 5.26 Màn hình xác nhận đăng ký chuyến 96

Hình 5.27 Màn hình điểm danh chuyến 97

Hình 5.28 Màn hình checkin/ checkout 98

Hình 5.29 Màn hình điểm danh sinh viên 99

Hình 5.30 Màn hình điểm danh bằng QR code 100

Hình 5.31 Màn hình điểm danh nhập liệu 100

Hình 5.32 Màn hình khảo sát 101

Hình 5.33 Màn hình thực hiện khảo sát 102

Hình 5.34 Màn hình chính của giảng viên 104

Hình 5.35 Màn hình thêm mới chuyến tham quan 105

Hình 5.36 Màn hình thêm mới doanh nghiệp 109

Hình 5.37 Giao diện chỉnh sửa chuyến tham quan 111

Hình 5.38 Màn hình chính phía sinh viên, doanh nghiệp 116

Hình 5.39 Màn hình khảo sát 117

Hình 6.1 Các thư mục trong “quan-ly-tham-quan” 119

1

CHƯƠNG 1 TỔNG QUAN 1.1 Tính cấp thiết và mục tiêu của đề tài

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

Tham quan tại doanh nghiệp là hoạt động thường xuyên của Phòng Quan hệ Doanh nghiệp nhằm rút ngắn khoảng cách giữa lý thuyết và thực tiễn, giúp sinh viên cập nhật kiến thức thực tế và có cái nhìn cận cảnh hơn về môi trường làm việc trong tương lai

Ngày nay, doanh nghiệp có xu hướng tìm kiếm sinh viên từ các trường về thực tập và đào tạo, hoạt động tham quan doanh nghiệp càng được chú trọng hơn, nâng cao cả về chất lượng lẫn số lượng Không chỉ đơn thuần là “tham quan”, trải nghiệm thực tế về môi trường làm việc, giao lưu với các anh chị quản lý, ban lãnh đạo công

ty, được nghe những kinh nghiệm và kỹ năng làm việc

Vì lẽ đó, phòng Quan hệ Doanh nghiệp cần phải có một website để quản lý lượng lớn các chuyến tham quan, nắm bắt thông tin, trạng thái của các chuyến một cách chính xác nhất

1.1.2 Mục đích của đề tài

Đề tài “XÂY DỰNG WEBSITE QUẢN LÝ THAM QUAN CỦA PHÒNG QUAN HỆ DOANH NGHIỆP TẠI TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM” đặt ra các vấn đề trọng tâm về mục tiêu mà sinh viên nghiên cứu cần thực hiện được bao gồm:

- Sử dụng công nghệ, kỹ thuật, thư viện ứng dụng và quá trình phát triển phần mềm, mang lại giá trị nhanh nhất cho khách hàng, bao gồm: các công nghệ giúp phát triển ứng dụng web đa nền tảng, các công nghệ ứng dụng giúp phát triển dự án nhanh nhất, độc lập nhất và dễ dàng triển khai cho các môi trường khác nhau

- Xây dựng website quản lý tham quan cho phòng Quan hệ Doanh nghiệp giúp các thầy cô dễ dàng quản lý thông tin của các chuyến tham quan được tổ chức, doanh nghiệp hợp tác với nhà trường Từ đó, xem xét và kết hợp với giảng viên để tạo ra chuyến tham quan bổ ích cho các bạn sinh viên

- Sản phẩm là một trang web nên yêu cầu giao diện thân thiện với người dùng, phù hợp với chủ đề mà khách hàng hướng đến Sản phẩm cũng bắt buộc phải

sử dụng được trên nhiều trình duyệt cũng như nhiều loại thiết bị di động đồng thời các tính năng có thể hoạt động tốt, giao diện không có quá nhiều biến động giữa các thiết bị, trình duyệt

2

1.2 Đối tượng, phạm vi và phương pháp thực hiện

1.2.1 Đối tượng nghiên cứu

Đồ án được thực hiện xoay quanh hai đối tượng trọng tâm, bao gồm: công nghệ và kiến thức thực tế về việc quản lý, xử lý các nghiệp vụ mà khách hàng yêu cầu

Trong đó, đối tượng công nghệ bao gồm các đối tượng nghiên cứu bắt buộc như mã nguồn mở Java Spring Boot, Angular framework, cơ sở dữ liệu NoSQL MongoDB Ngoài việc kết hợp các đối tượng nghiên cứu công nghệ, một số thư viện

có giá trị như JWT (Json Web Token), Ant Design cũng được nghiên cứu để xây dựng giao diện website được tốt hơn

Đối tượng khách hàng hướng đến là nhóm đối tượng có nhu cầu tổ chức, quản

lý các chuyến tham quan đến doanh nghiệp, bao gồm các quy trình đăng ký trực tuyến

từ giảng viên, xem xét các thông tin đưa ra các trạng thái của chuyến để thuận tiện cho việc theo dõi, quản lý người dùng, quản lý các danh mục, thống kê các kết quả khảo sát theo thời gian cho trước

1.2.2 Phạm vi

Phạm vi thực hiện được đặt ở mức độ tổng quát, nắm được kiến thức chung cho nội dung thực hiện và vận dụng từng nội dung kiến thức vào sản phẩm thực tế, không đặt nặng lý thuyết

1.3 Kết quả dự kiến đạt được

- Hiểu được các kiến thức về chức năng, cách thức hoạt động của Java Spring Boot và Angular trong việc xây dựng website

- Xây dựng hoàn thành một website quản lý tham quan với những kiến thức đã tìm hiểu

IoC Container trong Spring được xây dựng dựa trên nguyên lý Inversion of Control (đảo ngược điều khiển) đã xuất hiện khá lâu trong các mẫu hình thiết kế (design pattern), và được phổ biến rộng rãi nhờ Robert C Martin và Martin Fowler Khái niệm Control Flow (tạm dịch là luồng thực thi) được sử dụng cho trình tự thực hiện các câu lệnh, chỉ thị hoặc lời gọi hàm trong một chương trình, khi chương trình này thực thi

Do chương trình ngày càng phức tạp, nên các lập trình viên áp dụng phương pháp lập trình hướng đối tượng nhằm phân loại, chia tách các chức năng và gom thành các đối tượng Các lập trình viên còn tạo dựng các thư viện tạo sẵn để có thể sử dụng lại Luồng thực thi của chương trình, trong những tình huống cần xem xét ở mức tổng thể, không còn quan tâm đến các bước thực thi câu lệnh cụ thể nữa, mà chỉ xem xét đến quá trình gọi phương thức của các đối tượng trong ứng dụng cũng như các đối tượng của thư viện dựng sẵn

Các lập trình viên, khi xây dựng ứng dụng từ đầu, đã thực hiện hai nhiệm vụ: trực tiếp điều khiển luồng thực thi của chương trình và xây dựng các chức năng để đáp ứng nghiệp vụ của ứng dụng Thực tế, có nhiều chương trình hoặc bộ phận trong chương trình có luồng thực thi rất giống nhau, chẳng hạn phần tương tác với HTTP trong các ứng dụng web, phần unit testing trong các ứng dụng,… Việc trực tiếp tạo dựng và kiểm soát luồng thực thi của chương trình lặp đi lặp lại khi xây dựng nhiều ứng dụng sẽ làm mất nhiều công sức, chi phí, tạo ra sự nhàm chán và dễ phát sinh lỗi Điều này tạo ra động lực cũng như môi trường để nguyên lý đảo ngược điều khiển nảy nở và phát triển

4

Hình 2.1 Mô hình ứng dụng áp dụng IoC

Như vậy, khái niệm “đảo ngược” ở đây chính là chuyển nhiệm vụ kiểm soát lưu trình thực thi từ ứng dụng cho một thành phần chuyên trách (thường là một thư viện phần mềm khung – framework – dựng sẵn ở bên ngoài) Ứng dụng chính chúng

ta quan tâm phát triển không kiểm soát việc điều khiển luồng thực thi nữa, mà chỉ tập trung vào việc định nghĩa chức năng Thư viện phần mềm khung chuyên trách kiểm soát điều khiển sẽ dựa trên mô tả trong cấu hình của ứng dụng để thay mặt ứng dụng điều phối luồng thực thi trong chương trình

Dễ dàng nhận thấy thư viện phần mềm khung này khác với các thư viện thông thường ở chỗ: thư viện thông thường cung cấp các chức năng và chờ được ứng dụng gọi đến, còn thư viện phần mềm khung tạo dựng luồng thực thi và gọi đến các chức năng của ứng dụng

Nói một cách ngắn gọn IoC là một design pattern và tập hợp các kỹ thuật lập trình liên quan, trong đó luồng thực thi của một hệ thống bị đảo ngược so với cách tương tác truyền thống IoC trong Spring cũng hoàn toàn mang ý nghĩa như trên Trong Spring các đối tượng chính để xây dựng ứng dụng thì được quản lý bởi Spring IoC container Và IoC container gọi các đối tượng đó là các bean Một bean chỉ đơn giản là một đối tượng được khởi tạo và quản lý bởi Spring IoC container

Với cách code thông thường, các module cấp cao sẽ gọi các module cấp thấp Module cấp cao sẽ phụ thuộc và module cấp thấp, điều đó tạo ra các dependency Khi

5 module cấp thấp thay đổi, module cấp cao phải thay đổi theo Một thay đổi sẽ kéo theo hàng loạt thay đổi, giảm khả năng bảo trì của code

Vì thế DI ra đời, Hiện nay, một số DI container như Unity, StructureMap v…v,

hỗ trợ trong việc cài đặt và áp dụng Dependency Injection vào code, tuy nhiên vẫn có thể gọi chúng là IoC Container, ý nghĩa tương tự nhau [1]

➢ Có thể hiểu Dependency Injection một cách đơn giản như sau:

• Các module không giao tiếp với nhau mà thông qua interface

• Module cấp thấp sẽ implement interface

• Module cấp cao sẽ gọi module cấp thấp thông qua interface

• Việc khởi tạo các module cấp thấp do DI container thực hiện

• Interface Injection: Class cần inject sẽ implement 1 interface Interface này

chứa 1 hàm tên Inject Container sẽ injection dependency vào 1 class thông qua việc gọi hàm Inject của interface đó Đây là cách rườm rà và ít được sử

dụng nhất

➢ Ưu khuyết điểm của DI:

Bảng 2.1 Ưu khuyết điểm của DI

• Giảm sự kết dính giữa các module

• Code dễ bảo trì, dễ thay thế module

• Rất dễ test và viết Unit Test

• Dễ dàng thấy quan hệ giữa các module

(Vì các dependecy đều được inject vào

• Các object được khởi tạo toàn bộ ngay

từ đầu, có thể làm giảm performance

• Làm tăng độ phức tạp của code

6

2.1.2 Các module

Hình 2.2 Các module của Spring Framework

Spring Core: Core package là phần cơ bản nhất của Spring, cung cấp những

đặc tính như IoC (Inversion of Control) và DI (Dependency Injection) Khái niệm cơ bản là BeanFactory, một cài đặt của Factory pattern, cho phép “móc nối” sự phụ thuộc giữa các đối tượng trong file cấu hình

Spring Context: Spring context là một file cấu hình để cung cấp thông tin ngữ

cảnh của Spring Spring context cung cấp các service như JNDI access, EJB integration, e-mail, internalization, validation, và scheduling functionality

Spring AOP (Aspect – Oriented Programming): Spring AOP module tích

hợp chức năng lập trình hướng khía cạnh vào Spring framework thông qua cấu hình của nó Spring AOP module cung cấp các dịch vụ quản lý giao dịch cho các đối tượng trong bất kỳ ứng dụng nào sử dụng Spring Với Spring AOP chúng ta có thể tích hợp declarative transaction management vào trong ứng dụng mà không cần dựa vào EJB component Spring AOP module cũng đưa lập trình metadata vào trong Spring Sử dụng cái này chúng ta có thể thêm annotation vào source code để hướng dẫn Spring nơi và làm thế nào để liên hệ với aspect

Spring DAO (Data Access Object): Tầng JDBC và DAO đưa ra một cây

phân cấp exception để quản lý kết nối đến database, điều khiển exception và thông báo lỗi được ném bởi vendor của database Tầng exception đơn giản điều khiển lỗi

và giảm khối lượng code mà chúng ta cần viết như mở và đóng kết nối Hình 2.6: Các

7 module của Spring framework 15 Module này cũng cung cấp các dịch vụ quản lý giao dịch cho các đối tượng trong ứng dụng Spring

Spring ORM (Object Relational Mapping): Spring có thể tích hợp với một

vài ORM framework để cung cấp Object Relation tool bao gồm: JDO, Hibernate, OJB và iBatis SQL Maps

Spring Web: Nằm trên application context module, cung cấp context cho các

ứng dụng web Spring cũng hỗ trợ tích hợp với Struts, JSF và Webwork Web module cũng làm giảm bớt các công việc điều khiển nhiều request và gắn các tham số của request vào các đối tượng domain

Spring MVC: MVC Framework thì cài đặt đầy đủ đặc tính của MVC pattern

để xây dựng các ứng dụng Web MVC framework thì cấu hình thông qua giao diện

và chứa được một số kỹ thuật view bao gồm: JSP, Velocity, Tiles và generation of PDF và Excel file

2.2 Spring Boot

2.2.1 Tổng quan về Spring Boot

Spring Boot là một module của Spring Framework cung cấp các tính năng RAD (Rapid Aplication Development) để phát triển ứng dụng nhanh Nếu như trước đây, công đoạn khởi tạo một dự án Spring khá vất vả từ việc khai báo các dependency trong file pom.xml cho đến cấu hình bằng XML hoặc annotation phức tạp, thì giờ đây với Spring Boot, chúng ta có thể tạo các ứng dụng Spring một cách nhanh chóng và cấu hình cũng đơn giản hơn [1]

Dưới đây là một số tính năng nổi bật của Spring Boot:

• Có các tính năng của Spring Framework

• Tạo ứng dụng độc lập, có thể chạy bằng java-jar (cho cả java web)

• Cung cấp một loạt các tính năng phi chức năng phổ biến cho các dự án lớn như những trực tiếp Web Server như Tomcat, Jetty, …

• Cấu hình ít, tự động cấu hình bất kỳ khi nào có thể (giảm thời gian viết code, tăng năng xuất)

• Không yêu cầu XML config

• Cung cấp nhiều plugin

• Chuẩn cho Microservices (Cloud support; giảm việc setup, config; các thư viện hỗ trợ…)

8

2.2.2 Tạo một Spring Boot Application

- Java 1.8 trở lên

- Gradle 2.3+ hoặc Maven 3.0+

- Spring Framework 5.x.x.BUILD-SNAPSHOT

- IDE hỗ trợ Spring Tool Suit

2.3 Angular

2.3.1 Tổng quan về Angular

Angular là một Javascript framework xây dựng ứng dụng web mã nguồn mở (open source) hoạt động ở phía người dùng (client-side) sử dụng HTML, CSS và ngôn ngữ lập trình Typescript Angular là chữ A trong MEAN Trước đây chữ A trong MEAN Stack thường được biết tới AngularJS, nhưng sau năm 2012, Angular

đã được Google tiếp quản và phát triển lên Angular 2 rồi tới Angular 4 tiếp đến Angluar 9 và phiên bản mới nhất hiện nay là Angular 12 Angular là một Web Framework làm việc ở phía Front-end giúp thuận lợi trong việc tạo các Single Page

9

Hình 2.3 Các thành phần cơ bản trong angular

Hoạt động giữa các thành phần trong angular sẽ được mô tả như dưới đây

Hình 2.4 Cách hoạt động giữa các thành phần trong Angular

Các thành phần như component, service, directive, template, sẽ được khai báo và đóng gói trong các Module Trong các module, các component, service, directive bản chất đều là các class bình thường trong TypeScript, để giúp angular hiểu

và nhận biết đâu và component, đâu là directive, angular cung cấp sẵn các decorator (một mẫu design pattern) để gắn vào các class như @Component để nhận biết component, @Directive để nhận biết directive… Trong các decorator này, người dùng có thể cung cấp các metadata để khai báo tên (selector) thành phần đó, khai báo component sẽ gắn với giao diện template html và css là gì Với service thì không có

10 decorator nhận diện và nó giống như một class TypeScript thông thường Như vậy, angular đã nhận diện được các thành phần trong nó

Trong quá trình hoạt động, template sẽ được dùng để khởi tạo giao diện Nhờ các directive và data binding, template sẽ trải qua giai đoạn xử lý, sửa đổi để tạo ra giao diện hiển thị thật sự trên màn hình, các sự kiện từ DOM (Document Object Model đại diện cho trang giao diện) sẽ liên tục được theo dõi và qua đó, component

và directive sẽ có các phản hồi tương ứng Từ các phản hồi của directive và component, đối tượng đại diện cho giao diện là DOM có thể nhận được những thay đổi và những thay đổi đó sẽ tự động được trình duyệt cập nhật và hiển thị trên màn hình Các service sẽ đóng vai trò là thành phần hỗ trợ xử lý, có thể sử dụng lại trong nhiều component nhờ dependency injection

Angular được biết đến là có nhiệm vụ thực thi Single Page Application và giao diện hiển thị trên màn hình của người dùng cũng chỉ có một trang html duy nhất Nhưng mỗi component lại có phần template đính kèm và sẽ nằm tách rời ở nhiều file, angular sẽ cần gom tất cả phần template đang sử dụng, hợp lại thành một template thống nhất để hiển thị trên màn hình

Trong một ứng dụng angular có thể có rất nhiều module, mỗi module lại có nhiều component, service… Trong tất cả sẽ có một module là root module Module cũng là một class TypeScript và được gắn decorator @NgModule, bên trong nó là các metadata Với root module thì sẽ có một metadata đặc biệt là “bootstrap”, nó chứa mảng các component sẽ được chọn để khởi động ban đầu Thông thường các ứng dụng angular sẽ có sẵn một component được chọn để khởi động là AppComponent ngay từ khi tạo project Khi ứng dụng angular mới khởi động, trang giao diện sẽ là nội dung từ trang index.html với styles.css

2.4 MongoDB

2.4.1 Mô hình

MongoDB hệ quản trị cơ sở dữ liệu mã nguồn mở (open-source) thuộc họ cơ

sở dữ liệu phi quan hệ (NoSQL) [3]

MongoDB được phát triển từ năm 2007 bởi một tổ chức tên là MongoDB Inc

có trụ sở tại New York Tại thời điểm đó MongoDB được phát triển như là một nền tảng dịch vụ (Platform as a services - PAAS) Đến năm 2009 MongoDB đã được chính thức giới thiệu trên thị trường như một máy chủ cơ sở dữ liệu mã nguồn mở (open-source database server) được duy trì và phát triển bởi tổ chức MongoDB Inc Tại thời điểm đó đã có nhiều tổ chức lớn và vừa như SourceForge, Foursquare, eBay

sử dụng MongoDB để phát triển cơ sở dữ liệu của họ

11 MongoDB được xây dựng theo hướng là một cơ sở dữ liệu hướng đối tượng

vì vậy nó không có các ràng buộc toàn vẹn dữ liệu như ở các Cơ sở dữ liệu quan hệ

mà cho phép lưu trữ dữ liệu linh hoạt (stores data in flexible) có dữ liệu khác nhau trong cùng một Collection (tương đương với Table ở SQL) Do chính đặc thù này mà MongoDB có thể được sử dụng để lưu các dữ liệu đa dạng và phức tạp mà không bị hạn chế khi có thay đổi về cấu trúc lưu dữ liệu

MongoDB là một cơ sở dữ liệu phân tán vì vậy nó sẽ có những đặc trưng của

cơ sở dữ liệu phân tán như: tính sẵn sàng cao, khả năng mở rộng theo chiều ngang,

Các khái niệm tiêu biểu khi sử dụng MongoDB:

● Document - tài liệu: là đơn vị cơ bản của dữ liệu trong MongoDB, một document tương đương với một dòng trong bảng của SQL Mỗi một document đều có cấu trúc là một đoạn chuỗi json độc lập

● Collection: là tập hợp các document có các thuộc tính tương tự nhau Collection tương đương với một bảng (Table) trong SQL Điểm khác nhau rõ rệt nhất ở đây chính là việc bảng trong SQL có cấu trúc được quy định sẵn và

dữ liệu vào luôn phải tuân theo cấu trúc đó, còn Collection có thể tiếp nhận tự

do mọi document có các thuộc tính khác nhau vào mà không hề phát sinh lỗi

● Database: là các cơ sở dữ liệu độc lập lẫn nhau của MongoDB, một Database của MongoDB bao gồm một hay nhiều Collection và các cài đặt, phân quyền kèm theo Database đó

● _id: là một khóa định danh đặc biệt được quy định tự động bởi MongoDB khi thêm một Document vào Collection _id của bất cứ Document nào đều luôn là duy nhất trong Collection chứa document đó

● Index - chỉ mục: là một cấu trúc dữ liệu thu thập thông tin về các trường (field) trong Document của Collection từ đó mà nó giúp cho các câu truy vấn (query) đến các trường này tăng đáng kể tốc độ truy vấn Tuy nhiên việc tạo thêm các Index cũng làm tăng đáng kể dung lượng bộ nhớ tiêu hao cho Database MongoDB Trường _id là trường chỉ mục luôn luôn được khởi tạo mặc định bởi MongoDB khi thêm mới một Document

● Query - truy vấn: cũng giống như tất cả cơ sở dữ liệu khác, MongoDB

hỗ trợ truy vấn dữ liệu và nhà phát triển của cơ sở dữ liệu này cũng đã cung

12 cấp số lượng lớn các câu lệnh bổ trợ giúp đơn giản hóa việc truy vấn dữ liệu hơn rất nhiều lần so với các ngôn ngữ truy vấn dữ liệu truyền thống mà vẫn đảm bảo được tốc độ truy vấn nhanh

2.4.3 Ưu điểm

Lược đồ dữ liệu linh hoạt, do là cơ sở dữ liệu NoSQL tổ chức dữ liệu theo kiểu Document Database nên có thể tùy ý lưu các Document với các thuộc tính và kích thước Document khác nhau và cùng một Collection của MongoDB

Tốc độ truy vấn dữ liệu nhanh, có thể tăng tốc độ truy vấn dữ liệu ở các trường (field) thông thường bằng cách khởi tạo Index cho trường tương ứng đó

Khả năng mở rộng cơ sở dữ liệu lớn

Phù hợp cho xu hướng Big Data trên toàn thế giới cũng như dễ dàng được lựa chọn với các ứng dụng thời gian thực (real-time)

Được hỗ trợ bởi nhiều thư viện Javascript và có thể ứng dụng cho nhiều nền tảng, ngôn ngữ khác nhau

2.4.4 Nhược điểm

Là cơ sở dữ liệu không có cấu trúc nên không còn các ràng buộc khóa ngoại, khóa chính như cơ sở dữ liệu quan hệ Từ đó các vấn đề về toàn vẹn dữ liệu phải được chuyển đến cho Server ứng dụng xử lý thay Các vấn đề về sai dữ liệu đầu vào thường không được MongoDB cảnh báo do không có ràng buộc nào quy định

Tiêu tốn nhiều tài nguyên trong quá trình xử lý cũng như tiêu tốn bộ nhớ cho việc khởi tạo thêm các Index tăng tốc độ truy vấn

2.5 Các công nghệ và thư viện khác

2.5.1 JSON Web Token

JSON Web Mã (JWT) là một chuẩn mở (RFC 7519) định nghĩa một cách nhỏ gọn và khép kín để truyền một cách an toàn thông tin giữa các bên dưới dạng đối tượng JSON Thông tin này có thể được xác minh và đáng tin cậy vì nó có chứa chữ

ký số JWTs có thể được ký bằng một thuật toán bí mật (với thuật toán HMAC) hoặc một public / private key sử dụng mã hoá RSA [4]

➢ Ưu điểm:

- Stateless, thông tin không được lưu trữ trên máy chủ

- Dễ dàng phát triển, mở rộng

- Hiệu suất tốt hơn vì máy chủ đọc thông tin trong yêu cầu (nếu sử dụng phiên,

hệ thống phải truy vấn thông tin trong bộ nhớ hoặc cơ sở dữ liệu)

13

Hình 2.5 Cấu trúc Json Web Token

Phần chữ ký sẽ được mã hóa bằng HMAC hoặc RSA

HMAC: Người tạo JWT (người phát hành mã thông báo) và người nhận JWT (người xác minh mã thông báo) đã sử dụng cùng một khóa bí mật để mã hóa và kiểm tra

RSA sử dụng 1 cặp khóa, đối tượng khởi tạo JWT sử dụng khóa riêng để mã hóa, bộ thu JWT sử dụng khóa công khai để kiểm tra

Vì vậy, với HMAC, cả hai bên phải chia sẻ một khóa bí mật với nhau và JWT bên nhận hoàn toàn có thể tạo ra một mã JWT hợp lệ khác dựa trên khóa bí mật đó Đối với RSA, người nhận sử dụng khóa công khai để kiểm tra nhưng không thể khởi tạo JWT mới dựa trên khóa đó Do đó, mã hóa sử dụng RSA giúp bảo mật chữ ký tốt hơn khi chia sẻ JWT với nhiều đối tượng khác nhau

Trong dự án, JWT được áp dụng để xác thực và ủy quyền

2.5.2 Ant Design of Angular

Ant Design của Angular là một thư viện thành phần Angular UI cấp doanh nghiệp dựa trên Ant Design, tất cả các thành phần đều là mã nguồn mở và được sử dụng miễn phí theo giấy phép của MIT [5]

Ưu điểm:

⚫ Một ngôn ngữ thiết kế giao diện người dùng cấp doanh nghiệp cho các ứng dụng Angular

⚫ Hơn 60 thành phần Angular chất lượng cao

⚫ Được viết bằng TypeScript với các kiểu hoàn chỉnh được xác định

⚫ Hỗ trợ chế độ OnPush, hiệu suất cao

⚫ Tùy biến chủ đề mạnh mẽ đến từng chi tiết

⚫ Hỗ trợ quốc tế hóa cho hàng chục ngôn ngữ

về môi trường làm việc trong tương lai Khi thầy cô có nhu cầu tổ chức một chuyến tham quan thường phải mất thời gian đến phòng Quan hệ Doanh nghiệp làm việc với những thầy cô có phận sự trong phòng Tiếp đến các thông tin cập nhật chuyến tham quan đều phải liên hệ với phòng Quan hệ Doanh nghiệp gây khó khăn trong việc tự chủ xem trạng thái của các chuyến Sinh viên, cộng tác viên và doanh nghiệp cũng khó có thể xem thông tin chuyến tham quan mà họ đã đăng ký, tổ chức Vì vậy sự ra đời của website quản lý hành trình nhằm giúp phòng Quan hệ Doanh nghiệp có thể

dễ dàng quản lý tất cả thông tin các chuyến đã được đăng ký Phương pháp trực tuyến này giúp mọi vấn đề được đơn giản hóa

Chức năng của website quản lý tham quan cần cung cấp cho phòng Quan hệ Doanh nghiệp gồm:

- Khách: xem các bài viết được đăng tải trên trang chủ

- Người dùng: đăng nhập, đăng xuất

- Người quản trị viên: quản lý chi tiết các danh mục, chuyến tham quan, người dùng, …

- Giảng viên: đăng ký, chỉnh sửa thông tin chuyến khi quản trị viên chưa duyệt

và có thể xem thông tin, trạng thái các chuyến đã đăng ký

- Cộng tác viên: đăng ký dẫn đoàn các chuyến ở trạng thái đang xử lý, xem các chuyến đã được duyệt dẫn đoàn, điểm danh sinh viên và cập nhật hình ảnh checkin, checkout khi đi tham quan, thực hiện khảo sát sau các chuyến tham quan và cập nhật mật khẩu đăng nhập

- Sinh viên: xem các chuyến đang tham gia và thực hiện khảo sát sau các chuyến tham quan

- Doanh nghiệp: xem các chuyến đang tổ chức và thực hiện khảo sát sau các chuyến tham quan, cập nhật mật khẩu đăng nhập

15

3.2 Xác định yêu cầu

3.2.1 Yêu cầu chức năng

3.2.1.1 Yêu cầu chức năng người dùng

a Quản trị viên

- Cấu hình hệ thống

o Xem cấu hình hệ thống

o Thêm, thay đổi trạng thái, cập nhật thông tin cấu hình hệ thống

- Quản lý doanh nghiệp

o Xem danh sách doanh nghiệp

o Thêm, thay đổi trạng thái, cập nhật thông tin doanh nghiệp

- Quản lý cộng tác viên

o Xem danh sách cộng tác viên

o Thêm, thay đổi trạng thái, cập nhật thông tin cộng tác viên

- Quản lý câu hỏi khảo sát doanh nghiệp

o Xem danh sách câu hỏi khảo sát doanh nghiệp

o Thêm, thay đổi trạng thái, cập nhật thông tin câu hỏi khảo sát doanh nghiệp

- Quản lý câu hỏi khảo sát sinh viên

o Xem danh sách câu hỏi khảo sát sinh viên

o Thêm, thay đổi trạng thái, cập nhật thông tin câu hỏi khảo sát sinh viên

- Quản lý câu hỏi khảo sát cộng tác viên

o Xem danh sách câu hỏi khảo sát cộng tác viên

o Thêm, thay đổi trạng thái, cập nhật thông tin câu hỏi khảo sát cộng tác viên

- Quản lý địa điểm

o Xem danh sách địa điểm

o Thêm, thay đổi trạng thái, cập nhật thông tin địa điểm

- Quản lý đợt tham quan

o Xem danh sách đợt tham quan

o Thêm, thay đổi trạng thái, cập nhật thông tin đợt tham quan

- Quản lý file hướng dẫn

o Xem danh sách file hướng dẫn

o Thêm, thay đổi trạng thái, cập nhật thông tin file hướng dẫn

- Quản lý lĩnh vực

o Xem danh sách lĩnh vực

16

o Thêm, thay đổi trạng thái, cập nhật thông tin lĩnh vực

- Quản lý ngành

o Xem danh sách ngành

o Thêm, thay đổi trạng thái, cập nhật thông tin ngành

- Quản lý phương tiện

o Xem danh sách phương tiện

o Thêm, thay đổi trạng thái, cập nhật thông tin phương tiện

- Quản lý sinh viên

o Xem danh sách sinh viên

o Thêm, thay đổi trạng thái, cập nhật thông tin sinh viên

- Quản lý văn bản biểu mẫu

o Xem danh sách biểu mẫu

o Thêm, thay đổi trạng thái, cập nhật thông tin văn bản biểu mẫu

- Quản lý chuyến tham quan

o Xem danh sách chuyến theo trạng thái

o Thêm chuyến

o Cập nhật thông tin chuyến

o Cập nhật danh sách sinh viên tham gia

o Duyệt cộng tác viên tham gia dẫn đoàn

o Lưu trữ hồ sơ

o Xem timeline graphic chương trình tham quan

- Thống kê kết quả khảo sát

o Thống kê câu trả lời loại câu nhập liệu của doanh nghiệp

o Thống kê câu trả lời loại câu sắp xếp của doanh nghiệp

o Thống kê câu trả lời loại câu chọn một, nhiều của doanh nghiệp

o Thống kê câu trả lời loại câu nhập liệu của sinh viên

o Thống kê câu trả lời loại câu sắp xếp của sinh viên

o Thống kê câu trả lời loại câu chọn một, nhiều của sinh viên

o Thống kê câu trả lời loại câu nhập liệu của cộng tác viên

o Thống kê câu trả lời loại câu sắp xếp của cộng tác viên

o Thống kê câu trả lời loại câu chọn một, nhiều của cộng tác viên

o Thống kê số chuyến tham quan theo thời gian

o Thống kê số chuyến tham quan theo doanh nghiệp

b Giảng viên

- Đăng ký chuyến tham quan

- Cập nhật chuyến tham quan

- Xem chuyến tham quan đã đăng ký

c Cộng tác viên

17

- Đăng ký dẫn đoàn chuyến tham quan

- Hủy dẫn đoàn chuyến tham quan

- Xem chuyến tham quan đã được duyệt dẫn đoàn

- Điểm danh sinh viên

- Khảo sát sau chuyến đi

- Thay đổi mật khẩu đăng nhập

d Sinh viên

- Xem danh sách các chuyến đi đang tham gia

- Khảo sát sau chuyến đi

e Doanh nghiệp

- Khảo sát sau chuyến đi

- Thay đổi mật khẩu đăng nhập

3.2.1.2 Yêu cầu chức năng hệ thống

- Phân quyền

▪ Khách: xem các bài viết được đăng tải trên trang chủ

▪ Người dùng: đăng nhập và đăng xuất

▪ Admin: toàn quyền hệ thống

▪ Giảng viên: đăng ký, cập nhật thông tin chuyến, xem chuyến đã đăng

ký

▪ Cộng tác viên: đăng ký/ hủy dẫn đoàn, check in, check out điểm đến, xem chuyến đang dẫn, điểm danh sinh viên, khảo sát sau chuyến đi, thay đổi mật khẩu đăng nhập hệ thống

▪ Sinh viên: xem danh sách chuyến đang tham gia, khảo sát sau chuyến

▪ Chuyến tham quan

▪ Câu hỏi khảo sát

▪ Kết quả khảo sát

▪ Tốc độ tìm kiếm nhanh và hiệu quả

▪ Tốc độ tải trang nhanh

- Khả năng tương thích:

▪ Đáp ứng nhiều nền tảng và thiết bị

- Phát triển:

▪ Dễ dàng phát triển các ứng dụng

19

CHƯƠNG 4 ĐẶC TẢ CHỨC NĂNG 4.1 Định nghĩa usecase

Sinh viên

Doanh nghiệp

4 Quản lý câu hỏi khảo sát sinh viên x

5 Quản lý chuyến tham quan x

15 Quản lý văn bản biểu mẫu x

19 Xem chuyến tham quan đã đăng ký x

20

2.1 Xem danh sách câu hỏi khảo sát cộng tác viên UC_2.1

2.1.1 Cập nhật câu hỏi khảo sát cộng tác viên UC_2.1.1

2.1.2 Thay đổi trạng thái câu hỏi khảo sát cộng tác

2.2 Thêm mới câu hỏi khảo sát cộng tác viên UC_2.2

3.1 Xem danh sách câu hỏi khảo sát doanh nghiệp UC_3.1

3.1.1 Cập nhật câu hỏi khảo sát doanh nghiệp UC_3.1.1

2.1.2 Thay đổi trạng thái câu hỏi khảo sát doanh

4.1 Xem danh sách câu hỏi khảo sát sinh viên UC_4.1

4.1.1 Cập nhật câu hỏi khảo sát sinh viên UC_4.1.1 4.1.2 Thay đổi trạng thái câu hỏi khảo sát sinh viên UC_4.1.2

5.1 Xem danh sách chuyến tham quan theo trạng thái UC_5.1

5.1.3 Xem theo trạng thái đang xử lý UC_5.1.3 5.1.4 Xem theo trạng thái sẵn sàng chưa có đợt UC_5.1.4

21

5.1.7 Upload file quyết định của BGH UC_5.1.7

5.1.8.1 Xét duyệt cộng tác viên UC_5.1.8.1

5.1.9 Xem danh sách sinh viên tham quan UC_5.1.9

5.1.9.1 Thêm mới sinh viên tham gia UC_5.1.9.1 5.1.9.2 Import danh sách sinh viên UC_5.1.9.2 5.1.9.3 Điểm danh bù sinh viên UC_5.1.9.3

5.1.9.4 Import danh sách sinh viên điểm

6.1.2 Thay đổi trạng thái cộng tác viên UC_6.1.2

7.1.2 Thay đổi trạng thái doanh nghiệp UC_7.1.2

9.1.2 Thay đổi trạng thái đợt tham quan UC_9.1.2

22

10.1.2 Thay đổi trạng thái file hướng dẫn UC_10.1.2

13.1.2 Thay đổi trạng thái phương tiện UC_13.1.2

15.1.2 Thay đổi trạng thái văn bản biểu mẫu UC_15.1.2

23 16.6 Thống kê câu trả lời loại câu chọn một, nhiều của sinh

24

4.2 Lược đồ use case

Hình 4.1 Lược đồ usecase tổng quan

25

Hình 4.2 Lược đồ use case actor Admin