(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự

(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự(Đồ án tốt nghiệp) Xây dựng Website quản lý nhân sự

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

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

Khóa: 2016

GVHD: THS LÊ THỊ MINH CHÂU

XÂY DỰNG WEBSITE QUẢN LÝ NHÂN SỰ

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

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

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

GVHD: THS LÊ THỊ MINH CHÂU

Tp Hồ Chí Minh, tháng 12 năm 2020

LỜI CẢM ƠN

Để hoàn thành tốt đề tài khóa luận tốt nghiệp này, ngoài sự nỗ lực từ chính bản thân, nhóm em còn nhận được sự quan tâm giúp đỡ, chỉ bảo tận tình của nhiều cá nhân, tập thể Người mà chúng em không quên gửi lời cảm ơn sâu sắc

Đầu tiên, nhóm em xin chân thành cảm ơn khoa Đào tạo Chất lượng cao – nghành Công nghệ thông tin, trường Đại học Sư Phạm Kỹ Thuật TP Hồ Chí Minh và thầy

Nguyễn Đăng Quang – trưởng nghành CNTT đã tạo điều kiện thuận lợi cho chúng

em thực hiện đề tài này

Chúng em cũng xin được gửi lời cảm ơn chân thành nhất đến cô Lê Thị Minh Châu,

người đã tận tình chỉ bảo và hướng dẫn nhóm em trong suốt quá trình thực hiện đề tài này

Bên cạnh đó, chúng em xin gửi lời cảm ơn đến các thầy cô giảng viên của trường Đại học Sư Phạm Kỹ Thuật TP Hồ Chí Minh nói chung cũng như các thầy cô giảng viên khoa Đào tạo Chất lượng cao, nhất là nghành Công nghệ thông tin nói riêng, những người đã giảng dạy, tích lũy cho chúng em những kiến thức quý báu trong những năm học vừa qua Đó là nền tảng giúp chúng em làm nên đề tài này và cũng là tiền đề giúp chúng em tiến xa hơn nữa trong tương lai

Dù đã cố gắng hoàn thành đề tài khóa luận đúng yêu cầu, nhưng do thời gian hạn hẹp và khả năng còn hạn chế nên chắc chắn nhóm sẽ không tránh khỏi nhiều thiếu sót Chúng em mong nhận được sự thông cảm và tận tình chỉ bảo của các thầy cô và các bạn

Nhóm chúng em một lần nữa xin chân thành cảm ơn

Trân trọng

TÓM TẮT ĐỒ ÁN TỐT NGHIỆP

Đề tài: XÂY DỰNG WEBSITE QUẢN LÝ NHÂN SỰ

Ngày nay với sự phát triển của xã hội nói chung và sự phát triển của công nghệ thông tin nói riêng nhu cầu của con người ngày một được cao hơn trong việc quản lý nhân sự cho một công ty Ngoài việc chỉ hoàn thành quản lý chặt chẽ thông qua hồ

sơ giấy thì giờ đây công nghệ thông tin không những giúp họ có được sự quản lý chặt chẽ còn thực hiện được nhanh chóng mà không phải bận tâm suy nghĩ lưu trữ hồ sơ nơi nào là hợp lý, tiết kiệm được khá lớn lượng giấy để bảo vệ môi trường trong thực trạng hiện nay Nhìn thấy được xu hướng ấy, nhóm chúng em đã xây dựng nên website quản lý nhân sự - một website có thể cho người quản lý cũng như nhân viên thực hiện được các thao tác nhanh chóng nhất khi cần thực hiện các yêu cầu cho công việc với nhau

MỤC LỤC

ĐỒ ÁN TỐT NGHIỆP i

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP i

PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN ii

PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN PHẢN BIỆN iii

LỜI CẢM ƠN i

TÓM TẮT ĐỒ ÁN TỐT NGHIỆP ii

MỤC LỤC iii

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

DANH MỤC CÁC BẢNG BIỂU vii

DANH MỤC CÁC BIỂU ĐỒ VÀ HÌNH ẢNH x

CHƯƠNG 1: TỔNG QUAN 1

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

1.1.1.Vấn đề đặt ra 1

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

1.1.3.Hướng giải quyết 1

1.2.Mục tiêu đề tài 1

1.3.Đối tượng nghiên cứu 1

CHƯƠNG 2: CÔNG NGHỆ NỀN TẢNG 2

2.1.Nền tảng phát triển 2

2.1.1.Nền tảng công nghệ 2

2.2.Công nghệ sử dụng 2

2.2.1.ReactJS 2

2.2.2.Redux-Saga 4

2.2.3.NodeJS 5

2.2.4.Database PostgresSQL[2] 7

2.2.5.Jenkins[3] 8

2.2.6.Docker[4] 10

2.3.Cài đặt môi trường và hệ thống 11

2.3.1.Cài đặt framework ReactJS 11

2.3.2.Cài đặt NodeJS 12

CHƯƠNG 3: YÊU CẦU HỆ THỐNG 13

3.1.Yêu cầu người dùng 13

3.2.Yêu cầu hệ thống 13

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

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

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG 28

4.1.Tổng quan hệ thống 28

4.1.1.Mô hình Client-server 28

4.1.2.Class Diagram 29

4.2.Database 30

4.2.1.ERD 30

4.2.2.Physical diagram 31

4.2.3.Đặc tả chi tiết database 31

4.3.Sequence diagram 36

4.3.1.SQ001_UC001 Đăng nhập 36

4.3.2.SQ002_UC004 Quản lý tài khoản của Staff 37

4.3.3.SQ003_UC0012 Quản lý user của Admin 37

4.3.4.SQ004_UC005b Quản lý lương của Manger 39

4.3.5.SQ005_UC007b Quản lý phòng ban của manager 39

4.3.6.SQ006_UC0010 Quản lý Export Excel 40

4.4.Thiết kế giao diện 40

4.4.1.Giao diện Staff 40

4.4.2.Giao diện Manager 54

4.4.3.Giao diện Admin 67

CHƯƠNG 5: KẾT LUẬN 75

5.1.Kết quả đạt được 75

5.1.1.Kiến thức và thực nghiệm 75

5.1.2.Ưu điểm và nhược điểm 75

5.2.Thách thức 75

5.3.Kế hoạch phát triển trong tương lai 75

TÀI LIỆU THAM KHẢO 77

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

Admin: Administration (Người quản trị)

MVC: Model-View-Controller

ERD: Entity Relationship Diagram

API: Application Programming Interface (Giao diện lập trình ứng dụng)

SQL: Structured Query Language

HTML: HyperText Markup Language

CRUD: Create – Read – Update – Delete

CMND: Chứng Minh Nhân Dân

DANH MỤC CÁC BẢNG BIỂU

Bảng 2-1 Nền tảng công nghệ sử dụng 2

Bảng 3-1 Yêu cầu người dùng 13

Bảng 3-2 Actor 13

Bảng 3-3 Chức năng actor Staff 13

Bảng 3-4 Chức năng actor Manager 14

Bảng 3-5 Chức năng actor Admin 14

Bảng 3-6 Bảng danh sách các use case 19

Bảng 3-7 Mô tả usecase UC001.Đăng nhập 20

Bảng 3-8 Mô tả usecase UC002.Đăng xuất 20

Bảng 2-9 Mô tả usecase UC003 Thay đổi mật khẩu 20

Bảng 3-10 Mô tả usecase UC004.Quản lý tài khoản 21

Bảng 2-11 Mô tả usecase UC005a Quản lý lương của staff 21

Bảng 3-12 Mô tả usecase UC005b Quản lý lương của manager 22

Bảng 3-13 Mô tả usecase UC006 Quản lý hợp đồng của staff 22

Bảng 3-14 Mô tả usecase UC006b.Quản lý hợp đồng của admin 22

Bảng 3-15 Mô tả usecase UC007a.Quản lý phòng ban của staff 23

Bảng 3-16 Mô tả usecase UC007b.Quản lý phòng ban của Admin 24

Bảng 3-17 Mô tả usecase UC0018a Quản lý yêu cầu của staff 24

Bảng 3-18 Mô tả usecase UC008b Quản lý yêu cầu của manager 25

Bảng 3-19 Mô tả usecase UC009a Quản lý task của staff 25

Bảng 3-20 Mô tả usecase UC009b Quản lý task của manager 25

Bảng 3-21 Mô tả usecase UC0010 Quản lý Export report 26

Bảng 3-22 Mô tả usecase UC0011 Quản lý staff của manager 26

Bảng 3-23 Mô tả usecase UC0012 Quản lý user của admin 26

Bảng 3-24 Yêu cầu phi chức năng 27

Bảng 4-1 Bảng Employee 31

Bảng 4-2 Bảng Salary 32

Bảng 4-3 Bảng Contract 32

Bảng 4-4 Bảng Date-off 33

Bảng 4-5 Bảng Department 33

Bảng 4-6 Bảng project 33

Bảng 4-7 Bảng Task 34

Bảng 4-8 Bảng Project_member 34

Bảng 4-9 Bảng Role 34

Bảng 4-10 Bảng Tax 34

Bảng 4-11 Bảng Position 35

Bảng 4-12 Bảng salary_other 35

Bảng 4-13 Bảng insurance 35

Bảng 4-14 Bảng task_detail 35

Bảng 4-15 Bảng feedback 36

Bảng 4-16 Bảng bank_account 36

Bảng 4-17 Bảng bank 36

Bảng 4-18 Danh sách màn hình của Staff 40

Bảng 4-19 Mô tả chi tiết màn hình STAFF001 Login 41

Bảng 3-20 Mô tả chi tiết màn hình STAFF002.Dashboard 42

Bảng 4-21 Mô tả chi tiết màn hình STAFF003.Time-Sheet 44

Bảng 4-22 Mô tả chi tiết màn hình STAFF0003 Date-off 44

Bảng 4-23 Mô tả chi tiết màn hình STAFF005 Information 47

Bảng 4-24 Mô tả chi tiết màn hình STAFF006 Directory 51

Bảng 4-25 Mô tả chi tiết màn hình STAFF007 Position 54

Bảng 4-26 Danh sách màn hình Manager 54

Bảng 4-27 Mô tả chi tiết màn hình MANAGER001 Dashboard 55

Bảng 4-28 Mô tả chi tiết màn hình MANAGER002 Directory 56

Bảng 4-29 Mô tả chi tiết popup tạo mới tài khoản 57

Bảng 4-30 Mô tả chi tiết màn hình MANAGER003 Position 58

Bảng 4-31 Mô tả chi tiết màn hình popup tạo mới vị trí làm việc 59

Bảng 4-32 Mô tả chi tiết màn hình MANAGER004 Salaries 61

Bảng 4-33 Bảng Mô tả chi tiết màn hình popup xuất file báo cáo 62

Bảng 4-34 Mô tả chi tiết màn hình MANAGER005 Department 63

Bảng 4-35 Mô tả chi tiết màn hình MANAGER006 Information 64

Bảng 4-36 Mô tả chi tiết màn hình danh mục quản lý tài khoản ngân hàng 65

Bảng 4-37 Mô tả chi tiết màn hình danh mục quản lý hợp đồng 66

Bảng 4-38 Mô tả chi tiết màn hình danh mục quản lý bảo hiểm 66

Bảng 4-39 Mô tả chi tiết màn hình danh mục quản lý bảo hiểm 67

Bảng 4-40 Danh sách màn hình Admin 67

Bảng 4-41 Mô tả chi tiết màn hình ADM001 Directory 68

Bảng 4-42 Mô tả chi tiết popup tạo mới tài khoản 69

Bảng 4-43 Mô tả chi tiết màn hình ADMIN002 Department 70

Bảng 4-44 Mô tả chi tiết màn hình ADMIN003 Information 71

Bảng 4-45 Mô tả chi tiết màn hình danh mục quản lý tài khoản ngân hàng 72

Bảng 4-46 Mô tả chi tiết màn hình danh mục quản lý hợp đồng 73 Bảng 4-47 Mô tả chi tiết màn hình danh mục quản lý bảo hiểm 73 Bảng 4-48 Mô tả chi tiết màn hình danh mục quản lý bảo hiểm 74

DANH MỤC CÁC BIỂU ĐỒ VÀ HÌNH ẢNH

Hình 2.1 Minh họa logo công nghệ React 2

Hình 2.2 Mô hình liên kết React – Reducx – Saga 4

Hình 2.3 Minh họa logo NodeJS 6

Hình 2.4 Minh họa logo PostgresSQL 7

Hình 2.5 Minh họa logo Jenkins 8

Hình 2.6 Sơ đồ hoạt động của Jenkins 9

Hình 2.7 Minh họa logo Docker 10

Hình 3.1 Usecase diagram tổng quát 16

Hình 3.2 Usecase của actor Staff 17

Hình 3.3 Usecase của actor Manager 18

Hình 3.4 Usecase của actor Admin 19

Hình 4.1 Mô hình Client – Server 28

Hình 4.2 Class Diagram 29

Hình 4.3 ERD 30

Hình 4.4 Physical diagram 31

Hình 4.5 SQ001_UC001 Đăng nhập 37

Hình 4.6 SQ002_UC004 Quản lý tài khoản của Staff 37

Hình 4.7 SQ003_UC0012 Quản lý user của Admin 38

Hình 4.8 SQ004_UC005b Quản lý lương của Manger 39

Hình 4.9 SQ005_UC007b Quản lý phòng ban của manager 39

Hình 4.10 SQ006_UC0010 Quản lý Export Excel 40

Hình 4.11 Màn hình STAFF001 Login 41

Hình 4.12 Màn hình STAFF002.Dashboard 42

Hình 4.13 Màn hình STAFF003.Time-Sheet 44

Hình 4.14 Màn hình STAFF0003 Date-off 44

Hình 4.15 Màn hình danh mục Summary yêu cầu 46

Hình 4.16 Màn hình danh mục lịch sử yêu cầu đã tạo 46

Hình 4.17 Màn hình STAFF005 Information 47

Hình 4.18 Màn hình STAFF005 Information - BankAccout 48

Hình 4.19 Màn hình tạo mới bank accout 49

Hình 4.20 Màn hình chỉnh sửa thông tin accout 49

Hình 4.21 Màn hình xem thông tin hợp đồng 50

Hình 4.22 Màn hình xem thông tin bảo hiểm 50

Hình 4.23 Màn hình xem thông tin dự án 51

Hình 4.24 Màn hình STAFF006 Directory 51

Hình 4.25 Màn hình STAFF007 Position 53

Hình 4.26 Màn hình MANAGER001 Dashboard 55

Hình 4.27 Màn hình MANAGER002 Directory 56

Hình 4.28 Màn hình popup tạo mới tài khoản 57

Hình 4.29 Màn hình MANAGER003 Position 58

Hình 4.30 Màn hình popup tạo mới vị trí làm việc 59

Hình 4.31 Màn hình MANAGER004.Salaries 61

Hình 4.32 Màn hình popup xuất file báo cáo 62

Hình 4.33 Màn hình MANAGER005 Department 63

Hình 4.34 Màn hình MANAGER006 Information 64

Hình 4.35 Màn hình danh mục quản lý tài khoản ngân hàng 65

Hình 4.36 Màn hình danh mục quản lý hợp đồng 65

Hình 4.37 Màn hình danh mục quản lý bảo hiểm 66

Hình 4.38 Màn hình danh mục quản lý dự án 67

Hình 4.39 Màn hình ADM001 Directory 68

Hình 4.40 Màn hình popup tạo mới tài khoản 69

Hình 4.41 Màn hình ADMIN002 Department 70

Hình 4.42 Màn hình ADMIN003 Information 71

Hình 4.43 Màn hình danh mục quản lý tài khoản ngân hàng 72

Hình 4.44 Màn hình danh mục quản lý hợp đồng 72

Hình 4.45 Màn hình danh mục quản lý bảo hiểm 73

Hình 4.46 Màn hình danh mục quản lý dự án 74

đi những giấy cần thiết để cung cấp cho việc thực hiện yêu cầu cần duyệt Phải chờ đợi xếp thành từng hàng dài để báo cáo kết quả mỗi ngày làm việc

Thực ra với thời đại công nghệ số, công việc quản lý nhân sự đã đơn giản hơn rất nhiều khi xung quanh là công nghệ thông tin không ngừng phát triển Vì vậy, vấn đề đặt ra là chúng ta phải xây dựng được các phương pháp để áp dụng công nghệ thông tin vào quản lý một cách sát với nhu cầu thực tế nhất

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

Với thời đại công nghệ tiên tiến, việc quản lý trở nên khá dễ dàng Chỉ cần có Internet và thiết bị, chúng ta có thể truy cập vào bất kì lúc nào để xem thông tin của cần quản lý

1.1.3 Hướng giải quyết

Để đáp ứng nhu cầu về việc quản lí nhân sự một cách chính xác và nhanh chóng thực hiện các thủ tục thõa mãn nhu cầu cho nhân viên và người quản lý mà websitet

“Quản lí nhân sự ”ra đời

Với trang “Quản lí nhân sự” không những là nơi để thực hiện các thủ tục công việc hằng ngày mà là nới để cho nhân viên có thể quản lí độc lập thông tin cá nhân hay lương bổng của mình

1.2 Mục tiêu đề tài

- Áp dụng ngôn ngữ NodeJS và công nghệ ReacJS trong lập trình Web application

- Nắm bắt những nghiệp vụ cần có khi triển khai xây dựng website, đặc biệt là mô hình quản lí nhân sự

- Phân tích, thiết kế và xây dựng ứng dụng web quản lí nhân sự đáp ứng nhu cầu quản lý cho thực tiễn

- Tìm hiểu và thêm các các công nghệ Jenkins và Docker vào để hỗ trợ website

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

- Ngôn ngữ NodeJS và công nghệ ReactJS

2.2.1.1 Thư viện ReactJS [1]

Hình 2.1 Minh họa logo công nghệ React

React Js là một thư viện viết bằng javascript, dùng để xây dựng giao diện người dùng (UI) React được sử dụng rộng rãi và có hệ sinh thái đa dạng phong phú Trong khi những framework khác cố gắng hướng đến một mô hình MVC hoàn thiện thì React nổi bật với sự đơn giản và dễ dàng phối hợp với những thư viện Javascript khác Nếu như AngularJS là một Framework cho phép nhúng code javascript trong code html thông qua các attribute như ng-model, ng-repeat thì với react là một library cho phép nhúng code html trong code javascript nhờ vào JSX, bạn có thể dễ dàng lồng các đoạn HTML vào trong JS tích hợp giữa javascript và HTML vào trong JSX làm cho các component dễ hiểu hơn

Hiện nay, thư viện này nhận được rất nhiều sự quan tâm đến từ cộng đồng, Github repo của React đang có được hơn 67k stars Nó đang được maintain bởi Facebook và Instagram, cùng với sự đóng góp của cộng đồng 1011 (28/5/2017) lập trình viên giỏi trên Thế giới

Về cơ bản, việc xây dựng một ứng dụng MVC phía client với ràng buộc dữ liệu 2 chiều (2way data-binding) là khá đơn giản Tuy nhiên nếu dự án ngày càng mở rộng, nhiều tính năng hơn, làm cho việc bảo trì dự án gặp khó khăn, đồng thời hiệu năng cũng bị giảm

Bạn cũng có thể giải quyết vấn đề đó bằng các thư viện khác như Backbone.js hay Angular.js, tuy nhiên bạn sẽ thấy các hạn chế của chúng khi dự án của bạn ngày càng lớn

React thì trái lại, nó sinh ra để dành cho những ứng dụng lớn dễ dàng quản lý khi

mở rộng React được tạo ra cho phần V của mô hình MVC, cho phép lập trình viên tạo ra các web app lớn, có thể hiển thị các dữ liệu thay đổi theo thời gian mà không cần reload lại trang, cũng như xây dựng các UI components có thể tương tác và tái sử dụng Mục tiêu chính của React là nhanh, đơn giản, hiệu năng cao và dễ dàng mở rộng

2.2.1.2 Ưu và nhược điểm khi sử dụng ReactJS

2.2.1.2.1 Ưu điểm

- Giúp viết Javascript dễ dàng hơn với JSX: React sử dụng một cú pháp mới gọi

là JSX, là một sự hòa trộn giữa Javascript và cú pháp XML: cho phép quoting như HTML và sử dụng HTML tag để render sub-components Vì vậy nó cũng trở nên thân thiện hơn với các lập trình viên front-end

- Component hóa giao diện: React Component API cho phép lập trình viên tạo

ra các Component tương ứng với các phần của giao diện Các component này

có thể được tái sử dụng như một layout template, hoặc kết hợp với các component khác để xây dựng content của giao diện

- Tăng hiệu năng với Virtual DOM: React sử dụng khái niệm virtual DOM để tạo lại các component của bạn ngay cả khi component đó đang “live” Cách tiếp cận này mang lại cho bạn tính linh hoạt rất lớn và cải thiện hiệu năng bởi React có thể tính toán được trước những thay đổi nào cần thực hiện trong DOM

và chỉ update DOM theo những thay đổi đó Bằng cách đó React tránh và giảm thiểu những hành động gây tốn tài nguyên của DOM và làm cho việc cập nhật giao diện hiệu quả hơn

- Thân thiệt với SEO: Một trong những vấn đề lớn của các Js frameworks là nó không thân thiện với các cỗ máy tìm kiếm (search engine) Mặc dù đã có nhiều cải thiện nhưng thực sự search engine vẫn gặp rất nhiều khó khăn khi “đọc” các web app chứa nhiều Js Tuy nhiên React tự hào nằm ngoài số đó bởi vì bạn

có thể chạy React trên server và các virtual DOM của component sẽ được render và trả về trình duyệt dưới dạng web page mà không cần các thư viện

bên thứ 3 hay bất kì thủ thuật nào Vì vậy React đáp ứng đầy đủ tính SEO friendly

- React cung cấp nhiều công cụ out-of-the-box

- Dễ dàng viết UI Testcase

- Những bộ não lớn đang “hậu thuẫn” đằng sau React: React được Facebook opensource và hiện được phát triển bởi rất nhiều lập trình viên giỏi trên thế giới, vì vậy tương lai của React cũng cực kì được đảm bảo

2.2.1.2.2 Nhược điểm

- React chỉ phục vụ cho tầng View React chỉ là View Library nó không phải là một MVC framework như những framework khác Đây chỉ là thư viện của Facebook giúp render ra phần view Vì thế React sẽ không có phần Model và Controller, mà phải kết hợp với các thư viện khác React cũng sẽ không có 2-way binding hay là Ajax

- Tích hợp React vào các framework MVC truyền thống yêu cầu cần phải cấu hình lại

- React khá nặng nếu so với các framework khác React có kích thước tương tương với Angular (Khoảng 35kb so với 39kb của Angular) Trong khi đó Angular là một framework hoàn chỉnh

2.2.2 Redux-Saga

2.2.2.1 Giới thiệu Redux-saga

Hình 2.2 Mô hình liên kết React – Reducx – Saga

Redux-Saga là một thư viện redux middleware (Trong Redux, middleware là một lớp nằm giữa Reducers và Dispatch Action) giúp bạn quản lý những side effect trong redux Redux-Saga sử dụng Generators (function*) của ES6 để xử lý “bất đồng bộ” một cách “đồng bộ”

2.2.2.2 Các khái niệm cơ bản về Redux-saga

Redux saga cung cấp cho chúng ta một số method gọi là effect như sau:

- Fork(): sử dụng cơ chế non - blocking call trên function

- Call(): Gọi function Nếu nó return về một promise, tạm dừng saga cho đến khi promise được giải quyết

- Take(): tạm dừng cho đến khi nhận được action

- Put(): Dùng để dispatch một action

- takeEvery(): Theo dõi một action nào đó thay đổi thì gọi một saga nào đó

- akeLastest() : Có nghĩa là nếu chúng ta thực hiện một loạt các actions, nó sẽ chỉ thực thi và trả lại kết quả của của actions cuối cùng

- yield(): Có nghĩa là chạy tuần tự khi nào trả ra kết quả mới thực thi tiếp

- Select(): Chạy một selector function để lấy data từ state

2.2.2.3 Ưu điểm của Redux – Saga

- Do tách riêng side-effect ra khỏi action nên việc testing là dễ dàng hơn

Redux-Thunk

- Giữ cho action pure synchronos theo chuẩn redux và loại bỏ hoàn toàn

callback theo javascript truyền thống

2.2.2.4 Nhược điểm của Redux – Saga

- Function ko viết được dạng arrow-function

- Phải hiểu về Generator function và các khái niệm trong saga pattern

2.2.3 NodeJS

2.2.3.1 Giới thiệu NodeJS

Hình 2.3 Minh họa logo NodeJS

- NodeJS là một nền tảng (Platform) phát triển độc lập được xây dựng ở trên Javascript Runtime của Chrome mà chúng ta có thể xây dựng được các ứng dụng mạng một cách nhanh chóng và dễ dàng mở rộng

- NodeJS được xây dựng và phát triển từ năm 2009, bảo trợ bởi công ty

Joyent, trụ sở tại California, Hoa Kỳ

- Phần Core bên dưới của Nodejs được viết hầu hết bằng C++ nên cho tốc độ

xử lý và hiệu năng khá cao

- NodeJS tạo ra được các ứng dụng có tốc độ xử lý nhanh, realtime thời gian thực

- NodeJS áp dụng cho các sản phẩm có lượng truy cập lớn, cần mở rộng

nhanh, cần đổi mới công nghệ, hoặc tạo ra các dự án Startup nhanh nhất có thể

Lưu ý: NodeJS là một nền tảng (platform), không phải Web Framework, cũng không phải ngôn ngữ lập trình

2.2.3.2 Ưu và nhược điểm khi sử dụng ReactJS

ngữ lập trình động còn lại, cụ thể là nó không có khái niệm về đa luồng, tất

cả là đơn luồng và hướng sự kiện.”

- NodeJS chạy đa nền tảng phía Server, sử dụng kiến trúc hướng sự kiện

Event-driven, cơ chế non-blocking I/O làm cho nó nhẹ và hiệu quả

- Có thể chạy ứng dụng Nodejs ở bất kỳ đâu trên máy Mac – Window – Linux,

hơn nữa cộng đồng Nodejs rất lớn và hoàn toàn miễn phí

- NodeJS đáp ứng tốt cho ứng dụng thời gian thực và chạy đa nền tảng, đa

thiết bị

2.2.3.2.2 Nhược điểm

- Nodejs không hỗ trợ đa luồng, nó là một máy chủ đơn luồng

- Ứng dụng nặng tốn tài nguyên: Nếu bạn cần xử lý các ứng dụng tốn tài

nguyên CPU như encoding video, convert file, decoding encryption… hoặc

các ứng dụng tương tự như vậy thì không nên dùng NodeJS

2.2.4 Database PostgresSQL [2]

2.2.4.1 Giới thiệu PostgresSQL

Hình 2.4 Minh họa logo PostgresSQL

PostgreSQL là một hệ thống quản trị cơ sở dữ liệu quan hệ-đối tượng

(object-relational database management system) có mục đích chung, hệ thống cơ sở dữ liệu

mã nguồn mở tiên tiến nhất hiện nay

PostgreSQL được phát triển dựa trên POSTGRES 4.2 tại phòng khoa học máy tính

Berkeley, Đại học California

PostgreSQL là hệ thống quản lý cơ sở dữ liệu đầu tiên triển khai tính năng kiểm

soát đồng thời nhiều phiên bản (MVCC) trước cả Oracle Tính năng MVCC cũng

tương tự với các snapshot riêng biệt trong Oracle

PostgreSQL là một phần mềm mã nguồn mở miễn phí Mã nguồn của phần mềm

khả dụng theo license của PostgreSQL, một license nguồn mở tự do Theo đó, bạn sẽ

được tự do sử dụng, sửa đổi và phân phối PostgreSQL dưới mọi hình thức

2.2.4.2 Ưu điểm khi sử dụng PostgresSQL

- PostgreSQL có thể chạy các trang web và ứng dụng web động với LAMP

- Ghi nhật ký viết trước của PostgreSQL làm cho nó trở thành một cơ sở dữ liệu có khả năng chịu lỗi cao

- Mã nguồn PostgreSQL có sẵn miễn phí theo giấy phép nguồn mở Điều này cho phép bạn tự do sử dụng, sửa đổi và triển khai nó theo nhu cầu kinh

- Dễ sử dụng

- Hạn chế việc bảo trì hệ thống

2.2.4.3 Nhược điểm khi sử dụng PostgresSQL

- Postgres không thuộc sở hữu của một tổ chức Vì vậy, nó đã gặp khó khăn khi đưa tên của mình ra khỏi đó mặc dù có đầy đủ tính năng và có thể so sánh với các hệ thống DBMS khác

- Những thay đổi được thực hiện để cải thiện tốc độ đòi hỏi nhiều công việc hơn MySQL vì PostgreSQL tập trung vào khả năng tương thích

- Nhiều ứng dụng nguồn mở hỗ trợ MySQL, nhưng có thể không hỗ trợ

PostgreSQL

- Về số liệu hiệu suất, nó chậm hơn MySQL

2.2.5 Jenkins [3]

2.2.5.1 Giới thiệu Jenkins

Hình 2.5 Minh họa logo Jenkins

Jenkins là một server tự động hóa mã nguồn mở được viết bằng ngôn ngữ Java Jenkins giúp tự động hóa các công đoạn “non-human” của quá trình phát triển phần mềm, với CI (Continuous Integration – sự tích hợp liên tục) và tạo điều kiện thuận lợi cho các khía cạnh kỹ thuật của CD (Continuous Delivery – sự phân phối liên tục) Đây là một hệ thống server chạy trong container servlet như Apache Tomcat Jenkins

có thể thực thi các dự án dựa trên Apache Ant, Apache Maven và sbt (scala build tool)

cũng như các tập lệnh shell tùy ý và hàng loạt lệnh của Windows

Hình 2.6 Sơ đồ hoạt động của Jenkins

2.2.5.2 Tính năng cơ bản của Jenkins

- Dễ dàng cài đặt

- Dễ dàng cấu hình

- Có hàng trăm plugin có sẵn trong update center, mỗi plugin có thể cung cấp hoặc hỗ trợ cho một tính năng náo đó, tích hợp với mọi công cụ trong chuỗi công cụ CI và CD

- Extensible Jenkins có thể được mở rộng bằng kiến trúc plugin của nó, cung cấp khả năng gần như vô tận cho những gì nó có thể làm

- Jenkins có thể dễ dàng phân phối công việc trên nhiều máy để xây dựng, kiểm tra và triển khai nhanh hơn trên nhiều nền tảng

- Mã nguồn mở Jenkins là một công cụ mã nguồn mở, vì là mã nguồn mở nên

dĩ nhiên nó miễn phí cộng với một cộng đồng hỗ trợ hùng hậu

2.2.6 Docker [4]

2.2.6.1 Tổng quan về hệ thống gợi ý

2.2.6.1.1 Khái niệm

Hình 2.7 Minh họa logo Docker

Docker là một công cụ được thiết kế để giúp tạo, triển khai và chạy các ứng dụng

dễ dàng hơn bằng cách sử dụng các containers

Các containers cho phép developer đóng gói một ứng dụng với tất cả các phần cần thiết, chẳng hạn như thư viện và các phụ thuộc khác, và gửi tất cả ra dưới dạng một package

Bằng cách đó, nhờ vào container, ứng dụng sẽ chạy trên mọi máy Linux khác bất

kể mọi cài đặt tùy chỉnh mà máy có thể có khác với máy được sử dụng để viết và kiểm tra code

Theo một cách nào đó, Docker khá giống virtual machine

Điểm khác biệt là thay vì tạo ra toàn bộ hệ điều hành ảo, Docker cho phép các ứng dụng sử dụng cùng một nhân Linux như hệ thống mà chúng đang chạy và chỉ yêu cầu các ứng dụng được vận chuyển với những thứ chưa chạy trên máy chủ

Điều này giúp tăng hiệu suất đáng kể và giảm kích thước của ứng dụng

Và quan trọng, Docker là mã nguồn mở

Điều này có nghĩa là bất kỳ ai cũng có thể đóng góp cho Docker và mở rộng nó để đáp ứng nhu cầu của riêng họ nếu họ cần các tính năng bổ sung không có sẵn

2.2.6.1.2 Ứng dụng

Docker là một công cụ được thiết kế để mang lại lợi ích cho cả developer và quản trị viên hệ thống, làm cho nó trở thành một phần của nhiều công cụ DevOps Điều đó có nghĩa là họ có thể tập trung vào code mà không phải lo lắng về hệ thống mà cuối cùng nó sẽ chạy

Nó cũng cho phép họ bắt đầu bằng cách sử dụng một trong hàng ngàn chương trình đã được thiết kế để chạy trong bộ chứa Docker như một phần của ứng dụng của họ

Đối với người operation, Docker mang đến sự linh hoạt và có khả năng giảm số lượng hệ thống cần thiết vì chi phí thấp hơn

2.3 Cài đặt môi trường và hệ thống

2.3.1 Cài đặt framework ReactJS

Bước 1: Cài đặt môi trường – công cụ phát triển

React Developer Tools

React detector là chrome extenstion để xác định trang web nào sử dụng react Show me the react: firefox và chrome

React Developer Tools: là một plugin có thể mở rộng chức năng của các công cụ phát triển của trình duyệt Nó tạo ra một tab mới trong các công cụ dành cho nhà phát triển Nó được cài đặt dưới dạng tiện ích mở rộng cho trên Chrome hoặc Firefox

NodeJS

- Là ngôn ngữ lập trình phía server

- Là runtime environment (nền tảng để chạy ứng dụng), dùng để xây dựng ứng dụng full – stack javascript

- Mã nguồn mở, cài đặt trên windows, masOS, Lunix, platforms khác

- Không cần phải biết nếu chỉ học React Chỉ cần biết sử dụng Node Package Manager (npm) để cài đặt dependencies (tự động cài đặt khi cài đặt node)

- Kiểm tra phiên bản: node -v và npm – v

- Cú pháp cài đặt các package bằng npm: npm install [package-name] –save

Bước 2: Cài đặt ReactJS

Khởi tạo Project

Mở trang cmd lên và thực hiện các câu lệnh như sau:

Cài đặt bằng câu lệnh: npm install -g create-react-app

Tạo mới ứng dụng: create-react-app [tên project]

Chạy ứng dụng: npm start

2.3.2 Cài đặt NodeJS

Ta chỉ cần vào trang chủ Nodejs.org để download và cài đặt Nodejs Để kiểm

tra đã cài đặt được nodejs hay chưa? Ta cần mở chương trình "Node.js Command

Prompt" lên bằng cách vào Start gõ search từ "prompt" rồi gõ node -v

Nếu xuất ra version của Nodejs tức là ta đã cài đặt thành công

3 CHƯƠNG 3: YÊU CẦU HỆ THỐNG

3.1 Yêu cầu người dùng

Bảng 3-1 Yêu cầu người dùng

1 Web Application

Ứng dụng web hỗ trợ người dùng có thể:

- Tìm kiếm nhân viên

- Quản lý nhân viên

- Quản lý thông tin cá nhân

- Quản lý hành vi nhân viên

3.2 Yêu cầu hệ thống

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

3.2.1.1 Actor

Bảng 3-2 Actor

1 Staff (Nhân viên) Nhân viên truy cập vào hệ thống

2 Manager (Người quản

2 Đăng xuất Đăng xuất tài khoản khỏi hệ thống

3 Quên mật khẩu Staff sẽ nhập email của tài khoản Sau đó

vào mail xác nhận để đổi mật khẩu

4 Quản lý tài khoản

Staff có thể thực hiện các tác vụ:

- Sửa thông tin cá nhân

- Đổi mật khẩu

5 Quản lý lương cá nhân Xem danh sách lương cá nhân theo tháng

theo năm

6 Quản lý hợp đồng cá nhân Nhân viên xem thông tin hợp đồng cá nhân

7 Quản lý request Tạo request, xem lịch sử request

8 Phòng ban Xem thông tin phòng ban đang làm

9 Khen thưởng Xem được thông tin khen thưởng cá nhân 3.2.1.2.2 Manager

Bảng 3-4 Chức năng actor Manager

1 Quản lý nhân viên

Quản lý nhân viên theo phòng ban thực hiện được các thao tác:

- Tìm kiếm nhân viên theo phòng ban quản

- Sắp xếp phòng ban theo danh sách hiển thị

- Xem chi tiết phòng ban được quản lý

3 Khen thưởng Đánh giá chế độ khen thưởng – phạt cho

nhân viên được quản lý

4 Quản lý các request Phê duyệt các yêu cầu mà nhân viên đang

được quản lý yêu cầu

5 Quản lý danh sách lương

cho nhân viên

Quản lý danh sách lương cho nhân viên quản lý theo phòng ban

1 Quản lý User Quản lý danh sách user của hệ thống Thực

hiện được các thao tác:

- Các tác vụ CRUD đối với user trong hệ thống

- Tìm kiếm user trong hệ thống

- Sắp xếp phòng ban theo danh sách hiển thị

3 Quản lý vị trí cho nhân

viên

Quản lý danh sách vị trí nhân viên Thực hiện được các tác vụ CRUD đối với vị trí nhân viên

4 Quản lý hợp đồng Quản lý danh sách hợp đồng thực hiện các

tác vụ CRUD đối với hợp đồng

3.2.1.3 Usecase Diagram

Hình 3.1 Usecase diagram tổng quát

3.2.1.3.1 Usecase Staff

Hình 3.2 Usecase của actor Staff

3.2.1.3.2 Usecase Manager

Hình 3.3 Usecase của actor Manager

3.2.1.3.3 Usecase Admin

Hình 3.4 Usecase của actor Admin

3.2.1.4 Danh sách usecase

Bảng 3-6 Bảng danh sách các use case

9 Quản lý phòng ban của staff UC007a

10 Quản lý phòng ban của admin UC007b

12 Quản lý yêu cầu của manager UC008b

13 Quản lý task của staff UC009a

19 Quản lý vị trí chức vụ user UC0014

3.2.1.5 Đặc tả chi tiết usecase

3.2.1.5.1 UC001.Đăng nhập

Bảng 3-7 Mô tả usecase UC001.Đăng nhập

Usecase Đăng nhập

Mô tả Kiểm tra và xác thực vai trò người dùng

Tác nhân kích hoạt Staff, Manager, Admin

Tiền điều kiện Tồn tại tài khoản admin cung cấp

Các bước thực hiện Bước 1: Vào màn hình đăng nhập

Bước 2: Nhập Email address và Mật khẩu Bước 3: Nhấn button Đăng nhập

Bước 4: Nếu thành công sẽ chuyển tới trang chủ Nếu thất bại sẽ quay lại bước chuyển tới màn hình đăng nhập

3.2.1.5.2 UC002.Đăng xuất

Bảng 3-8 Mô tả usecase UC002.Đăng xuất

Usecase Đăng xuất

Mô tả Người dùng đăng xuất tài khoản ra khỏi hệ thống và

trình duyệt

Tác nhân kích hoạt Staff, Manager, Admin

Tiền điều kiện Đã tiến hành đăng nhập vào website

Các bước thực hiện Bước 1: Click vào button user, tùy chọn đăng xuất sẽ

hiện ra từ menu dropdown

Bước 2: Người dùng được chuyển về trang đăng nhập sau khi đăng xuất

3.2.1.5.3 UC003.Thay đổi mật khẩu

Bảng 3-9 Mô tả usecase UC003.Thay đổi mật khẩu

Usecase Thay đổi mật khẩu

Mô tả Người dùng có nhu cầu thay đổi mật khẩu

Tác nhân kích hoạt Staff, Manager, Admin

Tiền điều kiện Đã tiến hành đăng nhập vào website

Các bước thực hiện Bước 1: Click vào button user, tùy chọn thay đổi mật

khẩu sẽ hiện ra từ menu dropdown

Bước 2: Người dùng được chuyển sang trang thay đổi mật khẩu

Bước 3: Nhập mật khẩu cũ, nhập mật khẩu mới và nhập xác nhận mật khẩu mới

Bước 4: Nhấn button Save

3.2.1.5.4 UC004.Quản lý tài khoản

Bảng 3-10 Mô tả usecase UC004.Quản lý tài khoản

Usecase Quản lý tài khoản

Tác nhân kích hoạt Staff, Manager, Admin

Tiền điều kiện Đã đăng nhập vào website

Các bước thực hiện Bước 1: Chọn Information ở thanh Navigation

Bước 2: Người dùng điền đầy đủ thông tin và bấm Update để xác nhận chỉnh sửa thông tin

3.2.1.5.5 UC005a Quản lý lương của staff

Bảng 3-11 Mô tả usecase UC005a.Quản lý lương của staff

Use case Quản lý lương của staff

Tác nhân kích hoạt Staff

Tiền điều kiện Đã đăng nhập vào hệ website

Các bước thực hiện Bước 1: Chọn Salaries ở thanh Navigation

Bước 2: Người dùng chọn tháng để xem thông tin lương

3.2.1.5.6 UC005b Quản lý lương của manager

Bảng 3-12 Mô tả usecase UC005b.Quản lý lương của manager

Usecase Quản lý lương của manager

Mô tả Quản lý lương cho nhân viên trong phòng ban

Tác nhân kích hoạt Manager

Tiền điều kiện Đã đăng nhập vào website và có quyền manager

Các bước thực hiện Bước 1: Vào màn hình trang chủ

Bước 2: Chọn Salaries ở thanh Navigation Bước 3: Người dùng chọn tháng để xem thông tin lương

3.2.1.5.7 UC006a Quản lý hợp đồng của staff

Bảng 3-13 Mô tả usecase UC006.Quản lý hợp đồng của staff

Usecase Quản lý hợp đồng của staff

Tác nhân kích hoạt Staff

Tiền điều kiện Đã đăng nhập vào website

Các bước thực hiện Bước 1: Vào màn hình trang chủ

Bước 2: Chọn Contract ở thanh Navigation Bước 3: Người dùng chọn tháng để xem thông tin hợp đồng

3.2.1.5.8 UC006b.Quản lý hợp đồng của admin

Bảng 3-14 Mô tả usecase UC006b.Quản lý hợp đồng của admin

Usecase Quản lý hợp đồng của admin

đồng cho user

Tác nhân kích hoạt Admin

Tiền điều kiện Đã đăng nhập vào website và có quyền admin

Các bước thực hiện Bước 1: Chọn Directory ở thanh Navigation

Bước 2: Người dùng vào danh sách user

Bước 3: Người dùng click vào icon Edit để có thể tiến

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

Bước 4: Chọn Contract ở thanh Navigation Bước 5a: Người dùng click vào icon Edit để có thể tiến hành chỉnh sửa thông tin hợp đồng

Bước 6a: Người dùng điền đầy đủ thông tin cần chỉnh sửa và bấm button Save để lưu thông tin thay đổi Bước 5b: Người dùng click vào button New để tạo mới hợp đồng cho User

Bước 6b: Người dùng điền đầy đủ thông tin cần chỉnh sửa và bấm button Save để lưu thông tin thay đổi 3.2.1.5.9 UC007a Quản lý phòng ban của staff

Bảng 3-15 Mô tả usecase UC007a.Quản lý phòng ban của staff

Usecase Quản phòng ban của staff

Mô tả Người dùng có nhu cầu xem thông tin phòng ban

đang thực hiện

Tác nhân kích hoạt Staff

Tiền điều kiện Đã đăng nhập vào website

Các bước thực hiện Bước 1: Chọn Department ở thanh Navigation

Bước 2a: Người dùng chọn vào icon detail để xem chi tiết phòng ban

Bước 2b: Người dùng nhập vào từ khóa để tìm kiếm phòng ban theo nhu cầu

3.2.1.5.10 UC007b.Quản lý phòng ban của Admin

Bảng 3-16 Mô tả usecase UC007b.Quản lý phòng ban của Admin

Usecase Quản lý phòng ban của Admin

ban

Tác nhân kích hoạt Admin

Tiền điều kiện Đăng nhập thành công và có quyền admin

Các bước thực hiện Bước 1: Chọn Department ở thanh Navigation

Bước 2a: Admin chọn vào icon detail để xem chi tiết phòng ban

Bước 2b: Admin nhập vào từ khóa để tìm kiếm phòng ban theo nhu cầu

Bước 2c: Amin click icon Edit để chỉnh phòng ban Bước 3c: Admin nhập thông tin cần chỉnh sửa cho phòng ban và bấm vào button Save để lưu thông tin cần thay đổi

Bước 2d: Admin click vào button New để tạo mới phòng ban

Bước 3d: Admin nhập thông tin phòng ban cần tạo mới và bấm vào button Save để tạo mới phòng ban

3.2.1.5.11 UC0018a Quản lý yêu cầu của staff

Bảng 3-17 Mô tả usecase UC0018a Quản lý yêu cầu của staff

Usecase Quản lý khen thưởng – phạt của staff

Mô tả Người dùng có nhu cầu thực hiện hoạt động CRUD

yêu cầu của cá nhân

Tác nhân kích hoạt Staff, Manager, Admin

Tiền điều kiện Đăng nhập thành công

Các bước thực hiện Bước 1: Chọn Date-off ở thanh Navigation

Bước 2a: Người dùng nhập vào thông tin yêu cầu và nhấn Submit để tạo yêu cầu

Bước2b: Người dùng bấm vào lable Summary để xem tóm tắt thông tin số lượng yêu cầu

Bước 2c: Người dùng bấm vào lable History để xem

lịch sử thông tin đã yêu cầu

3.2.1.5.12 UC008b Quản lý yêu cầu của manager

Bảng 3-18 Mô tả usecase UC008b.Quản lý yêu cầu của manager

Usecase Quản lý yêu cầu của manager

Mô tả Người dùng có nhu cầu phê duyệt yêu cầu khi có

thông tin yêu cầu từ nhân viên

Tác nhân kích hoạt Manager

Tiền điều kiện Đăng nhập thành công và có quyền manager

Các bước thực hiện Bước 1: Chọn Date-off ở thanh Navigation

Bước 2: Người dùng xem thông tin yêu và phê duyệt yêu cầu

3.2.1.5.13 UC009a Quản lý task của staff

Bảng 3-19 Mô tả usecase UC009a.Quản lý task của staff

Usecase Quản lý task của staff

Mô tả Nhân viên có nhu cầu xem thông tin và log task cá

nhân

Tác nhân kích hoạt Staff

Tiền điều kiện Đăng nhập thành công

Các bước thực hiện Bước 1: Chọn Dasboard ở thanh Navigation

Bước 2: Nhập thông tin cần log task và nhấn Submit

để hoàn thành

3.2.1.5.14 UC009b Quản lý task của manager

Bảng 3-20 Mô tả usecase UC009b.Quản lý task của manager

Usecase Quản lý task của manager

Mô tả Manager có nhu cầu thực hiện hoạt động CRUD task

Tác nhân kích hoạt Manager

Tiền điều kiện Đăng nhập thành công và có quyền manager

Các bước thực hiện Bước 1: Chọn Dasboard ở thanh Navigation

Bước 2a: Nhập thông tin task và nhấn Submit để hoàn thành tạo task

Bước 2b: Chọn vào label thời gian để xem task theo tháng

3.2.1.5.15 UC0010 Quản lý Export report

Bảng 3-21 Mô tả usecase UC0010.Quản lý Export report

Usecase Quản lý Export report

Tác nhân kích hoạt Manager

Tiền điều kiện Đăng nhập thành công và có quyền manager

Các bước thực hiện Bước 1: Chọn Department ở thanh Navigation

Bước 2: Click phòng ban cần báo cáo

Bước 3: Chọn vào button Export để xuất file báo cáo 3.2.1.5.16 UC0011 Quản lý staff của manager

Bảng 3-22 Mô tả usecase UC0011.Quản lý staff của manager

Usecase Quản lý staff của manager

Mô tả Manager có nhu cầu thực hiện hoạt động CRUD staff

cho phòng ban

Tác nhân kích hoạt Manager

Tiền điều kiện Đăng nhập thành công và có quyền manager

Các bước thực hiện Bước 1: Chọn Department ở thanh Navigation

Bước 2: Nhấn icon Detail phòng ban để xem thông tin phòng ban

Bước 3: Chọn vào label staff để thực hiện các hoạt động CRUD staff cho phòng ban

3.2.1.5.17 UC0012 Quản lý user của admin

Bảng 3-23 Mô tả usecase UC0012.Quản lý user của admin

Usecase Quản lý user của admin

Mô tả Admin có nhu cầu thực hiện hoạt động CRUD user

Tác nhân kích hoạt Admin

Tiền điều kiện Đăng nhập thành công và có quyền Admin

Các bước thực hiện Bước 1: Chọn Directory ở thanh Navigation

Bước 2: Danh sách user hiện lên admin thực hiện các thao tác CRUD cần thiết

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

Bảng 3-24 Yêu cầu phi chức năng

UX thân thiện người dùng, dễ sử dụng

2 Độ tin cậy Các thông tin được lưu trữ trong cơ sở dữ liệu là vĩnh

viễn

Bảo mật hệ thống và thông tin người dùng

3 Tính khả dụng Xử lý dữ liệu theo thời gian thực

4 Bảo trì Dễ dàng bảo trì và nâng cấp