Структура приложения
Тип метаданных
application
Библиотека компонентов
http://n2oapp.net/framework/config/schema/application-3.0
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
welcome-page-id | Строка | Ссылка на страницу, которая открывается по / | Значение настройки n2o.homepage.id |
navigation-layout | fullSizeHeader fullSizeSidebar | Макет отображения элементов управления.fullSizeHeader - шапка во всю ширину экранаfullSizeSidebar - боковая панель во всю высоту экрана | fullSizeHeader |
navigation-layout-fixed | true false | Фиксация шапки и бокового меню при скролле страницы | false |
Настройки
#Идентификатор домашней страницы
n2o.homepage.id = index
# Макет отображения элементов управления
n2o.application.navigation_layout = fullSizeHeader
# Фиксация шапки и бокового меню при скролле страницы
n2o.application.navigation_layout_fixed = false
Тело
<datasources> - Источники данных приложения
<events> - События
<header> - Шапка
<sidebars> - Боковые панели
<footer> - Подвал
Пример
<?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">
<datasources>...</datasources>
<events>...</events>
<header>...</header>
<sidebars>...</sidebars>
<footer>...</footer>
</application>
<events>
События
Тело
<stomp-event> - Событие, приходящее через STOMP протокол
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<events>
<stomp-event>...</stomp-event>
<stomp-event>...</stomp-event>
</events>
</application>
<header>
Шапка
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
title | Строка | Заголовок шапки. Возможно использование плейсхолдеров | |
datasource | Ссылка на источник данных | Идентификатор источника данных | |
home-page-url | Строка | URL домашней страницы. Переход на нее происходит по клику на логотип или заголовок | |
logo-src | Строка | Путь к файлу с логотипом, который будет отображаться в шапке | |
sidebar-icon | Строка | Иконка открытия боковой панели | |
sidebar-toggled-icon | Строка | Иконка скрытия боковой панели | Значение sidebar-icon |
src | Строка | React компонент шапки | |
class | Строка | CSS класс шапки | |
style | Строка | СSS стиль шапки |
Тело
<nav> - Основное меню
<extra-menu> - Дополнительное меню
<search> - Панель поиска
Пример
<?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>
<search>
Панель поиска
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию | Обязательность |
---|---|---|---|---|
query-id | Ссылка на выборку | Идентификатор выборки, на основе которой происходит получение данных | ! | |
filter-field-id | Строка | Поле выборки, отвечающее за фильтрацию | ||
url-field-id | Строка | Поле выборки, отвечающее за ссылку перехода варианта выбора | ||
label-field-id | Строка | Поле выборки, отвечающее за заголовок варианта выбора | ||
icon-field-id | Строка | Поле выборки, отвечающее за иконку варианта выбора | ||
description-field-id | Строка | Поле выборки, отвечающее за описание варианта выбора | ||
target | application newWindow | Сценарий открытия страницы:newWindow - в новой вкладкеapplication - в текущем приложении | application |
Пример
<search
query-id="popupSearch"
filter-field-id="name"
url-field-id="href"
label-field-id="name"
advanced-target="application"
advanced-url="/search"
advanced-param="q"
/>
<sidebars>
Боковые панели
Тело
<sidebar> - Боковая панель
Пример
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
<sidebars>
<sidebar>...</sidebar>
<sidebar>...</sidebar>
</sidebars>
</application>
<sidebar>
Боковая панель
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
title | Строка | Название в заголовке боковой панели. Возможно использование плейсхолдеров | |
subtitle | Строка | Название в подзаголовке боковой панели. Возможно использование плейсхолдеров | |
side | left right | Сторона появления боковой панели | left |
path | Строка | Путь, по которому будет отображаться боковая панель | |
datasource | Ссылка на источник данных | Идентификатор и сточника данных боковой панели | |
logo-src | Строка | Путь к файлу с логотипом, который будет отображаться в боковой панели | |
logo-class | Строка | CSS класс логотипа боковой панели | |
home-page-url | Строка | URL страницы, переход на которую происходит по клику на логотип или заголовок | |
default-state | none micro mini maxi | Исходное состояние боковой панели:none - скрыта полностьюmicro - отображается тонкая полоскаmini - отображаются только иконкиmaxi - широкая боковая панель | none - если у шапки задан атрибут sidebar-icon или sidebar-toggled-icon maxi - иначе |
toggled-state | none micro mini maxi | Состояние боковой панели принимаемое при нажатии на иконку, задаваемую атрибутом sidebar-toggled-icon шапки :none - скрыта полностьюmicro - отображается тонкая полоскаmini - отображаются только иконкиmaxi - широкая боковая панель | none - если у шапки задан атрибут sidebar-icon или sidebar-toggled-icon mini - если значение default-state="maxi" maxi - иначе |
toggle-on-hover | true false | Открывается ли панель по hover | false |
overlay | true false | Перекрывает ли боковая панель содержимое страницы | false |
src | Строка | React компонент боковой панели | |
class | Строка | CSS класс боковой панели | |
style | Строка | СSS стиль боковой панели | |
ref-id | Строка | Ссылка на родительский файл боковой панели |
Настройки
#Сторона появления боковой панели
n2o.api.sidebar.side = left
#Открывается ли панель по hover
n2o.api.sidebar.toggle_on_hover = false
#Перекрывает ли боковая панель контент страницы
n2o.api.sidebar.overlay = false
Тело
<datasource> - Встроенный источник данных
<nav> - Основное меню
<extra-menu> - Дополнительное меню
Пример
<sidebar title="N2O" path="/person">
<datasource id="ds"/>
<nav>...</nav>
<extra-menu>...</extra-menu>
</sidebar>
<footer>
Подвал
Атрибуты
Наименование | Тип | Описание |
---|---|---|
left-text | Строка | Текст слева |
right-text | Строка | Текст справа |
src | Строка | React компонент подвала |
class | Строка | CSS класс подвала |
style | Строка | СSS стиль подвала |
Пример
<?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>
<menu-item>...</menu-item>
<dropdown-menu>...</dropdown-menu>
</nav>
<extra-menu>
Дополнительное меню
Атрибуты
Наименование | Тип | Описание |
---|---|---|
src | Строка | React компонент меню |
ref-id | Ссылка | Ссылка на родительский файл меню |
Тело
Список элементов меню
Пример
<extra-menu>
<menu-item>...</menu-item>
<dropdown-menu>...</dropdown-menu>
</extra-menu>