Xây dựng website quản lý nhân sự

TỔNG QUAN

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

Trong thời đại công nghệ hiện đại, con người ngày càng phụ thuộc vào công nghệ thông tin để tối ưu hóa quy trình làm việc Việc xử lý các thủ tục giấy tờ rườm rà và phải chờ đợi duyệt từng cấp không chỉ gây khó khăn cho công nhân sau những giờ làm việc căng thẳng mà còn dễ dẫn đến việc quên mang theo các giấy tờ cần thiết Điều này khiến họ phải xếp hàng dài để báo cáo kết quả công việc hàng ngày, tạo thêm áp lực trong môi trường làm việc.

Trong thời đại công nghệ số hiện nay, việc quản lý nhân sự đã trở nên đơn giản hơn nhờ sự phát triển không ngừng của công nghệ thông tin Do đó, cần thiết phải xây dựng các phương pháp áp dụng công nghệ thông tin vào quản lý nhân sự một cách phù hợp với nhu cầu thực tế.

Trong thời đại công nghệ hiện đại, việc quản lý trở nên đơn giản hơn bao giờ hết Chỉ cần có kết nối Internet và thiết bị phù hợp, người dùng có thể dễ dàng truy cập thông tin cần quản lý mọi lúc, mọi nơi.

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

Trang "Quản lý nhân sự" không chỉ là nền tảng để thực hiện các thủ tục công việc hàng ngày, mà còn là công cụ giúp nhân viên tự quản lý thông tin cá nhân và lương bổng của mình một cách độc lập.

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.

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

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

CÔNG NGHỆ NỀN TẢNG

Nền tảng phát triển

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

Công nghệ sử dụng

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

React Js là một thư viện JavaScript nổi bật, chuyên dùng để xây dựng giao diện người dùng (UI) với hệ sinh thái phong phú Khác với các framework khác theo mô hình MVC, React mang lại sự đơn giản và khả năng tích hợp dễ dàng với các thư viện JavaScript khác Trong khi AngularJS cho phép nhúng mã JavaScript vào HTML qua các thuộc tính như ng-model hay ng-repeat, React sử dụng JSX để nhúng HTML vào mã JavaScript, giúp việc tích hợp giữa JavaScript và HTML trở nên dễ hiểu hơn.

Thư viện React hiện đang thu hút sự chú ý lớn từ cộng đồng, với hơn 67.000 sao trên kho lưu trữ Github Được duy trì bởi Facebook và Instagram, React còn nhận được sự đóng góp từ 1.011 lập trình viên tài năng trên toàn cầu tính đến ngày 28 tháng 5 năm 2017.

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 (2-way data-binding) có thể đơn giản ở giai đoạn đầu, nhưng khi dự án mở rộng với nhiều tính năng, việc bảo trì trở nên khó khăn và hiệu suất có thể bị ảnh hưởng.

Bạn có thể sử dụng các thư viện như Backbone.js hoặc Angular.js để giải quyết vấn đề, nhưng khi dự án phát triển lớn hơn, bạn sẽ nhận thấy những hạn chế của chúng.

React được thiết kế cho các ứng dụng lớn, giúp quản lý dễ dàng khi mở rộng và tập trung vào phần View của mô hình MVC Nó cho phép lập trình viên phát triển các web app có khả năng hiển thị dữ liệu thay đổi theo thời gian mà không cần tải lại trang, đồng thời xây dựng các UI components tương tác và tái sử dụng Mục tiêu chính của React là mang lại tốc độ, sự đơn giản, hiệu suất cao và khả năng mở rộng dễ dàng.

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

React giúp việc viết Javascript trở nên dễ dàng hơn thông qua JSX, một cú pháp kết hợp giữa Javascript và XML JSX cho phép sử dụng HTML để trích dẫn và render các thành phần con, làm cho nó trở nên thân thiện hơn với lập trình viên front-end.

React Component API cho phép lập trình viên tạo ra các thành phần giao diện, gọi là component, tương ứng với từng phần của giao diện Những component này có thể được tái sử dụng như một mẫu bố cục hoặc kết hợp với các component khác để xây dựng nội dung cho giao diện.

React sử dụng virtual DOM để tối ưu hóa hiệu năng bằng cách cho phép tái tạo các component ngay cả khi chúng đang hoạt động Cách tiếp cận này mang lại tính linh hoạt cao và cải thiện hiệu suất, vì React có khả năng xác định trước những thay đổi cần thiết trong DOM và chỉ thực hiện các cập nhật tương ứng Nhờ đó, React giảm thiểu các thao tác tốn tài nguyên của DOM, giúp việc cập nhật giao diện trở nên hiệu quả hơn.

Một trong những thách thức lớn của các framework JavaScript là khả năng tối ưu hóa cho SEO, khiến các công cụ tìm kiếm gặp khó khăn trong việc "đọc" các ứng dụng web chứa nhiều JavaScript Dù đã có nhiều cải tiến, nhưng React nổi bật với khả năng chạy trên server, cho phép các virtual DOM của component được render và trả về trình duyệt dưới dạng trang web mà không cần sử dụng thêm thư viện nào khác.

4 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

React, được Facebook phát hành mã nguồn mở, hiện đang được phát triển bởi một cộng đồng lập trình viên tài năng trên toàn cầu, điều này đảm bảo một tương lai vững chắc cho framework này.

React chỉ là một thư viện dành riêng cho tầng View, không phải là một framework MVC như nhiều framework khác Được phát triển bởi Facebook, React chỉ hỗ trợ việc render giao diện mà không bao gồm phần Model và Controller Do đó, để xây dựng ứng dụng hoàn chỉnh, React cần kết hợp với các thư viện khác và không cung cấp tính năng two-way binding hay 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 có kích thước tương đương với Angular, khoảng 35kb so với 39kb của Angular, tuy nhiên React được xem là nhẹ hơn so với nhiều framework khác Điều này cho thấy React mặc dù có kích thước lớn, nhưng vẫn không phải là một framework hoàn chỉnh như Angular.

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

Redux-Saga is a Redux middleware library that helps manage side effects in Redux applications It acts as an intermediary between reducers and dispatched actions By utilizing ES6 Generators (function*), Redux-Saga enables developers to handle asynchronous operations in a synchronous manner, simplifying the management of complex side effects.

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

- 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

Hình 2.3 Minh họa logo NodeJS

NodeJS là nền tảng phát triển độc lập, được xây dựng trên Javascript Runtime của Chrome, cho phép chúng ta tạo ra 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 là lựa chọn lý tưởng cho các sản phẩm có lưu lượng truy cập lớn, yêu cầu khả năng mở rộng nhanh chóng và đổi mới công nghệ Nó cũng rất phù hợp cho việc phát triển các dự án khởi nghiệp một cách 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

- Các ứng dụng NodeJS được viết bằng javascript, ngôn ngữ này là một ngôn ngữ khá thông dụng Theo tác giả của ngôn ngữ Javascript, Ryan Dahl:

“Javascript có những đặc tính mà làm cho nó rất khác biệt so với các ngôn

7 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ị

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

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

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

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 tiện ích mở rộng giúp nâng cao chức năng của các công cụ phát triển trong trình duyệt, tạo ra một tab mới dành riêng cho React Tiện ích này có thể được cài đặt trên các trình duyệt Chrome và Firefox.

- 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

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

Để tải và cài đặt Node.js, bạn chỉ cần truy cập trang chủ Nodejs.org Sau khi cài đặt, để kiểm tra xem Node.js đã được cài đặt thành công hay chưa, hãy mở chương trình "Node.js Command Prompt".

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.

YÊU CẦU HỆ THỐNG

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

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

STT Tiêu đề User story

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

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

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

Yêu cầu hệ thống

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

Người quản lý truy cập vào hệ thống quản lý nhân viên

3 Admin (Quản trị hệ thống)

Người giữ vai trò quản lý, theo dõi các hoạt động của website

3.2.1.2 Đặc tả chức năng actor

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

STT Chức năng Mô tả

Staff sử dụng tài khoản mà admin cung cấp khi ứng tuyển vào công ty

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

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

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

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

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

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 lý

- Các tác vụ CRUD nhân viên với phòng ban

Quản lý danh sách phòng ban được quản lý Thực hiện được các thao tác:

- 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

Phân chia công việc cho nhân viên theo từng phòng ban Thực hiện được các thao tác:

- Các tác vụ CRUD task theo phòng ban

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

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

Quản lý danh sách phòng ban Thực hiện được các thao tác:

- Các tác vụ CRUD đối với phòng ban

- 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

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

Hình 3.2 Usecase của actor Staff

Hình 3.3 Usecase của actor Manager

Hình 3.4 Usecase của actor Admin

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

STT Tên use case Usecase ID

3 Thay đổi mật khẩu UC003

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

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

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

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

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

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

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

11 Quản lý yêu cầu của staff UC008a

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

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

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

15 Quản lý Export report UC0010

16 Quản lý staff của manager UC0011

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

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

3.2.1.5 Đặc tả chi tiết usecase

Bảng 3-7 Mô tả usecase UC001.Đă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

Bảng 3-8 Mô tả usecase UC002.Đă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

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

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

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

Mô tả Người dùng muốn xem thông tin cá nhân

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

Mô tả Xem thông tin lương cá nhân

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

Mô tả Xem thông tin hợp đồng cá nhân

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

Mô tả Admin có nhu cầu thực hiện hoạt động CRUD hợp đồ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

23 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

Để lưu thông tin đã chỉnh sửa, người dùng cần điền đầy đủ thông tin và nhấn nút Lưu Để tạo hợp đồng mới cho người dùng, hãy nhấp vào nút Tạo mới.

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

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

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

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

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

Để chỉnh sửa thông tin phòng ban, Amin cần nhấp vào biểu tượng Chỉnh sửa Sau đó, Admin sẽ nhập các thông tin cần thay đổi và nhấn nút Lưu để lưu lại những 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

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

25 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

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

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

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

Mô tả Manager xuất báo cáo

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

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

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

Giao diện phù hợp với từng trình duyệt web khác nhau

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.

THIẾT KẾ HỆ THỐNG

Tổng quan hệ thống

Mô hình Client-Server là một kiến trúc phổ biến trong mạng máy tính, được ứng dụng rộng rãi và là nền tảng của hầu hết các trang web hiện nay Khi nhận yêu cầu từ client, server có khả năng chuyển tiếp yêu cầu đó đến server khác, chẳng hạn như database server, nếu nó không thể xử lý yêu cầu một cách độc lập Server có thể thực hiện các nhiệm vụ từ đơn giản đến phức tạp, và mô hình này bao gồm hai thành phần chính: client và server.

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

Client là thành phần chịu trách nhiệm gửi yêu cầu đến server, đóng vai trò trung gian trong việc giao tiếp giữa người dùng, server và môi trường bên ngoài Khi nhận yêu cầu từ người dùng, client sẽ tạo ra các query string để gửi đến server Sau khi nhận được kết quả từ server, client sẽ tổ chức và hiển thị thông tin đó một cách rõ ràng cho người dùng.

Server là hệ thống chịu trách nhiệm xử lý các yêu cầu từ client và gửi lại kết quả để client tiếp tục phục vụ người dùng Nó giao tiếp với môi trường bên ngoài thông qua các query string, tiếp nhận và phân tích dữ liệu trước khi trả về kết quả cho client.

Database

4.2.3 Đặc tả chi tiết database

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

1 Id Id của bảng uuid Pk

2 firstname Họ người dùng Varchar

3 lastname Tên người dùng Varchar

4 email Địa chỉ email người dùng

5 password Mật khẩu Varchar Not null

6 address Địa chỉ của người dùng

7 role_id Phân quyền cho người dùng int Not null

9 phone Số điện thoại người dùng int

11 Identity_card Số CMND Varchar

12 employee_code Mã nhân viên Varchar

13 avatar Ảnh đại diện Varchar

14 departmentId Mã phòng ban Uuid FK

16 Position Vị trí nhân viên Varchar

2 time Thời gian date Not null

3 employeeId mã khóa bảng employee uuid FK

4 employee Tên nhân viên Positionhar

5 totalWorkingDate Tổng ngày làm việc int Not null

6 gross Số tiền tổng int Not null

7 startDate Ngày bắt đầu Date Not null

8 endDate Ngày kết thúc Date Not null

9 employeeCode Mã nhân viên Positionhar Not null

2 employeeId Id của employee uuid FK

3 contractNo Mã hợp đồng Varchar Not null

4 startDate Ngày bắt đầu Date Not null

6 joinDate Ngày tham gia Date Not null

7 probationStatus Trạng thái hiệu lực của hợp đồng

8 endProbationDate Ngày kết thúc tập sự Date

9 grossSalary Tổng mức lương Int Not null

2 Date Thời gian Int Not null

3 Reson Lý do Varchar Not null

4 type Loại hợp lệ hay không hợp lệ

5 createdAt Ngày tạo Date Not null

6 employeeId Id employe Uuid PK

7 Status Trạng thái của yêu cầu Text

1 Id Id của bảng uuid PK

2 Name Tên phòng ban Positionhar Not null

3 Location Vị trí phòng ban Positionhar Not null

4 CreatedAt Ngày tạo Date Not null

2 Name Tên dự án Varchar Not null

4 endDate Ngày kết thúc Date

2 projectId Id bảngdự án uuid FK

3 employeeId Id bảng employee uuid FK

4 Activtiy Trạng thái task Varchar Not null

5 Task Tên task Positionhar Not null

3 projectId Id của project uuid FK

4 startDate Ngày tạo Date Not null

1 Id Id của bảng Int Pk

2 Permission Tên vị trí Varchar Not null

1 Id Id của bảng int Pk

2 code Mã của Bảo hiểm Varchar Not null

3 employeeId Id của nhân viên uuid FK

4 Ratio Hệ số của bảo hiểm Int Not null

2 floor Số tầng của nơi làm việc của nhân viên

3 Seat Vị trí làm việc Varchar

4 employeeId Id của employee Uuid FK

3 hospital Bệnh viện đăng ký bảo hiểm

5 effectiveDate ngày đăng ký date

2 TaskId Id của task uuid FK

3 workingĐate Ngày làm việc Varchar

4 workingHour Giờ làm việc int

2 reviewerId Id của reviewer uuid FK

4 reviewDate Ngày nhận xét date

3 bankId Id của bank Uuid

4 accoutNumber Số thẻ ngân hàng Varchar

5 accoutName Tên ngân hàng Varchar

2 name Tên ngân hàng Varchar

Sequence diagram

Hình 4.5 SQ001_UC001 Đăng nhập 4.3.2 SQ002_UC004 Quản lý tài khoản của Staff

Hình 4.6 SQ002_UC004 Quản lý tài khoản của Staff 4.3.3 SQ003_UC0012 Quản lý user của Admin

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

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

Hình 4.8 SQ004_UC005b Quản lý lương của Manger 4.3.5 SQ005_UC007b Quản lý phòng ban của manager

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

4.3.6 SQ006_UC0010 Quản lý Export Excel

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

Thiết kế giao diện

4.4.1.1 Danh sách màn hình của Staff

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

ID Tên màn hình Chi tiết

STAFF001 Login Giao diện đăng nhập

STAFF002 Dashboard Giao diện bảng điều khiển

STAFF003 là giao diện quản lý thời gian làm việc, giúp theo dõi và ghi nhận giờ làm của nhân viên STAFF004 cung cấp giao diện để thực hiện yêu cầu xin nghỉ, tạo điều kiện thuận lợi cho việc quản lý ngày nghỉ STAFF005 là giao diện trang thông tin cá nhân, nơi nhân viên có thể cập nhật và xem thông tin cá nhân của mình.

STAFF006 Directory Giao diện danh sách thành viên

STAFF007 Position Giao diện danh sách vị trí làm việc

4.4.1.2 Đặc tả chỉ tiết các màn hình của Staff

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

Kiểu dữ liệu Reference Ghi chú

Nhập đúng tên đăng nhập đã được cũng cấp

Mật khẩu Type True Text Database

Nhập đúng mật khẩu đã được cung cấp

Đăng nhập Click Fasle Button

Khi click, sẽ chuyển đến màn hình USER002

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

Click False Label Khi click, chuyển đến màn hình STAFF002

6 6 Vị trí ngồi theo kế hoạch

Click False Label Khi click, chuyển màn hình STAFF007

Click False Button Khi click, chuyển màn hình STAFF004

Enter True Int Nhập thời gian than đã thực hiện

9 9 Lưu Click False Button Click để lưu thay đổi

10 1 Nộp Click False Button Sau khi hoàn thành log thời gian Click để nộp báo kết quả

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

Click Fasle Date Database Khi click màn hình popup thời gian xuất hiện

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

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

Click True Text Database Khi click sẽ chọn loại ngày nghỉ hiện trên checkbox

2 Số ngày nhắc còn lại theo loại

None True Int Database Hiển thị theo giá loại ngày nghỉ được chọn

3 Thời gian bắt đầu nghỉ

Click True Date Database 1 Khi click hiện popup để chọn ngày

2 Ghi trực tiếp thời gian theo fotmat mm/dd/yyyy

4 Thời gian nghỉ kết thúc

Click True Date Database 1 Khi click hiện popup để chọn ngày

2 Ghi trực tiếp thời gian theo fotmat mm/dd/yyyy

5 Yêu cầu Click Fasle Label Khi click sẽ chuyển đến mục tạo mới request

6 Danh sách loại ngày nghỉ

Click Fasle Label Khi click sẽ chuyển đến mục tóm tắt danh sách tổng số mỗi loại ngày nghỉ

7 Lịch sử Click Fasle Label Khi click sẽ chuyển đến mục lịch sử yêu cầu đã tạo

8 Lý do Enter True Text Database Người dùng nhập lý do nghỉ

9 Gửi Click Fasle Button Khi click yêu cầu sẽ được tạo

Khi click sẽ chuyển đến mục tóm tắt danh sách tổng số mỗi loại ngày nghỉ

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

- Khi click sẽ chuyển đến mục lịch sử yêu cầu đã tạo

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

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

Khi click thông tin thay đổi sẽ được lưu

2 Giới tính Click True Boolean Database Hiển thị giới tính đã chọn

3 Số điện thoại Enter True Text Database

Hiện thị số điện thoại đã có hoặc chỉnh sửa

4 Họ và tên lót Enter True Text Database Họ và tên lót

5 Tên Enter True Text Database Tên

6 Địc chỉ Enter True Text Database Thông tin địa chỉ

7 ID Enter True Text Database Thông tin id của staff

8 Ngày sinh Enter True Date Database

Hiển thị thông tin ngày sinh

1 Nhập trực tiếp để thay đổi ngày sinh theo fotmat mm/dd/yyyy

2 Click để hiện popup chọn ngày

9 Hình đại diện Click Fasle Image Database

Hiển thị avatar của staff

Click để hiện danh mục chọn hình khi cần thay ảnh đại diện

10 Thông tin cá nhân Click False

Click để chuyển sang danh mục thông tin cá nhân

11 Tài khoản ngân hàng Click False

Click để chuyển sang danh mục thông tin tài khoản ngân hàng

Click để chuyển sang danh mục hợp đồng

Click để chuyển sang danh mục bảo hiểm

14 Thông tin dự án Click False

Click để chuyển sang danh mục phản hồi

Khi click để chuyển sang danh mục thông tin tài khoản ngân hàng

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

1 Tạo mới Click False Button Khi click sẽ hiện popup tạo mới tài ngân hàng

Click false Icon Khi click sẽ hiện popup chỉnh sửa thông tin ngân hàng

- Khi click sẽ hiện popup tạo mới tài ngân hàng

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

- Khi click sẽ hiện popup chỉnh sửa thông tin ngân hàng

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

Click để chuyển sang danh mục hợp đồng

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

Click để chuyển sang danh mục bảo hiểm

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

Click để chuyển sang danh mục thông tin project.

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

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

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

Enter True Text Nhập vào tên hoặc id nhân viên cần tìm

True Label Hiển thị thông tin nhân viên như hình

Click True Icon Khi click sẽ chuyển trang danh sách nhân viên trước đó

4 Trang sau Click True Icon Khi click sẽ chuyển trang danh sách nhân viên sau đó

Lablel Hiển thị số trang hiện tại

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

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

Khi click, sẽ hiện checkbox để chọn phòng ban cần xem thông danh sách chỗ ngồi

Xem thông tin bộ phận quản lý

Khi hover vào vị trí nào thì popup message thông tin tên phòng ban và tên người quản lý hiện lên

Xem thông tin nhân viên

Khi hover vào vị trí nào thì popup message thông tin tên phòng ban và tên người nhân hiện lên

4 Thành viên none Phòng chưa có nhân viên

4.4.2.1 Danh sách màn hình Manager

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

MANAGER001 Dashboard Giao diện bảng điều khiển

MANAGER002 Directory Giao diện danh sách quản lý thành viên

MANAGER003 Position Giao diện danh sách vị trí làm việc

MANAGER004 Salaries Giao diện quản lý lương

MANAGER005 Deparment Giao diện quản lý phòng ban

MANAGER006 Information Giao diện trang thông tin cá nhân

4.4.2.2 Đặc tả chi tiết màn hình Manager

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

Click False Khi click, popup tạo mới task hiện lên để tạo task

True Label int Hiển thị tổng thời gian thực hiện các task

3 Avatar Click Falase khi click, xuất hiện drop đăng xuất và thay đổi mật khẩu

Click False Label Khi click, màn hình sẽ chuyển đến MANAGER002

5 Vị trí Click False Label Khi click, màn hình sẽ chuyển đến MANAGER003

6 Lương Click False Label Khi click, màn hình sẽ chuyển đến MANAGER004

Click False Label Khi click, màn hình sẽ chuyển đến MANAGER005

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

Click False Label Khi click, sẽ hiện popup để thực hiện đăng kí tài khoản cho nhân viên

Click False Icon Khi click, dữ liệu sẽ hiển thị trong màn hình MANAGER006

Khi click, sẽ hiện popup để thực hiện đăng kí tài khoản cho nhân viên

Hình 4.28 Màn hình popup tạo mới tài khoản Bảng 4-29 Mô tả chi tiết popup tạo mới tài khoản

Enter True Text Nhập thông tin tên cho tài khoản

2 Mật khẩu Enter True Text Nhập thông tin mật khẩu cho tài khoản

3 Đóng Click False Click để đóng popup

4 Thêm mới Click False Click để tạo tài khoản cho nhân viên

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

1 Chọn tầng Click True Text

Khi click, sẽ hiện checkbox để chọn tầng cần xem thông danh sách chỗ ngồi

Khi click popup tạo mới chỗ ngồi xuất hiện

Xem thông tin bộ phận quản lý

1 Click khi cần chỉnh sửa thông tin, khi click popup sẽ xuất hiện để chỉnh sửa

2 Hover để hiển thị message gồm tên phòng ban và tên người quản lý

Click/ hover Flase 1.Click khi cần chỉnh sửa thông tin, khi

59 nhân viên click popup sẽ xuất hiện để chỉnh sửa

2 Hover để hiển thị message gồm tên phòng ban và tên người quản lý

Khi click popup tạo mới chỗ ngồi xuất hiện

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

1 Nhập mã số Enter True Text Nhập tên chỗ làm việc

Khi click checkbox danh sách nhân viên sẽ xuất hiện chọn nhân viên cần gán vị trí

3 Lưu Click Flase Click để tạo mới

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

Click True Date Click chọn tháng cần xem báo cáo

2 Nộp Click Fasle Button Click để nộp sau khi chọn xem tháng thông tin xong

3 Thông tin phần trăm bảo hiểm

Hover True Text Database Khi hover, sẽ message gồm thông tin phần trăm cần đóng

4 Cài đặt Click Fasle Icon Khi click sẽ hiện lên drop để xuất file excel hoặc gửi thông báo cho nhân viên

None Fasle Text Database Thông tin lương chi tiết nhân viên như hình

Khi click sẽ hiện lên drop để xuất file excel hoặc gửi thông báo cho nhân viên

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

1 Xuất file Click False Click để xuất file báo cáo

2 Gửi thông tin cho các nhân viên

Click Fasle Click để gửi thông tin cho nhân

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

1 Tìm kiếm Enter True Text Nhập từ khóa để tìm kiếm phòng ban

2 Tạo mới Click False Button Click để tạo mới phòng ban

3 Chỉnh sửa Click False Icon Khi click, sẽ chuyển đến màn hình Edit thông tin

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

Click Fasle Hiển thị thông cá nhân như hình

2 Thông tin tài khoản ngân hàng

Click Fasle Khi click sẽ chuyển đến màn hình tài khoản ngân hàng

Click Fasle Khi click sẽ chuyển đến danh mục quản lý hợp đồng

Click Fasle Khi click sẽ chuyển đến danh mục quản lý bảo hiểm

Click Fasle Khi click sẽ chuyển đến danh mục quản lý dự án

Click True Click để lưu thông tin chỉnh sửa

Khi click sẽ chuyển đến màn hình tài khoản ngân hàng

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

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

1 Tạo mới Enter True Text Click để tạo mới ngân hàng

2 Chỉnh sửa Click False Icon Khi click, sẽ chuyển đến màn hình Edit thông tin ngân hàng Khi click sẽ chuyển đến danh mục quản lý hợp đồng

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

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

1 Tạo mới Enter True Text Click để tạo mới hợp đồng

2 Chỉnh sửa Click False Icon Khi click, sẽ chuyển đến màn hình Edit thông tin hợp đồng Khi click sẽ chuyển đến danh mục quản lý bảo hiểm

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

1 1 Lưu Click Click để lưu thông tin bảo hiểm

2 2 Thời gian Click True Date

Khi click, popup thời gian và chọn ngày phù còn hiệu lực bảo hiểm

3 Mã số bảo hiểm Enter True Text Nhập mã số bảo hiểm

Bệnh viện đăng ký khám

Enter True Text Nhập địa chỉ bệnh viện đăng ký

Khi click sẽ chuyển đến danh mục quản lý dự án

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

1 1 Tạo mới dự án Click False Label Click để tạo mới dự án

2 2 Chỉnh sửa dự án Click False Icon Click để chỉnh sửa dự án

4.4.3.1 Danh sách màn hình Admin

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

ADM001 Dashboard Giao diện trang chủ của admin

ADM002 Like Giao diện quản lý lượt thích

ADM003 Manager Giao diện quản lý người dùng

ADM004 Recipes Giao diện quản lý công thức

4.4.3.2 Đặc tả chi tiết màn hình Manager

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

Click False Label Khi click, sẽ hiện popup để thực hiện đăng kí tài khoản cho nhân viên

Click False Icon Khi click, dữ liệu sẽ hiển thị trong màn hình ADMIN003 Khi click, sẽ hiện popup để thực hiện đăng kí tài khoản cho nhân viên

Hình 4.40 Màn hình popup tạo mới tài khoản Bảng 4-42 Mô tả chi tiết popup tạo mới tài khoản

Enter True Text Nhập thông tin tên cho tài khoản

6 Mật khẩu Enter True Text Nhập thông tin mật khẩu cho tài khoản

7 Đóng Click False Click để đóng popup

8 Thêm mới Click False Click để tạo tài khoản cho nhân viên

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

1 Tìm kiếm Enter True Text Nhập từ khóa để tìm kiếm phòng ban

2 Tạo mới Click False Button Click để tạo mới phòng ban

3 Chỉnh sửa Click False Icon Khi click, sẽ chuyển đến màn hình Edit thông tin

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

Click Fasle Hiển thị thông cá nhân như hình

2 Thông tin tài khoản ngân hàng

Click Fasle Khi click sẽ chuyển đến màn hình tài khoản ngân hàng

Click Fasle Khi click sẽ chuyển đến danh mục quản lý hợp đồng

Click Fasle Khi click sẽ chuyển đến danh mục quản lý bảo hiểm

Click Fasle Khi click sẽ chuyển đến danh mục quản lý dự án

Khi click sẽ chuyển đến màn hình tài khoản ngân hàng

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

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

1 Tạo mới Enter True Text Click để tạo mới ngân hàng

2 Chỉnh sửa Click False Icon Khi click, sẽ chuyển đến màn hình Edit thông tin ngân hàng Khi click sẽ chuyển đến danh mục quản lý hợp đồng

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

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

1 Tạo mới Enter True Text Click để tạo mới hợp đồng

2 Chỉnh sửa Click False Icon Khi click, sẽ chuyển đến màn hình Edit thông tin hợp đồng Khi click sẽ chuyển đến danh mục quản lý bảo hiểm

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

5 1 Lưu Click Click để lưu thông tin bảo hiểm

6 2 Thời gian Click True Date

Khi click, popup thời gian và chọn ngày phù còn hiệu lực bảo hiểm

7 Mã số bảo hiểm Enter True Text Nhập mã số bảo hiểm

Bệnh viện đăng ký khám

Enter True Text Nhập địa chỉ bệnh viện đăng ký

Khi click sẽ chuyển đến danh mục quản lý dự án

Hình 4.46 Màn hình danh mục quản lý dự án Bảng 4-48 Mô tả chi tiết màn hình danh mục quản lý bảo hiểm

3 1 Tạo mới dự án Click False Label Click để tạo mới dự án

4 2 Chỉnh sửa dự án Click False Icon Click để chỉnh sửa dự án

Tiêu đề	Xây Dựng Website Quản Lý Nhân Sự
Thể loại	đồ án tốt nghiệp

Định dạng
Số trang	87
Dung lượng	3,22 MB