Skip to content

Latest commit

 

History

History
464 lines (272 loc) · 18.6 KB

components_common.rst

File metadata and controls

464 lines (272 loc) · 18.6 KB

Общее описание

Однострочное текстовое поле.

_static/Text_Field_Component.png

См. подробное описание Text Field на Form.io

:ref:`См. доработки компонента<text_field_ecos>`

:ref:`См. пример Text Field<sample_text_field_component>`

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

_static/Select_Journal_Component.png

:ref:`См. подробное описание Select Journal<Select_journal>`

:ref:`См. пример Select Journal<sample_select_journal_component>`

Компонент, отвечающий за выбор из оргструктуры пользователей/групп. Что именно будет выбираться (пользователи с группами вместе, или что-то одно), – регулируется внутри компонента.

_static/Select_Orgstruct_Component.png

:ref:`См. подробное описание Select Orgstruct<Select_orgstruct>`

:ref:`См. пример Select Orgstruct<sample_select_orgstruct_component>`

Числовое поле. Может принимать в себя как целочисленные значения, так и с плавающей точкой. Это регулируется внутри компонента.

См. подробное описание Number на Form.io

Поле, отвечающее за отображение даты и времени. Отображение регулируется внутри компонента.

_static/Date_Time_Component.png

См. подробное описание Date/Time на Form.io

:ref:`См. пример Date/Time<sample_date_time_component>`

Аналог Text Field. Многострочное текстовое поле.

_static/Text_Area_Component.png

См. подробное описание Text Area на Form.io

Поле выбора нескольких значений из списка параметров.

_static/Checkbox_Component.png

См. подробное описание Checkbox на Form.io

Поле для ввода значений «День», «Месяц» и «Год» с использованием числа или выбора типа поля.

См. подробное описание Day на Form.io

Поле, отвечающее за выбор из списка. Основан на стандартном formio-компоненте Select, был модифицирован.

_static/ECOS_Select_Component.png

:ref:`См. подробное описание Ecos Select<ecos_select>`

:ref:`См. пример Ecos Select<sample_ecos_select_component>`

Добавление кнопок для выполнения различных действий в форме.

_static/Button_Component.png

См. подробное описание Button на Form.io

:ref:`См. пример Button<sample_button_component>`

Однострочное текстовое поле.

Для выбора языка предусмотрен переключатель в виде флага России /США. После выбора языка в поле вводится текст.

Сохраняются оба введенных зачения.

Если поле содержит постфикс ML и является объектом (содержит ключ EN/RU), то элемент отрисовывается.

_static/ML_Text_Component.png

Поддержка ML text реализована для поля "Название поля", "Подсказка" всех компонент редактора форм, так же для поля "Контент" компонента Html Component, "Название свойства" компонента Panel Component.

Компонент позволяет отображать выбранные значения в виде таблицы.

:ref:`См. подробное описание Table Form<table_form>`

Компонент для автоматической отрисовки кнопок для форм задач.

В настройках кейса для "Пользовательской задачи" если заполнено поле "Варианты результатов", то должны создаваться кнопки действий согласно статье ...

Важно чтобы соблюдался порядок кнопок: слева серым цветом отрицательные действия, справа положительные синим цветом.

Пример такой формы - wfcperformTask, это стандартная форма в которой список действий указывается только в свойстве "Варианты результатов".

Кнопки могут быть без надписи.

Добавлена возможность указать позитивный/негативный тип действия кнопки ccc^n|Отмена#alf#bbb^p|Согласовать - p - позитивный (по умолчанию, можно не указывать) - n - негативный

Кнопки сортируются по типу действия - сначала позитивные, потом негативные

Компонент позволяет добавить на форму настраиваемую кнопку для загрузки файлов.

:ref:`См. подробное описание Import Button<import_button>`

Компонент для настройки ввода электронной почты.

См. подробное описание Email на Form.io

Компонент имеет настраиваемый параметр проверки, который, если он настроен правильно, может гарантировать, что введенное значение является допустимым URL-адресом.

См. подробное описание URL на Form.io

Компонент можно использовать для ввода номеров телефонов в форму.

См. подробное описание Phone Number на Form.io

Cпециальный компонент, выполняющий поиск введенных адресов.

См. подробное описание Address Field на Form.io

Многострочное текстовое поле для ввода на русском/анлийском языках.

Для выбора языка предусмотрен переключатель в виде флага России /США. После выбора языка вводится в поле вводится текст.

Сохраняются оба введенных зачения.

Если поле содержит постфикс ML и является объектом (содержитключ EN/RU), то элемент отрисовывается.

Компонент может быть добавлен в форму для отображения одного элемента HTML.

_static/HTML_Element_Component.png

См. подробное описание HTML Element на Form.io

Компонент для загрузки файлов.

_static/File_Component.png

См. подробное описание File на Form.io

:ref:`См. подробное описание File <file>`

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

См. подробное описание Select Action на Form.io

Компонент для отображения разделителя блоков.

:ref:`См. подробное описание Horizontal Line<horizontal_line>`

Компонент, отвечающий за разделение формы на столбцы. Основан на стандартном formio-компоненте Columns, был модифицирован.

_static/Columns_Component.png

_static/Columns_Component_1.png

_static/Columns_Component_form.png

См. подробное описание Columns на Form.io

:ref:`См. подробное описание Columns<columns>`

:ref:`См. пример Columns<sample_columns_component>`

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

_static/Panel_Component.png

См. подробное описание Panel на Form.io

:ref:`См. пример Panel<sample_panel_component>`

Компонент позволяет создать таблицу со столбцами и строками.

_static/Select_Journal_Component.png

См. подробное описание Table на Form.io

Компонент твечает за вкладки на форме. Вкладка скрывается, когда на ней все компоненты скрыты, либо компонентов нет совсем.

См. подробное описание Tabs на Form.io

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

См. подробное описание Hidden на Form.io

Невидимый компонент для загрузки асинхронных данных.

_static/Async_Data_Component.png

:ref:`м. подробное описание Async Data<async_data>`

:ref:`См. пример Async Data<sample_async_data_component>`

Компонент для включения одной формы в другие.

В свойствах одно поле - formRef с выбором из журнала форм (ecos-forms).

Внеший вид в билдере (как у компонента Hidden, но имя формируется по шаблону "Форма: имя_формы").

Вариант на английском: Form: form_name

где form_name и имя_формы - это атрибут "?disp" выбраной формы. Если форма не выбрана, то пишется No form (Нет формы)

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

_static/Include_Form_Component.png

Оболочка для набора полей, аналогичная Field Set.

_static/Container_Component.png

Компонент управления отображением данных, основанный на использовании Bootstrap Grid.

Система Bootstrap Grid нужна для разметки страницы, в частности, для создания адаптивных макетов.

Фреймворк определяет 5 уровней адаптивности (брейкпоинтов), которые основаны на ширине области просмотра:

  • xs — extra small, супермаленький — ширина < 576px (это уровень по умолчанию);
  • sm — small, маленький — ширина ≥ 576px;
  • md — medium, средний — ширина ≥ 768px;
  • lg — large, большой — ширина ≥ 992px;
  • xl — extra large, супербольшой — ширина ≥ 1200px.

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

Основные правила сетки в Bootstrap:

  • колонки находятся строго внутри ряда на первом уровне вложенности;
  • ряды нужны только для размещения колонок;
  • ряды должны располагаться внутри контейнера.

Ряды и колонки всегда работают вместе, их нельзя разделять.

Элемент с классом .container является корневым блоком сетки в Bootstrap, то есть располагается на внешнем уровне. Контейнер подходит для хранения любых элементов, а не только рядов и колонок.

Внутри ряда должны находиться только колонки, а контент – уже внутри них.

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

Классическая Bootstrap-сетка состоит из 12 колонок.

В большинстве случаев, не требуется использование всех, их можно объединять по мере надобности. Представьте, что вся область просмотра разделена на 12 равных частей – единиц ширины. В одной колонке может быть от 1 до 12 таких единиц.

См. подробное описание Bootstrap Grid system

См. подробное описание Container на Form.io

Компонент управления отображением данных, который извлекает информацию из коллекции объектов и визуализирует ее в сетке со строками и ячейками. Каждая строка соответствует отдельному объекту, а каждый столбец — свойству в этом объекте.

_static/Data_Grid_Component.png

См. подробное описание Data Grid на Form.io

Компонент управления отображением данных.

Компонент позволяет пользователям создавать пары ключ/значение.

См. подробное описание Data Map на Form.io