Структура приложения
Структура приложения (<application>)
Тип метаданных
application
Библиотека компонентов
http://n2oapp.net/framework/config/schema/application-3.0
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| navigation-layout | Строка | Макет отображения элементов управления. Возможные значения: fullSizeHeader - заголовок во всю ширину экрана fullSizeSidebar - боковая панель во всю высоту экрана | fullSizeHeader |
| navigation-layout-fixed | true false | Зафиксированы ли header и sidebar | false |
| welcome-page-id | Строка | Ссылка на страницу, которая открывается по root(/) |
Настройки
# Макет отображения элементов управления.
n2o.application.navigation_layout=fullSizeHeader
# Зафиксированы ли header и sidebar
n2o.application.navigation_layout_fixed=false
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0"
navigation-layout="fullSizeSidebar" navigation-layout-fixed="true" welcome-page-id="index">
<datasources>...</datasources>
<events>...</events>
<header>...</header>
<sidebars>...</sidebars>
<footer>...</footer>
</application>
Тело
Источники данных, События, Шапка(header), Боковые панели, Подвал(footer)
События (<events>)
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<events>
...
</events>
</application>
Тело
Событие, приходящее через STOMP протокол
Событие, приходящее через STOMP протокол (<stomp-event>)
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| id | Строка | Идентификатор события | |
| destination | Строка | Место назначения |
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<events>
<stomp-event id="ev1" destination="/notifications">
...
</stomp-event>
</events>
</application>
Тело
Шапка (<header>)
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | Строка | React компонент шапки | Header |
| class | CSS класс | Класс компонента шапки | |
| style | CSS свойство | Стиль компонента шапки | |
| title | Строка | Заголовок шапки | |
| visible | true false | Видимость шапки | true |
| logo-src | Строка | Путь к файлу с логотипом, который будет отображаться в шапке | |
| home-page-url | Строка | URL домашней страницы(переход на нее происходит по клику на логотип или название в шапке) | |
| sidebar-icon | Класс иконки | Иконка открытия боковой панели, если не задана, значит кнопки не будет | |
| sidebar-toggled-icon | Класс иконки | Иконка скрытия боковой панели, если не задана, значит кнопки не будет |
Тело
Основное меню, дополнительное меню, строка поиска
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<header title="N2O">
<nav>...</nav>
<extra-menu>...</extra-menu>
<search query-id="q1">...</search>
</header>
</application>
Боковые панели (<sidebars>)
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<sidebars>
...
</sidebars>
</application>
Боковая панель (<sidebar>)
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | Строка | React компонент боковой панели | Sidebar |
| class | CSS класс | Класс компонента боковой панели | |
| style | CSS свойство | Стиль компонента боковой панели | |
| title | Строка | Название в заголовке боковой панели | |
| ref-id | Строка | Ссылка на родительский файл боковой панели | |
| subtitle | Строка | Название в подзаголовке боковой панели | |
| datasource | Ссылка на источник данных | Идентификатор источника данных боковой панели | |
| path | Строка | URL по которому будет отображаться боковая панель | |
| visible | true false | Видимость боковой панели | true |
| side | left right | Сторона появления боковой панели | left |
| welcome-page-id | Ссылка | Ссылка на страницу | |
| logo-src | Строка | Путь к файлу с логотипом, который будет отображаться в заголовке боковой панели | |
| home-page-url | Строка | URL страницы, переход на которую происходит по клику на логотип или название в заголовке боковой панели | |
| logo-class | CSS класс | CSS класс для области с логотипом и названием | |
| default-state | none micro mini maxi | Состояние сайдбара по умолчанию. Возможные значения: none - скрыт полностью micro - отображается тонкая полоска mini - отображаются только иконки maxi - широкая боковая панель | none, если у <header> задан атрибут sidebar-icon или sidebar-toggled-icon, иначе maxi |
| toggled-state | none micro mini maxi | Состояние боковой панели принимаемое при нажатии на кнопку toggle-sidebar, которую можно добавить в меню заголовка приложения с помощью атрибута sidebar-toggled-icon. Возможные значения: none - скрыт полностью micro - отображается тонкая полоска mini - отображаются только иконки maxi - широкая боковая панель | |
| toggle-on-hover | true false | Открывается ли панель по hover | false |
| overlay | true false | Перекрывает ли боковая панель контент страницы | true |
Настройки
#Сторона появления
n2o.api.sidebar.side=left
#Открывается ли панель по hover
n2o.api.sidebar.toggle_on_hover=false
#Перекрывает ли боковая панель контент страницы
n2o.api.sidebar.overlay=false
#Количество записей в боковой панели (число)
n2o.api.sidebar.size=1
Тело
Стандартный источник данных
Навигационная панель
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<sidebars>
<sidebar title="N2O">
<datasource id="ds1"/>
<nav>...</nav>
<extra-menu>...</extra-menu>
</sidebar>
</sidebars>
</application>
Подвал (<footer>)
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | Строка | React компонент подвала | DefaultFooter |
| class | CSS класс | Класс компонента подвала | |
| style | CSS свойство | Стиль компонента подвала | |
| right-text | Строка | Текст в подвале справа | |
| left-text | Строка | Текст в подвале слева | |
| visible | true false | Видимость подвала | true |
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<footer left-text="N2O"/>
</application>
Навигационная панель
<nav>
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | Строка | React компонент меню | |
| ref-id | Ссылка | Ссылка на родительский файл меню |
Тело
Список элементов меню
Пример
<nav>
<a href="http://google.com/"/>
<page page-id="ProtoPage" route="/proto" label="Контакты"/>
<sub-menu>...</sub-menu>
</nav>
<extra-menu>
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | Строка | React компонент шапки | |
| ref-id | Ссылка | Ссылка на родительский файл меню |
Тело
Список элементов меню
Пример
<extra-menu>
<page page-id="ProtoPage" route="/proto" label="Контакты"/>
<a href="http://google.com/"/>
<sub-menu>...</sub-menu>
</extra-menu>
<search>
Панель поиска
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| query-id | Строка | Запрос за данными | |
| filter-field-id | Строка | Идентификатор поля фильтра | |
| url-field-id | Строка | Поле выборки, отвечающее за ссылку перехода на результат поиска | |
| label-field-id | Строка | Поле выборки, отвечающее за заголовок | |
| icon-field-id | Строка | Поле выборки, отвечающее за иконку | |
| description-field-id | Строка | Поле выборки, отвечающее за описание | |
| advanced-target | self newWindow application | Тип сценария открытия ссылки | |
| advanced-url | Строка | Базовый url | |
| advanced-param | Строка | Параметр фильтра |
Пример
<search
query-id="popupSearch"
filter-field-id="filterValue"
url-field-id="href"
label-field-id="label"
icon-field-id="icon"
description-field-id="description"
advanced-target="application"
advanced-url="/search"
advanced-param="q"
/>