Разработка: scada-coating
Хроника разработки проекта scada-coating. Основные направления: новые функции. Всего 2 записей в потоке. Последние темы: Как я вернул визуальность из забвения: indicator-strip в боевых условиях; Управление 15 подвесками: когда UI решает всё.
Верни indicator-strip: как я вернул управление подвесками из забвения
Проект scada-coating — система для управления конвейерным производством с подвесками. Звучит просто, но стоит один раз потерять видимость того, где находятся 36 позиций обработки, и система становится чёрным ящиком. Именно это и произошло во время миграции на новую архитектуру (feature/variant-a-migration): когда переписывали вкладку Линия, забыли про горизонтальную полоску с позициями — indicator-strip. Без неё оператор не видит, какие ванны заняты, какие в аварии и где вообще находится автооператор.
Задача была простая на словах, но коварная на деле: вернуть indicator-strip, добавить управление позициями по клику и гарантировать, что Control Panel (панель управления автооператором) появляется только там, где нужна обратная связь — то есть только на вкладке Линия.
Первым делом я разбирался, что случилось. Оказалось, что во время рефакторинга функция renderIndicatorStrip() вообще не вызывалась в init(). Классический случай: переделали главный цикл инициализации и забыли добавить одну строку. Добавил вызов — полоска появилась на месте. Но это была только половина дела.
Дальше потребовалось переписать selectPosition() — функцию обработки клика по позиции. Раньше она просто подсвечивала ячейку на схеме, теперь должна открывать панель управления этой конкретной позицией. Логика прояснилась через пару итераций: клик на ячейку в indicator-strip или на саму ванну в схеме должен открыть одну и ту же панель с управлением. Для этого пришлось добавить closePositionControl() — чтобы корректно закрывать панель при переключении между вкладками или нажатии Escape.
Нюанс был в том, что Control Panel для автооператора (движение, захват, выбор цели) должен быть видимым только на Линии. На вкладках Процесс и Оборудование он должен исчезать. Это не просто UX-удобство — это требование безопасности и логики: обратная связь от АО имеет смысл только там, где оператор видит саму линию.
После этого я понял, что система управления подвесками вообще требует большего внимания. На основе анализа кодовой базы выяснилось, что подвески имеют пять состояний: RegisteredInSystem (пустая, серая), Processing (синяя), ProcessingDelayed (жёлтая пульсация), ProcessingFinished (зелёная), ProcessingInterrupted (красная). И это не просто цвета — каждое состояние требует разных доступных действий. На схеме есть хранилище пустых подвесок (IsSuspenderStorage), хранилище снаряженных (IsLoadingStorage) и позиция загрузки-выгрузки (IsTransferPosition).
Интересный момент: стандарт ISA-101 для производственного оборудования рекомендует именно такую цветовую кодировку состояний — это не выдумка, а индустриальный стандарт. SCADA-системы по всему миру используют одни и те же цвета для одних и тех же состояний. Это помогает операторам, переходящим между разными системами, ориентироваться без переучивания.
После того как я вернул indicator-strip с поддержкой управления позициями, система стала намного понятнее оператору. Теперь видна полная картина: 36 позиций, каждая с чётким статусом, треугольники показывают, где находится автооператор, а клик открывает панель управления выбранной позицией. Это простое решение, но оно меняет всё — от ощущения контроля до скорости работы оператора.
Дальше передо мной встала задача проработать полный цикл управления подвесками: dropdown-меню для вызова свободной подвески, список всех подвесок с фильтрацией по состоянию, контекстное меню для быстрых действий. Но это уже другая история.
😄 Забыть вернуть indicator-strip — это как забыть приборную панель в машине, но заметить только когда закончилось топливо на трассе.
Строим интерактивную линию производства: когда один клик решает судьбу 15 подвесок
Работаю над SCADA-системой управления конвейерной линией в проекте scada-coating. Задача была не для слабонервных: реализовать полноценный интерфейс управления подвесками — теми самыми кареточками, которые возят детали по линии обработки.
Проблема была в том, что оператор должен был видеть состояние каждой из 15 подвесок, быстро вызывать нужную, менять её место дислокации, маркировать, переносить в разные хранилища. Всё это нужно было сделать с минимумом кликов и максимумом наглядности. Типичный SCADA-вызов: «Нужно быстро, интуитивно и без ошибок».
Решил начать с моделирования данных. Добавил структуры для позиций на линии с типизацией — загрузочные, выгрузочные, хранилища снаряжённых и пустых деталей. Потом описал сами подвески с их состояниями: свободная, в работе, загруженная. Получилось что-то вроде машины состояний, где каждый переход имеет чёткие правила.
HTML-часть была увлекательной. Добавил action bar прямо в линию-вью с кнопками: «Вызвать подвеску», «Снарядить», «Переместить», «Все подвески». Плюс модальное окно с выдвижной панелью, где видна информация обо всех 15 подвесках одновременно. Экран на экран — чтобы оператор всегда видел целиком.
Но самое интересное началось с JavaScript-логики. Реализовал трёхшаговый визард для вызова подвески: сначала выбираешь, какую подвеску нужна, потом указываешь, куда её вызвать, потом подтверждаешь действие. Каждый шаг валидируется, каждое действие блокируется, если оно невозможно в текущий момент.
Контекстные меню при клике на позицию меняются в зависимости от её состояния. Пустая позиция предлагает вызвать подвеску, загруженная — отправить в обработку или переместить в другое хранилище. Логика простая на вид, но за ней стоит матрица правил, которые гарантируют, что ни при каких раскладах оператор не сможет отправить подвеску туда, где её быть не должно.
Занимательный факт: Цветовая типизация позиций на схеме (синяя для загрузки-выгрузки, зелёная для готовых, жёлтая для пустых) — это не просто красота. В промышленных системах цвет часто решает, получит ли оператор инсульт в 3 часа ночи при аварии. Люди реагируют на цвет в три раза быстрее, чем на текст.
Итоговый workflow связал в кучу: нажимаешь кнопку запуска на вкладке «Процесс» — система автоматически переходит на вкладку «Линия» и открывает визард вызова подвески. Оператору не нужно ничего искать. Всё уже перед глазами.
Прототип выложил в scada-operator-v6.html — можно открыть, нажать кнопки на вкладке «Линия» и посмотреть, как оно живёт.
😄 Что общего у C++ и подростка? Оба непредсказуемы и требуют постоянного внимания