Commit df7b2bb7 authored by Valentin Skripnikov's avatar Valentin Skripnikov

-

parent dbfb2a4c
Внешние модули-компоненты (ВМК) Внешние модули-компоненты (ВМК)
=============================== ===============================
Интеграция с помощью внешнего-модуля компонента предназначена для добавления Механизм внешнего-модуля компонента предназначена для добавления
или замены каких-либо элементов пользовательского web-интерфейса ARTA Synergy. или замены каких-либо элементов пользовательского web-интерфейса ARTA Synergy.
Для этого необходимо описать пользовательский компонент, который и будет Для этого необходимо описать пользовательский компонент, который и будет
служить внешним модулем-компонентом, а затем указать для него место размещения служить внешним модулем-компонентом, а затем указать для него место размещения
и способ вставки. в интерфейсе (GUI) и способ вставки.
Добавление ВМК Добавление ВМК
-------------- --------------
Для настройки пользовательских компонентов методологу нужно во вкладке Для настройки пользовательских компонентов необходимо во вкладке
"Процессы" конфигуратора выбрать пункт "Пользовательские компоненты". "Процессы" конфигуратора выбрать пункт "Пользовательские компоненты".
![Пользовательские компоненты](resources/img/integration/user-component.png) .. figure:: _static/img/extcmp/extcmp-1.png
Пользовательские компоненты
Настройка пользовательских компонентов включает в себя настройку следующих Настройка пользовательских компонентов включает в себя настройку следующих
полей: полей:
* "Название" - название пользовательского компонента, является обязательным * **"Название"** - название пользовательского компонента, является обязательным
полем; полем;
* **"Код"** - название пользовательского компонента, является обязательным
* "Исходный код" - код компонента, написанный на `HTML/CSS`. Можно также полем;
добавить сюда и код на `javascript`, но делать этого не рекомендуется, * **"Использовать в формах"** - данная опция позволяет использовать компонент
т.к. для `js` вызывать функции отсюда будет сложнее. Для написания в формах (в качестве пользовательского компонента);
скрипта следует использовать поле "Исходный код скрипта"; * **"HTML код"** - HTML код(в том числе CSS), который будет вставлен в страницу
ARTA Synergy;
* "Исходный код скрипта" - код скрипта, написанный на `javascript`, с * **"JAVASCRIPT код"** - основной код компонента на JavaScript, который будет
помощью которого можно настроить содержимое компонента, обратившись вставлен в страницу ARTA Synergy.
к существующим в системе API, описание которых можно посмотреть в
[javadoc](../javadoc) и воспользовавшись возможностью обработать .. attention:: Начиная с версии Synergy 3.14, все пользовательские скрипты
необходимые клиентские события. Для этого нужно вызвать функцию
`$EVENT_BUS.subscribe()` и указать ей в качестве параметров необходимое
событие и функцию, которую это событие обрабатывает.
> `$EVENT_BUS.subscribe(new EventHandler`
> `('WORK_USERS_CHANGED', handlerUsersSelected));`
Также объект `EVENT_BUS` позволяет отписываться от событий и создавать
новые. Для возможности указания новых событий необходимо обратиться
к центру решений.
.. warning:: Начиная с версии Synergy 3.14, все пользовательские скрипты
выполняются с добавлением директивы `use strict`. Эта директива выполняются с добавлением директивы `use strict`. Эта директива
означает, что соответствующий ей код будет выполнятся в так означает, что соответствующий ей код будет выполнятся в так
называемом **"строгом режиме"**, поддерживающем стандарт `JavaScript` называемом **"строгом режиме"**, поддерживающем стандарт JavaScript
`ECMAScript5 <http://www.ecma-international.org/publications/standards/Ecma-262.htm>`_. `ECMAScript5 <http://www.ecma-international.org/publications/standards/Ecma-262.htm>`_.
>> **Примечание:** .. warning:: Если код скрипта содержит конструкции, не соответствующие стандарту ES5,
то они не будут выполняться. Это не является ошибкой Synergy.
>> Если код скрипта содержит конструкции, не соответствующие стандарту ES5,
то они не будут выполняться. Это не является ошибкой Synergy.
**Использование пользовательских компонентов как полей формы**
В общем случае пользовательские компоненты не участвуют в местах,
где могут использоваться какие-либо другие компоненты формы:
- отсутствует в полях формы реестра;
- отсутствует в фильтрах реестра;
- не учитывается при поиске в реестре;
- не участвует в сортировке реестра;
- отсутствует во всех видах сопоставлений;
- не учитывается во всех спец.процессах (например, в условном
переходе).
Для того, чтобы пользователький компонент присутствовал в
сопоставлениях, необходимо, чтобы в его модели были реализованы
методы `setAsfData` и `getAsfData` (см.
["Создание нового компонента"](#integration.methods.form_scripting.new_user_component)),
а также чтобы возвращалась структура компонента вида:
```
{
"id": "id",
"type": "type",
"value": "value",
"key": "key"
}
```
Для снятия остальных ограничений достаточно реализации метода
`getAsfData` и корректности возвращаемой структуры.
**Пример:** **Пример:**
В качестве примера расмотрим реализацию пользовательского компонента "Load info", В качестве примера рассмотрим реализацию пользовательского компонента "Load info",
который показывает перегруженных сотрудников при создании работы (данный который показывает перегруженных сотрудников при создании работы (данный
компонент входит в стандартную поставку Synergy). компонент входит в стандартную поставку Synergy).
Итерационные задачи по реализации:
[0193: Компонент предупреждение о перегрузке](../../../../additional/statements/2/html/t0193.html)
Исходный код содержит следующий простой `HTML` код: Исходный код содержит следующий простой `HTML` код:
```xml .. code-block:: xml
<!-- Определим добавляемый элемент, указав для него необходимый стиль. -->
<span id = "workloadLable" style="color:red; padding-top: 10px"> </span> <!-- Определим добавляемый элемент, указав для него необходимый стиль. -->
<!-- За содержимое элемента будет отвечать исходный код скрипта. --> <span id = "workloadLable" style="color:red; padding-top: 10px"> </span>
``` <!-- За содержимое элемента будет отвечать исходный код скрипта. -->
Исходный код скрипта устроен более сложным образом. Рассмотрим реализацию Исходный код скрипта устроен более сложным образом. Рассмотрим реализацию
функции получающей данные из `api`: функции получающей данные посредством вызова REST API:
```javascript .. code-block:: javascript
function ajaxUserWL(ar){
function ajaxUserWL(ar){
// Функция filtrAr() исключает из массива повторения пользователей. // Функция filtrAr() исключает из массива повторения пользователей.
ar = filtreAr(ar); ar = filtreAr(ar);
...@@ -157,31 +108,28 @@ function ajaxUserWL(ar){ ...@@ -157,31 +108,28 @@ function ajaxUserWL(ar){
overloadUsers(res); overloadUsers(res);
} }
}); });
} }
```
Итерационные задачи по реализации:
[0195: API получения нагрузки](../../../../additional/statements/2/html/t0195.html)
**Замечание:**
> Полную реализацию компонента можно посмотреть в настройках пользовательских .. note:: Полную реализацию компонента можно посмотреть в настройках пользовательских
> компонентов, выбрав компонент "Load info". компонентов, выбрав компонент "Load info".
**Замечание:** .. **Замечание:**
> Для API, находящихся по `URL` rest/%api/method%, авторизация будет происходить Для API, находящихся по `URL` rest/%api/method%, авторизация будет происходить
> по куки (как в браузере), поэтому его можно вызывать авторизованному в Synergy по куки (как в браузере), поэтому его можно вызывать авторизованному в Synergy
> пользователю. Для API, находящихся по другим адресам `URL`, необходимо пользователю. Для API, находящихся по другим адресам `URL`, необходимо
> настроить процесс авторизации (см. [Способы авторизации](#integration.auth)). настроить процесс авторизации (см. [Способы авторизации](#integration.auth)).
> Сделать это можно например так: вызвать API по адресу Сделать это можно например так: вызвать API по адресу
> `https://%логин%:%пароль%@%адрес/метода/api%` `https://%логин%:%пароль%@%адрес/метода/api%`
Для того, чтобы выбрать, где использовать пользовательский компонент, методологу Для того, чтобы выбрать, где использовать пользовательский компонент,
необходимо во вкладке "Процессы" выбрать пункт "Внешние модули-компоненты" необходимо во вкладке "Процессы" выбрать пункт "Внешние модули-компоненты"
и добавить новый внешний модуль-компонент. и добавить новый внешний модуль-компонент.
![Внешние модули-компоненты](resources/img/integration/vmk.png) .. figure:: _static/img/extcmp/extcmp-2.png
Внешние модули-компоненты
Настройка внешнего модуля-компонента включает в себя настройку следующих полей: Настройка внешнего модуля-компонента включает в себя настройку следующих полей:
...@@ -189,8 +137,8 @@ function ajaxUserWL(ar){ ...@@ -189,8 +137,8 @@ function ajaxUserWL(ar){
полем; полем;
* "Место размещения" - выбрать один из доступных вариантов для указания * "Место размещения" - выбрать один из доступных вариантов для указания
места, в котором будет находиться пользовательский компонент. На данный места, в котором будет находиться пользовательский компонент. На данный
момент доступны следующие альтернативы: момент доступны следующие альтернативы:
+ "onLoad" - пользовательский компонент будет выводиться при загрузке + "onLoad" - пользовательский компонент будет выводиться при загрузке
приложения; приложения;
+ "Depricated" - место, используемое для вывода пользовательских + "Depricated" - место, используемое для вывода пользовательских
...@@ -213,7 +161,8 @@ function ajaxUserWL(ar){ ...@@ -213,7 +161,8 @@ function ajaxUserWL(ar){
помещается пользовательский тег (замена всех потомков тега места размещения). помещается пользовательский тег (замена всех потомков тега места размещения).
#### События для ВМК {#integration.methods.user-component.events} События для ВМК
---------------
Для работы ВМК в Synergy реализована отправка событий в JS EventBus. Для работы ВМК в Synergy реализована отправка событий в JS EventBus.
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment