106 lines
3.7 KiB
Markdown
106 lines
3.7 KiB
Markdown
# Web GUI для датчиков температуры и клапанов
|
||
|
||
Веб-интерфейс для:
|
||
- мониторинга температур,
|
||
- установки уставок,
|
||
- ручного и автоматического управления клапанами,
|
||
- управления позицией клапана в `%`.
|
||
|
||
## Быстрый старт
|
||
|
||
1. Запустите демо backend:
|
||
```bash
|
||
python mock_server.py
|
||
```
|
||
2. Откройте страницу:
|
||
- `http://127.0.0.1:8080/index.html`
|
||
3. В поле `API endpoint` оставьте пустым для демо или укажите `http://127.0.0.1:8080`.
|
||
|
||
Если API не указан, интерфейс переходит в офлайн-режим (демо) и хранит состояние в `localStorage`.
|
||
|
||
## Привязка к вашему проекту
|
||
|
||
GUI читает и пишет данные через `API_PATHS` в `app.js`:
|
||
|
||
1. Датчики: `/api/sensors`, `/sensors`, `/api/data`, `/state`
|
||
2. Клапаны: `/api/valves`, `/valves`, `/api/data`, `/state`
|
||
3. Запись: сначала `PUT /api/*/:id`, затем `PUT /api/*` (без `:id`)
|
||
|
||
Если ваш контракт другой, правьте:
|
||
- массив `API_PATHS` в `app.js`
|
||
- функции `normalizeSensor`, `normalizeValve` в `app.js`
|
||
|
||
## Работа с COM-портом (MCU)
|
||
|
||
Для чтения с порта COM запущен `serial_bridge.py`:
|
||
|
||
```bash
|
||
python serial_bridge.py --serial-port COM3 --baudrate 115200
|
||
```
|
||
|
||
По умолчанию сервис доступен на `http://127.0.0.1:8080`.
|
||
|
||
Поддерживаемые входящие форматы с порта:
|
||
|
||
1) JSON-пакет:
|
||
```json
|
||
{"sensors":[{"id":"zone_1","value":24.5,"setpoint":28.0}], "valves":[{"id":"valve_1","mode":"auto","position":32,"targetTemp":28}]}
|
||
```
|
||
|
||
2) Текстовый формат:
|
||
```text
|
||
T1=24.5;T1_SETPOINT=28.0;V1_MODE=auto;V1_POS=32;V1_TGT=28
|
||
```
|
||
|
||
Исходящие команды от GUI (`PUT`) также отправляются в порт как JSON:
|
||
```json
|
||
{"type":"sensor","id":"zone_1","setpoint":28.0}
|
||
{"type":"valve","id":"valve_1","mode":"manual","position":50}
|
||
```
|
||
|
||
Если нужен другой протокол от/к MCU (Modbus/байт-структура), пришлите пример кадров — подгоню парсер в `serial_bridge.py`.
|
||
|
||
В GUI:
|
||
- поле `COM порт` показывает список `/api/serial/ports`;
|
||
- кнопка `Обновить порты` — принудительно перечитывает список COM;
|
||
- кнопка `Подключить` / `Отключить` — вызывает `/api/serial/connect` и `/api/serial/disconnect` в `serial_bridge.py`.
|
||
|
||
## Форматы API
|
||
|
||
### GET
|
||
- `GET /api/sensors` → массив:
|
||
```json
|
||
[
|
||
{ "id": "zone_1", "name": "Термопара 1", "value": 24.6, "setpoint": 28, "unit": "°C", "zone": "1" }
|
||
]
|
||
```
|
||
- `GET /api/valves` → массив:
|
||
```json
|
||
[
|
||
{ "id": "valve_1", "name": "Клапан 1", "zone": "1", "mode": "auto", "position": 40, "targetTemp": 28, "isOpen": true }
|
||
]
|
||
```
|
||
|
||
### PUT
|
||
- `PUT /api/sensors/{id}`:
|
||
```json
|
||
{ "setpoint": 29.5 }
|
||
```
|
||
- `PUT /api/valves/{id}`:
|
||
- ручной:
|
||
```json
|
||
{ "mode": "manual", "position": 50 }
|
||
```
|
||
- авто:
|
||
```json
|
||
{ "mode": "auto", "targetTemp": 28.0 }
|
||
```
|
||
- или отдельные поля (`mode`, `position`, `targetTemp`).
|
||
|
||
## Файлы
|
||
- `index.html` — разметка страницы
|
||
- `styles.css` — стили
|
||
- `app.js` — логика интерфейса
|
||
- `mock_server.py` — демонстрационный backend
|
||
- `serial_bridge.py` — backend для COM-порта
|