7. KẾT CẤU CỦA ĐỒ ÁN
4.10 Các thành phần chính của Web và Nhiệm vụ của chúng:
33
Hình 4.9: File dữ liệu Web
Điểm chung : Tất cả các trang làm việc cùng sử dụng chung một Phông chữ và Cỡ chữ nhất định để tạo tính đồng nhất.
Điểm khác biệt : Tùy theo khả năng và ước muốn của người dùng ta có thể thay đổi chức năng hoặc ngoại hình website [6]
4.10.1 Trang Login (tham khảo code tại templates/auth/login.html)
Về mặt hình thức: bao gồm - 2 dịng điền thơng
- 1 nút nhấn đăng nhập
Về mặt nhiệm vụ: Tạo ra 1 file nhiệm vụ trong Mục API , có nhiệm vụ tạo ra 1 login admin và 1 password cho admin. Sau đó các lần đăng nhập sau user chỉ cần nhập đúng là sẽ được cấp đặc quyền của 1 admin hệ thống ( Chính xác tại webserver này chỉ có 1 admin – user ).
Tạo ra khoảng thông tin không để kiểm tra từ các dữ liệu so so API ta dùng If/If not – token - return
So sánh tên truy cập trong Database ta dùng If để so sánh với Data: sẽ xảy ra 2 trường hợp:
34 - Đăng nhập thành công
- Đăng nhập thất bại : - Sai tên đăng nhập - Sai mật khẩu
Ở phần code này: Quy định duy nhất để mở được hệ thống chính là phải mở ra 1 trang HTTP được quy định tại file app.py để có thể chạy chương trình ( vì sử dụng Linux trên RaspberryOS , sự khác nhau về hiểu biết của 2 hệ điều hành là 1 bậc )
4.10.2 Trang Chào (tham khảo code tại templates/dashboard)
Chào mừng… và cho biết các tác vụ mà website sẽ làm được - 1 bảng Dashboard:
o 1 tab Dashboard o 1 tab Slave o 1 tab System
4.10.3 Trang làm việc với các kết nối cũ
(tham khảo code tại templates/slave/login.html)
Về mặt hình thức: bao gồm - 1 bảng thông tin danh sách
- 5 nút nhấn : Kết nối , Quét , Làm mới , Edit , Trạng thái , Chi tiết Về mặt nhiệm vụ:
Tạo ra 1 Bảng giá trị thời gian thực đồng thời lưu trữ thông tin các kết nối bao gồm Địa chỉ MAC , Tên thay thế , Thông tin hiểu thị : Giá sản phẩm, Tên sản phẩm và Trạng thái kết nối hiện tại
Và sau đó ta set up 1 bảng Information để chuyển thông tin sang API Database để truyền data được điền vào
Các Data được xem là các threads ( luồng thôn tin) bao gồm Device_name
Prroduct_name Product_price
35
Và sau đó nhận kết q qua thơng báo có trên web
Có 2 trạng thái Success và Failed, ngồi ra cịn UnIdentified nếu mất kết nối giữa màn hình và Gateway ( đây là 1 trường hợ ngẫu nhiên khơng dự đốn trước được).
Đây là thể hiện thứ tự truyền các threads từ Web xuống Gateway và xuống tiếp các Màn hình hiển thị
Bước 1 : Gateway dị lại địa chỉ Mac [8]
Bước 2 : Truyền luồng đầu tiên để kích hoạt BLE bên màn hình Bước 3: Truyền lần lượt các luồng Product_name và Product_price Bước 4 : Báo cáo trạng thái và kết quả truyền
4.10.4 Trang tìm các kết nối mới (tham khảo code tại templates/slave)
Về mặt hình thức: bao gồm - 1 bảng thông tin sự thật - 2 nút nhấn : Quét lại , Chi tiết
Về mặt nhiệm vụ: Sử dụng công cụ quét tầm xa của BLE có tại Gateway được cài đặt ở phần cứng để tìm kiếm các địa chỉ MAC của các thiết bị không dây khác
Sau khi quét các thiết bị thành công , lập tức danh sách các thiết bị sẽ hiện lên ngay trên trang Scan ( bán kính xa )
4.10.5 Trang Làm việc các kết nối mới (tham khảo code tại templates/slave)
Về mặt hình thức: bao gồm 2 phần : Phần 1: Slave :
- 2 Dịng điền thơng tin
- 3 nút nhấn : Thay đổi tên , thay đổi giá , Làm mới màn hình Phần 2: Action :
- 1 Dịng điền thơng tin
- 2 nút nhấn : Lưu và Hủy kết nối
Về mặt nhiệm vụ: Tương tự như các kết nối cũ nhưng có thêm khả năng ghi nhớ - đặt tên thay thế
36
4.10.6 Trang đổi Password (tham khảo code tại templates/system)
Về mặt hình thức: bao gồm
- 4 dòng : Tên cũ , mật mã cũ , mật mã mới , nhập lại mã mới - 2 nút : vào khung thay đổi và cập nhập mật mã.
Về mặt nhiệm vụ: Thay đổi hoặc xóa mật khẩu đã nằm ở phần trước Login, đây cũng đòi hỏi quyền admin khi truy cập vào.