devexpress-reporting
Version:
DevExpress Reporting provides the capability to develop a reporting application to create and customize reports.
122 lines (121 loc) • 6.04 kB
JavaScript
/**
* DevExpress HTML/JS Reporting (designer\tools\dialogs\editParametersDialog.js)
* Version: 24.2.6
* Build date: Mar 18, 2025
* Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED
* License: https://www.devexpress.com/Support/EULAs/universal.xml
*/
import { getLocalization } from '@devexpress/analytics-core/analytics-internal';
import * as ko from 'knockout';
import { GroupLayoutItem, SeparatorLayoutItem } from '../../dataObjects/parameters/layoutItems';
import { ParametersLayoutItemsProvider } from '../../internal/parameterLayout/_parametersLayoutItemsProvider';
import { ParametersLayoutTreeListController } from '../../internal/parameterLayout/_parametersLayoutTreeListController';
import { ParametersDialogBase } from './parametersDialogs';
export class EditParametersDialog extends ParametersDialogBase {
dispose() {
super.dispose();
this.fieldListModel = null;
}
constructor(report) {
super(report);
this.buttonMap = {
'addGroup': { text: 'Add Group', localizationId: 'ReportStringId.ParameterCollectionEditorForm_AddGroup' },
'addParameter': { text: 'Add Parameter', localizationId: 'ReportStringId.ParameterCollectionEditorForm_AddParameter' },
'addSeparator': { text: 'Add Separator', localizationId: 'ReportStringId.ParameterCollectionEditorForm_AddSeparator' },
'down': { text: 'Move Down', localizationId: 'AnalyticsCoreStringId.Cmd_MoveDown' },
'up': { text: 'Move Up', localizationId: 'AnalyticsCoreStringId.Cmd_MoveUp' }
};
this.addButtons = [];
this.moveButtons = [];
this.width = 'auto';
this.height = 726;
this.popupCss = 'dxrd-parameters-edit-dialog';
this.title = getLocalization('Edit Parameters', 'ASPxReportsStringId.ReportDesigner_ParametersDialog_EditParameters');
this.contentEmptyAreaPlaceHolder = getLocalization('Add items to configure report parameters and parameter panel layout', 'ReportStringId.ParameterCollectionEditorForm_EmptyViewPlaceHolder');
this.contentNoPropertiesPlaceHolder = getLocalization('This item has no configurable properties', 'ReportStringId.ParameterCollectionEditorForm_SeparatorViewPlaceHolder');
this.contentTemplate = 'dxrd-parameters-content';
this.selectedPath = ko.observable('');
this._disposables.push(this.contentVisible = ko.computed(() => {
return this._currentReport.parameterPanelLayoutItems().length > 0 && !!this._selectedItem();
}), this.hasNoEditableProperties = ko.pureComputed(() => {
return this._selectedItem() && this._selectedItem() instanceof SeparatorLayoutItem;
}));
const _parameterEditingSettings = report.parameterHelper._parameterEditingSettings;
this._disposables.push(this.itemsProvider = new ParametersLayoutItemsProvider(this._currentReport, this._selectedItem));
this._disposables.push(this.treeListController = new ParametersLayoutTreeListController(this._currentReport, this._selectedItem, _parameterEditingSettings));
this.fieldListModel = {
itemsProvider: this.itemsProvider,
treeListController: this.treeListController,
selectedPath: this.itemsProvider.selectedPath,
expandRootItems: true,
onItemsChanged: (items) => {
items.forEach(item => {
item.parent.collapsed = false;
});
}
};
this.addButtons.push({
onClick: () => this.addParameter(),
icon: 'dxrd-svg-actions-add_parameter',
iconClass: 'dx-image-add-parameter',
name: 'addParameter',
visible: _parameterEditingSettings.allowEditParameterCollection,
title: this.getDisplayTextButton('addParameter')
}, {
onClick: () => this.addGroup(),
icon: 'dxrd-svg-actions-add_group',
iconClass: 'dx-image-add-group',
name: 'addGroup',
visible: _parameterEditingSettings.allowEditParameterGroups,
title: this.getDisplayTextButton('addGroup')
}, {
onClick: () => this.addSeparator(),
icon: 'dxrd-svg-actions-add_separator',
iconClass: 'dx-image-add-separator',
name: 'addSeparator',
title: this.getDisplayTextButton('addSeparator'),
visible: _parameterEditingSettings.allowEditParameterSeparators
});
this.moveButtons.push({
onClick: () => this.up(),
icon: 'dxrd-svg-operations-moveup',
iconClass: 'dx-image-moveup',
name: 'up',
title: this.getDisplayTextButton('up'),
visible: _parameterEditingSettings.allowReorderParameters
}, {
onClick: () => this.down(),
icon: 'dxrd-svg-operations-movedown',
iconClass: 'dx-image-movedown',
name: 'down',
title: this.getDisplayTextButton('down'),
visible: _parameterEditingSettings.allowReorderParameters,
});
}
getDisplayTextButton(key) {
return getLocalization(this.buttonMap[key].text, this.buttonMap[key].localizationId);
}
up() {
this.treeListController.move(true);
}
down() {
this.treeListController.move(false);
}
addGroup() {
this.treeListController.addItem(new GroupLayoutItem({}, this._currentReport, null));
}
addSeparator() {
this.treeListController.addItem(new SeparatorLayoutItem({}, this._currentReport, null));
}
addParameter() {
const parameterItem = this._createParameter();
this.treeListController.addItem(parameterItem);
this._currentReport.parameters.push(parameterItem.parameter());
}
isDisabledButton(buttonName) {
if (buttonName === 'up' || buttonName === 'down')
return !this.contentVisible();
return false;
}
onSubmit() { }
}