Структура приложения
Структура приложения (<application>)#
Тип метаданных
application
Библиотека компонентов
http://n2oapp.net/framework/config/schema/application-1.0Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| navigation-layout | Строка | Макет отображения элементов управления. Возможные значения: fullSizeHeader - заголовок во всю ширину экрана fullSizeSidebar - боковая панель во всю высоту экрана | fullSizeHeader |
| navigation-layout-fixed | Boolean | Зафиксированы ли header и sidebar | false |
| welcome-page-id | Строка | Ссылка на страницу, которая открывается по root(/) |
Пример
<?xml version='1.0' encoding='UTF-8'?><application xmlns="http://n2oapp.net/framework/config/schema/application-1.0" navigation-layout="fullSizeSidebar" navigation-layout-fixed="true" welcome-page-id="index"> <header>...</header> <sidebar>...</sidebar> <footer>...</footer></application>Тело
Шапка(header), боковая панель, подвал(footer)
Шапка (<header>)#
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | React компонент | Реализация шапки | Header |
| title | Строка | Заголовок шапки | |
| style | CSS свойства | Стиль шапки | |
| class | CSS класс | CSS класс шапки | |
| visible | Boolean | Видимость шапки | true |
| logo-src | Строка | Путь к файлу с логотипом, который будет отображаться в шапке | true |
| 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-1.0"> <header title="N2O"> <nav>...</nav> <extra-menu>...</extra-menu> <search>...</search> </header></application>Боковая панель (<sidebar>)#
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | React компонент | Реализация боковой панели | Sidebar |
| title | Строка | Название в заголовке боковой панели | |
| style | CSS свойства | Список CSS свойств | |
| class | CSS класс | CSS класс боковой панели | |
| visible | Boolean | Видимость боковой панели | 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 |
| toggled-state | Строка | Состояние боковой панели принимаемое при нажатии на кнопку toggle-sidebar, которую можно добавить в меню заголовка приложения. Возможные значения: none - скрыт полностью micro - отображается тонкая полоска mini - отображаются только иконки maxi - широкая боковая панель | maxi |
| toggle-on-hover | Boolean | Открывается ли панель по hover | false |
| overlay | Boolean | Перекрывает ли боковая панель контент страницы | true |
Пример
<?xml version='1.0' encoding='UTF-8'?><application xmlns="http://n2oapp.net/framework/config/schema/application-1.0"> <sidebar title="N2O"> <nav>...</nav> <extra-menu>...</extra-menu> </sidebar></application>Подвал (<footer>)#
Атрибуты
| Наименование | Тип | Описание | Значение по умолчанию |
|---|---|---|---|
| src | React компонент | Реализация подвала | DefaultFooter |
| style | CSS свойства | Список CSS свойств | |
| class | CSS класс | CSS класс подвала | |
| right-text | Строка | Текст в подвале справа | |
| left-text | Строка | Текст в подвале слева | |
| visible | Boolean | Видимость подвала | true |
Пример
<?xml version='1.0' encoding='UTF-8'?><application xmlns="http://n2oapp.net/framework/config/schema/application-1.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"/>