Конструктор обложек для папок СУД Directum

в 6-10 раз

увеличение скорости создания/доработки обложки

24 000

пользователей в системе

Задача

Ежегодно в ПАО «Сургутнефтегаз» создается большое количество общих папок, для многих из которых требуется обложка. Обложка – это удобный интерфейс для пользователей по работе с компонентами СУД Directum.

Процесс разработки обложек в ПАО «Сургутнефтегаз», в упрощенном виде, состоит из следующих этапов:

  1. Заказчик ставит задачу по созданию/доработке обложки с описанием требований к будущей обложке и ее функционалу.
  2. Проектировщик формализует требования заказчика, составляет схему обложки и пишет Техническое задание (ТЗ).
  3. Программист, в соответствии с требованиями ТЗ, разрабатывает обложку, кодируя её на четырех языках. На двух языках программирования: JavaScript, ISBL. И на двух языках гипертекстовой разметки: HTML, CSS.

Количество разработок и доработок обложек в СУД Directum ПАО «Сургутнефтегаз» достигает 35 и более штук в год. Для автоматизации данного процесса был разработан конструктор обложек.

Описание и возможности решения

Работа в конструкторе происходит следующим образом. Разработчик обложки в конструкторе визуально выстраивает из предопределенных блоков структуру будущей обложки. Производит настройку параметров обложки и каждого блока. Далее разработчик нажимает на кнопку «Сгенерировать код обложки», после чего конструктор автоматически генерирует HTML, CSS, JavaScript и ISBL код обложки.

Рисунок 1. Конструктор обложек для СУД Directum

Рисунок 2. Конструктор HTML-форм

Более подробно процесс описан в инструкции к конструктору обложек, а также в демонстрационном видеоролике.

В большинстве случаев, не потребуется знаний языков HTML, CSS, JavaScript. Код будет сгенерирован автоматически.
Таким образом, обложку в конструкторе может разработать специалист, не владеющий соответствующими языками программирования и гипертекстовой разметки. Например, проектировщик сможет создать или изменить обложку, не привлекая к данной работе программистов.

Прикреплен файл: Инструкция.docx

Результаты применения решения

Значительно сокращается время на описание требований к обложке заказчиком и составление Технического задания проектировщиком. Отпадает необходимость в прорисовке схем в графическом редакторе для формулировки задачи. Достаточно создать прототип в конструкторе.

В результате автоматизации процесса разработки обложек при помощи конструктора время на их создание/доработку сокращается в 6-10 раз. Если учитывать время программистов, проектировщиков и заказчиков, то экономия составляет до 300 и более человека-часов в год.

Немаловажно, что при разработке обложки уменьшается вероятность логических и синтаксических ошибок в программном коде за счет стандартизации формирования программного кода в соответствии с утвержденными требованиями разработки.

Рисунок 3. Готовая обложка в конструкторе

Рисунок 4. Сгенерированный HTML код обложки

Рисунок 5. Сгенерированные шаблоны ISBL, JS кода обложки

Рисунок 6. Готовая обложка в СУД Directum

Использованные технологии и технические особенности

Конструктор был написан на языке JavaScript с использованием фреймворка React и JavaScript-библиотеки Redux. Так как в процессе создания обложки в конструкторе добавляются/перемещаются/удаляются блоки (составные элементы обложки), соответственно происходит постоянное динамическое изменение DOM-дерева (Document Object Model) html-документа. Для более удобной работы с DOM-деревом необходимо использование хранилища состояний приложения. Для этого хорошо подошла библиотека Redux. По сути, конструктор обложек – это SPA (Single Page Application) приложение, но без серверной части. Поэтому, наиболее оптимальным решением для разработки конструктора было использование связки React-Redux.

Преимуществом данного подхода является то, что для начала работы в конструкторе не требуется никакой установки ПО. Конструктор доступен для запуска из обложки папки «Конструктор обложек» в СУД Directum. Также имеется портативная версия конструктора. Достаточно скачать папку с конструктором на свой ПК и запустить файл index.html. Конструктор будет работать в любом современном браузере. Занимает он всего 3,5 мегабайта памяти на жестком диске. Подключение к интернету для его работы не требуется.

Перспективы развития решения

На текущий момент первая версия конструктора обложек разработана и используется по прямому назначению в компании ПАО «Сургутнефтегаз».

В будущем планируется создание второй версии конструктора, в которой будет возможность сохранять уже собранные ранее в конструкторе обложки, а также возможность автоматической сборки и добавления собранной в конструкторе обложки в папку СУД Directum путем нажатия одной кнопки.

Команда

Проектирование, разработка, внедрение:
Смирнов Андрей Евгеньевич

 

7
44
Авторизуйтесь, чтобы оценить материал.
Утверждено

У вас похожая задача?

Обсудите реализацию с экспертом Directum

Обязательное поле
Обязательное поле
Обязательное поле
Обязательное поле
Обязательное поле
Обязательное поле

Благодарим за интерес! Мы свяжемся с вами.

Комментарии (2)

Добрый день. 
Очень интересное решение, визуально удобное и простое для кастомизации. 

Есть момент: 
"Разработчик обложки в конструкторе визуально выстраивает из предопределенных блоков структуру будущей обложки.", если "Проектировщик формализует требования заказчика, составляет схему обложки", то почему с таким понятным конструктором, сам проектировщик не может накидать блоки на обложку, полагаю это бы ускорило процесс и избавило от лишнего блока работ. Тем более, что есть версия не требующая наличия клиента система (как я понял из описания про портативную версию), что несомненно даёт удобство для проектировщика.

Так же думаю стоит рассмотреть возможность создания набора виджетов, которые можно добавить на обложку, для контроля за объектами системы, рабочей нагрузки и т.д.

Очень здорово, что предусмотрели разделение обработки элементов системы от основного "скелета" конструктора, полагаю это сильно упростит работы, при желании переработки этого решения под Directum RX.

Андрей Смирнов

Александр, спасибо за комментарий.

Да, действительно, с помощью конструктора для простой обложки проектировщик сам может создать обложку в конструкторе. Но бывают обложки с довольно сложной логикой, когда необходима дополнительная разработка JS-скриптов и ISBL-сценариев. В этом случае обложку в конструкторе реализует разработчик.

Одной из причин разделения обработки, действительно, было предоставление возможности модернизации конструктора под Directum RX.

Набор виджетов - интересное предложение. Возможно, будет реализовано в ПАО «Сургутнефтегаз» после перехода на Directum RX.

 

Андрей Смирнов: обновлено 09.04.2021 в 19:09
Авторизуйтесь, чтобы написать комментарий