Открытие панели отчетов

Для открытия панели отчетов предназначен контрол-опенер Layout/report:Opener. В следующем примере открытие панели происходит при клике по кнопке "Построить отчет".

Рассмотрим последовательность конфигурации контрола-опенера для открытия панели отчетов.

В опции reportTemplate задайте имя шаблона панели отчетов. Подробнее о настройке такого шаблона читайте здесь.

<!-- WML -->
<Layout.report:Opener
    reportTemplate="Engine-demo/Report"/>

В опции filterOptions задайте настройку фильтров. В опцию передают объект с двумя обязательными свойствами:

• items — конфигурация структуры фильтров. Настройка выполняется аналогично объединенному фильтр.
• itemTemplate — объект со свойством templateName, которое принимает имя пользовательского шаблона отображения фильтров. Настройка такого шаблона выполняется аналогично объединенному фильтру.

<!-- WML -->
<Layout.report:Opener
    filterOptions="{{_componentOptions}}"
    reportTemplate="Engine-demo/Report" />

// JavaScript
_beforeMount: function() {
    this._componentOptions = {
        items: [{
            id: 'owner',
            resetValue: '0',
            value: '0',
            textValue: '',
            source: new sourceLib.Memory({
                data: [
                    { id: 0, title: 'По ответственному', owner: '0' },
                    { id: 1, title: 'Новиков Д.В.', owner: 'Новиков Д.В.' }
                ],
                keyProperty: 'owner'
            })
        }],
        itemTemplate: {
            templateName: 'Engine-demo/Report/resources/filterPanelItemsTemplate'
        }
    }
};

<!-- Engine-demo/Report/resources/filterPanelItemsTemplate.wml -->
<ws:template name="owner">
    <Controls.source:SelectedKey bind:selectedKey="item.value">
        <Controls.filterPopup:Dropdown
                source="{{item.source}}"
                keyProperty="owner"
                bind:textValue="item.textValue"
                on:selectedKeysChanged="_selectedKeysChanged()"
                displayProperty="title"/>
    </Controls.source:SelectedKey>
</ws:template>

<ws:partial template="{{_options.item.name}}" item="{{_options.item}}" departSource="{{_departSource}}"/>

В опции name задайте имя контрола, чтобы к нему можно было получить доступ из кода как к дочернему контролу.

<!-- WML -->
<Layout.report:Opener
    name="reportOpener"
    filterOptions="{{_componentOptions}}"
    reportTemplate="Engine-demo/Report" />

Для открытия панели отчетов вызовите метод open(). Это можно выполнить, например, в обработчике клика по кнопке Controls/buttons:Button.

<!-- WML -->
<div>
    <Controls.buttons:Button
        caption="Построить отчет"
        on:click="_openReport()" />

    <Layout.report:Opener
        name="reportOpener"
        filterOptions="{{_componentOptions}}"
        reportTemplate="Engine-demo/Report" />
</div>

// JavaScript
_openReport: function() {
   this._children.reportOpener.open();
},

Изменение конфигурации панели отчетов при открытии

При открытии панели отчетов можно изменить конфигурацию самой панели. Для этого необходимо при вызове метода open() передать в первом аргументе объект с новой конфигурацией панели.

// JavaScript
_openDialog(): function() {
    var templateOptions = {
        caption: 'My Report'
    };
    this._children.reportOpener.open(templateOptions);
}