@es.framework/ng.ui.core 2.0.58

package/fesm2022/es.framework-ng.ui.core-generic-report.mjs

@@ -0,0 +1,556 @@
+import * as i0 from '@angular/core';
+import { NgModule, inject, Component, Input, ViewChild } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/forms';
+import { FormsModule, FormGroup, ReactiveFormsModule } from '@angular/forms';
+import { FormlyForm } from '@ngx-formly/core';
+import { TranslatePipe } from '@es.framework/ng.core/pipes';
+import * as i2 from 'primeng/button';
+import { ButtonModule } from 'primeng/button';
+import { DialogModule } from 'primeng/dialog';
+import * as i3 from 'primeng/inputtext';
+import { InputTextModule } from 'primeng/inputtext';
+import { RadioButtonModule } from 'primeng/radiobutton';
+import { CheckboxModule } from 'primeng/checkbox';
+import * as i1$1 from 'primeng/dynamicdialog';
+import { DynamicDialogRef, DynamicDialogConfig, DialogService } from 'primeng/dynamicdialog';
+import { LocalizationService, RestService } from '@es.framework/ng.core/services';
+import { Subject, takeUntil } from 'rxjs';
+import * as i5 from 'primeng/drawer';
+import { DrawerModule } from 'primeng/drawer';
+import { TableModule } from 'primeng/table';
+import * as i6 from 'primeng/splitbutton';
+import { SplitButtonModule } from 'primeng/splitbutton';
+import * as i7 from 'primeng/tooltip';
+import { TooltipModule } from 'primeng/tooltip';
+import { DomSanitizer } from '@angular/platform-browser';
+import { QueryBuilderService } from '@es.framework/ng.ui.core/generic-search-advanced';
+import * as i4 from 'primeng/api';
+
+class GenericReportModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: GenericReportModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.3", ngImport: i0, type: GenericReportModule, imports: [CommonModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: GenericReportModule, imports: [CommonModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: GenericReportModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule],
+                }]
+        }] });
+
+// report-name-dialog.component.ts
+class ReportNameDialogComponent {
+    fileName = '';
+    ref = inject(DynamicDialogRef);
+    config = inject(DynamicDialogConfig);
+    translate = inject(LocalizationService);
+    ngOnInit() {
+        this.fileName = this.config.data?.fileName || '';
+    }
+    save() {
+        if (this.fileName?.trim()) {
+            this.ref.close(this.fileName.trim());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ReportNameDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.3", type: ReportNameDialogComponent, isStandalone: true, selector: "app-report-name-dialog", ngImport: i0, template: `
+    <div class="p-fluid">
+      <div class="field">
+        <label for="fileName" class="block text-sm font-medium mb-2">
+          {{ 'REPORT_NAME' | translate }}
+        </label>
+        <input
+          id="fileName"
+          type="text"
+          [(ngModel)]="fileName"
+          pInputText
+          class="w-full"
+          [placeholder]="'ENTER_REPORT_NAME' | translate"
+          autofocus>
+      </div>
+    </div>
+
+    <div class="flex justify-end gap-2 mt-4">
+      <button
+        type="button"
+        pButton
+        class="p-button-text"
+        (click)="ref.close()"
+        [label]="'CANCEL' | translate">
+      </button>
+      <button
+        type="button"
+        pButton
+        (click)="save()"
+        [label]="'SAVE' | translate">
+      </button>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ReportNameDialogComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'app-report-name-dialog',
+                    standalone: true,
+                    imports: [
+                        FormsModule,
+                        TranslatePipe,
+                        ButtonModule,
+                        InputTextModule
+                    ],
+                    template: `
+    <div class="p-fluid">
+      <div class="field">
+        <label for="fileName" class="block text-sm font-medium mb-2">
+          {{ 'REPORT_NAME' | translate }}
+        </label>
+        <input
+          id="fileName"
+          type="text"
+          [(ngModel)]="fileName"
+          pInputText
+          class="w-full"
+          [placeholder]="'ENTER_REPORT_NAME' | translate"
+          autofocus>
+      </div>
+    </div>
+
+    <div class="flex justify-end gap-2 mt-4">
+      <button
+        type="button"
+        pButton
+        class="p-button-text"
+        (click)="ref.close()"
+        [label]="'CANCEL' | translate">
+      </button>
+      <button
+        type="button"
+        pButton
+        (click)="save()"
+        [label]="'SAVE' | translate">
+      </button>
+    </div>
+  `
+                }]
+        }] });
+
+var ExportType;
+(function (ExportType) {
+    ExportType[ExportType["LIST"] = 0] = "LIST";
+    ExportType[ExportType["HTML"] = 1] = "HTML";
+    ExportType[ExportType["PDF"] = 2] = "PDF";
+    ExportType[ExportType["EXCEL"] = 3] = "EXCEL";
+    ExportType[ExportType["PRINT"] = 4] = "PRINT";
+})(ExportType || (ExportType = {}));
+class GenericReportComponent {
+    ref;
+    config;
+    previewContainer;
+    filterFields = [];
+    fields_ = [];
+    exportType = ExportType.PDF;
+    fileName = '';
+    showFilters = false;
+    loading = false;
+    currentDate = new Date();
+    previewData = [];
+    htmlExportContent = '';
+    showHtmlInIframe = false;
+    previewColumns = [];
+    options = {};
+    enableQueryBuilder = true;
+    localExport = false;
+    queryString = '';
+    apiName = '';
+    moduleName = '';
+    model = {};
+    form = new FormGroup({});
+    exportConfig;
+    exportTypes = [
+        { value: ExportType.EXCEL, label: 'EXCEL', icon: 'pi pi-file-excel' },
+        { value: ExportType.PDF, label: 'PDF', icon: 'pi pi-file-pdf' },
+        { value: ExportType.HTML, label: 'HTML', icon: 'pi pi-code' },
+        { value: ExportType.PRINT, label: 'PRINT', icon: 'pi pi-print' }
+    ];
+    exportMenuItems = [];
+    destroy$ = new Subject();
+    dialogService = inject(DialogService);
+    translate = inject(LocalizationService);
+    restService = inject(RestService);
+    queryBuilder = inject(QueryBuilderService);
+    sanitizer = inject(DomSanitizer);
+    constructor(ref, config) {
+        this.ref = ref;
+        this.config = config;
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+        if (this.ref) {
+            try {
+                this.ref.close();
+            }
+            catch (e) {
+                // Ignore errors during cleanup
+            }
+        }
+    }
+    ngOnInit() {
+        this.filterFields = this.config.data?.filterFields || [];
+        this.buildQueryUIFields();
+        this.initializeComponent();
+        this.initializeExportConfig();
+        this.initializeExportMenu();
+    }
+    get filterCount() {
+        return this.queryBuilder.getAppliedFiltersCount(this.model).total;
+    }
+    buildQueryUIFields() {
+        if (this.enableQueryBuilder) {
+            this.fields_ = this.queryBuilder.buildQueryUIFields(this.filterFields, true, true);
+        }
+        else {
+            this.fields_ = this.filterFields;
+        }
+    }
+    initializeComponent() {
+        this.apiName = this.config.data?.apiName || '';
+        this.moduleName = this.config.data?.moduleName || '';
+        this.initializeFilterFields();
+        this.onExport();
+    }
+    initializeFilterFields() {
+        this.filterFields = this.config.data?.filterFields || this.getDefaultFilterFields();
+        this.model = this.config.data?.model || {};
+        this.fileName = this.config.data?.defaultFileName || `export_${new Date().toISOString().split('T')[0]}`;
+    }
+    initializeExportConfig() {
+        this.exportConfig = {
+            filters: this.model,
+            exportType: this.exportType,
+            fileName: this.fileName
+        };
+    }
+    initializeExportMenu() {
+        this.exportMenuItems = [
+            // Edit Report Name menu item
+            {
+                label: this.translate.instant('EDIT_REPORT_NAME'),
+                icon: 'pi pi-pencil',
+                command: () => this.openReportNameDialog()
+            },
+            // Separator
+            { separator: true },
+            // Export type menu items
+            ...this.exportTypes.map(type => ({
+                label: this.translate.instant(type.label),
+                icon: type.icon,
+                command: () => this.onExportTypeChange(type.value)
+            }))
+        ];
+    }
+    openReportNameDialog() {
+        const ref = this.dialogService.open(ReportNameDialogComponent, {
+            header: this.translate.instant('EDIT_REPORT_NAME'),
+            width: '500px',
+            data: {
+                fileName: this.fileName
+            }
+        });
+        ref?.onClose.subscribe((result) => {
+            if (result) {
+                this.fileName = result;
+            }
+        });
+    }
+    getDefaultFilterFields() {
+        return [
+            {
+                key: 'search',
+                type: 'input',
+                props: {
+                    label: this.translate.instant('SEARCH'),
+                    placeholder: this.translate.instant('ENTER_SEARCH_TERM'),
+                }
+            }
+        ];
+    }
+    // Query and Preview Methods
+    generatePreview() {
+        this.onExport();
+    }
+    onSubmit() {
+        const odataParams = this.queryBuilder.buildODataFromQueryModel(this.model, this.filterFields);
+        this.queryString = this.queryBuilder.toODataQueryString(odataParams);
+        this.onExport();
+    }
+    onReset() {
+        this.exportType = ExportType.PDF;
+        this.fileName = `export_${new Date().toISOString().split('T')[0]}`;
+        this.form.reset();
+        this.model = {};
+        this.generatePreview();
+    }
+    // Export Methods
+    onExport() {
+        this.loading = true;
+        const exportConfig = this.createExportConfig();
+        this.handleApiExport(exportConfig);
+    }
+    createExportConfig() {
+        return {
+            filters: this.model,
+            exportType: this.exportType,
+            fileName: this.fileName
+        };
+    }
+    handleApiExport(config) {
+        if (this.form.invalid)
+            return;
+        const requestOptions = this.createRequestOptions(config);
+        this.restService.request(requestOptions, { apiName: this.apiName, moduleName: this.moduleName })
+            .pipe(takeUntil(this.destroy$))
+            .subscribe({
+            next: (response) => {
+                this.handleExportResponse(response, config);
+            },
+            error: (error) => {
+                console.error('Export failed:', error);
+                this.loading = false;
+            }
+        });
+    }
+    createRequestOptions(config) {
+        // Default query
+        if (!this.queryString || this.queryString == '') {
+            // Use the new QueryBuilderService methods
+            const odataParams = this.queryBuilder.buildODataFromQueryModel(this.model, this.filterFields);
+            // this.odataSearch.emit(odataParams);
+            // Generate query string using the unified method
+            this.queryString = this.queryBuilder.toODataQueryString(odataParams);
+            // console.log('OData Query String:', queryString);
+        }
+        const filters = {
+            fileName: config.fileName || '',
+            query: this.queryString,
+            exportType: config.exportType,
+        };
+        const params = Object.keys(filters).reduce((acc, key) => {
+            acc[key] = filters[key];
+            return acc;
+        }, {});
+        const requestOptions = {
+            method: 'GET',
+            url: `/${this.apiName}/export`,
+            params: params
+        };
+        if (config.exportType === ExportType.HTML) {
+            requestOptions.responseType = 'text';
+        }
+        return requestOptions;
+    }
+    // private handleExportResponse(response: any, config: any) {
+    //   this.loading = false;
+    //   if (config.exportType === ExportType.HTML) {
+    //     this.showHtmlExport(response);
+    //   } else {
+    //     this.downloadBinaryExport(response, config);
+    //   }
+    // }
+    handleExportResponse(response, config) {
+        this.loading = false;
+        if (config.exportType === ExportType.HTML) {
+            this.showHtmlExport(response);
+            // } else if (config.exportType === ExportType.PDF && this.isMobileDevice()) {
+        }
+        else if (config.exportType === ExportType.PDF) {
+            this.showPdfInMobile(response, config);
+        }
+        else {
+            this.downloadBinaryExport(response, config);
+        }
+    }
+    // Platform detection methods
+    isMobileDevice() {
+        return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+    }
+    isIOS() {
+        return /iPad|iPhone|iPod/.test(navigator.userAgent);
+    }
+    isAndroid() {
+        return /Android/.test(navigator.userAgent);
+    }
+    showPdfModal = false;
+    currentPdfUrl;
+    currentFileName = '';
+    showPdfInMobile(base64Data, config) {
+        try {
+            const blob = this.base64ToBlob(base64Data, this.getMimeType(ExportType.PDF));
+            this.currentPdfUrl = this.sanitizeUrl(URL.createObjectURL(blob));
+            this.currentFileName = `${config.fileName}.pdf`;
+            this.showPdfModal = true;
+        }
+        catch (error) {
+            var error = 'PDF is too large for mobile viewing. Please download instead.';
+        }
+        finally {
+            // this.loading = false;
+        }
+    }
+    sanitizeUrl(url) {
+        return this.sanitizer.bypassSecurityTrustResourceUrl(url);
+    }
+    // onPdfModalClose(): void {
+    //   this.showPdfModal = false;
+    //   if (this.currentPdfUrl) {
+    //     URL.revokeObjectURL(this.currentPdfUrl);
+    //     this.currentPdfUrl = '';
+    //   }
+    // }
+    onPdfDownload() {
+        // Trigger download
+        // const blob = this.base64ToBlob(this.getCurrentBase64(), this.getMimeType(ExportType.PDF));
+        // this.downloadFile(blob, this.currentFileName);
+    }
+    downloadBinaryExport(response, config) {
+        const blob = this.base64ToBlob(response, this.getMimeType(config.exportType));
+        this.downloadFile(blob, `${config.fileName}.${this.getFileExtension(config.exportType)}`);
+    }
+    // HTML Export Methods
+    showHtmlExport(htmlContent) {
+        const cleanHtml = this.cleanHtmlContent(htmlContent);
+        this.htmlExportContent = cleanHtml;
+        this.showHtmlInIframe = true;
+        setTimeout(() => {
+            this.setIframeContent(cleanHtml);
+        }, 100);
+    }
+    setIframeContent(htmlContent) {
+        const iframe = document.getElementById('reportIframe');
+        if (!iframe) {
+            console.error('Iframe not found');
+            return;
+        }
+        const iframeDoc = iframe.contentDocument || iframe.contentWindow?.document;
+        if (iframeDoc) {
+            iframeDoc.open();
+            iframeDoc.write(htmlContent);
+            iframeDoc.close();
+        }
+    }
+    print() {
+        // const iframe = document.getElementById('reportIframe') as HTMLIFrameElement | null;
+        // if (!iframe || !iframe.contentWindow) return;
+        // const iframeWindow = iframe.contentWindow;
+        // iframeWindow.focus();
+        // iframeWindow.print();
+        document.getElementById('reportIframe').contentWindow.print();
+    }
+    // Utility Methods
+    getExportButtonText() {
+        switch (this.exportType) {
+            case ExportType.PRINT:
+                return this.translate.instant('PRINT');
+            case ExportType.HTML:
+                return this.translate.instant('EXPORT');
+            default:
+                return this.translate.instant('EXPORT');
+        }
+    }
+    onExportTypeChange(type) {
+        this.exportType = type;
+    }
+    getCurrentExportTypeIcon() {
+        const currentType = this.exportTypes.find(type => type.value === this.exportType);
+        return currentType?.icon || 'pi pi-download';
+    }
+    base64ToBlob(base64, mime) {
+        const byteChars = atob(base64);
+        const byteNums = Array.from(byteChars, c => c.charCodeAt(0));
+        return new Blob([new Uint8Array(byteNums)], { type: mime });
+    }
+    downloadFile(blob, fileName) {
+        const url = window.URL.createObjectURL(blob);
+        const link = document.createElement('a');
+        link.href = url;
+        link.download = fileName;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        window.URL.revokeObjectURL(url);
+    }
+    getFileExtension(exportType) {
+        switch (exportType) {
+            case ExportType.EXCEL:
+                return 'xlsx';
+            case ExportType.PDF:
+                return 'pdf';
+            case ExportType.HTML:
+                return 'html';
+            default:
+                return 'pdf';
+        }
+    }
+    getMimeType(exportType) {
+        switch (exportType) {
+            case ExportType.EXCEL:
+                return 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+            case ExportType.PDF:
+                return 'application/pdf';
+            default:
+                return 'application/octet-stream';
+        }
+    }
+    cleanHtmlContent(html) {
+        return html
+            .replace(/\\r\\n/g, '\n')
+            .replace(/\\"/g, '"')
+            .replace(/\\t/g, ' ')
+            .trim();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: GenericReportComponent, deps: [{ token: i1$1.DynamicDialogRef }, { token: i1$1.DynamicDialogConfig }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: GenericReportComponent, isStandalone: true, selector: "app-generic-report", inputs: { filterFields: "filterFields", enableQueryBuilder: "enableQueryBuilder", localExport: "localExport", queryString: "queryString", apiName: "apiName", moduleName: "moduleName", model: "model" }, providers: [DialogService, RestService], viewQueries: [{ propertyName: "previewContainer", first: true, predicate: ["previewContainer"], descendants: true }], ngImport: i0, template: "<!-- class=\"flex flex-col h-full bg-white dark:bg-gray-900 rounded-lg max-w-6xl mx-auto\" -->\n<div >\n  <!-- Content -->\n  <div class=\"flex-1 overflow-hidden p-2\">\n\n    <!-- Preview Actions -->\n    <div class=\"flex justify-between items-center mb-6 p-2 bg-white rounded-lg\">\n      <h3 class=\"text-lg font-semibold text-gray-900 dark:text-white\">\n        {{ 'REPORT' | translate }}\n      </h3>\n      <div class=\"flex gap-2\">\n        <!-- Filters Button -->\n        <button\n          type=\"button\"\n          (click)=\"showFilters = !showFilters\"\n          class=\"flex items-center px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\"\n          [pTooltip]=\"'SEARCH_FILTERS' | translate\">\n          <i class=\"pi pi-filter\"></i>\n          @if (filterCount > 0) {\n            <span class=\"ml-2 bg-blue-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center\">\n              {{ filterCount }}\n            </span>\n          }\n        </button>\n\n        <!-- Refresh Preview -->\n        <button\n          (click)=\"generatePreview()\"\n          [disabled]=\"loading\"\n          class=\"flex items-center px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-700 disabled:bg-gray-300 disabled:cursor-not-allowed transition-colors\"\n          [pTooltip]=\"'REFRESH' | translate\">\n          <i class=\"pi pi-refresh mr-2 ml-2\" [class.animate-spin]=\"loading\"></i>\n          {{ 'REFRESH' | translate }}\n        </button>\n\n        <!-- Print Button -->\n        @if (exportType === 4 || exportType === 1 || exportType === 2) {\n          <button\n            (click)=\"print()\"\n            class=\"flex items-center px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\"\n            [pTooltip]=\"'PRINT' | translate\">\n            <i class=\"pi pi-print mr-2 ml-2\"></i>\n            {{ 'PRINT' | translate }}\n          </button>\n        }\n      </div>\n    </div>\n\n    <!-- Preview Content -->\n    <div #previewContainer class=\"bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg\">\n      <!-- HTML Export Preview (Iframe) -->\n      @if (showHtmlInIframe && htmlExportContent || showPdfModal) {\n        <div class=\"html-export-preview\">\n          <iframe\n            id=\"reportIframe\"\n            class=\"w-full border border-gray-300 dark:border-gray-600 rounded-b-lg\"\n            [style.height]=\"'600px'\"\n            title=\"HTML Export Preview\"\n            [src]=\"currentPdfUrl\"\n            width=\"100%\"\n            height=\"100%\"\n            frameborder=\"0\"\n            allowfullscreen\n            >\n            <!--  allowfullscreen -->\n          </iframe>\n        </div>\n      }\n      <!-- <app-pdf-modal\n      *ngIf=\"showPdfModal\"\n      [pdfUrl]=\"currentPdfUrl\"\n      [fileName]=\"currentFileName\"\n      (closed)=\"onPdfModalClose()\"\n      (downloadRequested)=\"onPdfDownload()\">\n    </app-pdf-modal> -->\n\n    <!-- Regular Preview Table -->\n    <!-- <div *ngIf=\"!showHtmlInIframe\" class=\"p-4\">\n    <p-table\n      [value]=\"previewData\"\n      [columns]=\"previewColumns\"\n      [paginator]=\"true\"\n      [rows]=\"10\"\n      [showCurrentPageReport]=\"true\"\n      currentPageReportTemplate=\"Showing {first} to {last} of {totalRecords} entries\"\n      styleClass=\"p-datatable-sm\">\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th *ngFor=\"let col of previewColumns\" class=\"text-left\">\n            {{ col.header }}\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-rowData>\n        <tr>\n          <td *ngFor=\"let col of previewColumns\" class=\"text-left\">\n            {{ rowData[col.field] }}\n          </td>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"emptymessage\">\n        <tr>\n          <td [attr.colspan]=\"previewColumns.length\" class=\"text-center py-4\">\n            <div class=\"text-center py-8\">\n              <i class=\"pi pi-inbox text-4xl text-gray-400 dark:text-gray-500 mb-4\"></i>\n              <p class=\"text-gray-500 dark:text-gray-400\">{{ 'NO_PREVIEW_DATA' | translate }}</p>\n            </div>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n  </div> -->\n</div>\n\n<!-- <div class=\"mt-4 p-3 bg-green-50 dark:bg-green-900/20 rounded-lg\">\n<p class=\"text-sm text-green-700 dark:text-green-300\">\n  <i class=\"pi pi-info-circle mr-2\"></i>\n  {{ 'PREVIEW_INFO' | translate }}\n</p>\n</div> -->\n</div>\n\n<!-- Footer -->\n<div class=\"border-t border-gray-200 dark:border-gray-700 px-2 py-2 bg-gray-50 dark:bg-gray-800\">\n  <div class=\"flex justify-between items-center\">\n    <button\n      type=\"button\"\n      (click)=\"onReset()\"\n      class=\"flex items-center px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-700 rounded-lg transition-colors\"\n      [disabled]=\"loading\">\n      <i class=\"pi pi-refresh mr-2\"></i>\n      {{ 'RESET' | translate }}\n    </button>\n\n    <div class=\"flex gap-2\">\n      <button\n        type=\"button\"\n        (click)=\"ref?.close()\"\n        class=\"px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\"\n        [disabled]=\"loading\">\n        {{ 'CANCEL' | translate }}\n      </button>\n\n      <!-- SplitButton for Export -->\n      <!-- || previewData.length === 0 -->\n      <p-splitButton\n        [label]=\"getExportButtonText()\"\n        [icon]=\"getCurrentExportTypeIcon()\"\n        [model]=\"exportMenuItems\"\n        (onClick)=\"onExport()\"\n        [disabled]=\"loading\"\n        styleClass=\"p-button-primary\">\n      </p-splitButton>\n    </div>\n  </div>\n</div>\n\n<!-- Filters Drawer -->\n@if(showFilters){\n  <p-drawer\n    [(visible)]=\"showFilters\"\n    position=\"right\"\n    [styleClass]=\"'!w-full md:!w-80 lg:!w-[40rem] !h-full' \"\n    [modal]=\"true\"\n    [dismissible]=\"true\"\n    styleClass=\"p-4 w-full max-w-md max-h-[90vh] flex flex-col\">\n    <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit(); showFilters=false\" class=\"flex flex-col flex-1\">\n      <div class=\"flex-1 overflow-auto\">\n        <formly-form\n          [form]=\"form\"\n          [fields]=\"fields_\"\n          [model]=\"model\"\n          [options]=\"options\">\n        </formly-form>\n      </div>\n    </form>\n    <ng-template pTemplate=\"footer\">\n      <div class=\"flex justify-end mt-2 space-x-2 flex-none\">\n        <button\n          type=\"submit\"\n          pButton size=\"small\"\n          (click)=\" onSubmit(); showFilters=false\"\n          label=\"{{ 'SEARCH' | translate }}\">\n        </button>\n        <button\n          type=\"button\"\n          pButton\n          size=\"small\"\n          class=\"p-button-text\"\n          (click)=\"onReset(); showFilters=false\">\n          {{ 'CLEAR' | translate }}\n        </button>\n      </div>\n    </ng-template>\n  </p-drawer>\n}\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i5.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: SplitButtonModule }, { kind: "component", type: i6.SplitButton, selector: "p-splitbutton, p-splitButton, p-split-button", inputs: ["model", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "icon", "iconPos", "label", "tooltip", "tooltipOptions", "styleClass", "menuStyle", "menuStyleClass", "dropdownIcon", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions", "buttonProps", "menuButtonProps", "autofocus", "disabled", "tabindex", "menuButtonDisabled", "buttonDisabled"], outputs: ["onClick", "onMenuHide", "onMenuShow", "onDropdownClick"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: GenericReportComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-generic-report', imports: [
+                        ReactiveFormsModule,
+                        FormsModule,
+                        TranslatePipe,
+                        ButtonModule,
+                        DialogModule,
+                        InputTextModule,
+                        RadioButtonModule,
+                        CheckboxModule,
+                        DrawerModule,
+                        FormlyForm,
+                        TableModule,
+                        SplitButtonModule,
+                        TooltipModule
+                    ], providers: [DialogService, RestService], template: "<!-- class=\"flex flex-col h-full bg-white dark:bg-gray-900 rounded-lg max-w-6xl mx-auto\" -->\n<div >\n  <!-- Content -->\n  <div class=\"flex-1 overflow-hidden p-2\">\n\n    <!-- Preview Actions -->\n    <div class=\"flex justify-between items-center mb-6 p-2 bg-white rounded-lg\">\n      <h3 class=\"text-lg font-semibold text-gray-900 dark:text-white\">\n        {{ 'REPORT' | translate }}\n      </h3>\n      <div class=\"flex gap-2\">\n        <!-- Filters Button -->\n        <button\n          type=\"button\"\n          (click)=\"showFilters = !showFilters\"\n          class=\"flex items-center px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\"\n          [pTooltip]=\"'SEARCH_FILTERS' | translate\">\n          <i class=\"pi pi-filter\"></i>\n          @if (filterCount > 0) {\n            <span class=\"ml-2 bg-blue-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center\">\n              {{ filterCount }}\n            </span>\n          }\n        </button>\n\n        <!-- Refresh Preview -->\n        <button\n          (click)=\"generatePreview()\"\n          [disabled]=\"loading\"\n          class=\"flex items-center px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-700 disabled:bg-gray-300 disabled:cursor-not-allowed transition-colors\"\n          [pTooltip]=\"'REFRESH' | translate\">\n          <i class=\"pi pi-refresh mr-2 ml-2\" [class.animate-spin]=\"loading\"></i>\n          {{ 'REFRESH' | translate }}\n        </button>\n\n        <!-- Print Button -->\n        @if (exportType === 4 || exportType === 1 || exportType === 2) {\n          <button\n            (click)=\"print()\"\n            class=\"flex items-center px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\"\n            [pTooltip]=\"'PRINT' | translate\">\n            <i class=\"pi pi-print mr-2 ml-2\"></i>\n            {{ 'PRINT' | translate }}\n          </button>\n        }\n      </div>\n    </div>\n\n    <!-- Preview Content -->\n    <div #previewContainer class=\"bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg\">\n      <!-- HTML Export Preview (Iframe) -->\n      @if (showHtmlInIframe && htmlExportContent || showPdfModal) {\n        <div class=\"html-export-preview\">\n          <iframe\n            id=\"reportIframe\"\n            class=\"w-full border border-gray-300 dark:border-gray-600 rounded-b-lg\"\n            [style.height]=\"'600px'\"\n            title=\"HTML Export Preview\"\n            [src]=\"currentPdfUrl\"\n            width=\"100%\"\n            height=\"100%\"\n            frameborder=\"0\"\n            allowfullscreen\n            >\n            <!--  allowfullscreen -->\n          </iframe>\n        </div>\n      }\n      <!-- <app-pdf-modal\n      *ngIf=\"showPdfModal\"\n      [pdfUrl]=\"currentPdfUrl\"\n      [fileName]=\"currentFileName\"\n      (closed)=\"onPdfModalClose()\"\n      (downloadRequested)=\"onPdfDownload()\">\n    </app-pdf-modal> -->\n\n    <!-- Regular Preview Table -->\n    <!-- <div *ngIf=\"!showHtmlInIframe\" class=\"p-4\">\n    <p-table\n      [value]=\"previewData\"\n      [columns]=\"previewColumns\"\n      [paginator]=\"true\"\n      [rows]=\"10\"\n      [showCurrentPageReport]=\"true\"\n      currentPageReportTemplate=\"Showing {first} to {last} of {totalRecords} entries\"\n      styleClass=\"p-datatable-sm\">\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th *ngFor=\"let col of previewColumns\" class=\"text-left\">\n            {{ col.header }}\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-rowData>\n        <tr>\n          <td *ngFor=\"let col of previewColumns\" class=\"text-left\">\n            {{ rowData[col.field] }}\n          </td>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"emptymessage\">\n        <tr>\n          <td [attr.colspan]=\"previewColumns.length\" class=\"text-center py-4\">\n            <div class=\"text-center py-8\">\n              <i class=\"pi pi-inbox text-4xl text-gray-400 dark:text-gray-500 mb-4\"></i>\n              <p class=\"text-gray-500 dark:text-gray-400\">{{ 'NO_PREVIEW_DATA' | translate }}</p>\n            </div>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n  </div> -->\n</div>\n\n<!-- <div class=\"mt-4 p-3 bg-green-50 dark:bg-green-900/20 rounded-lg\">\n<p class=\"text-sm text-green-700 dark:text-green-300\">\n  <i class=\"pi pi-info-circle mr-2\"></i>\n  {{ 'PREVIEW_INFO' | translate }}\n</p>\n</div> -->\n</div>\n\n<!-- Footer -->\n<div class=\"border-t border-gray-200 dark:border-gray-700 px-2 py-2 bg-gray-50 dark:bg-gray-800\">\n  <div class=\"flex justify-between items-center\">\n    <button\n      type=\"button\"\n      (click)=\"onReset()\"\n      class=\"flex items-center px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-700 rounded-lg transition-colors\"\n      [disabled]=\"loading\">\n      <i class=\"pi pi-refresh mr-2\"></i>\n      {{ 'RESET' | translate }}\n    </button>\n\n    <div class=\"flex gap-2\">\n      <button\n        type=\"button\"\n        (click)=\"ref?.close()\"\n        class=\"px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\"\n        [disabled]=\"loading\">\n        {{ 'CANCEL' | translate }}\n      </button>\n\n      <!-- SplitButton for Export -->\n      <!-- || previewData.length === 0 -->\n      <p-splitButton\n        [label]=\"getExportButtonText()\"\n        [icon]=\"getCurrentExportTypeIcon()\"\n        [model]=\"exportMenuItems\"\n        (onClick)=\"onExport()\"\n        [disabled]=\"loading\"\n        styleClass=\"p-button-primary\">\n      </p-splitButton>\n    </div>\n  </div>\n</div>\n\n<!-- Filters Drawer -->\n@if(showFilters){\n  <p-drawer\n    [(visible)]=\"showFilters\"\n    position=\"right\"\n    [styleClass]=\"'!w-full md:!w-80 lg:!w-[40rem] !h-full' \"\n    [modal]=\"true\"\n    [dismissible]=\"true\"\n    styleClass=\"p-4 w-full max-w-md max-h-[90vh] flex flex-col\">\n    <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit(); showFilters=false\" class=\"flex flex-col flex-1\">\n      <div class=\"flex-1 overflow-auto\">\n        <formly-form\n          [form]=\"form\"\n          [fields]=\"fields_\"\n          [model]=\"model\"\n          [options]=\"options\">\n        </formly-form>\n      </div>\n    </form>\n    <ng-template pTemplate=\"footer\">\n      <div class=\"flex justify-end mt-2 space-x-2 flex-none\">\n        <button\n          type=\"submit\"\n          pButton size=\"small\"\n          (click)=\" onSubmit(); showFilters=false\"\n          label=\"{{ 'SEARCH' | translate }}\">\n        </button>\n        <button\n          type=\"button\"\n          pButton\n          size=\"small\"\n          class=\"p-button-text\"\n          (click)=\"onReset(); showFilters=false\">\n          {{ 'CLEAR' | translate }}\n        </button>\n      </div>\n    </ng-template>\n  </p-drawer>\n}\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1$1.DynamicDialogRef }, { type: i1$1.DynamicDialogConfig }], propDecorators: { previewContainer: [{
+                type: ViewChild,
+                args: ['previewContainer']
+            }], filterFields: [{
+                type: Input
+            }], enableQueryBuilder: [{
+                type: Input
+            }], localExport: [{
+                type: Input
+            }], queryString: [{
+                type: Input
+            }], apiName: [{
+                type: Input
+            }], moduleName: [{
+                type: Input
+            }], model: [{
+                type: Input
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ExportType, GenericReportComponent, GenericReportModule, ReportNameDialogComponent };
+//# sourceMappingURL=es.framework-ng.ui.core-generic-report.mjs.map