IoT

Хмарна IoT-платформа MICROL Cloud

Інтерфейс платформи моніторингу промислових пристроїв: дашборди з drag-and-drop, бібліотека віджетів, звіти і ролі доступу.

Розробити веб-інтерфейс для збору, візуалізації та керування даними з промислових і комунальних пристроїв - лічильників, датчиків, контролерів - а також для адміністрування організацій, користувачів і звітності.

Завдання

  • Адаптивний односторінковий застосунок (SPA) з інтерактивними дашбордами

  • Бібліотека віджетів з панеллю налаштувань кожного

  • Модулі пристроїв і звітів, інтегровані з REST API бекенду

  • Рольова модель доступу (RBAC) з гранульованими правами

Як робили

Проаналізували доменну модель системи - користувачі, компанії, пристрої, панелі, віджети, звіти - та наявну документацію API. Разом із замовником сформували ієрархію ролей і прав доступу.

Спроєктували модульну архітектуру фронтенду з розділенням на представлення, компоненти, стан та API-шар. Реалізували конструктор дашбордів на основі drag-and-drop сітки та універсальну систему віджетів з окремою панеллю налаштувань.

Ітеративно узгоджували UX ключових екранів: авторизація, панель моніторингу, пристрої, звіти, керування користувачами.

Технології та функціонал

Візуалізація даних
  • Дашборди з перетягуванням і зміною розміру
  • Лінійні та стовпчикові графіки з навігацією по періодах
  • Кастомні спідометри з кольоровими зонами і тривогами
  • Таблиці даних пристроїв і журналів
10+ типів віджетів
  • Текстовий, числовий, спідометр
  • Графіки, таблиці, журнал тривог
  • Аналоговий і дискретний входи, перемикач
  • Прив'язка до пристрою, кольори, умови тривог
Безпека та доступ
  • 5 ролей: від користувача до root
  • Гранульовані права на панелі, віджети, пристрої
  • Меню і дії ховаються за правами
  • Авторизація з Bearer-токеном
React 18 TypeScript Vite 7 Tailwind CSS Redux Toolkit RTK Query Recharts D3.js React Router v6

Результат

Розроблено повнофункціональний фронтенд хмарної платформи MICROL Cloud: SPA з інтерактивними дашбордами, бібліотекою віджетів, модулями пристроїв і звітів та рольовою моделлю доступу. Оператори й адміністратори організацій у реальному часі відстежують показники пристроїв, налаштовують візуалізацію під свої потреби та керують користувачами.

Моніторинг у реальному часі з телефона і ПК Дашборд збирається під задачу без розробника Доступи розмежовані аж до окремого віджета

Схожа задача у вашому бізнесі?

Розкажіть про неї - розберемо процес і повернемось із підходом і оцінкою.

ЦИФРОВІ ПРОДУКТИ БУДЬ-ЯКОЇ СКЛАДНОСТІ

Заплануємо зустріч?

Оберіть зручний час у календарі - і ми детально обговоримо ваш проєкт та можливі рішення.

Ознайомтесь з цінами

Оберіть дату

1/3

Про що буде йти мова

Оберіть тему, послугу або напрямок

Розробка сайту або вебдодатку
2/3

Розкажіть про себе

3/3