@progress/telerik-angular-native-report-viewer
Version:
Progress® Telerik® Native Report Viewer for Angular
909 lines (895 loc) • 238 kB
JavaScript
import * as i0 from '@angular/core';
import { EventEmitter, Injectable, Component, ViewChild, Input, forwardRef, ViewChildren, Directive, Output, HostListener, ViewEncapsulation, ViewContainerRef, TemplateRef, HostBinding, NgModule } from '@angular/core';
import { ServiceType, ServiceClientLoginInfo, ServiceClientOptions, ReportControllerOptions, reportSourcesAreEqual, DocumentInfo, ServiceClient, ReportController, SearchManager, ContentArea } from '@progress/telerik-common-report-viewer';
import { debounceTime, Subject, Subscription, take, of, fromEvent } from 'rxjs';
import { caretAltToLeftIcon, caretAltLeftIcon, caretAltRightIcon, caretAltToRightIcon, chevronUpIcon, wholeWordIcon, chevronDownIcon, convertLowercaseIcon, regularExpressionIcon, xIcon, windowRestoreIcon, redoIcon, undoIcon, printIcon, rewindIcon, zoomInIcon, searchIcon, sparklesIcon, xCircleIcon, forwardIcon, zoomOutIcon, fileTxtIcon, downloadIcon, alignLeftIcon, positionLeftIcon, positionRightIcon, arrowRotateCwIcon, questionCircleIcon, warningTriangleIcon } from '@progress/kendo-svg-icons';
import { isDocumentAvailable } from '@progress/kendo-angular-common';
import * as i6$1 from '@progress/kendo-angular-dateinputs';
import { DatePickerComponent, DatePickerModule } from '@progress/kendo-angular-dateinputs';
import * as i2 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i3 from '@progress/kendo-angular-dropdowns';
import { ComboBoxComponent, DropDownListModule, ComboBoxModule, MultiSelectModule } from '@progress/kendo-angular-dropdowns';
import * as i4 from '@progress/kendo-angular-inputs';
import { NumericTextBoxModule, TextBoxModule, CheckBoxModule } from '@progress/kendo-angular-inputs';
import * as i6 from '@progress/kendo-angular-buttons';
import { ButtonsModule } from '@progress/kendo-angular-buttons';
import * as i2$2 from '@progress/kendo-angular-notification';
import { NotificationModule } from '@progress/kendo-angular-notification';
import * as i4$1 from '@progress/kendo-angular-layout';
import { SplitterModule } from '@progress/kendo-angular-layout';
import * as i5$3 from '@progress/kendo-angular-toolbar';
import { ToolBarToolComponent, ToolBarModule } from '@progress/kendo-angular-toolbar';
import * as i6$3 from '@progress/kendo-angular-indicators';
import { LoaderModule } from '@progress/kendo-angular-indicators';
import * as i7 from '@progress/kendo-angular-treeview';
import { TreeViewModule } from '@progress/kendo-angular-treeview';
import * as i8 from '@progress/kendo-angular-tooltip';
import { TooltipModule } from '@progress/kendo-angular-tooltip';
import * as i5$2 from '@progress/kendo-angular-icons';
import { IconsModule } from '@progress/kendo-angular-icons';
import * as i2$1 from '@progress/kendo-angular-pager';
import { PagerComponent, PagerModule } from '@progress/kendo-angular-pager';
import * as i3$1 from '@progress/kendo-angular-dialog';
import { WindowModule, DialogModule } from '@progress/kendo-angular-dialog';
import * as i5 from '@progress/kendo-angular-listbox';
import { ListBoxModule } from '@progress/kendo-angular-listbox';
import { debounceTime as debounceTime$1 } from 'rxjs/operators';
import * as i5$1 from '@progress/kendo-angular-conversational-ui';
import { AIPromptModule } from '@progress/kendo-angular-conversational-ui';
import * as i6$2 from '@progress/kendo-angular-utils';
import { DragAndDropModule } from '@progress/kendo-angular-utils';
import { LabelModule } from '@progress/kendo-angular-label';
const messages = {
ReportViewer_SendEmailDialogToLabel: 'To:',
ReportViewer_SendEmailDialogTitle: 'Send Email',
ReportViewer_SearchDialogCaptionText: 'Find',
ReportViewer_SearchDialogMatchWholeWordTitle: 'Match Whole Word',
ReportViewer_SearchDialogUseRegexTitle: 'Use Regex',
ReportViewer_SearchDialogMatchCaseTitle: 'Match Case',
ReportViewer_SearchDialogNavigateUpTitle: 'Navigate Up',
ReportViewer_SearchDialogNavigateDownTitle: 'Navigate Down',
ReportViewer_SearchDialogPageText: 'page',
ReportViewer_SearchDialogComboBoxPlaceholderText: 'Search...',
ReportViewer_SendEmailDialogClose: 'Close',
ReportViewer_SearchDialogTitle: 'Search in report',
ReportViewer_SearchDialogClearTitle: 'Clear',
ReportViewer_SearchDialogNoResultsLabel: 'No results',
ReportViewer_ToolbarNavigateBackwardTitle: 'Navigate Backward',
ReportViewer_ToolbarNavigateForwardTitle: 'Navigate Forward',
ReportViewer_ToolbarSearchTitle: 'Toggle Search',
ReportViewer_ToolbarAiPromptTitle: 'Toggle AI Prompt',
ReportViewer_ToolbarExportTitle: 'Export',
ReportViewer_ToolbarToggleDocumentMapTitle: 'Toggle Document Map',
ReportViewer_ToolbarFirstPageTitle: 'First Page',
ReportViewer_ToolbarLastPageTitle: 'Last Page',
ReportViewer_ToolbarNextPageTitle: 'Next Page',
ReportViewer_ToolbarPreviousPageTitle: 'Previous Page',
ReportViewer_ToolbarToggleParametersAreaTitle: 'Toggle Parameters Area',
ReportViewer_ToolbarPrintPreviewTitle: 'Print Preview',
ReportViewer_ToolbarPrintReportTitle: 'Print',
ReportViewer_ToolbarInteractiveViewTitle: 'Interactive View',
ReportViewer_ToolbarRefreshTitle: 'Refresh',
ReportViewer_ToolbarStopRenderingTitle: 'Stop Rendering',
ReportViewer_ToolbarZoomInTitle: 'Zoom In',
ReportViewer_ToolbarZoomOutTitle: 'Zoom Out',
ReportViewer_ToolbarZoomComboBoxPlaceholderText: 'Choose zoom level',
ReportViewer_NoPageToDisplay: 'No page to display.',
ReportViewer_LoadingReport: 'Loading report...',
ReportViewer_LoadingReportPagesInProgress: '{0} pages loaded so far...',
ReportViewer_LoadedReportPagesComplete: 'Done. Total {0} pages loaded.',
ReportViewer_RenderingCancelled: 'Report processing was canceled.',
ReportViewer_PreparingPrint: 'Preparing document to print. Please wait...',
ReportViewer_PreparingDownload: 'Preparing document to download. Please wait...',
ReportViewer_MissingOrInvalidParameter: 'Error creating report document. Missing or invalid parameter value. Please input valid data for the following parameters:',
ReportViewer_ErrorSendingDocument: 'Error sending document.',
ReportViewer_UnableToGetReportParameters: 'Unable to get report parameters.',
ReportViewer_InvalidParameter: 'Invalid parameter',
ReportViewer_ErrorCreatingReportDocument: 'Error creating report document.',
ReportViewer_ErrorServiceUrl: "Cannot access the Reporting REST service. (serviceUrl = '{0}'). Make sure the service address is correct and enable CORS if needed. (https://enable-cors.org)",
ReportViewer_NoReport: 'No report.',
ReportViewer_AutoRunDisabled: 'Please validate the report parameter values and press Preview to generate the report.',
ReportViewer_AiPromptDialogConsentAccept: 'Consent',
ReportViewer_AiPromptDialogConsentReject: 'Cancel',
ReportViewer_AiPromptDialogTextAreaPlaceholder: "Enter your prompt",
ReportViewer_AiPromptDialogNoPredefinedAndCustomPromptsPlaceholder: "Custom prompts are disabled and there are no predefined prompts configured. Please allow custom prompts or add predefined prompts to use the AI feature.",
ReportViewer_AiPromptDialogNoCustomPromptsPlaceholder: "Custom prompts are disabled, please select one of the predefined suggestions below"
};
const zoomStep = 0.25;
const minScale = 0.25;
const maxScale = 4;
class ReportingAngularViewerService {
constructor() {
this.options = {
contentTabIndex: 1000,
authenticationToken: '',
reportSource: {
parameters: {},
report: null,
},
scale: 1,
scaleMode: 2,
serviceType: 0,
serviceUrl: null,
viewMode: 0,
keepClientAlive: true,
messages: messages,
pageMode: 0,
printMode: 0,
reportServer: null,
};
this.documentInfo = {
documentReady: false,
documentMapAvailable: false,
containsFrozenContent: false,
pageCount: 1,
documentMapNodes: [],
bookmarkNodes: [],
renderingExtensions: [],
};
this.onZoomChange = new EventEmitter();
this.parameters = [];
this.isSearchWindowOpen = false;
this.isAiPromptWindowOpen = false;
this.currentHistoryIndex = -1;
this.history = [];
this.currentPageIndex = 0;
this.renderingInProgress = false;
this.isBackwardsNavigationInProgress = false;
this.isParametersSectionAvailable = false;
this.windowWidth = 310;
this.windowHeight = 390;
this.totalPages = 1;
this.skip = 0;
}
getServiceClientOptions() {
if (this.options.serviceType === ServiceType.ReportServer && this.options.reportServer !== null) {
let serverOptions = this.options.reportServer;
let serviceUrl = serverOptions.url + '/api/reports';
let tokenUrl = serverOptions.url + '/Token';
let loginInfo = new ServiceClientLoginInfo(tokenUrl, serverOptions.username, serverOptions.password);
return new ServiceClientOptions(serviceUrl, loginInfo);
}
return new ServiceClientOptions(this.options.serviceUrl);
}
getControllerOptions() {
return new ReportControllerOptions(this.options.keepClientAlive, this.options.authenticationToken, this.options.reportSource, this.options.printMode, this.options.pageMode, this.options.viewMode, this.options.scaleMode, this.options.scale, this.options.messages);
}
setOptions(options) {
this.options = options;
this.controller.setOptions(this.getControllerOptions());
this.controller.refreshReport(true, '');
}
applyHistory(reportSource, page, reportDocumentId, scale, scaleMode, viewMode) {
this.controller.setReportSource(reportSource);
this.controller.setReportDocumentId(reportDocumentId);
if (this.controller.getScale() !== scale) {
this.setScale(scale);
}
if (this.controller.getScaleMode() !== scaleMode) {
this.setScaleMode(scaleMode);
}
if (this.controller.getViewMode() !== viewMode) {
this.setViewMode(viewMode);
}
this.controller.refreshReport(false /* ignoreCache */, reportDocumentId, true /* alwaysRespectAutoRun */);
this.controller.navigateToPage(page, undefined);
}
applyParameter(id, value) {
this.isSearchWindowOpen = false;
this.isAiPromptWindowOpen = false;
this.controller.setParameter(id, value);
this.controller.previewReport();
}
setScale(scale) {
this.options.scale = scale;
this.controller.setScale(scale);
this.onZoomChange.emit(scale);
}
setScaleMode(scaleMode) {
this.options.scaleMode = scaleMode;
this.controller.setScaleMode(scaleMode);
}
setViewMode(mode) {
if (mode) {
this.options.viewMode = mode;
}
else {
this.options.viewMode ? this.options.viewMode = 0 : this.options.viewMode = 1;
}
this.controller.setViewMode(this.options.viewMode);
this.controller.refreshReportCore(false, this.controller.getReportDocumentId());
}
zoomIn() {
if (this.options.scale < maxScale) {
this.options.scale += zoomStep;
this.setScale(this.options.scale);
}
}
zoomOut() {
if (this.options.scale > minScale) {
this.options.scale -= zoomStep;
this.setScale(this.options.scale);
}
}
navigateBackwards() {
this.renderingInProgress = true;
this.isSearchWindowOpen = false;
this.isAiPromptWindowOpen = false;
this.isBackwardsNavigationInProgress = true;
this.currentHistoryIndex--;
if (this.history.length >= 0) {
const currentHistoryItem = this.history[this.currentHistoryIndex];
this.applyHistory(currentHistoryItem.reportSource, currentHistoryItem.page, currentHistoryItem.documentId, currentHistoryItem.scale, currentHistoryItem.scaleMode, currentHistoryItem.viewMode);
}
}
navigateForward() {
this.renderingInProgress = true;
this.isSearchWindowOpen = false;
this.isAiPromptWindowOpen = false;
this.currentHistoryIndex++;
if (this.currentHistoryIndex < this.history.length) {
const currentHistoryItem = this.history[this.currentHistoryIndex];
this.applyHistory(currentHistoryItem.reportSource, currentHistoryItem.page, currentHistoryItem.documentId, currentHistoryItem.scale, currentHistoryItem.scaleMode, currentHistoryItem.viewMode);
}
}
addHistoryItem(temp = false) {
this.removeTempHistoryItems();
const historyItem = {
reportSource: { report: this.controller.getReportSource()?.report, parameters: this.options.reportSource.parameters },
documentId: this.controller.getReportDocumentId(),
page: this.getPageNumber(),
scale: this.controller.getScale(),
scaleMode: this.controller.getScaleMode(),
viewMode: this.controller.getViewMode(),
temp: temp
};
const controllerReportSource = this.controller.getReportSource();
if (!this.history.some(item => reportSourcesAreEqual({ firstReportSource: item.reportSource, secondReportSource: controllerReportSource }))) {
this.currentHistoryIndex++;
let deleteCount = this.isBackwardsNavigationInProgress ? 0 : this.history.length - this.currentHistoryIndex;
this.history.splice(this.currentHistoryIndex, deleteCount, historyItem);
}
this.isBackwardsNavigationInProgress = false;
return historyItem;
}
removeTempHistoryItems() {
var lastIndex = this.history.length - 1;
while (lastIndex >= 0 && this.history[lastIndex].temp) {
this.history.splice(lastIndex, 1);
if (this.currentHistoryIndex >= lastIndex) {
this.currentHistoryIndex--;
}
lastIndex--;
}
}
clearReport() {
this.isSearchWindowOpen = this.isAiPromptWindowOpen = this.renderingInProgress = false;
this.isSearchWindowOpen = this.renderingInProgress = false;
this.currentPageIndex = 0;
this.totalPages = 0;
this.documentInfo = new DocumentInfo();
}
getPageNumber() {
return this.currentPageIndex + 1;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ReportingAngularViewerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ReportingAngularViewerService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ReportingAngularViewerService, decorators: [{
type: Injectable
}] });
const SystemBooleanType = 'System.Boolean';
const SystemDateTimeType = 'System.DateTime';
class ParametersSectionComponent {
static isInvalidInput(parameter) {
if (parameter.allowNull) {
return false;
}
if (parameter.multivalue) {
return parameter.value == null || parameter.value.length === 0;
}
return parameter.value == null;
}
constructor(service, cdr) {
this.service = service;
this.cdr = cdr;
this.loading = true;
this.parameter = {
name: '',
type: '',
text: '',
multivalue: false,
allowNull: false,
allowBlank: false,
isVisible: false,
autoRefresh: false,
hasChildParameters: false,
childParameters: [],
availableValues: [],
value: '',
id: '',
label: ''
};
this.datepickerValue = new Date();
this.isInvalidInput = ParametersSectionComponent.isInvalidInput;
}
ngAfterViewInit() {
this.datePicker?.valueChange.asObservable().pipe(debounceTime(this.parameter.autoRefresh ? 2000 : 0)).subscribe(value => {
this.onValueChange(this.parameter, adjustTimezone(value));
});
const reportDateParam = this.service.parameters.find(p => p.type === SystemDateTimeType && p.id === this.parameter.id);
this.datepickerValue = new Date(reportDateParam?.value);
}
onClearSelectionClick(param) {
param.value = '';
}
onSelectAllClick(parameter) {
parameter.value = parameter.availableValues.map((val) => val.value);
this.service.options.reportSource.parameters = JSON.parse(JSON.stringify(this.service.options.reportSource.parameters));
this.service.options.reportSource.parameters[parameter.id] = parameter.value;
if (!parameter.autoRefresh || !this.service.controller.autoRunEnabled)
return;
this.service.applyParameter(parameter.id, parameter.value);
}
onValueChange(parameter, value) {
//TODO: should be removed once the common viewer accepts lower case true/false values
if (parameter.type === SystemBooleanType) {
value = value.target.checked ? 'True' : 'False';
}
parameter.value = value;
this.service.options.reportSource.parameters = JSON.parse(JSON.stringify(this.service.options.reportSource.parameters));
// Can't check for all falsy values because 0 is falsy, won't work with integer parameters
if (value === undefined || value === null || value.length === 0) {
parameter.value = value = null;
if (!parameter.allowNull)
return;
}
if (parameter.childParameters?.length > 0) {
parameter.childParameters.forEach((param) => {
delete this.service.options.reportSource.parameters[param.toString()];
});
this.service.options.reportSource.parameters[parameter.id] = parameter.value;
if (!parameter.autoRefresh || !this.service.controller.autoRunEnabled)
return;
this.service.controller.setParameters(this.service.options.reportSource.parameters);
this.service.controller.refreshReport(true, '');
}
else {
this.service.options.reportSource.parameters[parameter.id] = value;
if (!parameter.autoRefresh || !this.service.controller.autoRunEnabled)
return;
this.service.applyParameter(parameter.id, value);
this.cdr.detectChanges();
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ParametersSectionComponent, deps: [{ token: ReportingAngularViewerService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ParametersSectionComponent, selector: "parameters-section", inputs: { loading: "loading", parameter: "parameter" }, viewQueries: [{ propertyName: "datePicker", first: true, predicate: DatePickerComponent, descendants: true }], ngImport: i0, template: `
<div *ngIf="parameter.isVisible" class="k-card trv-parameter-container">
<div class="k-card-header trv-parameter-header">
<div class="k-card-title trv-parameter-title" [title]="parameter.text">{{parameter.text}}</div>
</div>
<div class="k-card-body trv-parameter-value">
<div *ngIf="isInvalidInput(parameter)" class="k-notification k-notification-error trv-parameter-error">
<div class="k-notification-wrap">
<span class="k-icon k-i-warning"></span>
<span class="k-notification-content trv-parameter-error-message">{{' ' + service.options.messages.ReportViewer_InvalidParameter}}</span>
</div>
</div>
<div class="trv-parameter-editor-available-values">
<kendo-multiselect
*ngIf="parameter.multivalue && parameter.availableValues"
[data]="parameter.availableValues"
[valuePrimitive]="true"
textField="name"
valueField="value"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
[kendoDropDownFilter]="{caseSensitive: false, operator: 'contains'}"
>
</kendo-multiselect>
<kendo-combobox
*ngIf="!parameter.multivalue && parameter.availableValues"
[data]="parameter.availableValues"
[valuePrimitive]="true"
textField="name"
valueField="value"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
>
</kendo-combobox>
<div *ngIf="parameter.availableValues" class="k-actions k-actions-end trv-parameter-actions">
<button kendoButton *ngIf="parameter.multivalue" fillMode="outline" class="trv-select-all" (click)="onSelectAllClick(parameter)">Select all</button>
</div>
<kendo-datepicker *ngIf="parameter.type === 'System.DateTime' && !parameter.availableValues"
[value]="datepickerValue"
[disabled]="loading"
>
</kendo-datepicker>
<kendo-numerictextbox *ngIf="(parameter.type === 'System.Int64' || parameter.type ==='System.Double') && !parameter.availableValues"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
>
</kendo-numerictextbox>
<kendo-textbox *ngIf="parameter.type === 'System.String' && !parameter.availableValues"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
>
</kendo-textbox>
<input *ngIf="parameter.type === 'System.Boolean' && !parameter.availableValues"
type="checkbox"
kendoCheckBox
[id]="parameter.id"
[checked]="(parameter.value && parameter.value !== 'False') || parameter.value === 'True'"
(change)="onValueChange(parameter, $event)"
[disabled]="loading"
/>
</div>
</div>
</div>
`, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.FilterDirective, selector: "[kendoDropDownFilter]", inputs: ["data", "kendoDropDownFilter", "filterable"] }, { kind: "component", type: i4.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "component", type: i3.ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "inputAttributes", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "escape"], exportAs: ["kendoComboBox"] }, { kind: "component", type: i3.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["showStickyHeader", "focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "adaptiveMode", "title", "subtitle", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer", "inputAttributes"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "removeTag"], exportAs: ["kendoMultiSelect"] }, { kind: "component", type: i6.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: i6$1.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "component", type: i4.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: i4.CheckBoxDirective, selector: "input[kendoCheckBox]", inputs: ["size", "rounded"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ParametersSectionComponent, decorators: [{
type: Component,
args: [{
selector: 'parameters-section',
template: `
<div *ngIf="parameter.isVisible" class="k-card trv-parameter-container">
<div class="k-card-header trv-parameter-header">
<div class="k-card-title trv-parameter-title" [title]="parameter.text">{{parameter.text}}</div>
</div>
<div class="k-card-body trv-parameter-value">
<div *ngIf="isInvalidInput(parameter)" class="k-notification k-notification-error trv-parameter-error">
<div class="k-notification-wrap">
<span class="k-icon k-i-warning"></span>
<span class="k-notification-content trv-parameter-error-message">{{' ' + service.options.messages.ReportViewer_InvalidParameter}}</span>
</div>
</div>
<div class="trv-parameter-editor-available-values">
<kendo-multiselect
*ngIf="parameter.multivalue && parameter.availableValues"
[data]="parameter.availableValues"
[valuePrimitive]="true"
textField="name"
valueField="value"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
[kendoDropDownFilter]="{caseSensitive: false, operator: 'contains'}"
>
</kendo-multiselect>
<kendo-combobox
*ngIf="!parameter.multivalue && parameter.availableValues"
[data]="parameter.availableValues"
[valuePrimitive]="true"
textField="name"
valueField="value"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
>
</kendo-combobox>
<div *ngIf="parameter.availableValues" class="k-actions k-actions-end trv-parameter-actions">
<button kendoButton *ngIf="parameter.multivalue" fillMode="outline" class="trv-select-all" (click)="onSelectAllClick(parameter)">Select all</button>
</div>
<kendo-datepicker *ngIf="parameter.type === 'System.DateTime' && !parameter.availableValues"
[value]="datepickerValue"
[disabled]="loading"
>
</kendo-datepicker>
<kendo-numerictextbox *ngIf="(parameter.type === 'System.Int64' || parameter.type ==='System.Double') && !parameter.availableValues"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
>
</kendo-numerictextbox>
<kendo-textbox *ngIf="parameter.type === 'System.String' && !parameter.availableValues"
[value]="parameter.value"
(valueChange)="onValueChange(parameter, $event)"
[disabled]="loading"
>
</kendo-textbox>
<input *ngIf="parameter.type === 'System.Boolean' && !parameter.availableValues"
type="checkbox"
kendoCheckBox
[id]="parameter.id"
[checked]="(parameter.value && parameter.value !== 'False') || parameter.value === 'True'"
(change)="onValueChange(parameter, $event)"
[disabled]="loading"
/>
</div>
</div>
</div>
`
}]
}], ctorParameters: function () { return [{ type: ReportingAngularViewerService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { datePicker: [{
type: ViewChild,
args: [DatePickerComponent]
}], loading: [{
type: Input
}], parameter: [{
type: Input
}] } });
// TODO: This method is taken from HTML viewer
function adjustTimezone(date) {
let result = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));
return result;
}
class CustomPagerToolComponent extends ToolBarToolComponent {
constructor(service) {
super();
this.service = service;
this.totalPages = 1;
this.disabled = false;
this.tabindex = -1;
this.prevKey = 38;
this.nextKey = 40;
this.focusedIndex = -1;
this.caretAltToLeftIcon = caretAltToLeftIcon;
this.caretAltLeftIcon = caretAltLeftIcon;
this.caretAltRightIcon = caretAltRightIcon;
this.caretAltToRightIcon = caretAltToRightIcon;
this.getIndexOfFocused = (prevKeyCode, nextKeyCode, collection) => (ev) => {
switch (ev.type) {
case 'keydown':
if (ev.keyCode === prevKeyCode) {
return collection.length - 1;
}
if (ev.keyCode === nextKeyCode) {
return 0;
}
break;
case 'click':
return collection.findIndex(be => be === ev.target || be.contains(ev.target));
case 'focus':
return 0;
default:
return 0;
}
};
this.seekFocusedIndex = (prevKeyCode, nextKeyCode, seeker) => (startIndex, ev) => {
switch (ev.keyCode) {
case prevKeyCode:
return seeker(startIndex - 1) ? startIndex - 1 : startIndex;
case nextKeyCode:
return seeker(startIndex + 1) ? startIndex + 1 : startIndex;
default:
return startIndex;
}
};
this.isPresent = (value) => value !== null && value !== undefined;
this.makePeeker = (collection) => (index) => this.isPresent(collection[index]);
this.areEqual = (first) => (second) => first === second;
}
canFocus() {
return true;
}
focus(ev) {
this.tabindex = 0;
if (this.overflows) {
if (!isDocumentAvailable())
return;
if (ev) {
this.focusedIndex = this.getIndexOfFocused(this.prevKey, this.nextKey, this.buttonElements)(ev);
this.focusButton(this.focusedIndex, ev);
}
}
else {
this.pager?.['element'].nativeElement.focus();
}
}
handleKey(ev) {
if (this.overflows && isDocumentAvailable()) {
const peekAtIndex = this.makePeeker(this.buttonElements);
const isUnmodified = this.areEqual(this.focusedIndex);
this.focusedIndex = this.seekFocusedIndex(this.prevKey, this.nextKey, peekAtIndex)(this.focusedIndex, ev);
this.focusButton(this.focusedIndex, ev);
return !isUnmodified(this.focusedIndex);
}
this.tabindex = -1;
return false;
}
overflowNavButton(pageIndex) {
this.service.currentPageIndex = pageIndex;
this.service.controller?.navigateToPage(this.service.getPageNumber(), undefined);
}
getLocaleMessage(message) {
return this.service.options.messages[`ReportViewer_Toolbar${message}Title`];
}
onPageChange(e) {
this.service.currentPageIndex = e.skip;
this.service.controller?.navigateToPage(this.service.getPageNumber(), undefined);
}
get buttonElements() {
return [...this.navButtons.toArray().filter(el => !el.nativeElement.classList.contains('k-disabled'))].map(el => el.nativeElement);
}
focusButton(index, ev) {
// Guard against focusing twice on mousedown.
if (!ev.type || ev.type === 'focus' || ev.type === 'keydown') {
this.buttonElements[index]?.focus();
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomPagerToolComponent, deps: [{ token: ReportingAngularViewerService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomPagerToolComponent, selector: "custom-pager-tool", inputs: { totalPages: "totalPages", disabled: "disabled" }, providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => CustomPagerToolComponent) }], viewQueries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbarTemplate"], descendants: true, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "toolbarElement", first: true, predicate: ["toolbarElement"], descendants: true }, { propertyName: "popupElement", first: true, predicate: ["popupElement"], descendants: true }, { propertyName: "pager", first: true, predicate: ["pager"], descendants: true, read: PagerComponent }, { propertyName: "navButtons", predicate: ["navButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
<ng-template #toolbarTemplate>
<span #toolbarElement>
<kendo-datapager #pager
fillMode="flat"
[class]="{'k-disabled' : this.disabled}"
[tabindex]="tabindex"
[pageSize]="1"
[skip]="service.currentPageIndex"
[total]="service.totalPages"
[pageSizeValues]="false"
[info]="false"
[previousNext]="true"
type="input"
(pageChange)="onPageChange($event)"
>
</kendo-datapager>
</span>
</ng-template>
<ng-template #popupTemplate>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-end-left"
[svgIcon]="caretAltToLeftIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === 0"
[title]="getLocaleMessage('FirstPage')"
(click)="overflowNavButton(0)"
fillMode="flat"> {{ getLocaleMessage('FirstPage') }}
</button>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-60-left"
[svgIcon]="caretAltLeftIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === 0"
[title]="getLocaleMessage('PreviousPage')"
(click)="overflowNavButton(service.currentPageIndex - 1)"
fillMode="flat"> {{ getLocaleMessage('PreviousPage') }}
</button>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-60-right"
[svgIcon]="caretAltRightIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === service.totalPages - 1"
[title]="getLocaleMessage('NextPage')"
(click)="overflowNavButton(service.currentPageIndex + 1)"
fillMode="flat"> {{ getLocaleMessage('NextPage') }}
</button>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-end-right"
[svgIcon]="caretAltToRightIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === service.totalPages - 1"
[title]="getLocaleMessage('LastPage')"
(click)="overflowNavButton(service.totalPages - 1)"
fillMode="flat"> {{ getLocaleMessage('LastPage') }}
</button>
</ng-template>
`, isInline: true, styles: [".toolbar-nav-btn{width:100%;justify-content:start}\n"], dependencies: [{ kind: "component", type: i2$1.PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive"], outputs: ["pageChange", "pageSizeChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "component", type: i6.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomPagerToolComponent, decorators: [{
type: Component,
args: [{ providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(() => CustomPagerToolComponent) }], selector: 'custom-pager-tool', template: `
<ng-template #toolbarTemplate>
<span #toolbarElement>
<kendo-datapager #pager
fillMode="flat"
[class]="{'k-disabled' : this.disabled}"
[tabindex]="tabindex"
[pageSize]="1"
[skip]="service.currentPageIndex"
[total]="service.totalPages"
[pageSizeValues]="false"
[info]="false"
[previousNext]="true"
type="input"
(pageChange)="onPageChange($event)"
>
</kendo-datapager>
</span>
</ng-template>
<ng-template #popupTemplate>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-end-left"
[svgIcon]="caretAltToLeftIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === 0"
[title]="getLocaleMessage('FirstPage')"
(click)="overflowNavButton(0)"
fillMode="flat"> {{ getLocaleMessage('FirstPage') }}
</button>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-60-left"
[svgIcon]="caretAltLeftIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === 0"
[title]="getLocaleMessage('PreviousPage')"
(click)="overflowNavButton(service.currentPageIndex - 1)"
fillMode="flat"> {{ getLocaleMessage('PreviousPage') }}
</button>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-60-right"
[svgIcon]="caretAltRightIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === service.totalPages - 1"
[title]="getLocaleMessage('NextPage')"
(click)="overflowNavButton(service.currentPageIndex + 1)"
fillMode="flat"> {{ getLocaleMessage('NextPage') }}
</button>
<button
#navButton
kendoButton
class="toolbar-nav-btn"
icon="arrow-end-right"
[svgIcon]="caretAltToRightIcon"
[tabindex]="tabindex"
[disabled]="service.totalPages <= 1 || service.currentPageIndex === service.totalPages - 1"
[title]="getLocaleMessage('LastPage')"
(click)="overflowNavButton(service.totalPages - 1)"
fillMode="flat"> {{ getLocaleMessage('LastPage') }}
</button>
</ng-template>
`, styles: [".toolbar-nav-btn{width:100%;justify-content:start}\n"] }]
}], ctorParameters: function () { return [{ type: ReportingAngularViewerService }]; }, propDecorators: { totalPages: [{
type: Input
}], disabled: [{
type: Input
}], toolbarTemplate: [{
type: ViewChild,
args: ['toolbarTemplate', { static: true }]
}], popupTemplate: [{
type: ViewChild,
args: ['popupTemplate', { static: true }]
}], toolbarElement: [{
type: ViewChild,
args: ['toolbarElement']
}], popupElement: [{
type: ViewChild,
args: ['popupElement']
}], pager: [{
type: ViewChild,
args: ['pager', { read: PagerComponent, static: false }]
}], navButtons: [{
type: ViewChildren,
args: ['navButton']
}] } });
class afterFilterChangedDirective {
constructor() {
this.afterFilterChanged = new EventEmitter();
this.filterChangeDelay = 600;
this.stream = new Subject();
this.subscription = this.stream
.pipe(debounceTime$1(this.filterChangeDelay))
.subscribe((value) => this.afterFilterChanged.next(value));
}
ngOnDestroy() {
this.subscription.unsubscribe();
}
onFilterChange(value) {
this.stream.next(value);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: afterFilterChangedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: afterFilterChangedDirective, selector: "[afterFilterChanged]", inputs: { filterChangeDelay: "filterChangeDelay" }, outputs: { afterFilterChanged: "afterFilterChanged" }, host: { listeners: { "filterChange": "onFilterChange($event)" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: afterFilterChangedDirective, decorators: [{
type: Directive,
args: [{
selector: '[afterFilterChanged]'
}]
}], ctorParameters: function () { return []; }, propDecorators: { afterFilterChanged: [{
type: Output
}], filterChangeDelay: [{
type: Input
}], onFilterChange: [{
type: HostListener,
args: ['filterChange', ['$event']]
}] } });
class SearchComponent {
constructor(ngZone, service) {
this.ngZone = ngZone;
this.service = service;
this.chevronUpIcon = chevronUpIcon;
this.wholeWordIcon = wholeWordIcon;
this.chevronDownIcon = chevronDownIcon;
this.convertToLowerCaseIcon = convertLowercaseIcon;
this.regularExpressionIcon = regularExpressionIcon;
this.windowTop = 30;
this.searchResults = [];
this.isComboboxOpen = false;
this.searchText = '';
this.opened = true;
this.selectedIndex = 0;
this.searchInfo = {
searchToken: '',
matchCase: false,
matchWholeWord: false,
useRegularExpressions: false
};
this.subs = new Subscription();
}
ngOnInit() {
const reportElemWidth = this.service.reportWidth;
this.windowHeight = this.service.windowHeight;
this.windowWidth = this.service.windowWidth;
this.windowLeft = reportElemWidth - (this.windowWidth + 40);
}
ngAfterViewInit() {
this.service.searchManager?.on('searchComplete', (results) => this.onSearchComplete(results));
this.ngZone.onStable.pipe(take(1)).subscribe(_ => this.comboBox?.focus());
const combobox = this.comboBox?.wrapper?.nativeElement;
this.subs.add(combobox.addEventListener('keydown', (event) => this.onArrowEvent(event), true));
}
ngOnDestroy() {
this.subs.unsubscribe();
}
toggle(isOpened) {
this.service.isSearchWindowOpen = isOpened;
this.searchResults = [];
this.service.searchManager.closeSearch();
}
handleFilter(value) {
if (value === "") {
return;
}
this.searchText = value;
this.search(value, true);
}
onWidthChange(width) {
this.service.windowWidth = width;
}
onHeightChange(height) {
this.service.windowHeight = height;
}
onBlur() {
this.searchText = this.comboBox.text = this.comboBox?.searchbar.value;
}
search(text, isTextFilter = false) {
if (typeof text !== 'string' && !isTextFilter)
return;
if (text && this.searchTerms.indexOf(text) === -1) {
this.searchTerms.push(text);
}
if (this.searchInfo.searchToken !== text) {
this.selectedIndex = 0;
}
this.comboBox.value = text;
this.comboBox.searchBarChange(text);
this.searchInfo.searchToken = text;
this.service.searchManager?.search(this.searchInfo);
this.ngZone.onStable.pipe(take(1)).subscribe(_ => this.comboBox?.focus());
}
onSearchFilter(filterName) {
this.selectedIndex = 0;
this.searchInfo[filterName] = !this.searchInfo[filterName];
this.search(this.searchInfo.searchToken);
}
onSelectionChange(item) {
const searchResultItem = this.searchResults[item.index];
this.service.searchManager?.high