Skip to main content

Release notes 7.23

· 4 min read
Игорь Рябов
Игорь Рябов
n2o team

Рад объявить о выходе долгожданного релиза N2O Framework 7.23. Версия получилась настолько крупной, что для добавления всех новых функций пришлось создать новые схемы query-5.0, application-3.0. В этой версии появились различные источники данных, мульти действия с if/else, события изменения данных и много другое.

Browser storage​

Главным нововведением является появление различных источников данных. Например, источник <browser-storage>. Он работает с localStorage и sessionStorage браузера. С его помощью можно сделать полноценное CRUD приложение вообще без использования БД.

Parent datasource​

Больше не нужно пробрасывать кучу параметров через URL. В модальных окнах можно спокойно использовать данные родительской страницы ссылаясь на ее источник данных через <parent-datasource>.

note

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

Application datasource​

Единожды полученные данные можно использовать на разных страницах с помощью источников данных уровня приложения.

<application xmlns="http://n2oapp.net/framework/config/schema/application-3.0">
    <datasources>
        <datasource id="appDs"/>
        ...  <!-- Источники данных в приложении -->
    </datasources>
</application>

Страницы могут ссылаться и работать с данными приложения с помощью <app-datasource>.

<page xmlns="http://n2oapp.net/framework/config/schema/page-4.0">
    <datasources>
        <app-datasource id="appDs"/> <!-- Ссылка на источник данных в приложении -->
    </datasources>

    <regions>
        <form datasource="appDs"/> <!-- Ссылка на app-datasource -->
    </regions>
</page>

Inherited datasource​

Еще одним видом источника данных является <inherited-datasource>. С его помощью можно легко копировать часть данных из других источников, преобразовывая их в удобный для себя вид. Этот источник хорошо подойдет для редактирования записей таблицы в модальном окне. Для этого можно пробросить его на модальную страницу внутри действия <show-modal>.

<show-modal page-id="card">
    <datasources>
        <!-- Копируем в editDs выделенную запись таблицы -->
        <inherited-datasource id="editDs"
                              source-datasource="table"
                              source-model="resolve"/>
    </datasources>
</show-modal>
note

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

С помощью <inheritance-datasource> можно из формы получить данные для нескольких таблиц.

Мульти действия​

При клике по кнопке теперь можно вызвать не одно, а сразу несколько действий. Например, сохранить данные, обновить таблицу и закрыть модально окно:

<button label="Сохранить">
    <invoke operation-id="save"/>
    <refresh datasource="table"/>
    <close/>
</button>

Все действия будут выполняться последовательно. А действия <invoke> будут ожидать успешного завершения.

Можно даже создавать условия ветвления через if/else:

<button label="Отправить">
    <invoke operation-id="send"/>
    <if test="status=='confirmed'">
        <a href="/confirm"/>
    </if>
    <else>
        <close/>
        <alert text="Заявка отклонена!"/>
    </else>
</button>

Или через switch:

<button label="Сохранить">
    <switch value-field-id="type">
        <case value="1">
            <invoke object-id="type1" operation-id="create"/>
        </case>
        <case value="2">
            <invoke object-id="type2" operation-id="update"/>
        </case>
        <default>
            <alert text="Не задан тип операции!"/>
        </default>
    </switch>
</button>

Edit list​

Для редактирования записей таблицы без обращения к бекенду созданы специальные действия <edit-list>. Они отлично подходят, чтобы редактировать "1 к М" записи таблицы в модальном окне до финальной отправки изменений на сервер.

Select options datasource​

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

<select id="genders"
        datasource="genders"/>

Query-5.0​

Появилась новая более удобная схема задания выборок query-5.0. Поля выборки теперь задаются без вложенных элементов, что делает выборки более компактными.

<fields>
    <field id="lastName" mapping="last_name"/>
    <field id="firstName" mapping="first_name"/>
    <field id="middleName" mapping="middle_name"/>
</fields>

Но самое главное, что можно задавать поля внутри списков.

<fields>
    <list id="docs">
        <field id="series" mapping="ser"/>
        <field id="number" mapping="num"/>
    </list>
</fields>

Помимо нового маппинга полей добавились удобные функции нормалайзеров. С помощью них можно делать типовые преобразования данных, например, форматирование по маске:

<field id="phone" normalize="#formatByMask(#this, '# (###) ###-##-##')"/>

Сайдбары теперь могут меняться в зависимости от текущего адреса страницы. Для этого в application-3.0 появился элемент <sidebars>, где можно перечислить несколько сайдбаров задав им разный шаблон адреса в атрибуте path.

 <sidebars>
    <sidebar title="N2O"/> <!-- Дефолтный сайдбар -->
    <sidebar title="Список пользователей" path="/persons/list"/>
    <sidebar title="Профиль пользователя" path="/persons/list/*/profile"/>
    <sidebar title="Остальные страницы пользователей" path="/persons/**"/>
</sidebars>

Data change event​

На странице появился элемент <events>, в котором можно задавать события изменения данных.

 <events>
    <on-change datasource="main" model="resolve" field-id="target">
        ... <!-- Действия -->
    </on-change>
</events>

Что еще​

  • Мы наконец-то добавили валидации в <multi-set>.
  • В таблицах появилось выравнивание контента (alignment)
  • Появился новый компонент <markdown>, в котором можно задавать markdown разметку.
  • Можно вывести несколько алертов, и все они будут выводиться в стеке.

Полезные ссылки​