GIỚI THIỆU WEB
Sự Ra Đời Của Web quản lý thiết bị phòng Gym
Web quản lý thiết bị phòng Gym ra đời nhằm giải quyết vấn đề thiếu thời gian của chủ phòng tập trong việc kiểm tra và bảo trì thiết bị Khi nhận thấy chủ phòng tập không thể thường xuyên kiểm tra thiết bị do bận rộn với khách hàng, chúng tôi đã quyết định phát triển một trang web quản lý trực tuyến Giải pháp này giúp nhân viên dễ dàng thông báo tình trạng thiết bị cho chủ phòng tập mọi lúc, mọi nơi, từ đó nâng cao hiệu quả quản lý và bảo dưỡng thiết bị, đồng thời giảm bớt gánh nặng cho chủ phòng tập.
Mô tả Web
Web quản lý thiết bị phòng GYM là nền tảng quản lý hiệu quả cho trang thiết bị, giúp người dùng dễ dàng tìm kiếm và quản lý các thiết bị cần thiết Giao diện thân thiện, rõ ràng trên các trang chính, cung cấp các chế độ xem dành riêng cho quản trị viên và người dùng Chủ phòng tập chỉ cần đầu tư một khoản nhỏ để sở hữu phần mềm này, cho phép kiểm tra và quản lý thiết bị mọi lúc, mọi nơi.
Giới thiệu React và NodeJS
• React là một thư viện JavaScript nhằm đơn giản hóa việc phát triển giao diện người dùng.
Được phát triển bởi Facebook, ngôn ngữ lập trình này ra mắt lần đầu vào năm 2013 và đã được áp dụng để xây dựng các nền tảng như Facebook và Instagram Nó nhận được sự ủng hộ rộng rãi từ nhiều công ty khác trên toàn cầu.
Mục tiêu chính của React là đơn giản hóa quá trình phát triển ứng dụng Nó tập trung tất cả trạng thái tại một thời điểm và chia giao diện người dùng thành các thành phần (components) để quản lý hiệu quả hơn.
• React được sử dụng để xây dựng single-page web applications.
NodeJS là nền tảng phát triển ứng dụng web mạnh mẽ, được xây dựng trên V8 JavaScript Engine, cho phép thực thi mã JavaScript Với NodeJS, việc xây dựng và mở rộng ứng dụng web trở nên đơn giản và hiệu quả hơn.
NodeJS là một nền tảng mạnh mẽ được viết bằng JavaScript, sở hữu cộng đồng người dùng đông đảo, giúp bạn dễ dàng tìm kiếm hỗ trợ khi cần Với cơ chế xử lý bất đồng bộ (non-blocking), NodeJS mang lại tốc độ xử lý nhanh chóng, cho phép quản lý hàng ngàn kết nối đồng thời mà không gặp trở ngại Đặc biệt, khả năng mở rộng dễ dàng của NodeJS là một lợi thế quan trọng cho những ai có nhu cầu phát triển website.
PHÂN TÍCH
Mô hình trạng thái Web
Hình 2-1Mô hình liên kết giữa các trạng thái
Phân tích các trang của Web
2.2.1 Phân tích trang Login/Signup
Login: Điền đầy đủ User Name và Password, đúng thì sẽ cho vào trang chính Nếu sai sẽ báo lỗi Tài Khoàn hoặc Mật Khẩu không đúng.
Tài khoản thì sẽ được cắp chứ không tự tạo
Trang chủ của hệ thống hiển thị 6 danh mục chính cho người dùng sau khi đăng nhập, bao gồm: Quản lý (với 2 mục nhỏ là lịch sử hoạt động và tài khoản), Nhà cung cấp, Hóa đơn, Thiết bị, Tài khoản cá nhân và Đăng xuất Danh mục Quản lý chỉ dành cho admin, trong khi nhân viên sẽ nhận thông báo nếu cố gắng truy cập vào mục này mà không có quyền hạn.
2.2.3 Phân tích trang quản lý(admin)
ADMIN có trách nhiệm quản lý người dùng trên website, bao gồm việc thêm tài khoản, điều chỉnh quyền hạn, và kích hoạt hoặc vô hiệu hóa tài khoản Chỉ có tài khoản admin mới có quyền truy cập vào chức năng này.
Nhân viên có thể theo dõi các hoạt động của tài khoản theo thời gian, bao gồm việc thêm, sửa, xóa thông tin trong các danh mục, cũng như cập nhật thông tin cá nhân và mật khẩu.
Thiết bị: liệt kê các hoạt động của thiết bị như; thêm mới cập nhật tình trạng theo môc thời gian thực hiện hành động.
Thêm mới một tài khoản để cấp cho người sử dụng phần mềm chứ không cho tự tạo tài khoản.
Chỉnh sửa quyền hạn tài khoản: admin và nhân viên.
Reset mật khẩu: dùng để trả lại mật khẩu mặc định khi có người dùng quên mật khẩu
Bật/tắt tài khoản: để vô hiệu hóa tài khoản nào không dùng chứ không xóa.
2.2.4 Phân tích trang nhà cung cấp
Danh sách tất cả các nhà cung cấp hiện có trong cơ sở dữ liệu được liệt kê và dễ dàng tìm kiếm Người dùng có thể nhấn "Thêm" để thêm nhà cung cấp mới, cũng như chỉ định để chỉnh sửa hoặc xóa nhà cung cấp Lưu ý rằng không thể xóa nhà cung cấp đã tạo hóa đơn.
2.2.5 Phân tích trang hóa đơn
Danh sách tất cả các hóa đơn có sẵn trong cơ sở dữ liệu được liệt kê và tìm kiếm một cách dễ dàng Người dùng có thể nhấn vào nút thêm để tạo hóa đơn mới Ngoài ra, có khả năng chỉ định hóa đơn để thực hiện chỉnh sửa hoặc xóa Hệ thống cũng cho phép tìm kiếm hóa đơn trong khoảng thời gian cụ thể.
2.2.6 Phân tích trang thiết bị
Danh sách tất cả các thiết bị trong cơ sở dữ liệu được liệt kê rõ ràng và dễ dàng tìm kiếm Người dùng có thể chỉ định thiết bị để thực hiện chỉnh sửa hoặc xóa Hệ thống cho phép tìm kiếm các thiết bị được thêm vào trong khoảng thời gian cụ thể Mỗi thiết bị được trình bày theo thứ tự, bao gồm tình trạng thiết bị và thời hạn bảo hành.
2.2.7 Phân tích trang tài khoản cá nhân
Người dùng có thể cập nhật thông tin tài khoản của mình, bao gồm họ tên, ngày sinh, CMND và ảnh đại diện Họ cũng có quyền tự thay đổi ảnh đại diện và mật khẩu.
Sơ đồ ERD
Diagrams
Hình 3-3Sơ đồ Diagrams Database
Table
Eg_name nvarchar(20) Not Null
Rcp_code nvarchar(20) Not null
Rcp_date date Not Null
Eg_ID int Not Null
Equipment_ID int PK, FK
State_des nvarchar(20) Not null
Tax_ID nvarchar(200) Not null
ID_code nvarchar(20) Not Null
First_name nvarchar(20) Not Null
Last_name nvarchar(20) Not Null
Record_date int Not Null
MÃ CODE
Thiết kế xử lí Login
Lấy username, password từ req.body(từ font-end) rồi kiểm tra bằng sp trên database Nếu đúng sẽ trả về userinfo
Thiết kế xử lý Supplier(Nhà cung cấp)
Lấy dữ liệu từ req.body (frontend) và gọi stored procedure trong cơ sở dữ liệu để thêm nhà cung cấp AccountId được sử dụng để ghi lại hoạt động của tài khoản trong quá trình thực hiện công việc.
Chỉnh sửa nhà cung cấp:
Sửa: Lấy dữ liệu từ req.body(font-end) rồi gọi sp trong database để chỉnh sửa, accountId để ghi nhận việc sửa thông tin
Xóa: lấy id nhà cung cấp từ req.body rồi gọi sp trong database để xóa Nếu có lỗi sẽ không xóa được và gửi về err.massage
Thiết kế xử lý Receipt(Hóa đơn)
To create a new invoice, retrieve data from req.body on the front end and call the stored procedure in the database The accountId is used to log the addition of the new invoice.
Sửa hóa đơn: Lấy dữ liệu cần chỉnh sửa từ req.body rồi gọi sp trong database (.execute) để chỉnh sửa staffId để ghi nhận việc chỉnh sửa
Xóa hóa đơn: lấy mã hóa đơn từ req.body rồi gọi sp trong database để thực hiện xóa hóa đơn
Thiết kế xử lý Equipment(Thiết bị)
Thêm loại thiết bị bằng cách lấy thông tin từ hóa đơn thông qua req.body và gọi stored procedure trong cơ sở dữ liệu Sau khi loại thiết bị được thêm thành công, từng thiết bị sẽ được tự động thêm vào cơ sở dữ liệu.
Thêm thiết bị: lấy id của loại thiết bị vừa được thêm thông qua req.body rồi gọi sp trong database để thêm thiết bị
Sửa thông tin thiết bị:
Để chỉnh sửa thông tin thiết bị, cần lấy các dữ liệu như id (thiết bị), stateDes (tình trạng) và des (mô tả) Sau đó, gọi thủ tục trong cơ sở dữ liệu để cập nhật thông tin thiết bị Thông tin accountId sẽ được sử dụng để ghi nhận việc sửa đổi vào cơ sở dữ liệu.
Chỉ cho phép thay đổi thông tin như tình trạng và mô tả của thiết bị Tên và hạn bảo hành không cho phép thay đổi
Để xóa thiết bị, trước tiên cần lấy ID của thiết bị đó và gọi đến dịch vụ trong cơ sở dữ liệu Việc xóa thiết bị chỉ dừng lại ở việc ngừng quản lý thiết bị, mà không xóa thiết bị khỏi cơ sở dữ liệu.
Thiết kế quản lý tài khoản(chỉ admin)
Lấy dữ liệu từ req.body rồi gọi sp trong database để thực hiện thêm tài khoản idCode(cmnd)
Chỉnh sửa thông tin tài khoản:
Lấy dữ liệu từ req.body rồi gọi sp trong db Thực hiện đặt mật khẩu về mặt định là
123456 cho tài khoản được chỉ định -Thay đổi tình trạng hoạt động:
Để thay đổi tình trạng tài khoản, cần lấy thông tin accountId và trạng thái active Sau đó, gọi stored procedure trong cơ sở dữ liệu để thực hiện việc kích hoạt, với trạng thái active được định dạng dưới dạng bit, chỉ nhận giá trị true hoặc false Tài khoản không được kích hoạt sẽ không thể đăng nhập.
-Thay đổi quyền tài khoản:
Lây thông tin tài khoản(accountId) và quyền cần thay đổi rồi gọi sp trong database để thực hiện hành động
KIỂM THỬ CHƯƠNG TRÌNH
Kiểm thử Login
Không tìm thấy account trong cơ sở dữ liệu
Kiểm thử Quản lý
Hình 4-2aTrang quản lý của Staff
Màn hình Admin Lịch sử:
Hình 4-2bTrang quản lý của Admin
Kiểm thử Nhà cung cấp
Chỉnh sửa nhà cung cấp:
Kiểm thử Hóa đơn
Kiểm thử Thiết bị
Kiểm thử Tài khoản cá nhân
Hình 4-6Tài khoản cá nhân