Работа с формами / Вычисления на формах

Вычисления на формах

Для клиентских сценариев на формах есть множество различных применений. В этой статье речь пойдет о том, как автоматизировать вычисления.

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

Для настройки такого функционала, создадим приложение Заказы со свойствами Стоимость (cost), Процент скидки (discount) и Итоговая стоимость (total_cost).

01.PNG

В расширенном режиме настройки формы, добавим форму создания:

02.PNG

На форме будем использовать виджет Код, со следующим сценарием:

<%
Scripts.calcTotal = function () {
    Context.data.total_cost = Context.fields.total_cost
    .create(Context.data.discount ? Context.data.cost.asFloat() - (Context.data.cost.asFloat()*(Context.data.discount / 100)) : Context.data.cost.asFloat());
}
%>
<%= UI.widget.contextRow('__name') %>
<%= UI.widget.contextRow('cost', { onChange: Scripts.calcTotal }) %>
<%= UI.widget.contextRow('discount', { onChange: Scripts.calcTotal }) %>
<%= UI.widget.contextRow('total_cost', { readonly: true }) %>

Обратите внимание, что в данном сценарии мы работаем с типом Деньги,  поэтому для записи результата используется метод поля create.

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

03.gif

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

На форму приложения Заказы добавим свойство типа Приложение (product), которое будет ссылаться на перечень товаров. В виджете Код напишем сценарий:

<%
Scripts.calculation = function () {
    Context.data.product.fetch()
    .then(item => {
        Context.data.total_cost = Context.fields.total_cost
        .create(Context.data.discount ? item.data.price.asFloat() - (item.data.price.asFloat() * (Context.data.discount / 100)) : item.data.price.asFloat());
    });
}
%>
<%= UI.widget.contextRow('__name') %>
<%= UI.widget.contextRow('product', { onChange: Scripts.calculation }) %>
<%= UI.widget.contextRow('discount', { onChange: Scripts.calculation }) %>
<%= UI.widget.contextRow('total_cost', { readonly: true }) %>

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

04.gif