[ĐỒ ÁN TỐT NGHIỆP] XÂY DỰNG PHẦN MỀM QUẢN LÍ KÝ TÚC XÁ BVU DORMITORY

GIỚI THIỆU ĐỀ TÀI

Đặt vấn đề

Hiện nay tại Ký túc xá BVU Cơ sở 1 có khá đông các bạn sinh viên đang ở Bản thân tôi đã có một vài lần trao đổi với Chú quản lý Lưu Tiến Hoàn để hiểu rõ về nghiệp vụ và công tác tại đây Hiện tại công tác quản lí thông tin ở đây vẫn đang được tổ chức theo cách truyền thống bằng giấy bút Một số vấn đề có thể kể đến như:

• Thông tin hồ sơ của sinh viên gia nhập Ký túc xá: được ghi vào những cuốn sổ, điều này gây khó khăn cho việc tra cứu thông tin Chưa có phương pháp theo dõi tình trạng đang ở lại Ký túc xá hay đã về nhà/vắng mặt của sinh viên

• Việc tạo hóa đơn: người quản lí cần phải ghi chép số liệu về chỉ số điện/nước của từng phòng vào sổ tay, sau đó cần tổng hợp bằng tay thành phiếu báo điện nước rồi chuyển cho mỗi phòng Việc này gây tốn thời gian và công sức, và kể cả tiền bạc khi phải in ra các tờ phiếu

• Việc quản lí thông tin tài sản: hiện tại chưa có phương thức số hóa thông tin, thông tin chưa được lưu trữ online gây khó khăn trong việc thống kê tình trạng sử dụng

• Việc thông báo: Có những thông báo mà người quản lí cần truyền tới các bạn sinh viên, tuy nhiên vẫn chưa có ứng dụng công nghệ thông tin nên việc này trở nên khó khăn, người quản lí có thể sẽ cần gọi điện thoại cho từng bạn để trao đổi – điều này gây tốn thời gian và tiền bạc khi muốn truyền đi một thông tin chung

• Việc liên hệ: Do thông tin sinh viên được lưu giữ trong sổ sách nên việc tra cứu thông tin liên hệ của mỗi bạn cũng trở nên khó khăn, với số

2 lượng lớn sinh viên thì người quản lí khó để nhớ hoặc lưu số điện thoại của các bạn vào danh bạ do bộ nhớ có hạn và việc này không hợp lí Bên cạnh đó, việc liên hệ qua số điện thoại với số lượng lớn sinh viên cũng sẽ gây ảnh hưởng đến vấn đề tài chính

• Việc thống kê/báo cáo: Do quản lí bằng phương pháp truyền thống giấy/bút, nên việc thống kê là hết sức vất vả - đặc biệt là khi có những thông tin thay đổi với tần suất cao (như sinh viên vắng mặt, thống kê hóa đơn…) thì phương pháp truyền thống này sẽ kém đi phần hiệu quả.

Hướng giải quyết

Trước những khó khăn kể trên, là một sinh viên ngành Công nghệ thông tin tại Đại học Bà Rịa – Vũng Tàu, tôi thấy mình có thể áp dụng những kiến thức đã học trên Trường lẫn tự nghiên cứu để góp phần “số hóa” cách thức vận hành của việc quản lí thông tin tại Ký túc xá, nhằm hướng tới một tương lai tốt đẹp hơn

Qua đó, phần mềm BVU Dormitory với mục tiêu:

• Thông tin hồ sơ của sinh viên gia nhập Ký túc xá: lưu trữ trên

CSDL online nhằm đồng bộ và nhất quán

• Việc tạo hóa đơn: người quản lí có thể định nghĩa các dịch vụ mong muốn và kích hoạt chúng ở mỗi phòng, sau đó tạo hóa đơn trong ứng dụng, gửi thông tin hóa đơn tới các bạn sinh viên cùng một phòng

• Việc quản lí thông tin tài sản: ứng dụng cho phép người quản lí định nghĩa các danh mục sản phẩm, quản lí thông tin từng mã sản phẩm riêng lẻ giúp nhất quán giữa việc số hóa thông tin với thực tế

• Việc thông báo: người quản lí có thể tạo các thông báo trong ứng dụng, thông báo sẽ xuất hiện ở Bảng tin cho các bạn sinh viên có thể thấy được

• Việc liên hệ: thông tin của các bạn sinh viên đã được lưu trữ khi nhập Ký túc xá, do đó người quản lí có thể liên hệ tới từng bạn thông qua số điện thoại hoặc nhắn tin in-app (nhắn ngay trong ứng dụng, sử dụng Internet) Bên cạnh đó có thể liên hệ tới người thân/phụ huynh của sinh viên nếu có cung cấp số điện thoại trong thông tin hồ sơ

• Việc thống kê/báo cáo: người quản lí có thể dễ dàng xuất các báo cáo/thống kê cần thiết đối với từng loại thông tin khác nhau, ví dụ: công nợ, tình trạng các bạn sinh viên ở lại/về nhà, thông tin hóa đơn, thông tin tài sản…

Các công nghệ được lựa chọn

1.3.1 Frontend - Flutter (Cross-platform UI framework)

Hình 1.1 Trang chủ https://flutter.dev

Ra mắt vào Tháng 5 năm 2017, Flutter với sứ mệnh là một bộ thư viện dựa trên ngôn ngữ Dart (đều do Google tạo ra) giúp lập trình viên phát triển các phần mềm đa nền tảng (đa nền tảng đối với Flutter là việc viết phần mềm một lần bằng một ngôn ngữ Dart, tuy nhiên cho khả năng tự biên dịch ra các phần mềm tương tự nhau ở các nền tảng hệ điều hành như Android, iOS, Windows, Linux, MacOS, Web frontend… thay vì như cách phát triển

4 truyền thống phải tự xây dựng từng phần mềm bằng ngôn ngữ lập trình riêng biệt cho mỗi nền tảng[Java/Kotlin cho Android; Swift/Objective-C cho iOS] – dẫn đến tốn thời gian và chi phí gấp nhiều lần)

Các đặc trưng của Flutter:

• Sử dụng ngôn ngữ Dart (ngôn ngữ lập trình mềm dẻo, hỗ trợ cả OOP,

Reactive Programming và Functional Programming, static và dynamic typing, dễ học với hầu hết mọi người do cú pháp của Dart thuộc họ ngôn ngữ lập trình C [C-based programming language], ngôn ngữ được đội ngũ chuyên gia hàng đầu của Google phát triển - do đó đảm bảo độ tin cậy và mạnh mẽ cho các ứng dụng được viết bằng Dart)

• Hỗ trợ Hot-reload (cơ chế tải lại mã [rebuild] cấp tốc giúp việc phát triển nhanh hơn bao giờ hết, người lập trình chỉ cần tạo thay đổi trong code và nhấn lưu thì giao diện sẽ được ngay lập tức cập nhật)

• Giúp tạo ra các ứng dụng có giao diện nhất quán bởi việc sử dụng trình render giao diện Skia (một trình render giao diện được viết bằng C++, giúp tái tạo lại mọi pixel trong màn hình thay vì sử dụng lại cơ chế sẵn có của hệ điều hành, điều này cho phép người lập trình khả năng tùy chỉnh mọi điểm ảnh trên màn hình của mình, từ đó cho hiệu năng cao hơn so với các công nghệ cùng lĩnh vực như React Native, Xamarin hay đặc biệt nhanh hơn khi so với các công nghệ Web- embedded như Ionic/PhoneGap) Ngoài ra, Flutter đảm bảo việc render giao diện giữ ở mức cơ bản 60FPS (60 khung hình/s) hoặc thậm chí 120FPS nếu thiết bị đáp ứng được (xem chi tiết), giúp mang lại trải nghiệm mượt mà cho người dùng

• Bản thân Flutter đã và đang được đội ngũ phát triển tạo ra một kho các widget (controls/components/hay gọi là các thành phần giao diện)

5 phong phú, giúp cho Flutter dễ dàng tiếp cận hơn đa số các công nghệ đa nền tảng khác Họ không ngừng chia sẻ các video giới thiệu về các widgets, các series trên YouTube “vọc vạch” sâu vào cơ chế hoạt động của Flutter để giúp bất kì ai khi làm quen cũng sẽ có một kiến thức vững chắc về cách Flutter hoạt động

• Flutter sử dụng ngôn ngữ Dart cho cả việc xây dựng code logic và giao diện (không giống như Java hay Kotlin cần viết riêng giao diện vào các file xml), điều này giúp người lập trình không cần phải học thêm những khái niệm khác khi tạo giao diện – giúp quá trình phát triển được nhất quán và nhanh hơn bao giờ hết

Bản chất Flutter chỉ là một bộ UI framework giúp tạo giao diện nhanh chóng, nó không thể trực tiếp cung cấp cho người lập trình các API của hệ điều hành (các tác vụ thao tác với phần cứng, can thiệp sâu vào hệ thống như đọc ghi file, truy cập Camera, Micro…) như cách mà các công nghệ

Native như Android (Java/Kotlin) hay iOS (Swift/Objective-C) làm được Để khắc phục nhược điểm đó, Flutter cung cấp cơ chế có tên gọi MethodChannel Đây là một cơ chế giúp người lập trình có thể đứng ở code Flutter (Dart) và gọi được tới các hàm nằm ở phía ứng dụng Native của hệ điều hành để lấy thông tin, điều này giống như trái tim của Flutter khi nó vốn chỉ là thư viện tạo giao diện, nhờ đó làm tăng tính khả dụng khi lập trình phần mềm cho nhiều nền tảng mà vẫn đảm bảo tính tương thích hoàn toàn và tạo nên được những ứng dụng giúp xử lí hầu hết những yêu cầu khắt khe từ người dùng không kém cạnh những nền tảng Native

Với những ưu điểm kể trên của Flutter, tôi chọn Flutter làm nền tảng để phát triển phần mềm cho đề tài này, với mong muốn phần mềm được tạo ra nhanh chóng, có một giao diện bắt mắt, hiệu năng tốt và chạy được trên nhiều nền tảng – do trong thực tế đối tượng sử dụng sẽ có thể dùng một trong hai hệ điều hành Android hoặc iOS

Firebase được Google ra mắt vào Tháng 4 năm 2012, tới nay (2021) đã hơn

Firebase là một bộ công cụ đa năng giúp cho các nhà lập trình thúc đẩy quá trình phát triển sản phẩm với tốc độ cao ở phía giao diện người dùng mà không cần quan tâm nhiều đến Backend

Firebase cung cấp các cách tương tác cơ bản sau để kết hợp và xây dựng nên một hệ thống Phần mềm/Web:

Hình 1.2 Các ứng dụng nổi tiếng được xây dựng bởi Flutter

- Web Console: Bộ công cụ quản trị các chức năng trên giao diện Web console.firebase.google.com

- Backend SDK: Bộ thư viện phía Backend (dành cho máy chủ Web), giúp người lập trình có quyền truy cập sâu (quyền quản trị) vào các chức năng của Firebase

- Frontend SDK: Bộ thư viện phía Frontend (dành cho Web frontend,

Mobile/Desktop apps), giúp người lập trình kết nối tới/sử dụng các chức năng của Firebase

Hiện tại, Firebase cung cấp các chức năng/dịch vụ chính sau:

- Authentication: Xác thực người dùng Với Firebase Authentication, người lập trình có thể tích hợp nhiều cách thức đăng nhập vào hệ thống như Xác thực bằng Email, số điện thoại, thông qua tài khoản của các bên như Facebook, Apple, Microsoft, Github…

- Realtime Database: Cơ sở dữ liệu thời gian thực Dữ liệu được lưu trữ ở định dạng cây JSON Firebase Realtime Database cung cấp các bộ Client SDK (thư viện phát triển ở phía giao diện người dùng) cho phép cập nhật (đồng bộ) trong thời gian thực khi dữ liệu có thay đổi

- Firestore Database: Cơ sở dữ liệu thời gian thực mở rộng Đây là một kiểu CSDL mới được Firebase ra mắt vào Tháng 10/2017, cũng cho khả năng cập nhật thời gian thực như Firebase Realtime DB, thêm vào đó cho phép lưu trữ các loại dữ liệu phức tạp hơn, hỗ trợ việc truy vấn với các điều kiện đầy đủ hơn

- Storage: Lưu trữ tập tin Firebase Storage cho phép lưu trữ, truy xuất, tải lên/xuống các tập tin như: Ảnh, video, âm thanh…

- Hosting: Lưu trữ website frontend Firebase Hosting cho phép lưu trữ các website có nội dung ở phía frontend (JavaScript/HTML/CSS,

ReactJS, VueJS, Angular, Svelte…) Hỗ trợ publish ra môi trường Internet với domain tùy chỉnh

PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG

Khảo sát sơ bộ

2.1.1 Các đối tượng sử dụng

- Người quản trị/Người quản lý: điện thoại

- Android : Phiên bản phổ biến hiện tại khoảng Android 10

Theo nhận định, các bạn sinh viên khi lên đại học có thể được bố mẹ mua sắm cho một chiếc điện thoại mới Thời điềm này tại Việt Nam, các hãng phân phối điện thoại nổi tiếng như: Thế giới Di động, Điện máy xanh, CellphoneS, Hoàng Hà Mobile… hầu hết đều cung cấp các mẫu điện thoại chạy Hệ điều hành Android phiên bản 10.0 trở lên, kể cả các mẫu điện thoại có giá thấp nhất

Do các mẫu điện thoại đời mới được sản xuất theo hướng rẻ, đẹp, đa dạng, bắt kịp xu thế… nên nhà sản xuất thường trang bị các cấu hình hiện đại/chưa bị lỗi thời

Hình 2.1 Các phiên bản Android được hỗ trợ

Xem ví dụ tại TGDĐ: Các mẫu điện thoại Android giá thấp đến cao (https://www.thegioididong.com/dtdd?g=android#cB&p9237&o

Thống kê: https://gs.statcounter.com/os-version-market- share/android/mobile-tablet/worldwide

Hình 2.2 Mức phổ biến của các phiên bản Android (Tháng 10/2021)

- iOS: Phiên bản hệ điều hành phổ biến hiện tại: iOS 14

Phiên bản iOS khả dụng: iOS 12

Với đặc trưng là các thiết bị nhất quán (chỉ có các thiết bị thuộc nhà Apple mới có thể chạy hệ điều hành iOS), việc ra các phiên bản cập nhật hệ điều hành của Apple diễn ra thường xuyên hơn do không có nhiều sự khác biệt lớn giữa các dòng điện thoại (đối với Android, do hệ điều hành này được nhiều hãng điện thoại phân phối và tùy chỉnh riêng, do đó tạo nên sự khác biệt lớn giữa các điện thoại Android trong việc cập nhật phiên bản)

Hiện tại phiên bản iOS thấp nhất còn khả dụng là iOS 12, sở dĩ vì hiện tại các dòng điện thoại chạy các chip cũ (A7)/bộ nhớ thấp (1GB RAM) như iPhone 5S/6/6 Plus vẫn còn được một bộ phận không nhỏ người dùng sử dụng Trong khi iOS 13 trở lên không còn hỗ trợ cập nhật cho các mẫu điện thoại kể trên

Thống kê: https://gs.statcounter.com/os-version-market- share/ios/mobile-tablet/worldwide

Hình 2.3 Mức phổ biến của các phiên bản iOS (Tháng 10/2021)

Phân tích Hệ thống

Chuyên mục này được triển khai bằng UML – Ngôn ngữ mô hình hoá thống nhất (https://www.tutorialspoint.com/uml/uml_standard_diagrams.htm) Các dạng Biểu đồ được thể hiện cho mỗi chức năng bao gồm:

• UseCase Specification (Đặc tả chức năng)

• UseCase Diagram: Mô tả các mối quan hệ và sự phụ thuộc giữa các chức năng (https://www.tutorialspoint.com/uml/uml_use_case-

• Activity Diagram: Mô tả từng luồng chạy chi tiết của chức năng

(https://www.tutorialspoint.com/uml/uml_activity_diagram.htm)

Trong hệ thống này, các tác nhân trực tiếp sử dụng ứng dụng bao gồm:

• Người quản lí: Quản trị các thông tin

• Sinh viên: Xem thông tin, cho phép tương tác với một số nội dung nhất định

Biểu đồ khái quát các chức năng có trong ứng dụng

Hình 2.4 Biểu đổ UseCase tổng quát

1 Đặc tả chức năng Để có thể sử dụng các chức năng của hệ thống, người dùng (Admin/Sinh viên) cần đăng nhập thông qua số điện thoại

15 Ứng dụng này sử dụng Firebase Authentication với phương thức đăng nhập thông qua số điện thoại Khi người dùng nhập số điện thoại, hệ thống sẽ gửi một mã số OTP (6 kí tự) tới tin nhắn của số điện thoại đó, người dùng ghi nhớ mã OTP và nhập lại vào ứng dụng để xác minh rằng mình là chủ sở hữu

Phương thức đăng nhập thông qua số điện thoại đang trở nên phổ biến những năm gần đây, các ứng dụng về Internet Banking, Sàn thương mại điện tử hay cả những ứng dụng Mạng xã hội đều đã và đang sử dụng phương thức này cho việc xác minh danh tính người dùng, điều đó cho thấy đây là phương thức an toàn và đáng tin cậy

Bảng 1 Đặc tả chức năng Đăng nhập

Descriptions Người dùng muốn đăng nhập vào ứng dụng để sử dụng các chức năng từ ứng dụng Actor Người dùng (Sinh viên/Người quản lý) Priority Phải có / Tiên quyết

Trigger Nhấn nút “Đăng nhập” trong App

Pre-conditions Sở hữu số điện thoại

Kết nối Internet ổn định

Người dùng đăng nhập thành công

Truy xuất các thông tin để hiển thị cho màn hình chính của App tùy vào quyền của người dùng đăng nhập là Sinh viên hoặc Người quản lý

1 Người dùng khởi động ứng dụng

2 Ứng dụng kiểm tra nếu đã đăng nhập thì chuyển đến Bước 8, ngược lại chuyển đến màn hình đăng nhập

3 Người dùng nhập số điện thoại, chọn nút

4 Hệ thống xác minh recaptcha bật lên để người dùng xác minh không spam/không phải robot

5 Hệ thống gửi mã OTP tới số điện thoại người dùng đã nhập, đồng thời ứng dụng hiển thị màn hình nhập mã OTP

6 Người dùng kiểm tra mã số OTP được gửi tới trong tin nhắn (hộp thư đến của

SIM), nhập vào ứng dụng và nhấn “Tiếp tục”

7 Hệ thống kiểm tra mã OTP, xác nhận người dùng đăng nhập thành công

8 Ứng dụng chuyển tới màn hình chính

4.1 Hệ thống không xác minh được recaptcha, thông báo lỗi tới người dùng và yêu cầu thao tác lại 7.1 Mã OTP không khớp hoặc đã hết hạn, thông báo lỗi và yêu cầu thao tác lại 7.2 Hệ thống không tìm thấy người dùng tương ứng với số điện thoại vừa nhập, thông báo lỗi và yêu cầu thao tác lại

Non-Functional Mã số OTP được gửi tới tin nhắn sau thời gian

5 phút sẽ hết hiệu lực

Hình 2.5 Biểu đồ Usecase chức năng Đăng nhập

Hình 2.6 Biểu đồ Activity chức năng Đăng nhập

Những người dùng khi đã đăng nhập có thể nhắn tin với nhau Nhắn tin ngay trong ứng dụng giúp giảm thiểu chi phí so với nhắn thông qua SMS truyền thống

Bảng 2 Đặc tả chức năng Đăng nhập

Descriptions Người dùng sau khi đăng nhập có thể nhắn tin với nhau Actor Người dùng (Sinh viên/Người quản lý) Priority Không bắt buộc

Trigger Mục Tin nhắn trong ứng dụng

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Tin nhắn được gửi tới người nhận, người nhận thấy được tin nhắn mới từ người gửi trong mục Tin nhắn

1 Người dùng đăng nhập thành công

2 Người dùng chọn mục Tin nhắn

3 Hệ thống tải các tin nhắn/cuộc trò chuyện

4 Người dùng chọn vào cuộc trò chuyện mong muốn

5 Hệ thống tải chi tiết cuộc trò chuyện

6 Người dùng nhập nội dung muốn nhắn, nhấn “Gửi”

7 Hệ thống xử lý thông tin và chuyển tin nhắn đến Người nhận trong cuộc trò chuyện

Exception Flow 7.1 Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi cho người gửi

Hình 2.7 Biểu đồ Usecase chức năng Nhắn tin

Hình 2.8 Biểu đồ Activity chức năng Nhắn tin

22 2.2.3.3 Chức năng Xem thông báo Bảng tin

Những người dùng/sinh viên khi đã đăng nhập có thể xem các tin broadcast (tin chung cho mọi sinh viên)

Bảng 3 Đặc tả chức năng xem thông báo bảng tin

UseCase Name Xem thông báo bảng tin

Descriptions Người dùng sau khi đăng nhập có thể xem các thông báo ở Bảng tin Actor Người dùng (Sinh viên/Người quản lý) Priority Không bắt buộc

Trigger Mục Bảng tin trong ứng dụng

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Post-conditions Người dùng thấy được nội dung của thông báo, ngày giờ đăng

1 Người dùng đăng nhập thành công

2 Người dùng chọn mục Bảng tin

3 Hệ thống tải các thông báo của bảng tin và hiển thị ra màn hình theo dạng List

Exception Flow Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi cho người xem

Hình 2.9 Biểu đồ Usecase chức năng Xem thông báo Bảng tin

Hình 2.10 Biểu đồ Activity chức năng Xem thông báo Bảng tin

24 2.2.3.4 Chức năng Xem thông tin Hồ sơ/Phòng/Dịch vụ/Tài sản/Hóa đơn/Thành viên/Yêu cầu sửa chữa

Bảng 4 Đặc tả chức năng xem thông tin liên quan tới phòng

UseCase Name Xem thông tin hồ sơ và các thông tin liên quan đến phòng đang ở

Sinh viên sau khi đăng nhập có thể xem các thông tin về hồ sơ của bản thân và các thông tin liên quan về phòng đang ở như: các thành viên trong phòng, các dịch vụ của phòng, các tài sản, yêu cầu sửa chữa, các hóa đơn

Priority Không bắt buộc Trigger Mục Phòng/Cá nhân trong ứng dụng

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Post-conditions Người dùng thấy được thông tin của mục muốn xem

1 Sinh viên đăng nhập thành công

2 Sinh viên chọn mục Phòng hoặc Cá nhân

3 Hệ thống tải các thông tin tương ứng với chức năng đã chọn, hiển thị ra giao diện

Exception Flow Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi cho người xem

Hình 2.11 Biểu đồ Usecase chức năng Xem thông tin Hồ sơ/Phòng

Hình 2.12 Biểu đồ Activity chức năng Xem thông tin Hồ sơ/Phòng

2.2.3.5 Chức năng Tạo Yêu cầu sửa chữa

Bảng 5 Đặc tả chức năng tạo yêu cầu sửa chữa

UseCase Name Tạo Yêu cầu sửa chữa cho phòng đang ở

Sinh viên sau khi đăng nhập có thể tạo các yêu cầu sửa chữa cho phòng đang ở trong trường hợp phòng xuất hiện sự cố nào đó như mất điện, mất nước, hỏng hóc…

Trigger Mục Yêu cầu sửa chữa

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Sinh viên tạo được yêu cầu sửa chữa cho phòng đang ở

Người quản lí thấy được các yêu cầu sửa chữa theo phòng trong ứng dụng

1 Sinh viên đăng nhập thành công

2 Sinh viên chọn mục Yêu cầu sửa chữa

3 Ứng dụng hiện form nhập thông tin yêu cầu

4 Sinh viên nhập các nội dung cần thiết và gửi đi

5 Hệ thống lưu thông tin và hiển thị/thông báo yêu cầu tới người quản lí

Exception Flow Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi

Hình 2.13 Biểu đồ Usecase chức năng Tạo yêu cầu sửa chữa

Hình 2.14 Biểu đồ Activity chức năng Tạo yêu cầu sửa chữa

2.2.3.6 Chức năng Tạo và quản trị thông báo bảng tin

Bảng 6 Đặc tả chức năng tạo và quản trị thông báo bảng tin

UseCase Name Tạo Thông báo bảng tin tới tất cả sinh viên

Descriptions Người quản lí sau khi đăng nhập có thể tạo và quản trị các thông báo bảng tin nhằm gửi tới toàn bộ sinh viên các thông báo chung

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Người quản lí tạo và quản trị được thông báo cho bảng tin

Sinh viên thấy được các thông báo ở mục Bảng tin

1 Người quản lí đăng nhập thành công

2 Người quản lí chọn mục Bảng tin

3 Hệ thống tải thông tin các thông báo và hiển thị

4 Người quản lí bấm tạo hoặc chọn chức năng quản trị (xóa, sửa), nhập thông tin và lưu

5 Hệ thống xử lí thông tin và cập nhật lên giao diện

Exception Flow Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi

Hình 2.15 Biểu đồ Usecase chức năng Tạo và Quản trị thông báo bảng tin

Hình 2.16 Biểu đồ Activity chức năng Tạo và quản trị thông báo bảng tin

33 2.2.3.7 Chức năng Quản trị thông tin Phòng/Tài sản/Dịch vụ/Yêu cầu sửa chữa/Sinh viên/Hóa đơn

Bảng 7 Đặc tả chức năng quản trị các thông tin liên quan phòng Summary

UseCase Name Quản trị thông tin

Người quản lí sau khi đăng nhập có thể quản trị các thông tin thiết yếu của hệ thống như: phòng, hóa đơn, dịch vụ, tài sản, sinh viên, yêu cầu sửa chữa

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Post-conditions Người quản lí quản trị được các thông tin thiết yếu trong hệ thống

1 Người quản lí đăng nhập thành công

2 Người quản lí chọn mục muốn quản trị

3 Hệ thống tải thông tin mục đã chọn

4 Người quản lí chọn mục chi tiết muốn quản trị

5 Ứng dụng hiển thị form thông tin

6 Người quản lí nhập thông tin và lưu

7 Hệ thống cập nhật thông tin, hiển thị lên giao diện

Exception Flow Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi

Hình 2.17 Biểu đồ Usecacse chức năng Quản trị thông tin

Hình 2.18 Biểu đồ Activity chức năng Quản trị thông tin

36 2.2.3.8 Chức năng Xem báo cáo/thống kê

Bảng 8 Đặc tả chức năng xem báo cáo/thống kê

UseCase Name Xem báo cáo, thống kê

Descriptions Người quản lí sau khi đăng nhập có thể xem các báo cáo/xuất file excel với những dữ liệu khác nhau (về sinh viên, về hóa đơn…)

Priority Không bắt buộc Trigger Mục Quản lý/Báo cáo

Pre-conditions Đã đăng nhập

Kết nối Internet ổn định

Post-conditions Người quản lí xem được các báo cáo, file excel ứng với dữ liệu đã chọn

1 Người quản lí đăng nhập thành công

2 Người quản lí chọn mục Thống kê

3 Ứng dụng hiển thị các kiểu dữ liệu có thể xuất

4 Người dùng nhấn vào mục muốn xuất thông tin

5 Hệ thống tải thông tin tương ứng, kết xuất thành file và hiển thị hộp thoại lưu file

Exception Flow Có lỗi xảy ra, hệ thống hiển thị thông báo lỗi

Hình 2.19 Biểu đồ Usecase chức năng Xuất báo cáo, thống kê

Hình 2.20 Biểu đồ Activity chức năng xuất báo cáo, thống kê

Thiết kế Hệ thống

Mặc định, Flutter hỗ trợ 2 ngôn ngữ thiết kế là Material và Cupertino

Material là ngôn ngữ thiết kế do Google tạo ra, trong đó phổ biến trên các thiết bị Android và kể cả Web frontend

Cupertino là ngôn ngữ thiết kế do đội ngũ Flutter phát triển, cho phép người lập trình tạo ra giao diện mang phong cách của những ứng dụng iOS

39 Ứng dụng BVU Dormitory sử dụng ngôn ngữ thiết kế thiên về bộ Cupertino, vì bản thân tôi thấy rằng đây là một bộ giao diện có tính nhất quán cao, thoáng, và dễ sử dụng

Những năm gần đây, các ứng dụng lớn như của Google, Apple, Microsoft, Facebook… đều đã cho phép người dùng bật chế độ tối khi sử dụng ứng dụng Chế độ tối giúp giảm thiểu tình trạng mỏi mắt khi dùng ứng dụng vào ban đêm (khuya), khi môi trường xung quanh có độ tương phản thấp

Hình 2.21 Chế độ tối của Google Search

Hình 2.22 Chế độ tối của Facebook

Không nằm ngoài xu thế đó, ứng dụng BVU Dormitory cũng cung cấp cho người dùng tùy chọn để thay đổi giao diện sáng/tối, nhằm bảo vệ sức khỏe mắt cho người sử dụng

2.3.2 Thiết kế Cơ sở Dữ liệu

Cơ sở dữ liệu được sử dụng cho ứng dụng BVU Dormitory là Firebase Firestore Firestore là một Cơ sở dữ liệu không quan hệ (NoSQL) Nghĩa rằng giữa các bảng dữ liệu sẽ không có ràng buộc khóa chính – khóa ngoại

Dữ liệu giữa các trường (dòng/bản ghi) có thể khác nhau kể cả khi chúng cùng thuộc một bảng Điều này làm tăng tốc độ truy vấn lên đáng kể so với các cơ sở dữ liệu SQL như Microsoft SQL, MySQL… Cũng nhờ tốc độ

Hình 2.23 Chế độ tối của BVU Dormitory

41 truy vấn cao mà Firestore hỗ trợ cả realtime updating (cập nhật thời gian thực tới các client bất cứ khi nào dữ liệu trong Firestore có thay đổi)

Một số đặc điểm của Firestore:

• Linh hoạt: Dữ liệu trong Firestore được cấu trúc theo dạng các

Collection (tương ứng với bảng trong SQL), bên trong các Collection chứa các Document (tương ứng với bản ghi/dòng trong SQL) Đặc biệt, Firestore cho phép “lồng Collection bên trong Document”, có nghĩa rằng trong một bản ghi lại có thể chứa một “bảng khác”

• Tốc độ: Mặc định, các dữ liệu trong Firestore được đánh chỉ mục, điều này làm cho các câu truy vấn trong Firestore luôn giữ ở tốc độ nhanh Bên cạnh đó Firestore cung cấp phương thức để truy vấn với nhiều điều kiện phức tạp, lồng nhau

• Cập nhật thời gian thực: Cũng tương tự Firebase Realtime DB, Firestore cho phép cập nhật (đồng bộ) dữ liệu trên các thiết bị đã kết nối mạng theo thời gian thực (có nghĩa rằng độ trễ rất thấp) Bên cạnh đó Firestore cũng cho phép lấy dữ liệu theo yêu cầu (on demand) thay vì tự động đồng bộ

• Hỗ trợ offline: Firestore cung cấp cơ chế hoạt động offline (ngay cả khi thiết bị không có kết nối mạng) Có nghĩa ngay cả khi không có mạng, Firestore vẫn cho phép các hành động như đọc/ghi/cập nhật dữ liệu diễn ra, khi thiết bị được kết nối tới mạng Internet trở lại, Firestore sẽ tự động tải các thay đổi từ thiết bị lên đám mây

• Tính scale cao: Firestore là Cơ sở dữ liệu hiện đại nhất của Google, hỗ trợ việc chuyển vùng dữ liệu để đảm bảo tốc độ; đảm bảo tính nhất quán; hỗ trợ transaction cùng các thao tác hàng loạt (atomic transaction)

• Bảo mật: Với cơ chế bảo mật thông qua Security Rule, Firestore thậm chí có thể bảo vệ dữ liệu/phân quyền tới từng trường dữ liệu (column) của một Document (bản ghi) Ví dụ điển hình là hệ thống cho phép thay đổi các trường thông tin khác nhưng không cho chỉnh sửa username

Các Securiry Rule được lưu trữ ở phía Firebase Console (đám mây), do đó mọi client (các ứng dụng phía Frontend) khi dùng tới dữ liệu đều phải tuân theo các quy định do Security Rule đặt ra

Hình 2.24 Ví dụ Security Rule – Chặn cập nhật trên các trường nhất định

2.3.2.1 Các bảng dữ liệu và cấu trúc

Các bảng dữ liệu trong hệ thống ứng dụng BVU Dormitory được cấu hình như sau:

Hình 2.25 Biểu đồ ERD các bảng trong CSDL

2.3.2.2 Bảo mật Cơ sở dữ liệu

Bằng việc sử dụng Security Rules, các quy tắc trong hệ thống phần mềm BVU Dormitory cơ bản được định nghĩa dựa trên việc hạn chế quyền truy cập theo role (chức danh người dùng), trong đó admin có toàn quyền và student chỉ đọc hoặc cập nhật một số nội dung nhất định

Hình 2.26 Các quy tắc Security Rules cho Firestore

Ví dụ cho thấy hiệu quả của việc sử dụng Security Rules, áp dụng lên bảng “repair requests” (Hình 2.26, dòng 57):

Trong ví dụ (các ảnh trên), ảnh 1 từ trái qua là các Yêu cầu sửa chữa ở màn hình Admin, ảnh ở giữa là khi yêu cầu có nội dung “h” đã bị xóa khỏi danh sách của Phòng 101 (vẫn ở màn hình quản trị viên) Ảnh cuối cùng là khi ở màn hình Yêu cầu sửa chữa của Sinh viên, ứng dụng không thể xóa thông tin của bất kì yêu cầu nào bởi vi phạm quy tắc của Security Rule Điều này cho thấy độ hiệu quả khi sử dụng Security Rule để củng cố hàng rào bảo mật, đồng thời là tính linh hoạt khi các Security Rules có thể thay đổi ở Firebase Web Console bất kì khi nào, và có hiệu lực ngay lập tức lên các máy client

Hình 2.27 Ví dụ áp dụng Security Rules trong sử dụng thực tế

XÂY DỰNG PHẦN MỀM

Cấu trúc dự án

Cấu trúc các thư mục trong dự án như sau:

Hình 3.1 Cấu trúc thư mục của dự án

Chú thích nội dung các thư mục:

1 android: code của ứng dụng Android, thư mục này được Flutter tự động tạo ra khi tạo mới dự án

2 build: thư mục chứa các file đầu ra để cài đặt lên các máy thật hoặc xuất bản lên Google Play Store/Apple Store (định dạng apk/.aab/.ipa)

3 ios: code của ứng dụng iOS, thư mục này được Flutter tự động tạo ra khi tạo mới dự án

4 lib: chứa toàn bộ code Flutter của dự án

4.1 assets: chứa các tài nguyên tĩnh (static) của dự án, ví dụ như hình ảnh, fonts, icon…

4.2 app: chứa các code cấu hình chung (global) cho dự án, như cấu hình màu sắc, giao diện (themes), các file ngôn ngữ…

4.3 base: các class khuôn mẫu (blueprints) để các class khác kế thừa, ví dụ: BaseScreen (class mẫu cho các màn hình), BaseController (class xử lý logic của màn hình), BaseFirestoreModel (class cha dành cho việc ánh xạ dữ liệu từ Firestore thành các class nhất định, ví dụ như Invoice extends

4.4 helpers: các class tiện ích, cung cấp thêm chức năng cho các class sẵn có (extensions)

4.5 models: các class ánh xạ dữ liệu từ Firestore, ví dụ: Invoice, Building, Floor, Room, Student, Service…

4.6 repositories: các class chịu trách nhiệm xử lý dữ liệu từ Firestore, ví dụ: các thao tác lấy dữ liệu từ Firestore, các thao tác thêm/xóa/cập nhật dữ liệu… đều cần thông qua các repository class

4.7 screens: các màn hình/chức năng Mỗi màn hình là một thư mục chứa, trong đó bao gồm screen, controller, widget con

4.7.1 shared: các màn hình dùng chung cho các quyền admin và student 4.7.2 admin: các màn hình dành cho quyền admin

4.7.3 student: các màn hình dành cho quyền student

4.8 widgets: các thành phần giao diện dùng chung cho dự án, có thể sử dụng lại nhiều lần ở các màn hình

Cấu hình đa ngôn ngữ

Tại thư mục lib/app/locales/, bằng việc sử dụng package (thư viện)

Localization của Flutter, ứng dụng có thể hiển thị các nội dung chữ (label) ở nhiều ngôn ngữ khác nhau, các nội dung đó được định nghĩa trong các file app_.arb Khi lập trình các giao diện, người lập trình sử dụng các nội dung được định nghĩa trong các file này, thay vì gán cứng trong giao diện sẽ gây khó khăn cho việc chỉnh về sau Trong hình dưới đây là 2 ngôn ngữ Vietnamese (app_en.arb) và English (app_vi.arb)

Hình 3.2 Cấu trúc thư mục đa ngôn ngữ

Hình 3.3 Các chuỗi được định nghĩa trong Tiếng Việt

Hình 3.4 Ví dụ sử dụng đa ngôn ngữ trong coding

Các màn hình chức năng

3.3.1 Đăng nhập Để sử dụng được các chức năng khác có trong ứng dụng, trước hết người dùng cần định danh bản thân bằng việc đăng nhập Với việc sử dụng dịch vụ Firebase Authentication, ứng dụng này sử dụng phương thức đăng nhập thông qua số điện thoại (OTP) để tăng tính bảo mật và loại bỏ việc phải nhớ mật khẩu cho người dùng

Bước 1: Khởi động ứng dụng

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

51 Bước 2: Nhập số điện thoại và nhấn “Đăng nhập” Màn hình xác thực Captcha sẽ hiện ra Người dùng cần vượt qua màn hình captcha này để có thể tiếp tục

52 Bước 3: Khi captcha được vượt qua, màn hình hiển thị chờ người dùng nhập mã số OTP đã được gửi tới số điện thoại được nhập trước đó hiện lên Người dùng cần kiểm tra hộp thư đến tin nhắn và nhập mã OTP vào ứng dụng

Hình 3.7 Lỗi đăng nhập khi người dùng chưa có tài khoản trong hệ thống

Hình 3.8 Màn hình nhập mã OTP đăng nhập

Hình 3.9 Màn hình sau khi đăng nhập thành công (sinh viên)

54 3.3.2 Chức năng quản trị thông tin Sinh viên

Hình 3.10 Màn hình chính (home) của Người quản lý

3.3.2.1 Thêm thông tin hồ sơ sinh viên

Sinh viên khi nhập vào ở Ký túc xá sẽ được người quản lý nhập thông tin vào hệ thống, đồng thời chọn phòng cho sinh viên đó

Người quản lý cần chọn Khu à Tầng à Phòng, sau đó nhập thông tin sinh viên cho phòng này

55 Bước 1: Ở màn hình home, chọn mục Phòng, sau đó chọn phòng muốn thêm thông tin sinh viên

Hình 3.11 Màn hình chọn phòng của Khu/Tầng

56 Bước 2: Chọn mục Sinh viên trong màn hình chờ của phòng

Hình 3.12 Màn hình Sinh viên của phòng

57 Bước 4: Chọn nút thêm ở góc trên-phải để mở màn hình thêm thông tin sinh viên cho phòng hiện tại Tiến hành nhập thông tin và nhấn Tiếp tục khi đã hoàn tất Nếu số điện thoại đã được sinh viên khác sử dụng, một thông báo lỗi sẽ hiện lên

Hình 3.13 Thông tin sinh viên được thêm vào phòng

59 3.3.2.2 Chuyển thông tin sinh viên sang phòng khác

Trong quá trình ở Ký túc xá, đôi khi sẽ có trường hợp phòng nào đó gặp sự cố và không thể ở được trong một thời gian, hoặc sinh viên mong muốn chuyển phòng, người quản lý có thể chuyển thông tin sinh viên từ phòng này sang một phòng khác trong hệ thống

Bước 1: Tại màn hình sinh viên của phòng, chọn vào chi tiết sinh viên muốn chuyển phòng Hộp thoại quản trị thông tin sinh viên hiện lên, chọn Chuyển phòng Sau cùng, chọn phòng khác để chuyển thông tin sinh viên tới

Hình 3.14 Cửa sổ quản trị thông tin sinh viên

Hình 3.15 Chọn phòng mới cho sinh viên

Hình 3.16 Chuyển thông tin sinh viên thành công

61 3.3.2.3 Xóa thông tin sinh viên

Khi sinh viên không còn nhu cầu ở lại Ký túc xá, người quản lý có thể xóa thông tin hồ sơ của sinh viên để tránh những dữ liệu dư thừa không dùng tới

Bước 1: Chọn vào chi tiết sinh viên của phòng, khi hộp thoại quản trị thông tin hiện lên, nhấn Xóa thông tin hồ sơ

Sau khi xóa thông tin hồ sơ sinh viên thành công

Hình 3.17 Xóa thông tin hồ sơ sinh viên

63 3.3.3 Các chức năng quản trị thông tin Dịch vụ

Khi ở Ký túc xá, một phòng thường đi kèm với các dịch vụ như: điện, nước, wifi… Người quản lý có thể cấu hình thêm/cập nhật thông tin của các dịch vụ như tên, đơn giá theo thời điểm nhằm đáp ứng nhu cầu thực tế

Bước 1: Tại màn hình home, chọn mục Dịch vụ

Hình 3.18 Màn hình thông tin các dịch vụ

64 Bước 2: Tại đây, người quản lý có thể chọn vào dịch vụ để quản trị, hoặc nhấn nút thêm ở góc trên-phải để thêm mới dịch vụ

65 3.3.4 Chức năng quản trị thông tin Tài sản

Trong Ký túc xá, ở mỗi phòng đều có sử dụng/gắn các tài sản ví dụ như:

Giường, bóng đèn điện, điều hòa, bồn lavabo…

Người quản lý có thể quản trị thông tin các tài sản như thêm/cập nhật thông tin, gán thông tin vào phòng/bỏ gán khỏi phòng

3.3.4.1 Quản trị thông tin Danh mục tài sản

Bước 1: Tại màn hình home, chọn mục Tài sản

Hình 3.19 Màn hình thông tin các Tài sản

66 Bước 2: Tại đây, người quản lý có thể nhấn giữ để chọn vào danh mục tài sản muốn quản trị, hoặc nhấn nút thêm ở góc trên-phải để mở màn hình thêm thông tin danh mục tài sản (danh mục tài sản ở đây có nghĩa là nhóm các loại tài sản lại với nhau theo mục đích sử dụng hoặc tính năng)

Hình 3.20 Cửa sổ cập nhật thông tin danh mục tài sản

67 3.3.4.2 Quản trị thông tin Loại tài sản

Loại tài sản ở đây là những tài sản có cùng nhà cung cấp, cùng mẫu mã Các loại tài sản cùng đặc tính thì nằm chung trong danh mục tài sản

Bước 1: Khi nhấp vào thông tin danh mục tài sản, màn hình chi tiết các loại tài sản sẽ hiện ra

Người quản lý có thể nhấn giữ lên mục muốn quản trị, hoặc nhấn nút thêm ở góc trên-phải để mở cửa sổ thêm thông tin loại tài sản

Hình 3.21 Màn hình cập nhật thông tin loại tài sản

68 3.3.4.3 Quản trị thông tin Mã tài sản

Mã tài sản là các tài sản đơn lẻ, cùng thuộc một loại tài sản Mỗi mã tài sản sẽ được gán vào phòng nào đó để thể hiện việc phòng sử dụng tài sản

Bước 1: Tại màn hình các loại tài sản, khi nhấp vào một loại tài sản, màn hình chi tiết các mã tài sản của thuộc loại đó sẽ hiện ra

Hình 3.22 Màn hình cập nhật thông tin mã sản phẩm

69 3.3.4.4 Gán/Gỡ thông tin Mã tài sản lên phòng

Bước 1: Tại màn hình các mã tài sản, chọn vào mã tài sản muốn quản trị Khi màn hình quản trị thông tin mã tài sản hiện ra, chọn vào Gỡ/Gán thông tin

Hình 3.23 Màn hình quản trị thông tin mã tài sản

70 Bước 2: Khi chọn Gán vào phòng, màn hình chọn phòng hiện ra, người quản lý chọn phòng muốn gán để gán thông tin mã tài sản vào phòng mong muốn

Hình 3.24 Sau khi gán thông tin mã tài sản vào phòng

Mã tài sản sau khi Gỡ khỏi phòng sẽ hiện dấu “?’ ngay dưới chuỗi mã tài sản

Hình 3.25 Mã tài sản sau khi gỡ thông tin khỏi phòng

Hình 3.26 Màn hình các mã tài sản của một phòng

72 3.3.5 Chức năng quản trị thông tin Yêu cầu sửa chữa

Trong quá trình ở Ký túc xá sẽ không thể tránh khỏi những sự cố xảy ra trong một phòng, ví dụ khi hỏng bóng điện, hỏng ống nước…

Người quản lý và sinh viên đều có thể tạo thông tin yêu cầu sửa chữa thông qua ứng dụng để lưu lại trong hệ thống Người quản lý dựa vào thông tin các yêu cầu để chuẩn bị phương án xử lý – chuẩn bị đồ nghề khi đến phòng giải quyết sự cố