Ввод значений для устройства через web-интерфейс

Программное обеспечение Web UI
1

Пытаюсь настроить управление модулятором через веб-интерфейс.

Принцип таков: мы подаём сигнал устройству подключенному через rs-485. Устройство добавлено и настроено через configs/wb-mqtt-serial.conf.

Оно появилось во вкладке devices (Panter).
(Два параметра помечены красным, я предполагаю, потому что устройство принимает параметры функцией holding_multi (код 16), но не посылает ответов. В любом случае устройство работает корректно.)

Также добавлены два виртуальных девайса, написанных через wb-rules. Они тоже работают корректно, одно посылает на устройство через MQTT число в 16 бит (х00, х05, например), а второе - в 32 бита (х00, х07, х00, х64). Это все регулируется ползунками (type: “range”).

В чем проблема? В ползунках. Нам необходимо реализовать то же самое, но с полями ввода. Так как при наличии 200 лампочек весьма неудобно с помощью ползунка пытаться выбрать именно 188 ID.

Я прочел всю найденную документацию. У меня сложилось впечатление, что функции ввода во вкладке девайсов нет ни в каком виде, помимо ползунка. Value и text нельзя редактировать.

По аналогии с Демонстрационный веб-интерфейс
я попытался создать свою страницу (192.168.1.14/myPage.html). Я планировал добавить туда поля ввода и кнопку, через неё запускать команду вида:
mosquitto_pub -t “/devices/Panter/controls/Dimming all/on” -m ‘99’
(Команда, кстати, исправно подает сигнал на устройство, если вводится через консоль WinSCP. Вместо 99 должно быть любое число, введенное пользователем)
Через собственную страницу команду запустить, впрочем, не получилось. Команда записана в script.sh, который должен запускаться через php, но мне не удалось подружить эту систему.

Я уже не знаю, в какую сторону мне дальше копать. Не могли бы вы мне посоветовать, как мне лучше решить данную задачу? По сути мне просто нужны в веб-интерфейсе два поля, в одно вводится ID (произвольное значение от 1 до 65000), во второе процент (от 0 до 100), и кнопка, которая эти два значения скармливает в MQTT.
Если это невозможно стандартными средствами, то как передавать значения в MQTT из кастомных веб-страниц, залитых на контроллер?

Untitled

2

Добрый день! Спасибо за подробное изложение проблемы. Подумаю, что можно сделать в вашем случае, чтобы максимально просто все решить.

3

And, добрый день!
Вашу задачу можно решить в новой бета-версии веб-интерфейса (https://support.wirenboard.com/t/beta-testirovanie-web-ui-2-0/2079/) В теме есть инструкции по установке.
Контрол в шаблоне должен иметь тип “text”, а для того, чтобы текст можно было вводить в поле, необходимо создать мета-контрол writable и присвоить ему значение 1:
mosquitto_pub -r -t "/devices/<ваше_виртуальное_устройство>/controls/<ваш_контрол>/meta/writable" -m 1
Думаю, это самый простой способ сейчас сделать то, что вы хотите.

4

Новый интерфейс сразу отсек большую часть моего списка вопросов. Потрясающе удобная штука!
Спасибо за своевременный ответ, теперь все работает как задумано.

Причем доступен для редактирования как тип “text”, так и “value”, с разным оформлением. Интересно.

Подскажите, а можно ли как-то убрать всплывающие фичи “copied to clipboard” и иконку “history” (на скрине)?
Так как я наблюдаю странное поведение, возможно, баг, и подозреваю, что как раз функция копирования в буфер обмена его вызывает. Странность заключается в том, что курсор ввода “выбивается” из поля, когда я отпускаю кнопку мыши (и, соответственно, когда появляется сообщение “copied to clipboard”).

Правильный алгоритм действий: нажать на поле, ввести значение.
Нынешний алгоритм действий: зажать кнопку мыши, ввести значение, отпустить кнопку мыши.
Пока кнопка мыши зажата, курсор активен в указанном поле. Как только кнопка отпущена - курсор пропадает и появляется сообщение “copied to clipboard”. Ввод с клавиатуры, естественно, больше не работает.

Также можно зажать мышь, увести указатель подальше от нажатого поля и отпустить кнопку. Тогда текстовый курсор не пропадает из поля и ввод с клавиатуры работает. Сообщение о копировании не появляется.

Untitled

5

And, рад, что смогли помочь!
Это хорошо, что в бета-версии вы заметили такое поведение, добавлю Issue на доработку. Повторил у себя, действительно, поле ввода теряет фокус после того, как всплывает этот “copied to clipboard”.
А значок истории достаточно безобидный, нет? Вроде, не мешает ничему. Может, правда, раздражать. Уточню.

6

Значок истории действительно проблем не вызывает, это чисто вкусовщина : )
Но приятно было бы иметь возможность кастомизировать отображение подобных мелочей в новом интерфейсе.

7

Добры день
Попробовал у себя повторить создание редактируемых контролов типа text и value:
Контролы создал и добавил к ним мета-контрол writable

/devices/ctrl_boyler/controls/timeout_pump_text 100
/devices/ctrl_boyler/controls/timeout_pump_text/meta/type text
/devices/ctrl_boyler/controls/timeout_pump_text/meta/order 6
/devices/ctrl_boyler/controls/timeout_pump_text/meta/writable 1

/devices/ctrl_boyler/controls/timeout_pump_value 200
/devices/ctrl_boyler/controls/timeout_pump_value/meta/type value
/devices/ctrl_boyler/controls/timeout_pump_value/meta/order 7
/devices/ctrl_boyler/controls/timeout_pump_value/meta/writable 1

Но вот редактировать их не могу:

  • Щелкаю по полю - курсор появляется и тут же исчезает
  • с клавиатуры соответственно значения не вводятся
  • в поле value значения меняются стрелочками, но не сохраняются.

Куда копать?

8

vugluskr, добрый день! А какая версия Web-интерфейса у вас?
Вот второй, бета 11, у меня получается:
image

9

Ставил бету 11 поверх 8 беты:

root@wirenboard-AOWCONDB:~# dpkg --status wb-mqtt-homeui
Package: wb-mqtt-homeui
Status: install ok half-configured
Priority: optional
Section: misc
Installed-Size: 2576
Maintainer: Evgeny Boger boger@contactless.ru
Architecture: all
Version: 2.0~beta11
Config-Version: 2.0~beta8
Depends: mosquitto, mqtt-wss, mqtt-tools, nginx-extras, wb-utils (>= 2.0)
Breaks: wb-mqtt-confed (<< 1.0.3), wb-mqtt-db (<< 1.5)
Conflicts: wb-homa-webinterface
Conffiles:
/etc/wb-configs.d/20wb-mqtt-homeui 671136ab943aabff20d2fafab65293e3
/etc/wb-webui.conf cd6b3a6ae29321f35c4922868c3a3e9f obsolete
Description: Wiren Board Web UI web interface

Похоже, что то пошло не так?

10

Да, это последняя версия. Возможно, стоит почистить кеш/попробовать другой браузер? (Я проверял в Chromium 74.0.3689.0)

11

Все перепробовал, ни чего не помогло

  • Чистил кэш
  • Попробовал браузеры Сhrome/Chromium и Firefox под Linux и Windows
  • Версии самые свежие

Может это связано с тем, что у меня после обновления конфиги не обновились:
…
Status: install ok half-configured
…
Config-Version: 2.0~beta8
…

Припоминаю, что во время обновления на консоль что то сообщалось об неудаче при конвертировании.
Но проблем в работе интерфейса замечено не было.

12

А если тогда полностью удалить и поставить заново? Получится? Настройки нового веб-интерфейса хранятся в файле /etc/wb-webui.conf, сделайте резервную копию.

13
  1. Попробовал удалить бету 11, установить 1.7, затем бету 11:
    apt-get remove wb-mqtt-homeui && apt-get install wb-mqtt-homeui
    а за тем - dpkg -i wb-mqtt-homeui_2.0_beta11_all-all.deb

Получил следующее:

root@wirenboard-AOWCONDB:~# dpkg -i wb-mqtt-homeui_2.0_beta11_all-all.deb
(Чтение базы данных … на данный момент установлено 28596 файлов и каталогов.)
Подготовка к распаковке wb-mqtt-homeui_2.0_beta11_all-all.deb …
Распаковывается wb-mqtt-homeui (2.0~beta11) на замену (1.7.1) …
Настраивается пакет wb-mqtt-homeui (2.0~beta11) …
Traceback (most recent call last):
File “/usr/lib/wb-mqtt-homeui/convert_config_v1v2”, line 157, in
run_script()
File “/usr/lib/wb-mqtt-homeui/convert_config_v1v2”, line 146, in run_script
output_file.write(json.dumps(make_new_config(result), indent=4, sort_keys=True, ensure_ascii=False))
File “/usr/lib/wb-mqtt-homeui/convert_config_v1v2”, line 42, in make_new_config
new_dashboards = _format_dashboards(old_config[‘dashboards’])
File “/usr/lib/wb-mqtt-homeui/convert_config_v1v2”, line 78, in _format_dashboards
d_widgets = old_dashboard[‘widgets’]
KeyError: ‘widgets’
dpkg: ошибка при обработке пакета wb-mqtt-homeui (–install):
подпроцесс установлен сценарий post-installation возвратил код ошибки 1
При обработке следующих пакетов произошли ошибки:
wb-mqtt-homeui

Затем, я попробовал удалить из mqtt базы информацию об виджетах старой версии:

root@wirenboard-AOWCONDB:~# mqtt-delete-retained “/config/#”
100% [###############################################################] 13 of 13

повторяю попытку удаления, установки. теперь уже другая ошибка:

dpkg -i wb-mqtt-homeui_2.0_beta11_all-all.deb
Выбор ранее не выбранного пакета wb-mqtt-homeui.
(Чтение базы данных … на данный момент установлено 27499 файлов и каталогов.)
Подготовка к распаковке wb-mqtt-homeui_2.0_beta11_all-all.deb …
Распаковывается wb-mqtt-homeui (2.0~beta11) …
Настраивается пакет wb-mqtt-homeui (2.0~beta11) …
Traceback (most recent call last):
File “/usr/lib/wb-mqtt-homeui/convert_config_v1v2”, line 157, in
run_script()
File “/usr/lib/wb-mqtt-homeui/convert_config_v1v2”, line 141, in run_script
result = dicts[0]
IndexError: list index out of range
dpkg: ошибка при обработке пакета wb-mqtt-homeui (–install):
подпроцесс установлен сценарий post-installation возвратил код ошибки 1
При обработке следующих пакетов произошли ошибки:
wb-mqtt-homeui
root@wirenboard-AOWCONDB:~#

Воспользовался советом [bzzeke] и поправил скрипт конвертации.
https://support.wirenboard.com/t/beta-testirovanie-web-ui-2-0/2079/102?u=vugluskr

После этого все установилось, но интерфейс ругался на отсутствие конф файла.
Как оказалось в бета 8 он расположен в /mnt/data/etc/wb-webui.conf , а в бета 11 в /etc/wb-webui.conf

  1. После пройденного квеста основная проблема не разрешилась - фокус при клике на поле для редактирования тут же исчезал, а над полем появлялось сообщение о том что значение скопировано в клипборд:
    focus1
    focus1867×744 55.7 KB

Но при этом, если “навести фокус” с помощью правой кнопки мыши или клавишей TAB - все редактируется и сохраняется!

  • Опробовано в разных браузерах.
14

Спасибо за такой развернутый отчет! Проблема с фокусом была в одной из ранних бета-версий и ее частично устранили (правда осталось сообщение о копировании в буфер обмена).
Сейчас проверил в FireFox, Edge, WaterFox – проблема есть, в Chromium 74.0 – нет.

15

Проверил ввод данных в эти поля с мобильника (Safari/IOS). Все то же самое:

  • при клике на поле появляется виртуальная клавиатура, и тут же исчезает и появляется сообщение об Clipboard copy.
    Пока мне эта функция кажется больше вредной, чем полезной:
  • Использовать данные скопированные в клипборд не приходилось не разу, а вот мешает она постоянно при вводе
  • через Range движок
  • через редактируемые поля
16

Разработчики должны поправить в финальной версии этот баг. Попробуйте в поле ввода щелкнуть правой кнопкой и нажать Esc, а в поле со стрелками нажимать Enter после изменения значения.