Открытие панели отчетов
Для открытия панели отчетов предназначен контрол-опенер 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);
}