XÂY DỰNG ỨNG DỤNG WEBSITE HỆ THỐNG THÔNG TIN QUẢN LÝ KHAI BÁO Y TẾ ĐIỆN TỬ SỬ DỤNG NODEJS, REACTJS VÀ MONGODB

BỘ CÔNG THƯƠNG TRƯỜNG ĐẠI HỌC CÔNG NGHIỆP HÀ NỘI ĐỒ ÁN TỐT NGHIỆP NGÀNH KỸ THUẬT PHẦN MỀM XÂY DỰNG ỨNG DỤNG WEBSITE HỆ THỐNG THÔNG TIN QUẢN LÝ KHAI BÁO Y TẾ ĐIỆN TỬ SỬ DỤNG NODEJS, REACTJS VÀ MONGODB CBHD ThS Nguyễn Đức Lưu Sinh viên Nguyễn Thị Ngọc Ánh Mã số sinh viên 2018604140 Hà Nội – Năm 2022 MỤC LỤC LỜI CẢM ƠN i DANH MỤC BẢNG BIỂU ii MỤC LỤC HÌNH VẼ iii MỞ ĐẦU 1 CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 4 1 1 Tổng quan về website khai báo y tế 4 1 1 1 Khai báo y tế 4 1 1 2 Tình hình khai báo y tế hiện nay.

BỘ CÔNG THƯƠNG TRƯỜNG ĐẠI HỌC CÔNG NGHIỆP HÀ NỘI - ĐỒ ÁN TỐT NGHIỆP NGÀNH KỸ THUẬT PHẦN MỀM XÂY DỰNG ỨNG DỤNG WEBSITE HỆ THỐNG THÔNG TIN QUẢN LÝ KHAI BÁO Y TẾ ĐIỆN TỬ SỬ DỤNG NODEJS, REACTJS VÀ MONGODB CBHD : ThS Nguyễn Đức Lưu Sinh viên : Nguyễn Thị Ngọc Ánh Mã số sinh viên : 2018604140 Hà Nội – Năm 2022 MỤC LỤC LỜI CẢM ƠN i DANH MỤC BẢNG BIỂU ii MỤC LỤC HÌNH VẼ iii MỞ ĐẦU CHƯƠNG CƠ SỞ LÝ THUYẾT 1.1 Tổng quan website khai báo y tế 1.1.1 Khai báo y tế 1.1.2 Tình hình khai báo y tế 1.2 Các công cụ thiết kế website hệ thống thông tin khai báo y tế 1.2.1 NodeJS 1.2.2 Javascript 1.2.3 ReactJS 1.2.4 MongoDB 1.3 Kiến trúc phần mềm CHƯƠNG PHÂN TÍCH THIẾT KẾ HỆ THỐNG 10 2.1 Phân tích yêu cầu 10 2.2 Các yêu cầu phi chức 11 2.3 Biểu đồ use case 11 2.3.1 Biểu đồ use case tổng quan 11 2.3.2 Use case phân rã người dân đăng nhập 12 2.3.3 Use case phân rã quản lý thông tin cá nhân người dân 13 2.3.4 Use case phân rã quản lý thông tin người dân 13 2.3.5 Use case phân rã tạo mã QR 14 2.4 Mô tả chi tiết use case 14 2.4.1 Mô tả use case Đăng nhập nhân viên y tế 14 2.4.2 Mô tả use case Đăng nhập người dân 15 2.4.3 Mô tả use case Tạo QR code 17 2.4.4 Mô tả use case quản lý thông tin người dân 18 2.4.5 Mô tả use case người dân cập nhật thông tin 19 2.4.6 Mô tả use case người dân khai báo khẩn 20 2.5 Biểu đồ trình tự 22 2.5.1 Chức đăng nhập người dân 22 2.5.2 Chức đăng nhập nhân viên y tế 23 2.5.3 Chức tạo mã QR code 24 2.5.4 Chức cập nhật thông tin khai báo người dân 25 2.5.5 Chức quản lý thông tin người dân 26 2.6 Sơ đồ hoạt động 27 2.6.1 Chức đăng nhập nhân viên y tế 27 2.6.2 Chức đăng nhập người dân 28 2.6.3 Chức tạo QR code người dân 29 2.6.4 Chức quản lý thông tin người dân 30 2.6.5 Chức xem khai báo chi tiết người dân 31 2.7 Thiết kế sở liệu 32 2.7.1 Quan hệ bảng 32 2.7.2 Chi tiết bảng 32 2.8 Thiết kế giao diện 2.8.1 Màn hình đăng nhập 35 35 2.8.2 Màn hình nhập mã otp 35 2.8.3 Màn hình khai báo y tế 36 2.8.4 Màn hình mã QR 37 2.8.5 Màn hình khai báo khẩn cấp 37 2.8.6 Màn hình danh sách khai báo y tế 38 CHƯƠNG CÀI ĐẶT CHƯƠNG TRÌNH VÀ KIỂM THỬ HỆ THỐNG 39 3.1 Cài đặt chương trình 39 3.2 Phần mềm khai báo y tế điện tử 40 3.2.1 Màn hình chức đăng nhập người dân 40 3.2.2 Màn hình trang chủ khai báo y tế 42 3.2.3 Màn hình hướng dẫn khai báo y tế 44 3.2.4 Màn hình thống kê khai báo y tế nhân viên y tế 44 3.3 Kiểm thử phần mềm khai báo y tế điện tử 46 3.3.1 Kiểm thử chức đăng nhập người dân 46 3.3.2 Kiểm thử chức đăng nhập nhân viên y tế 48 3.3.3 Kiểm thử chức khai báo y tế 49 3.3.4 Kiểm thử chức khai báo khẩn cấp 55 KẾT LUẬN 59 TÀI LIỆU THAM KHẢO 60 PHỤ LỤC 61 LỜI CẢM ƠN Là sinh viên trường đại học Công nghiệp Hà Nội, đồ án tốt nghiệp minh chứng cho kiến thức có sau bốn năm học tập Trong trình hồn thành đồ án tốt nghiệp, ngồi cố gắng thân em nhận hướng dẫn tận tình thầy anh chị bạn bè Qua đây, em xin chân thành cảm ơn khoa Công nghệ thông tin, trường đại học Công nghiệp Hà Nội trang bị kiến thức cho em suốt trình học tập tạo hội để em làm đồ án tốt nghiệp Đặc biệt, em cảm ơn tới thầy ThS Nguyễn Đức Lưu giúp đỡ, hướng dẫn, bảo tận tình để em hồn thành tốt đồ án Em cố gắng hoàn thành đồ án tốt nghiệp mong nhận đóng góp ý thầy bạn để đồ án em hoàn thiện Em xin chân thành cảm ơn! DANH MỤC BẢNG BIỂU Bảng 1.1: Các yêu cầu phi chức 12 Bảng 2.1: Chi tiết bảng admin 33 Bảng 2.2: Chi tiết bảng user 35 Bảng 2.3: Chi tiết bảng form 36 Bảng 2.4: Chi tiết bảng formtype 36 Bảng 2.5: Chi tiết bảng question 37 Bảng 2.6: Chi tiết bảng answer 37 Bảng 3.1: Kiểm thử chức đăng nhập người dân 50 Bảng 3.2: Kiểm thử chức đăng nhập nhân viên y tế 52 Bảng 3.3: Kiểm thử chức khai báo y tế 54 Bảng 3.4: Kiểm thử chức khai báo khẩn cấp 60 MỤC LỤC HÌNH VẼ Hình 2.1 Biểu đồ use case tổng quan 12 Hình 2.2: Biểu đồ use case phân rã đăng nhập người dân 13 Hình 2.3: Biểu đồ use case phân rã quản lý thơng tin cá nhân 14 Hình 2.4: Biểu đồ use case phân rã quản lý thông tin người dân 14 Hình 2.5: Biểu đồ use case phân rã quản lý tài khoản 15 Hình 2.6: Biểu đồ trình tự chức đăng nhập người dân 23 Hình 2.7: Biểu đồ trình tự chức đăng nhập admin nhân viên y tế 24 Hình 2.8: Biểu đồ trình tự chức tạo mã QR Code 25 Hình 2.9: Biểu đồ trình tự chức cập nhật thơng tin người dân 26 Hình 2.10: Sơ đồ hoạt động nhân viên y tế đăng nhập 28 Hình 2.11: Sơ đồ hoạt động chức người dân đăng nhập 29 Hình 2.12: Sơ đồ hoạt động người dân tạo QR code 30 Hình 2.13: Sơ đồ hoạt động quản lý thơng tin người dân 31 Hình 2.14: Sơ đồ hoạt động xem khai báo chi tiết người dân 32 Hình 2.15: Cơ sở liệu 33 Hình 2.16: Giao diện đăng nhập 36 Hình 2.17: Giao diện nhập mã otp 37 Hình 2.18: Giao diện khai báo y tế 38 Hình 2.19: Giao diện mã QR 39 Hình 2.20: Giao diện khai báo khẩn cấp 39 Hình 2.21: Màn hình danh sách khai báo y tế 40 Hình 3.22: Màn hình khởi chạy dự án 41 Hình 3.23: Mở terminal chạy chương trình 41 Hình 3.24: Màn hình đăng nhập 42 Hình 3.25: Màn hinh mail nhận mã otp 42 Hình 3.26: Màn hình nhập mã otp đăng nhập 43 Hình 3.27: Màn hình khai báo y tế 44 Hình 3.28: Màn hình tạo mã QR code 45 Hình 3.29: Màn hình khai báo y tế khẩn cấp 46 Hình 3.30: Màn hình hướng dẫn khai báo y tế 46 Hình 3.31: Màn hình danh sách khai báo y tế 46 Hình 3.32: Màn hình xem chi tiết khai báo y tế 47 MỞ ĐẦU Tên đề tài Xây dựng ứng dụng Website hệ thống thông tin quản lý khai báo y tế điện tử sử dụng NodeJS, ReactJS MongoDB Lý chọn đề tài Cuối năm 2019, đại dịch Covid-19 xảy cướp sinh mạng hàng triệu người khắp giới Một vấn đề lớn khó giải lúc làm cách kiểm sốt thơng tin lịch trình di chuyển người dân, người có nguy mang mầm bệnh khoanh vùng dịch Khai báo y tế việc người dân cung cấp thông tin y tế cá nhân, thơng tin lịch sử nơi đi, nơi nơi đến nhằm mục đích kiểm sốt phịng chống dịch bệnh COVID-19 Căn thông tin cập nhật, quan y tế địa bàn nắm bắt diễn biến sức khỏe, lịch trình lại, di chuyển cá nhân để theo dõi, hỗ trợ tình cần thiết Đặc biệt, người liên quan đến ca bệnh, người từ tâm dịch trở về, người có biểu sốt, ho, khó thở,… cách ly tập trung lấy mẫu xét nghiệm chỗ Các trường hợp khác tư vấn, hướng dẫn thực biện pháp phòng chống dịch địa phương Với tình hình người nhiễm Covid cách ly nhà nhiều, hệ thống khai báo y tế giúp cán y tế cập nhật thơng tin tình hình sức khỏe bệnh nhân cách nhanh chóng có phương pháp điều trị kịp thời hạn chế rủi ro đáng tiếc xảy Chính lý trên, em chọn đề tài “Xây dựng ứng dụng Website hệ thống thông tin quản lý khai báo y tế điện tử sử dụng NodeJS, ReactJS MongoDB” có tính thực tiễn Mục tiêu nghiên cứu - Tổng hợp kiến thức NodeJS, ReactJS MongoDB để áp dụng vào xây dựng Website hệ thống thông tin khai báo y tế điện tử - Nghiên cứu, khảo sát thực tế ứng dụng website hệ thống thông tin quản lý tờ khai y tế, khai báo y tế - Phát biểu toán cần xử lý cho ứng dụng website khai báo y tế - Nghiên cứu đưa hướng làm công cụ công nghệ việc phát triển ứng dụng website hệ thống khai báo y tế - Phân tích thiết kế cho hệ thống thông tin khai báo y tế - Cài đặt triển khai ứng dụng - Website hệ thống thông tin khai báo y tế điện tử hướng tới tất người dân sinh sống lãnh thổ Việt Nam có ý định nhập cảnh Việt Nam giúp cho người dân dễ dàng khai báo y tế mà trực tiếp đến quan có thẩm quyền khai báo làm giảm tình trạng lây nhiễm chéo - Hệ thống khai báo y tế có giao diện thân thiện phù hợp với người dùng Nội dung nghiên cứu - Khảo sát yêu cầu, trình khai báo y tế - Nghiên cứu, phân tích yêu cầu chức năng, phi chức website - Thiết kế phát triển hệ thống website hệ thống thông tin khai báo y tế điện tử: o Người dân hoàn thành chức năng: Khai báo y tế, khai hộ, khai báo khẩn cấp, hướng dẫn khai báo y tế o Nhân viên y tế: Thống kê khai báo khẩn cấp, tìm kiếm khai báo y tế theo tình trạng, trạng thái khai báo, xử lý thông tin khai báo … - Cài đặt website kiểm thử chức Phạm vi đề tài - Về chức khai báo y tế: Khi người dân muốn khai báo y tế đăng nhập hệ thống khai báo email Đăng nhập hệ thống thành công, người dân tiến hành nhập thông tin khai báo y tế Khai báo y tế thành cơng hiển thị hình mã QR Code, người dân tải mã QR Code máy Ngoài chức khai báo, người dân thực chức khai hộ khai báo khẩn cấp Trong trường hợp người dân chưa biết sử dụng hệ thống khai báo y tế người dân vào hướng dẫn khai báo y tế - Về phần nhân viên y tế: Thống kê trường hợp khai báo y tế khẩn cấp, lọc tìm kiếm tình trạng khai báo y tế Ngồi ra, nhân viên y tế chỉnh sửa xóa thơng tin khai báo người dân Phương pháp thực - Nghiên cứu lý thuyết kết hợp khảo sát thực tế số website khai báo y tế lớn, từ phân tích thiết kế hệ thống website hệ thống thông tin khai báo y tế - Nghiên cứu ngôn ngữ ReactJS, NodeJS MongoDB - Phát triển ứng dụng web phạm vi thử nghiệm Bố cục đề tài (Nội dung đề tài chia thành chương) Chương 1: Cơ sở lý thuyết Giới thiệu công cụ để ứng dụng vào phát triển phần mềm khai báo điện tử: NodeJS, Javascript, ReactJS MongoDB Chương 2: Phân tích thiết kế hệ thống Phân tích tích u cầu, mơ tả biểu đồ use case, biểu đồ trình tự, sơ đồ hoạt động thiết kế giao diện chức hệ thống khai báo y tế điện tử Chương 3: Cài đặt chương trình kiểm thử hệ thống 54 3.3.3 Kiểm thử chức khai báo y tế Bảng 3.3: Kiểm thử chức khai báo y tế ID Mô tả trường hợp kiểm tra Các bước thực Kết mong đợi Kết Họ tên * textbox Nhập Họ tên = ký tự Các thông tin khác Test nhập Họ tên nhập hợp lệ hợp lệ Click vào "Gửi tờ khai" button - Tạo Họ tên thành công - Hiển thị Tên người Đạt khai báo trang quản lý khai báo y tế Tại ''Họ tên" = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Message thông báo "Họ tên không để trống" Đạt - Hightlight màu đỏ chuột focus vào ''Họ tên" textbox 1.Nhập số chứng minh thư hợp lệ = số dương Test nhập Số Các thông tin khác chứng minh nhân nhập hợp lệ dân hợp lệ Click vào "Gửi tờ khai" button - Tại trang quản lý khai báo y tế hiển thị số chứng minh thư Đạt người khai báo y tế - Số lượng mà bạn nhập lưu CSDL Test không nhập Họ tên Số chứng minh nhân dân 1.Nhập số chứng minh nhân dân = chữ Test nhập Số Các thông tin khác - Hiển thị thông báo "Số chứng minh nhân Đạt nhập hợp lệ CMT không đúng" dân không hợp lệ Click vào "Gửi tờ khai" button Test không nhập Số chứng minh nhân dân Nhập Số chứng minh nhân dân = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Message thông báo "Số chứng minh nhân dân không hợp lệ " - Hightlight màu đỏ chuột focus vào ''Số chứng minh nhân dân" Đạt 55 Năm sinh 1.Nhập Năm sinh hàng hóa hợp lệ = số dương Test nhập Năm Các thông tin khác sinh hợp lệ nhập hợp lệ Click vào "Gửi tờ khai" button 1.Nhập Năm sinh = chữ Test nhập Năm Các thông tin khác sinh không hợp nhập hợp lệ lệ Click vào "Gửi tờ khai" button Test không nhập Năm sinh Nhập Năm sinh = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Tại trang quản lý khai báo y tế hiển thị Đạt năm sinh người khai báo y tế - Chặn bàn phím Đạt - Message thơng báo "Năm sinh không hợp lệ " Đạt - Hightlight màu đỏ chuột focus vào ''Năm sinh" textbox Giới tính Test chế độ mặc định giới tính Mặc định chọn giới tính Đạt nam Chọn giới tính = Nam Các thông tin khác Test chọn giới 10 nhập hợp lệ tính = Nam Click vào "Gửi tờ khai" button - Tại trang quản lý khai báo y tế hiển thị Đạt giới tính người khai báo y tế Chọn giới tính = Nữ Các thông tin khác Test chọn giới 11 nhập hợp lệ tính = Nữ Click vào "Gửi tờ khai" button - Tại trang quản lý khai báo y tế hiển thị Đạt giới tính người khai báo y tế Chọn giới tính = Khác Các thơng tin khác Test chọn giới 12 nhập hợp lệ tính = Khác Click vào "Gửi tờ khai" button - Tại trang quản lý khai báo y tế hiển thị Đạt giới tính người khai báo y tế 56 Quốc tịch text box 13 14 Test nhập Quốc tịch hợp lệ Nhập Quốc tịch = ký tự Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Test không nhập Quốc tịch Tại ''Quốc tịch" = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Test nhập Quốc 15 tịch = ký tự khoảng trắng Nhập Quốc tịch = ký tự toàn khoảng trắng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Tỉnh Test chế độ mặc 16 định giới tính 17 Test giá trị combobox tỉnh Click vào combobox Chọn tỉnh = Bắc Giang 18 Test chọn combobox 19 Chọn tỉnh = Hà Nội - Tạo Quốc tịch thành công - Tại trang quản lý khai Đạt báo y tế hiển thị quốc tịch người khai báo y tế - Message thông báo "Quốc tịch không để trống" Đạt - Hightlight màu đỏ chuột focus vào ''Quốc tịch" textbox - Message thông báo "Quốc tịch không để trống" Đạt - Hightlight màu đỏ chuột focus vào ''Quốc tịch" textbox Mặc định không chọn tỉnh Hiển thị 63 tỉnh thành cho phép người dùng chọn - Tại trang quản lý khai báo y tế hiển thị tỉnh người khai báo y tế - Khai báo thành công - Tại trang quản lý khai báo y tế hiển thị tỉnh người khai báo y tế - Khai báo thành công Đạt Đạt Đạt Đạt 57 20 Test không chọn combobox Quận/Huyện combobox Test chế độ mặc 21 định giới tính 22 23 24 25 26 27 28 Không chọn tỉnh Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Hightlight đỏ vào trường tỉnh Đạt - Disable trường Quận/huyện, Phường/xã Mặc định không chọn Quận/Huyện Hiển thị Test giá trị Quận/Huyện tương ứng combobox Click vào combobox với tỉnh cho phép người Quận/Huyện dùng chọn - Tại trang quản lý khai báo y tế hiển thị Chọn Quận/Huyện = Việt Quận/Huyện người Yên Test chọn khai báo y tế combobox tương - Khai báo thành công - Tại trang quản lý khai ứng với tỉnh báo y tế hiển thị chọn Chọn Quận/Huyện = Bắc Quận/Huyện người Từ Liêm khai báo y tế - Khai báo thành công Không chọn Quận/Huyện - Hightlight đỏ vào Test không Các thông tin khác trường Quận/Huyện chọn combobox nhập hợp lệ - Disable trường Click vào "Gửi tờ khai" Phường/xã button Phường/Xã Test chế độ mặc Mặc định không chọn định giới tính Phường/Xã Test giá trị Hiển thị Phường/Xã combobox Click vào combobox tương ứng với tỉnh cho Phường/Xã phép người dùng chọn Test chọn Chọn Phường/Xã = Quang - Tại trang quản lý khai combobox tương Châu báo y tế hiển thị ứng với tỉnh Phường/Xã người chọn khai báo y tế - Khai báo thành công Đạt Đạt Đạt Đạt Đạt Đạt Đạt Đạt 58 29 30 Test không chọn combobox - Tại trang quản lý khai báo y tế hiển thị Chọn Phường/Xã = Minh Phường/Xã người Đạt Khai khai báo y tế - Khai báo thành công Không chọn Phường/Xã - Hightlight đỏ vào Các thông tin khác Đạt trường Phường/Xã nhập hợp lệ Số nhà - Tạo Số nhà thành công - Dữ liệu bạn vừa nhập lưu CSDL Đạt - Hiển thị Tên người khai báo trang quản lý khai báo y tế - Message thông báo Tại ''Số nhà" = Rỗng "Số nhà không để Các thông tin khác trống" nhập hợp lệ Đạt - Hightlight màu đỏ Click vào "Gửi tờ khai" chuột focus vào ''Số button nhà" textbox Nhập Số nhà = ký tự Các thông tin khác Test nhập Số nhà 31 nhập hợp lệ hợp lệ Click vào "Gửi tờ khai" button 32 Test không nhập Số nhà Số điện thoại textbox 1.Nhập số điện thoại hợp lệ = số dương Test nhập Số điện Các thông tin khác 33 thoại hợp lệ nhập hợp lệ Click vào "Gửi tờ khai" button - Tại trang quản lý khai báo y tế hiển thị số điện thoại người khai báo y tế Đạt - Số điện thoại mà bạn nhập lưu CSDL Nhập Số điện thoại không định dạng Test nhập Số điện Các thông tin khác - Hiển thị thông báo "Số 34 thoại không Đạt nhập hợp lệ điện thoại không đúng" định dạng Click vào "Gửi tờ khai" button 59 1.Nhập số điện thoại = chữ Test nhập Số điện Các thông tin khác - Hiển thị thông báo "Số 35 thoại không hợp Đạt nhập hợp lệ điện thoại không đúng" lệ Click vào "Gửi tờ khai" button 36 Test không nhập Số điện thoại Email textbox Kiểm tra địa 37 email mặc định 38 39 40 41 Nhập Số điện thoại = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Message thông báo "Số điện thoại không hợp lệ " - Hightlight màu đỏ chuột focus vào ''Số điện thoại" textbox Đạt Tự động fill email giống với mail đăng Đạt nhập Nhập email = rỗng - Hightlight focus Kiểm tra Các thơng tin khác vào trường email người dùng xóa nhập hợp lệ - Hiển thị thông báo Đạt hết email Click vào "Gửi tờ khai" "Email không để button trống" Sửa email không giống Kiểm tra sửa với mail đăng nhập - Hiển thị thông báo email không Các thông tin khác "Email không đúng" Đạt với mail đăng nhập hợp lệ - Set focus highlight nhập Click button "Gửi tờ vào trường lỗi khai" Các vấn đề khai báo y tế Kiểm tra trạng thái mặc định Trạng thái mặc định = Đạt nội dung khai Không báo Chọn khai báo = Có Các thơng tin khác Kiểm tra chọn nhập hợp lệ Khai báo thành cơng Đạt khai báo = Có Click vào "Gửi tờ khai" button Mã QR code 60 Khai báo y tế thành công Khai báo y tế thành Kiểm tra quét mã 43 công QR Quét mã QR 42 Hiển thị mã QR Hiển thị lên hình Đạt mã QR code Hiển thị link tự động fill thông tin khai báo y Đạt tế 61 3.3.4 Kiểm thử chức khai báo khẩn cấp Bảng 3.4: Kiểm thử chức khai báo khẩn cấp ID Mô tả trường Các bước thực hợp kiểm tra Kết mong đợi Kết Họ tên Test nhập Họ tên hợp lệ Test không nhập Họ tên Test nhập Họ tên = ký tự khoảng trắng Nhập Họ tên = ký tự Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Tại ''Họ tên" = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Nhập Họ tên = ký tự toàn khoảng trắng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Tạo Họ tên thành công - Hiển thị Tên người khai Đạt báo trang quản lý khai báo y tế - Message thông báo "Họ tên không để trống" - Hightlight màu đỏ Đạt chuột focus vào ''Họ tên" textbox - Message thông báo "Họ tên không để trống" - Hightlight màu đỏ Đạt chuột focus vào ''Họ tên" textbox Số điện thoại textbox 1.Nhập số điện thoại hợp lệ = số dương Test nhập Số Các thông tin khác điện thoại hợp nhập hợp lệ lệ Click vào "Gửi tờ khai" button Test nhập Số Nhập Số điện thoại không điện thoại định dạng không định dạng Test nhập Số Nhập số điện thoại = chữ điện thoại không hợp lệ 1.Nhập số điện thoại = số âm Các thông tin khác nhập hợp lệ - Tại trang quản lý khai báo y tế hiển thị số điện thoại người khai Đạt báo y tế - Số điện thoại mà bạn nhập lưu CSDL - Hiển thị thông báo "Số điện thoại không đúng" - Hiển thị thông báo "Số điện thoại không đúng" - Hiển thị thông báo "Số điện thoại không đúng" Đạt Đạt Đạt 62 Test không 10 nhập Số điện thoại Click vào "Gửi tờ khai" button Nhập Số điện thoại = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Tỉnh combobox Test chế độ 11 mặc định giới tính Test giá trị 12 Click vào combobox combobox tỉnh Chọn tỉnh = Bắc Giang Các thông tin khác 13 nhập hợp lệ Click vào "Gửi tờ khai" Test chọn button Chọn tỉnh = Hà Nội combobox Các thông tin khác 14 nhập hợp lệ Click vào "Gửi tờ khai" button Không chọn tỉnh Test không Các thông tin khác 15 chọn nhập hợp lệ combobox Click vào "Gửi tờ khai" button Quận/Huyện combobox Test chế độ 16 mặc định giới tính Test giá trị 17 combobox Click vào combobox Quận/Huyện 18 Test chọn 1 Chọn Quận/Huyện = combobox Việt Yên tương ứng với Các thông tin khác - Message thông báo "Số điện thoại không hợp lệ " - Hightlight màu đỏ chuột focus vào ''Số điện thoại" textbox Đạt Mặc định không chọn tỉnh Đạt Hiển thị 63 tỉnh thành cho Đạt phép người dùng chọn - Tại trang quản lý khai báo y tế hiển thị tỉnh Đạt người khai báo y tế - Khai báo thành công - Tại trang quản lý khai báo y tế hiển thị tỉnh Đạt người khai báo y tế - Khai báo thành công - Hightlight đỏ vào trường tỉnh Đạt - Disable trường Quận/huyện, Phường/xã Mặc định không chọn Quận/Huyện Đạt Hiển thị Quận/Huyện tương ứng với tỉnh cho Đạt phép người dùng chọn - Tại trang quản lý khai Đạt báo y tế hiển thị Quận/Huyện người 63 khai báo y tế nhập hợp lệ - Quận/Huyện mà bạn Click vào "Gửi tờ khai" nhập lưu CSDL button - Khai báo thành công tỉnh chọn 19 Chọn Quận/Huyện = Bắc Từ Liêm Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Không chọn Quận/Huyện Test không Các thông tin khác 20 chọn nhập hợp lệ combobox Click vào "Gửi tờ khai" button Phường/Xã combobox Test chế độ 21 mặc định giới tính Test giá trị 22 combobox Phường/Xã Click vào combobox - Tại trang quản lý khai báo y tế hiển thị Quận/Huyện người khai báo y tế - Quận/Huyện mà bạn nhập lưu CSDL - Khai báo thành công Đạt - Hightlight đỏ vào trường Quận/Huyện Đạt - Disable trường Phường/xã Mặc định không chọn Phường/Xã Đạt Hiển thị Phường/Xã tương ứng với tỉnh cho phép người dùng chọn Đạt - Tại trang quản lý khai Chọn Phường/Xã = Quang báo y tế hiển thị 23 Châu Phường/Xã người khai Đạt báo y tế Test chọn - Khai báo thành công combobox tương ứng với tỉnh chọn 24 - Tại trang quản lý khai báo y tế hiển thị Chọn Phường/Xã = Minh Phường/Xã người khai Đạt Khai báo y tế - Khai báo thành công 64 Không chọn Phường/Xã Test không Các thông tin khác - Hightlight đỏ vào trường 25 chọn nhập hợp lệ Đạt Phường/Xã combobox Click vào "Gửi tờ khai" button Số nhà * textbox 26 27 Test nhập Số nhà hợp lệ Test không nhập Số nhà Các vấn đề khai báo y tế radio button Kiểm tra trạng thái mặc định 28 nội dung khai báo 29 Kiểm tra chọn khai báo Nhập Số nhà = ký tự Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button Tại ''Số nhà" = Rỗng Các thông tin khác nhập hợp lệ Click vào "Gửi tờ khai" button - Tạo Số nhà thành công - Hiển thị Tên người khai Đạt báo trang quản lý khai báo y tế - Message thông báo "Số nhà không để trống" - Hightlight màu đỏ Đạt chuột focus vào ''Số nhà" textbox Trạng thái mặc định = Không Chọn tình trạng khai báo Các thơng tin khác Khai báo thành công nhập hợp lệ Click vào "Gửi tờ khai" button Đạt Đạt 65 KẾT LUẬN Qua trình làm đồ án, mang lại nhiều kinh nghiệm, kiến thức bổ ích có hội áp dụng kiến thức tích lũy sau năm tháng học tập trường Đại học Công nghiệp Hà Nội, phải kể đến kiến thức bật, hệ quản trị sở liệu, thiết kế trang Website để hoàn thành đề tài tốt nghiệp “Xây dựng ứng dụng Website hệ thống thông tin khai báo y tế sử dụng ReactJS, NodeJS MongoDB”, đạt kết như: ✔ Hoàn thành khảo sát phân tích thiết kế hệ thống, thiết kế sở liệu, thiết kế giao diện ✔ Hệ thống xây dựng chức theo yêu cầu ban đầu phía người dùng người quản trị Thiết kế rõ ràng, mơ tả chi tiết dễ hình dung ✔ Trải nghiệm người dùng: Khai báo y tế, khai báo khẩn cấp, chỉnh sửa thông tin khai báo y tế,… ✔ Hoạt động người quản trị: Quản lý khai báo y tế, khai báo khẩn cấp, xử lý liệu khai báo, tìm kiếm, sửa, xóa thơng tin khai báo y tế Trong thời gian tới để hoàn thiện Website cách toàn diện qua việc bổ sung thêm chức đăng ký địa điểm khai báo y tế, đăng ký tiêm phòng covid cập nhật tính theo tình hình diễn biến bệnh dịch covid Cuối cùng, lần em xin gửi lời cảm ơn sâu sắc đến quý thầy cô trường Đại học Công nghiệp Hà Nội dạy cho em nhiều kiến thức bổ ích đặc biệt thầy Nguyễn Đức Lưu nhiệt tình hướng dẫn em hồn thành đề tài 66 TÀI LIỆU THAM KHẢO [1] Hồng Quang Huy (2016), “Giáo trình sở liệu”, H Giáo dục Việt Nam 2011 [2].Vũ Thị Dương, Phùng Đức Hịa, Nguyễn Thị Hương Lan (2015), “Giáo trình Phân tích thiết kế hướng đối tượng”, NXB Khoa học Kỹ thuật [3] Https://topdev.vn/blog/reactjs-nhung-dieu-ban-can-phai-biet/ [4] Https://freetuts.net/reactjs/tu-hoc-reactjs [5] Https://viblo.asia/p/reactjs-nhung-kien-thuc-co-ban-de-bat-dau-jvElaPzA 67 PHỤ LỤC https://drive.google.com/drive/folders/1bZcpFx0CfCWim7fGlRBPqY55sCX Etjp?usp=sharing ... Website hệ thống thông tin khai báo y tế điện tử - Nghiên cứu, khảo sát thực tế ứng dụng website hệ thống thông tin quản lý tờ khai y tế, khai báo y tế - Phát biểu toán cần xử lý cho ứng dụng website. .. hệ thống thông tin quản lý khai báo y tế điện tử sử dụng NodeJS, ReactJS MongoDB? ?? có tính thực tiễn 5 Mục tiêu nghiên cứu - Tổng hợp kiến thức NodeJS, ReactJS MongoDB để áp dụng vào x? ?y dựng Website. .. ĐẦU CHƯƠNG CƠ SỞ LÝ THUYẾT 1.1 Tổng quan website khai báo y tế 1.1.1 Khai báo y tế 1.1.2 Tình hình khai báo y tế 1.2 Các công cụ thiết kế website hệ thống thông tin khai báo y tế 1.2.1 NodeJS