gamma-app-controller 1.0.2 → 1.0.3

package/fesm2020/gamma-app-controller.mjs

@@ -2566,6 +2566,8 @@ class ApplicationViewsComponent {
             { "compName": "GammaTableWithPercentageComponent", "item": "Table View with percentage" },
             { "compName": "GammSingleNumberCardComponent", "item": "Single Number Card" }
         ];
+        this.isPopupVisible = false;
+        this.jsonContent = '';
         this.title.setTitle('Application Views');
     }
     ngOnInit() {
@@ -2655,12 +2657,73 @@ class ApplicationViewsComponent {
             this.router.navigate(['/apps/controlPanel/applicationDataset']);
         }
     }
+    importConfigPopup() {
+        this.isPopupVisible = true;
+    }
+    hidePopup() {
+        this.isPopupVisible = false;
+        this.jsonContent = '';
+    }
+    onjsonFileSelected(event) {
+        const input = event.target;
+        if (input.files && input.files.length > 0) {
+            const file = input.files[0];
+            const reader = new FileReader();
+            reader.onload = (e) => {
+                if (e.target) {
+                    const parsedContent = JSON.parse(e.target.result);
+                    parsedContent.viewId = '';
+                    this.jsonContent = JSON.stringify(parsedContent, null, 2);
+                }
+            };
+            reader.readAsText(file);
+        }
+    }
+    submitView() {
+        console.log(this.jsonContent);
+        this.service.createAppViewConfig(JSON.parse(this.jsonContent)).subscribe({
+            next: (data) => {
+                this.toastr.success('View Created Successfully');
+                this.getComponentViewSet();
+                this.isLoader = false;
+            }, error: (err) => {
+                this.toastr.error('Unexpected Server Exception. Please contact System Admin.', 'View Creation');
+            }
+        });
+    }
+    exportJsonFile(item) {
+        if (!item) {
+            this.toastr.error('No data available to export.', 'Export Error');
+            return;
+        }
+        const jsonStr = JSON.stringify(item, null, 2);
+        const blob = new Blob([jsonStr], { type: 'application/json' });
+        const url = window.URL.createObjectURL(blob);
+        const anchor = document.createElement('a');
+        anchor.href = url;
+        anchor.download = `${item.viewName.replace(/ /g, '_')}.json`;
+        anchor.click();
+        window.URL.revokeObjectURL(url);
+    }
+    copyJsonFile(item) {
+        if (!item) {
+            this.toastr.error('No data available to copy.', 'Copy Error');
+            return;
+        }
+        const jsonStr = JSON.stringify(item, null, 2);
+        navigator.clipboard.writeText(jsonStr).then(() => {
+            this.toastr.success('Data copied to clipboard.', 'Success');
+        }).catch(err => {
+            this.toastr.error('Failed to copy data.', 'Copy Error');
+            console.error('Failed to copy text: ', err);
+        });
+    }
 }
 ApplicationViewsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ApplicationViewsComponent, deps: [{ token: ApplicationContentService }, { token: CommonService }, { token: i2$1.ToastrService }, { token: i1$1.Title }, { token: i1.ActivatedRoute }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-ApplicationViewsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ApplicationViewsComponent, selector: "app-application-views", viewQueries: [{ propertyName: "scrollToElement", first: true, predicate: ["scrollToElement"], descendants: true }], ngImport: i0, template: "<div class=\"flex flex-col flex-auto min-w-0\">\n\n    <lib-common-header [pageTitle]=\"'Application Views'\"></lib-common-header>\n\n    <div class=\"p-4 w-full\">\n        <div class=\"m-3 p-4 bg-white border border-gray-200 rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700\">\n            <h6 class=\"mb-2 text-lg tracking-tight text-gray-900\n                dark:text-white border-b pb-3 flex items-center\">\n                <i class=\"fa fa-table mr-2\"></i> Manage Views\n                <div class=\"ml-auto\">\n\n\n                    <button class=\"{{commonService.btnLightWhite}}\" (click)=\"backToPage()\" *ngIf=\"pageId\">\n                        Back To Page\n                    </button>\n\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"createNewComponentView()\">\n                        Add View\n                    </button>\n\n                </div>\n            </h6>\n            <app-loader *ngIf=\"isLoader\"></app-loader>\n            <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"componentViewTableDataSource\"\n                [hoverStateEnabled]=\"true\" *ngIf=\"!isLoader\" [selectedRowKeys]=\"[]\" [showBorders]=\"true\"\n                [showColumnLines]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\">\n                <dxo-paging [pageSize]=\"10\"></dxo-paging>\n                <dxo-export [enabled]=\"true\"></dxo-export>\n                <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\">\n                </dxo-search-panel>\n\n                <dxi-column dataField=\"viewName\"></dxi-column>\n                <!--                <dxi-column dataField=\"datasetName\"></dxi-column>-->\n                <!-- <dxi-column dataField=\"viewLabel\"></dxi-column> -->\n                <dxi-column dataField=\"kpiConfig.formate\"></dxi-column>\n                <dxi-column dataField=\"kpiConfig.componentName\"></dxi-column>\n                <dxi-column dataField=\"viewType\"></dxi-column>\n                <dxi-column dataField=\"createdBy\"></dxi-column>\n                <dxi-column dataField=\"creationDate\"></dxi-column>\n                <dxi-column dataField=\"action\" cellTemplate=\"cellTemplate\" [fixed]=\"true\"\n                    fixedPosition=\"right\"></dxi-column>\n                <div *dxTemplate=\"let data of 'cellTemplate'\">\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"editViews(data.data)\">\n                        Edit\n                    </button>\n                    <!-- <button class=\"{{commonService.btn_warning_md}}\" (click)=\"duplicateViews(data.data)\">\n                        Duplicate\n                    </button> -->\n                    <button class=\"{{commonService.btn_danger_md}}\" (click)=\"deleteDataset(data.data)\">\n                        Delete\n                    </button>\n                </div>\n\n\n\n            </dx-data-grid>\n        </div>\n    </div>\n\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i6.DxoExportComponent, selector: "dxo-export", inputs: ["backgroundColor", "enabled", "fileName", "formats", "margin", "printingEnabled", "proxyUrl", "svgToCanvas", "allowExportSelectedData", "customizeExcelCell", "excelFilterEnabled", "excelWrapTextEnabled", "ignoreExcelErrors", "texts"] }, { kind: "component", type: i9.DxDataGridComponent, selector: "dx-data-grid", inputs: ["accessKey", "activeStateEnabled", "allowColumnReordering", "allowColumnResizing", "autoNavigateToFocusedRow", "cacheEnabled", "cellHintEnabled", "columnAutoWidth", "columnChooser", "columnFixing", "columnHidingEnabled", "columnMinWidth", "columnResizingMode", "columns", "columnWidth", "customizeColumns", "customizeExportData", "dataRowTemplate", "dataSource", "dateSerializationFormat", "disabled", "editing", "elementAttr", "errorRowEnabled", "export", "filterBuilder", "filterBuilderPopup", "filterPanel", "filterRow", "filterSyncEnabled", "filterValue", "focusedColumnIndex", "focusedRowEnabled", "focusedRowIndex", "focusedRowKey", "focusStateEnabled", "grouping", "groupPanel", "headerFilter", "height", "highlightChanges", "hint", "hoverStateEnabled", "keyboardNavigation", "keyExpr", "loadPanel", "masterDetail", "noDataText", "pager", "paging", "remoteOperations", "renderAsync", "repaintChangesOnly", "rowAlternationEnabled", "rowDragging", "rowTemplate", "rtlEnabled", "scrolling", "searchPanel", "selectedRowKeys", "selection", "selectionFilter", "showBorders", "showColumnHeaders", "showColumnLines", "showRowLines", "sortByGroupSummaryInfo", "sorting", "stateStoring", "summary", "syncLookupFilterValues", "tabIndex", "toolbar", "twoWayBindingEnabled", "visible", "width", "wordWrapEnabled"], outputs: ["onAdaptiveDetailRowPreparing", "onCellClick", "onCellDblClick", "onCellHoverChanged", "onCellPrepared", "onContentReady", "onContextMenuPreparing", "onDataErrorOccurred", "onDisposing", "onEditCanceled", "onEditCanceling", "onEditingStart", "onEditorPrepared", "onEditorPreparing", "onExported", "onExporting", "onFileSaving", "onFocusedCellChanged", "onFocusedCellChanging", "onFocusedRowChanged", "onFocusedRowChanging", "onInitialized", "onInitNewRow", "onKeyDown", "onOptionChanged", "onRowClick", "onRowCollapsed", "onRowCollapsing", "onRowDblClick", "onRowExpanded", "onRowExpanding", "onRowInserted", "onRowInserting", "onRowPrepared", "onRowRemoved", "onRowRemoving", "onRowUpdated", "onRowUpdating", "onRowValidating", "onSaved", "onSaving", "onSelectionChanged", "onToolbarPreparing", "accessKeyChange", "activeStateEnabledChange", "allowColumnReorderingChange", "allowColumnResizingChange", "autoNavigateToFocusedRowChange", "cacheEnabledChange", "cellHintEnabledChange", "columnAutoWidthChange", "columnChooserChange", "columnFixingChange", "columnHidingEnabledChange", "columnMinWidthChange", "columnResizingModeChange", "columnsChange", "columnWidthChange", "customizeColumnsChange", "customizeExportDataChange", "dataRowTemplateChange", "dataSourceChange", "dateSerializationFormatChange", "disabledChange", "editingChange", "elementAttrChange", "errorRowEnabledChange", "exportChange", "filterBuilderChange", "filterBuilderPopupChange", "filterPanelChange", "filterRowChange", "filterSyncEnabledChange", "filterValueChange", "focusedColumnIndexChange", "focusedRowEnabledChange", "focusedRowIndexChange", "focusedRowKeyChange", "focusStateEnabledChange", "groupingChange", "groupPanelChange", "headerFilterChange", "heightChange", "highlightChangesChange", "hintChange", "hoverStateEnabledChange", "keyboardNavigationChange", "keyExprChange", "loadPanelChange", "masterDetailChange", "noDataTextChange", "pagerChange", "pagingChange", "remoteOperationsChange", "renderAsyncChange", "repaintChangesOnlyChange", "rowAlternationEnabledChange", "rowDraggingChange", "rowTemplateChange", "rtlEnabledChange", "scrollingChange", "searchPanelChange", "selectedRowKeysChange", "selectionChange", "selectionFilterChange", "showBordersChange", "showColumnHeadersChange", "showColumnLinesChange", "showRowLinesChange", "sortByGroupSummaryInfoChange", "sortingChange", "stateStoringChange", "summaryChange", "syncLookupFilterValuesChange", "tabIndexChange", "toolbarChange", "twoWayBindingEnabledChange", "visibleChange", "widthChange", "wordWrapEnabledChange"] }, { kind: "component", type: i6.DxiColumnComponent, selector: "dxi-column", inputs: ["alignment", "allowEditing", "allowExporting", "allowFiltering", "allowFixing", "allowGrouping", "allowHeaderFiltering", "allowHiding", "allowReordering", "allowResizing", "allowSearch", "allowSorting", "autoExpandGroup", "buttons", "calculateCellValue", "calculateDisplayValue", "calculateFilterExpression", "calculateGroupValue", "calculateSortValue", "caption", "cellTemplate", "columns", "cssClass", "customizeText", "dataField", "dataType", "editCellTemplate", "editorOptions", "encodeHtml", "falseText", "filterOperations", "filterType", "filterValue", "filterValues", "fixed", "fixedPosition", "format", "formItem", "groupCellTemplate", "groupIndex", "headerCellTemplate", "headerFilter", "hidingPriority", "isBand", "lookup", "minWidth", "name", "ownerBand", "renderAsync", "selectedFilterOperation", "setCellValue", "showEditorAlways", "showInColumnChooser", "showWhenGrouped", "sortIndex", "sortingMethod", "sortOrder", "trueText", "type", "validationRules", "visible", "visibleIndex", "width"], outputs: ["filterValueChange", "filterValuesChange", "groupIndexChange", "selectedFilterOperationChange", "sortIndexChange", "sortOrderChange", "visibleChange", "visibleIndexChange"] }, { kind: "component", type: i6.DxoPagingComponent, selector: "dxo-paging", inputs: ["enabled", "pageIndex", "pageSize"], outputs: ["pageIndexChange", "pageSizeChange"] }, { kind: "component", type: i6.DxoSearchPanelComponent, selector: "dxo-search-panel", inputs: ["highlightCaseSensitive", "highlightSearchText", "placeholder", "searchVisibleColumnsOnly", "text", "visible", "width"], outputs: ["textChange"] }, { kind: "component", type: LoaderComponent, selector: "app-loader" }, { kind: "component", type: CommonHeaderComponent, selector: "lib-common-header", inputs: ["pageTitle"] }] });
+ApplicationViewsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ApplicationViewsComponent, selector: "app-application-views", viewQueries: [{ propertyName: "scrollToElement", first: true, predicate: ["scrollToElement"], descendants: true }], ngImport: i0, template: "<div class=\"flex flex-col flex-auto min-w-0\">\n\n    <lib-common-header [pageTitle]=\"'Application Views'\"></lib-common-header>\n\n    <div class=\"p-4 w-full\">\n        <div class=\"m-3 p-4 bg-white border border-gray-200 rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700\">\n            <h6 class=\"mb-2 text-lg tracking-tight text-gray-900\n                dark:text-white border-b pb-3 flex items-center\">\n                <i class=\"fa fa-table mr-2\"></i> Manage Views\n                <div class=\"ml-auto\">\n\n\n                    <button class=\"{{commonService.btnLightWhite}}\" (click)=\"backToPage()\" *ngIf=\"pageId\">\n                        Back To Page\n                    </button>\n                    <button (click)=\"importConfigPopup()\" class=\"{{commonService.btn_warning_md}}\">\n                        Import Config\n                    </button>\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"createNewComponentView()\">\n                        Add View\n                    </button>\n\n                </div>\n            </h6>\n            <app-loader *ngIf=\"isLoader\"></app-loader>\n            <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"componentViewTableDataSource\"\n                [hoverStateEnabled]=\"true\" *ngIf=\"!isLoader\" [selectedRowKeys]=\"[]\" [showBorders]=\"true\"\n                [showColumnLines]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\">\n                <dxo-paging [pageSize]=\"10\"></dxo-paging>\n                <dxo-export [enabled]=\"true\"></dxo-export>\n                <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\">\n                </dxo-search-panel>\n\n                <dxi-column dataField=\"viewName\"></dxi-column>\n                <!--                <dxi-column dataField=\"datasetName\"></dxi-column>-->\n                <!-- <dxi-column dataField=\"viewLabel\"></dxi-column> -->\n                <dxi-column dataField=\"kpiConfig.formate\"></dxi-column>\n                <dxi-column dataField=\"kpiConfig.componentName\"></dxi-column>\n                <dxi-column dataField=\"viewType\"></dxi-column>\n                <dxi-column dataField=\"createdBy\"></dxi-column>\n                <dxi-column dataField=\"creationDate\"></dxi-column>\n                <dxi-column dataField=\"action\" cellTemplate=\"cellTemplate\" [fixed]=\"true\"\n                    fixedPosition=\"right\"></dxi-column>\n                <div *dxTemplate=\"let data of 'cellTemplate'\">\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"editViews(data.data)\">\n                        Edit\n                    </button>\n                    <!-- <button class=\"{{commonService.btn_warning_md}}\" (click)=\"duplicateViews(data.data)\">\n                        Duplicate\n                    </button> -->\n                    <button class=\"{{commonService.btn_danger_md}}\" (click)=\"deleteDataset(data.data)\">\n                        Delete\n                    </button>\n\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"exportJsonFile(data.data)\"\n                        title=\"Export View\">\n                        <i class=\"fa fa-sign-out\"></i>\n\n                    </button>\n                    <button class=\"{{commonService.btn_warning_md}}\" (click)=\"copyJsonFile(data.data)\"\n                        title=\"Copy as Json\">\n                        <i class=\"fa fa-files-o\"></i>\n\n\n                    </button>\n                </div>\n\n\n\n            </dx-data-grid>\n        </div>\n    </div>\n\n</div>\n\n\n<dx-popup [(visible)]=\"isPopupVisible\" [dragEnabled]=\"false\" [closeOnOutsideClick]=\"false\" [showTitle]=\"true\"\n    title=\"Model Editor\" [width]=\"1000\" [height]=\"620\">\n\n    <div>\n        <button (click)=\"hidePopup()\" class=\"btn btn-secondary\"></button>\n        <div class=\"m-2 flex items-center justify-between\">\n            <input type=\"file\" #fileInput accept=\".json\"\n                class=\"block w-3/5 p-2 text-sm text-gray-400 border border-gray-700 rounded-lg bg-gray-800 focus:ring-blue-500 focus:border-blue-500\"\n                (change)=\"onjsonFileSelected($event)\">\n            <button (click)=\"submitView()\" class=\"{{commonService.btn_success_md}} mr-4\">Submit</button>\n\n        </div>\n        <textarea [(ngModel)]=\"jsonContent\"\n            class=\"w-full h-100 p-2  border border-gray-700 rounded-lg bg-gray-800 text-gray-400\"></textarea>\n    </div>\n</dx-popup>", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i6.DxoExportComponent, selector: "dxo-export", inputs: ["backgroundColor", "enabled", "fileName", "formats", "margin", "printingEnabled", "proxyUrl", "svgToCanvas", "allowExportSelectedData", "customizeExcelCell", "excelFilterEnabled", "excelWrapTextEnabled", "ignoreExcelErrors", "texts"] }, { kind: "component", type: i9.DxDataGridComponent, selector: "dx-data-grid", inputs: ["accessKey", "activeStateEnabled", "allowColumnReordering", "allowColumnResizing", "autoNavigateToFocusedRow", "cacheEnabled", "cellHintEnabled", "columnAutoWidth", "columnChooser", "columnFixing", "columnHidingEnabled", "columnMinWidth", "columnResizingMode", "columns", "columnWidth", "customizeColumns", "customizeExportData", "dataRowTemplate", "dataSource", "dateSerializationFormat", "disabled", "editing", "elementAttr", "errorRowEnabled", "export", "filterBuilder", "filterBuilderPopup", "filterPanel", "filterRow", "filterSyncEnabled", "filterValue", "focusedColumnIndex", "focusedRowEnabled", "focusedRowIndex", "focusedRowKey", "focusStateEnabled", "grouping", "groupPanel", "headerFilter", "height", "highlightChanges", "hint", "hoverStateEnabled", "keyboardNavigation", "keyExpr", "loadPanel", "masterDetail", "noDataText", "pager", "paging", "remoteOperations", "renderAsync", "repaintChangesOnly", "rowAlternationEnabled", "rowDragging", "rowTemplate", "rtlEnabled", "scrolling", "searchPanel", "selectedRowKeys", "selection", "selectionFilter", "showBorders", "showColumnHeaders", "showColumnLines", "showRowLines", "sortByGroupSummaryInfo", "sorting", "stateStoring", "summary", "syncLookupFilterValues", "tabIndex", "toolbar", "twoWayBindingEnabled", "visible", "width", "wordWrapEnabled"], outputs: ["onAdaptiveDetailRowPreparing", "onCellClick", "onCellDblClick", "onCellHoverChanged", "onCellPrepared", "onContentReady", "onContextMenuPreparing", "onDataErrorOccurred", "onDisposing", "onEditCanceled", "onEditCanceling", "onEditingStart", "onEditorPrepared", "onEditorPreparing", "onExported", "onExporting", "onFileSaving", "onFocusedCellChanged", "onFocusedCellChanging", "onFocusedRowChanged", "onFocusedRowChanging", "onInitialized", "onInitNewRow", "onKeyDown", "onOptionChanged", "onRowClick", "onRowCollapsed", "onRowCollapsing", "onRowDblClick", "onRowExpanded", "onRowExpanding", "onRowInserted", "onRowInserting", "onRowPrepared", "onRowRemoved", "onRowRemoving", "onRowUpdated", "onRowUpdating", "onRowValidating", "onSaved", "onSaving", "onSelectionChanged", "onToolbarPreparing", "accessKeyChange", "activeStateEnabledChange", "allowColumnReorderingChange", "allowColumnResizingChange", "autoNavigateToFocusedRowChange", "cacheEnabledChange", "cellHintEnabledChange", "columnAutoWidthChange", "columnChooserChange", "columnFixingChange", "columnHidingEnabledChange", "columnMinWidthChange", "columnResizingModeChange", "columnsChange", "columnWidthChange", "customizeColumnsChange", "customizeExportDataChange", "dataRowTemplateChange", "dataSourceChange", "dateSerializationFormatChange", "disabledChange", "editingChange", "elementAttrChange", "errorRowEnabledChange", "exportChange", "filterBuilderChange", "filterBuilderPopupChange", "filterPanelChange", "filterRowChange", "filterSyncEnabledChange", "filterValueChange", "focusedColumnIndexChange", "focusedRowEnabledChange", "focusedRowIndexChange", "focusedRowKeyChange", "focusStateEnabledChange", "groupingChange", "groupPanelChange", "headerFilterChange", "heightChange", "highlightChangesChange", "hintChange", "hoverStateEnabledChange", "keyboardNavigationChange", "keyExprChange", "loadPanelChange", "masterDetailChange", "noDataTextChange", "pagerChange", "pagingChange", "remoteOperationsChange", "renderAsyncChange", "repaintChangesOnlyChange", "rowAlternationEnabledChange", "rowDraggingChange", "rowTemplateChange", "rtlEnabledChange", "scrollingChange", "searchPanelChange", "selectedRowKeysChange", "selectionChange", "selectionFilterChange", "showBordersChange", "showColumnHeadersChange", "showColumnLinesChange", "showRowLinesChange", "sortByGroupSummaryInfoChange", "sortingChange", "stateStoringChange", "summaryChange", "syncLookupFilterValuesChange", "tabIndexChange", "toolbarChange", "twoWayBindingEnabledChange", "visibleChange", "widthChange", "wordWrapEnabledChange"] }, { kind: "component", type: i6.DxiColumnComponent, selector: "dxi-column", inputs: ["alignment", "allowEditing", "allowExporting", "allowFiltering", "allowFixing", "allowGrouping", "allowHeaderFiltering", "allowHiding", "allowReordering", "allowResizing", "allowSearch", "allowSorting", "autoExpandGroup", "buttons", "calculateCellValue", "calculateDisplayValue", "calculateFilterExpression", "calculateGroupValue", "calculateSortValue", "caption", "cellTemplate", "columns", "cssClass", "customizeText", "dataField", "dataType", "editCellTemplate", "editorOptions", "encodeHtml", "falseText", "filterOperations", "filterType", "filterValue", "filterValues", "fixed", "fixedPosition", "format", "formItem", "groupCellTemplate", "groupIndex", "headerCellTemplate", "headerFilter", "hidingPriority", "isBand", "lookup", "minWidth", "name", "ownerBand", "renderAsync", "selectedFilterOperation", "setCellValue", "showEditorAlways", "showInColumnChooser", "showWhenGrouped", "sortIndex", "sortingMethod", "sortOrder", "trueText", "type", "validationRules", "visible", "visibleIndex", "width"], outputs: ["filterValueChange", "filterValuesChange", "groupIndexChange", "selectedFilterOperationChange", "sortIndexChange", "sortOrderChange", "visibleChange", "visibleIndexChange"] }, { kind: "component", type: i6.DxoPagingComponent, selector: "dxo-paging", inputs: ["enabled", "pageIndex", "pageSize"], outputs: ["pageIndexChange", "pageSizeChange"] }, { kind: "component", type: i6.DxoSearchPanelComponent, selector: "dxo-search-panel", inputs: ["highlightCaseSensitive", "highlightSearchText", "placeholder", "searchVisibleColumnsOnly", "text", "visible", "width"], outputs: ["textChange"] }, { kind: "component", type: i4$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "elementAttr", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "elementAttrChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "app-loader" }, { kind: "component", type: CommonHeaderComponent, selector: "lib-common-header", inputs: ["pageTitle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ApplicationViewsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-application-views', template: "<div class=\"flex flex-col flex-auto min-w-0\">\n\n    <lib-common-header [pageTitle]=\"'Application Views'\"></lib-common-header>\n\n    <div class=\"p-4 w-full\">\n        <div class=\"m-3 p-4 bg-white border border-gray-200 rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700\">\n            <h6 class=\"mb-2 text-lg tracking-tight text-gray-900\n                dark:text-white border-b pb-3 flex items-center\">\n                <i class=\"fa fa-table mr-2\"></i> Manage Views\n                <div class=\"ml-auto\">\n\n\n                    <button class=\"{{commonService.btnLightWhite}}\" (click)=\"backToPage()\" *ngIf=\"pageId\">\n                        Back To Page\n                    </button>\n\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"createNewComponentView()\">\n                        Add View\n                    </button>\n\n                </div>\n            </h6>\n            <app-loader *ngIf=\"isLoader\"></app-loader>\n            <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"componentViewTableDataSource\"\n                [hoverStateEnabled]=\"true\" *ngIf=\"!isLoader\" [selectedRowKeys]=\"[]\" [showBorders]=\"true\"\n                [showColumnLines]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\">\n                <dxo-paging [pageSize]=\"10\"></dxo-paging>\n                <dxo-export [enabled]=\"true\"></dxo-export>\n                <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\">\n                </dxo-search-panel>\n\n                <dxi-column dataField=\"viewName\"></dxi-column>\n                <!--                <dxi-column dataField=\"datasetName\"></dxi-column>-->\n                <!-- <dxi-column dataField=\"viewLabel\"></dxi-column> -->\n                <dxi-column dataField=\"kpiConfig.formate\"></dxi-column>\n                <dxi-column dataField=\"kpiConfig.componentName\"></dxi-column>\n                <dxi-column dataField=\"viewType\"></dxi-column>\n                <dxi-column dataField=\"createdBy\"></dxi-column>\n                <dxi-column dataField=\"creationDate\"></dxi-column>\n                <dxi-column dataField=\"action\" cellTemplate=\"cellTemplate\" [fixed]=\"true\"\n                    fixedPosition=\"right\"></dxi-column>\n                <div *dxTemplate=\"let data of 'cellTemplate'\">\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"editViews(data.data)\">\n                        Edit\n                    </button>\n                    <!-- <button class=\"{{commonService.btn_warning_md}}\" (click)=\"duplicateViews(data.data)\">\n                        Duplicate\n                    </button> -->\n                    <button class=\"{{commonService.btn_danger_md}}\" (click)=\"deleteDataset(data.data)\">\n                        Delete\n                    </button>\n                </div>\n\n\n\n            </dx-data-grid>\n        </div>\n    </div>\n\n</div>" }]
+            args: [{ selector: 'app-application-views', template: "<div class=\"flex flex-col flex-auto min-w-0\">\n\n    <lib-common-header [pageTitle]=\"'Application Views'\"></lib-common-header>\n\n    <div class=\"p-4 w-full\">\n        <div class=\"m-3 p-4 bg-white border border-gray-200 rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700\">\n            <h6 class=\"mb-2 text-lg tracking-tight text-gray-900\n                dark:text-white border-b pb-3 flex items-center\">\n                <i class=\"fa fa-table mr-2\"></i> Manage Views\n                <div class=\"ml-auto\">\n\n\n                    <button class=\"{{commonService.btnLightWhite}}\" (click)=\"backToPage()\" *ngIf=\"pageId\">\n                        Back To Page\n                    </button>\n                    <button (click)=\"importConfigPopup()\" class=\"{{commonService.btn_warning_md}}\">\n                        Import Config\n                    </button>\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"createNewComponentView()\">\n                        Add View\n                    </button>\n\n                </div>\n            </h6>\n            <app-loader *ngIf=\"isLoader\"></app-loader>\n            <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"componentViewTableDataSource\"\n                [hoverStateEnabled]=\"true\" *ngIf=\"!isLoader\" [selectedRowKeys]=\"[]\" [showBorders]=\"true\"\n                [showColumnLines]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\">\n                <dxo-paging [pageSize]=\"10\"></dxo-paging>\n                <dxo-export [enabled]=\"true\"></dxo-export>\n                <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\">\n                </dxo-search-panel>\n\n                <dxi-column dataField=\"viewName\"></dxi-column>\n                <!--                <dxi-column dataField=\"datasetName\"></dxi-column>-->\n                <!-- <dxi-column dataField=\"viewLabel\"></dxi-column> -->\n                <dxi-column dataField=\"kpiConfig.formate\"></dxi-column>\n                <dxi-column dataField=\"kpiConfig.componentName\"></dxi-column>\n                <dxi-column dataField=\"viewType\"></dxi-column>\n                <dxi-column dataField=\"createdBy\"></dxi-column>\n                <dxi-column dataField=\"creationDate\"></dxi-column>\n                <dxi-column dataField=\"action\" cellTemplate=\"cellTemplate\" [fixed]=\"true\"\n                    fixedPosition=\"right\"></dxi-column>\n                <div *dxTemplate=\"let data of 'cellTemplate'\">\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"editViews(data.data)\">\n                        Edit\n                    </button>\n                    <!-- <button class=\"{{commonService.btn_warning_md}}\" (click)=\"duplicateViews(data.data)\">\n                        Duplicate\n                    </button> -->\n                    <button class=\"{{commonService.btn_danger_md}}\" (click)=\"deleteDataset(data.data)\">\n                        Delete\n                    </button>\n\n                    <button class=\"{{commonService.btn_primary_md}}\" (click)=\"exportJsonFile(data.data)\"\n                        title=\"Export View\">\n                        <i class=\"fa fa-sign-out\"></i>\n\n                    </button>\n                    <button class=\"{{commonService.btn_warning_md}}\" (click)=\"copyJsonFile(data.data)\"\n                        title=\"Copy as Json\">\n                        <i class=\"fa fa-files-o\"></i>\n\n\n                    </button>\n                </div>\n\n\n\n            </dx-data-grid>\n        </div>\n    </div>\n\n</div>\n\n\n<dx-popup [(visible)]=\"isPopupVisible\" [dragEnabled]=\"false\" [closeOnOutsideClick]=\"false\" [showTitle]=\"true\"\n    title=\"Model Editor\" [width]=\"1000\" [height]=\"620\">\n\n    <div>\n        <button (click)=\"hidePopup()\" class=\"btn btn-secondary\"></button>\n        <div class=\"m-2 flex items-center justify-between\">\n            <input type=\"file\" #fileInput accept=\".json\"\n                class=\"block w-3/5 p-2 text-sm text-gray-400 border border-gray-700 rounded-lg bg-gray-800 focus:ring-blue-500 focus:border-blue-500\"\n                (change)=\"onjsonFileSelected($event)\">\n            <button (click)=\"submitView()\" class=\"{{commonService.btn_success_md}} mr-4\">Submit</button>\n\n        </div>\n        <textarea [(ngModel)]=\"jsonContent\"\n            class=\"w-full h-100 p-2  border border-gray-700 rounded-lg bg-gray-800 text-gray-400\"></textarea>\n    </div>\n</dx-popup>" }]
         }], ctorParameters: function () { return [{ type: ApplicationContentService }, { type: CommonService }, { type: i2$1.ToastrService }, { type: i1$1.Title }, { type: i1.ActivatedRoute }, { type: i1.Router }]; }, propDecorators: { scrollToElement: [{
                 type: ViewChild,
                 args: ['scrollToElement']
@@ -6285,10 +6348,10 @@ class GammaTableWithPercentageComponent {
     }
 }
 GammaTableWithPercentageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: GammaTableWithPercentageComponent, deps: [{ token: CommonService }, { token: i2$1.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
-GammaTableWithPercentageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: GammaTableWithPercentageComponent, selector: "app-gamma-table-with-percentage", inputs: { chartDataSource: "chartDataSource" }, ngImport: i0, template: "<div class=\"mx-2\">\n    <ng-container *ngIf=\"isLoader\">\n        <app-loader></app-loader>\n    </ng-container>\n    <ng-container *ngIf=\"!isLoader\">\n        <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"tableDataSource\" [selectedRowKeys]=\"[]\"\n            [showBorders]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\" [height]=\"370\">\n            <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\"></dxo-search-panel>\n            <dxo-export [enabled]=\"true\"></dxo-export>\n            <dxo-paging [pageSize]=\"7\"></dxo-paging>\n            <dxo-pager [showInfo]=\"true\" [showPageSizeSelector]=\"false\">\n            </dxo-pager>\n            <dxo-selection mode=\"single\"></dxo-selection>\n            <dxi-column dataField=\"eventType\"></dxi-column>\n            <dxi-column dataField=\"access_cost_sar\" cellTemplate=\"cellTemplate1\"></dxi-column>\n            <dxi-column dataField=\"margin_sar\" cellTemplate=\"cellTemplate2\"></dxi-column>\n            <dxi-column dataField=\"ict_cost_sar\" cellTemplate=\"cellTemplate3\"></dxi-column>\n            <dxi-column dataField=\"revenue\" cellTemplate=\"cellTemplate4\"></dxi-column>\n\n\n            <div *dxTemplate=\"let data of 'cellTemplate1'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n            <div *dxTemplate=\"let data of 'cellTemplate2'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n            <div *dxTemplate=\"let data of 'cellTemplate3'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n            <div *dxTemplate=\"let data of 'cellTemplate4'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n\n        </dx-data-grid>\n    </ng-container>\n\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i6.DxoExportComponent, selector: "dxo-export", inputs: ["backgroundColor", "enabled", "fileName", "formats", "margin", "printingEnabled", "proxyUrl", "svgToCanvas", "allowExportSelectedData", "customizeExcelCell", "excelFilterEnabled", "excelWrapTextEnabled", "ignoreExcelErrors", "texts"] }, { kind: "component", type: i9.DxDataGridComponent, selector: "dx-data-grid", inputs: ["accessKey", "activeStateEnabled", "allowColumnReordering", "allowColumnResizing", "autoNavigateToFocusedRow", "cacheEnabled", "cellHintEnabled", "columnAutoWidth", "columnChooser", "columnFixing", "columnHidingEnabled", "columnMinWidth", "columnResizingMode", "columns", "columnWidth", "customizeColumns", "customizeExportData", "dataRowTemplate", "dataSource", "dateSerializationFormat", "disabled", "editing", "elementAttr", "errorRowEnabled", "export", "filterBuilder", "filterBuilderPopup", "filterPanel", "filterRow", "filterSyncEnabled", "filterValue", "focusedColumnIndex", "focusedRowEnabled", "focusedRowIndex", "focusedRowKey", "focusStateEnabled", "grouping", "groupPanel", "headerFilter", "height", "highlightChanges", "hint", "hoverStateEnabled", "keyboardNavigation", "keyExpr", "loadPanel", "masterDetail", "noDataText", "pager", "paging", "remoteOperations", "renderAsync", "repaintChangesOnly", "rowAlternationEnabled", "rowDragging", "rowTemplate", "rtlEnabled", "scrolling", "searchPanel", "selectedRowKeys", "selection", "selectionFilter", "showBorders", "showColumnHeaders", "showColumnLines", "showRowLines", "sortByGroupSummaryInfo", "sorting", "stateStoring", "summary", "syncLookupFilterValues", "tabIndex", "toolbar", "twoWayBindingEnabled", "visible", "width", "wordWrapEnabled"], outputs: ["onAdaptiveDetailRowPreparing", "onCellClick", "onCellDblClick", "onCellHoverChanged", "onCellPrepared", "onContentReady", "onContextMenuPreparing", "onDataErrorOccurred", "onDisposing", "onEditCanceled", "onEditCanceling", "onEditingStart", "onEditorPrepared", "onEditorPreparing", "onExported", "onExporting", "onFileSaving", "onFocusedCellChanged", "onFocusedCellChanging", "onFocusedRowChanged", "onFocusedRowChanging", "onInitialized", "onInitNewRow", "onKeyDown", "onOptionChanged", "onRowClick", "onRowCollapsed", "onRowCollapsing", "onRowDblClick", "onRowExpanded", "onRowExpanding", "onRowInserted", "onRowInserting", "onRowPrepared", "onRowRemoved", "onRowRemoving", "onRowUpdated", "onRowUpdating", "onRowValidating", "onSaved", "onSaving", "onSelectionChanged", "onToolbarPreparing", "accessKeyChange", "activeStateEnabledChange", "allowColumnReorderingChange", "allowColumnResizingChange", "autoNavigateToFocusedRowChange", "cacheEnabledChange", "cellHintEnabledChange", "columnAutoWidthChange", "columnChooserChange", "columnFixingChange", "columnHidingEnabledChange", "columnMinWidthChange", "columnResizingModeChange", "columnsChange", "columnWidthChange", "customizeColumnsChange", "customizeExportDataChange", "dataRowTemplateChange", "dataSourceChange", "dateSerializationFormatChange", "disabledChange", "editingChange", "elementAttrChange", "errorRowEnabledChange", "exportChange", "filterBuilderChange", "filterBuilderPopupChange", "filterPanelChange", "filterRowChange", "filterSyncEnabledChange", "filterValueChange", "focusedColumnIndexChange", "focusedRowEnabledChange", "focusedRowIndexChange", "focusedRowKeyChange", "focusStateEnabledChange", "groupingChange", "groupPanelChange", "headerFilterChange", "heightChange", "highlightChangesChange", "hintChange", "hoverStateEnabledChange", "keyboardNavigationChange", "keyExprChange", "loadPanelChange", "masterDetailChange", "noDataTextChange", "pagerChange", "pagingChange", "remoteOperationsChange", "renderAsyncChange", "repaintChangesOnlyChange", "rowAlternationEnabledChange", "rowDraggingChange", "rowTemplateChange", "rtlEnabledChange", "scrollingChange", "searchPanelChange", "selectedRowKeysChange", "selectionChange", "selectionFilterChange", "showBordersChange", "showColumnHeadersChange", "showColumnLinesChange", "showRowLinesChange", "sortByGroupSummaryInfoChange", "sortingChange", "stateStoringChange", "summaryChange", "syncLookupFilterValuesChange", "tabIndexChange", "toolbarChange", "twoWayBindingEnabledChange", "visibleChange", "widthChange", "wordWrapEnabledChange"] }, { kind: "component", type: i6.DxiColumnComponent, selector: "dxi-column", inputs: ["alignment", "allowEditing", "allowExporting", "allowFiltering", "allowFixing", "allowGrouping", "allowHeaderFiltering", "allowHiding", "allowReordering", "allowResizing", "allowSearch", "allowSorting", "autoExpandGroup", "buttons", "calculateCellValue", "calculateDisplayValue", "calculateFilterExpression", "calculateGroupValue", "calculateSortValue", "caption", "cellTemplate", "columns", "cssClass", "customizeText", "dataField", "dataType", "editCellTemplate", "editorOptions", "encodeHtml", "falseText", "filterOperations", "filterType", "filterValue", "filterValues", "fixed", "fixedPosition", "format", "formItem", "groupCellTemplate", "groupIndex", "headerCellTemplate", "headerFilter", "hidingPriority", "isBand", "lookup", "minWidth", "name", "ownerBand", "renderAsync", "selectedFilterOperation", "setCellValue", "showEditorAlways", "showInColumnChooser", "showWhenGrouped", "sortIndex", "sortingMethod", "sortOrder", "trueText", "type", "validationRules", "visible", "visibleIndex", "width"], outputs: ["filterValueChange", "filterValuesChange", "groupIndexChange", "selectedFilterOperationChange", "sortIndexChange", "sortOrderChange", "visibleChange", "visibleIndexChange"] }, { kind: "component", type: i6.DxoPagerComponent, selector: "dxo-pager", inputs: ["allowedPageSizes", "displayMode", "infoText", "showInfo", "showNavigationButtons", "showPageSizeSelector", "visible"] }, { kind: "component", type: i6.DxoPagingComponent, selector: "dxo-paging", inputs: ["enabled", "pageIndex", "pageSize"], outputs: ["pageIndexChange", "pageSizeChange"] }, { kind: "component", type: i6.DxoSearchPanelComponent, selector: "dxo-search-panel", inputs: ["highlightCaseSensitive", "highlightSearchText", "placeholder", "searchVisibleColumnsOnly", "text", "visible", "width"], outputs: ["textChange"] }, { kind: "component", type: i6.DxoSelectionComponent, selector: "dxo-selection", inputs: ["allowSelectAll", "deferred", "mode", "selectAllMode", "showCheckBoxesMode", "recursive"] }, { kind: "component", type: LoaderComponent, selector: "app-loader" }, { kind: "pipe", type: contentSafeHtml, name: "contentSafeHtml" }] });
+GammaTableWithPercentageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: GammaTableWithPercentageComponent, selector: "app-gamma-table-with-percentage", inputs: { chartDataSource: "chartDataSource" }, ngImport: i0, template: "<div class=\"mx-2 bg-gray-800\">\n    <ng-container *ngIf=\"isLoader\">\n        <div class=\"flex justify-center items-start bg-gray-800 p-2\">\n            <app-loader></app-loader>\n        </div>\n    </ng-container>\n\n    <div class=\"mx-2 pb-2\">\n        <ng-container *ngIf=\"!isLoader\">\n            <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"tableDataSource\" [selectedRowKeys]=\"[]\"\n                [showBorders]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\" [height]=\"370\">\n                <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\"></dxo-search-panel>\n                <dxo-export [enabled]=\"true\"></dxo-export>\n                <dxo-paging [pageSize]=\"7\"></dxo-paging>\n                <dxo-pager [showInfo]=\"true\" [showPageSizeSelector]=\"false\">\n                </dxo-pager>\n                <dxo-selection mode=\"single\"></dxo-selection>\n                <dxi-column dataField=\"eventType\"></dxi-column>\n                <dxi-column dataField=\"access_cost_sar\" cellTemplate=\"cellTemplate1\"></dxi-column>\n                <dxi-column dataField=\"margin_sar\" cellTemplate=\"cellTemplate2\"></dxi-column>\n                <dxi-column dataField=\"ict_cost_sar\" cellTemplate=\"cellTemplate3\"></dxi-column>\n                <dxi-column dataField=\"revenue\" cellTemplate=\"cellTemplate4\"></dxi-column>\n\n\n                <div *dxTemplate=\"let data of 'cellTemplate1'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n                <div *dxTemplate=\"let data of 'cellTemplate2'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n                <div *dxTemplate=\"let data of 'cellTemplate3'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n                <div *dxTemplate=\"let data of 'cellTemplate4'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n\n            </dx-data-grid>\n        </ng-container>\n\n    </div>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i6.DxoExportComponent, selector: "dxo-export", inputs: ["backgroundColor", "enabled", "fileName", "formats", "margin", "printingEnabled", "proxyUrl", "svgToCanvas", "allowExportSelectedData", "customizeExcelCell", "excelFilterEnabled", "excelWrapTextEnabled", "ignoreExcelErrors", "texts"] }, { kind: "component", type: i9.DxDataGridComponent, selector: "dx-data-grid", inputs: ["accessKey", "activeStateEnabled", "allowColumnReordering", "allowColumnResizing", "autoNavigateToFocusedRow", "cacheEnabled", "cellHintEnabled", "columnAutoWidth", "columnChooser", "columnFixing", "columnHidingEnabled", "columnMinWidth", "columnResizingMode", "columns", "columnWidth", "customizeColumns", "customizeExportData", "dataRowTemplate", "dataSource", "dateSerializationFormat", "disabled", "editing", "elementAttr", "errorRowEnabled", "export", "filterBuilder", "filterBuilderPopup", "filterPanel", "filterRow", "filterSyncEnabled", "filterValue", "focusedColumnIndex", "focusedRowEnabled", "focusedRowIndex", "focusedRowKey", "focusStateEnabled", "grouping", "groupPanel", "headerFilter", "height", "highlightChanges", "hint", "hoverStateEnabled", "keyboardNavigation", "keyExpr", "loadPanel", "masterDetail", "noDataText", "pager", "paging", "remoteOperations", "renderAsync", "repaintChangesOnly", "rowAlternationEnabled", "rowDragging", "rowTemplate", "rtlEnabled", "scrolling", "searchPanel", "selectedRowKeys", "selection", "selectionFilter", "showBorders", "showColumnHeaders", "showColumnLines", "showRowLines", "sortByGroupSummaryInfo", "sorting", "stateStoring", "summary", "syncLookupFilterValues", "tabIndex", "toolbar", "twoWayBindingEnabled", "visible", "width", "wordWrapEnabled"], outputs: ["onAdaptiveDetailRowPreparing", "onCellClick", "onCellDblClick", "onCellHoverChanged", "onCellPrepared", "onContentReady", "onContextMenuPreparing", "onDataErrorOccurred", "onDisposing", "onEditCanceled", "onEditCanceling", "onEditingStart", "onEditorPrepared", "onEditorPreparing", "onExported", "onExporting", "onFileSaving", "onFocusedCellChanged", "onFocusedCellChanging", "onFocusedRowChanged", "onFocusedRowChanging", "onInitialized", "onInitNewRow", "onKeyDown", "onOptionChanged", "onRowClick", "onRowCollapsed", "onRowCollapsing", "onRowDblClick", "onRowExpanded", "onRowExpanding", "onRowInserted", "onRowInserting", "onRowPrepared", "onRowRemoved", "onRowRemoving", "onRowUpdated", "onRowUpdating", "onRowValidating", "onSaved", "onSaving", "onSelectionChanged", "onToolbarPreparing", "accessKeyChange", "activeStateEnabledChange", "allowColumnReorderingChange", "allowColumnResizingChange", "autoNavigateToFocusedRowChange", "cacheEnabledChange", "cellHintEnabledChange", "columnAutoWidthChange", "columnChooserChange", "columnFixingChange", "columnHidingEnabledChange", "columnMinWidthChange", "columnResizingModeChange", "columnsChange", "columnWidthChange", "customizeColumnsChange", "customizeExportDataChange", "dataRowTemplateChange", "dataSourceChange", "dateSerializationFormatChange", "disabledChange", "editingChange", "elementAttrChange", "errorRowEnabledChange", "exportChange", "filterBuilderChange", "filterBuilderPopupChange", "filterPanelChange", "filterRowChange", "filterSyncEnabledChange", "filterValueChange", "focusedColumnIndexChange", "focusedRowEnabledChange", "focusedRowIndexChange", "focusedRowKeyChange", "focusStateEnabledChange", "groupingChange", "groupPanelChange", "headerFilterChange", "heightChange", "highlightChangesChange", "hintChange", "hoverStateEnabledChange", "keyboardNavigationChange", "keyExprChange", "loadPanelChange", "masterDetailChange", "noDataTextChange", "pagerChange", "pagingChange", "remoteOperationsChange", "renderAsyncChange", "repaintChangesOnlyChange", "rowAlternationEnabledChange", "rowDraggingChange", "rowTemplateChange", "rtlEnabledChange", "scrollingChange", "searchPanelChange", "selectedRowKeysChange", "selectionChange", "selectionFilterChange", "showBordersChange", "showColumnHeadersChange", "showColumnLinesChange", "showRowLinesChange", "sortByGroupSummaryInfoChange", "sortingChange", "stateStoringChange", "summaryChange", "syncLookupFilterValuesChange", "tabIndexChange", "toolbarChange", "twoWayBindingEnabledChange", "visibleChange", "widthChange", "wordWrapEnabledChange"] }, { kind: "component", type: i6.DxiColumnComponent, selector: "dxi-column", inputs: ["alignment", "allowEditing", "allowExporting", "allowFiltering", "allowFixing", "allowGrouping", "allowHeaderFiltering", "allowHiding", "allowReordering", "allowResizing", "allowSearch", "allowSorting", "autoExpandGroup", "buttons", "calculateCellValue", "calculateDisplayValue", "calculateFilterExpression", "calculateGroupValue", "calculateSortValue", "caption", "cellTemplate", "columns", "cssClass", "customizeText", "dataField", "dataType", "editCellTemplate", "editorOptions", "encodeHtml", "falseText", "filterOperations", "filterType", "filterValue", "filterValues", "fixed", "fixedPosition", "format", "formItem", "groupCellTemplate", "groupIndex", "headerCellTemplate", "headerFilter", "hidingPriority", "isBand", "lookup", "minWidth", "name", "ownerBand", "renderAsync", "selectedFilterOperation", "setCellValue", "showEditorAlways", "showInColumnChooser", "showWhenGrouped", "sortIndex", "sortingMethod", "sortOrder", "trueText", "type", "validationRules", "visible", "visibleIndex", "width"], outputs: ["filterValueChange", "filterValuesChange", "groupIndexChange", "selectedFilterOperationChange", "sortIndexChange", "sortOrderChange", "visibleChange", "visibleIndexChange"] }, { kind: "component", type: i6.DxoPagerComponent, selector: "dxo-pager", inputs: ["allowedPageSizes", "displayMode", "infoText", "showInfo", "showNavigationButtons", "showPageSizeSelector", "visible"] }, { kind: "component", type: i6.DxoPagingComponent, selector: "dxo-paging", inputs: ["enabled", "pageIndex", "pageSize"], outputs: ["pageIndexChange", "pageSizeChange"] }, { kind: "component", type: i6.DxoSearchPanelComponent, selector: "dxo-search-panel", inputs: ["highlightCaseSensitive", "highlightSearchText", "placeholder", "searchVisibleColumnsOnly", "text", "visible", "width"], outputs: ["textChange"] }, { kind: "component", type: i6.DxoSelectionComponent, selector: "dxo-selection", inputs: ["allowSelectAll", "deferred", "mode", "selectAllMode", "showCheckBoxesMode", "recursive"] }, { kind: "component", type: LoaderComponent, selector: "app-loader" }, { kind: "pipe", type: contentSafeHtml, name: "contentSafeHtml" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: GammaTableWithPercentageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-gamma-table-with-percentage', template: "<div class=\"mx-2\">\n    <ng-container *ngIf=\"isLoader\">\n        <app-loader></app-loader>\n    </ng-container>\n    <ng-container *ngIf=\"!isLoader\">\n        <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"tableDataSource\" [selectedRowKeys]=\"[]\"\n            [showBorders]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\" [height]=\"370\">\n            <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\"></dxo-search-panel>\n            <dxo-export [enabled]=\"true\"></dxo-export>\n            <dxo-paging [pageSize]=\"7\"></dxo-paging>\n            <dxo-pager [showInfo]=\"true\" [showPageSizeSelector]=\"false\">\n            </dxo-pager>\n            <dxo-selection mode=\"single\"></dxo-selection>\n            <dxi-column dataField=\"eventType\"></dxi-column>\n            <dxi-column dataField=\"access_cost_sar\" cellTemplate=\"cellTemplate1\"></dxi-column>\n            <dxi-column dataField=\"margin_sar\" cellTemplate=\"cellTemplate2\"></dxi-column>\n            <dxi-column dataField=\"ict_cost_sar\" cellTemplate=\"cellTemplate3\"></dxi-column>\n            <dxi-column dataField=\"revenue\" cellTemplate=\"cellTemplate4\"></dxi-column>\n\n\n            <div *dxTemplate=\"let data of 'cellTemplate1'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n            <div *dxTemplate=\"let data of 'cellTemplate2'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n            <div *dxTemplate=\"let data of 'cellTemplate3'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n            <div *dxTemplate=\"let data of 'cellTemplate4'\">\n                <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n            </div>\n\n        </dx-data-grid>\n    </ng-container>\n\n</div>" }]
+            args: [{ selector: 'app-gamma-table-with-percentage', template: "<div class=\"mx-2 bg-gray-800\">\n    <ng-container *ngIf=\"isLoader\">\n        <div class=\"flex justify-center items-start bg-gray-800 p-2\">\n            <app-loader></app-loader>\n        </div>\n    </ng-container>\n\n    <div class=\"mx-2 pb-2\">\n        <ng-container *ngIf=\"!isLoader\">\n            <dx-data-grid [columnAutoWidth]=\"true\" [dataSource]=\"tableDataSource\" [selectedRowKeys]=\"[]\"\n                [showBorders]=\"true\" [showRowLines]=\"true\" id=\"gridContainer\" [height]=\"370\">\n                <dxo-search-panel [highlightCaseSensitive]=\"true\" [visible]=\"true\"></dxo-search-panel>\n                <dxo-export [enabled]=\"true\"></dxo-export>\n                <dxo-paging [pageSize]=\"7\"></dxo-paging>\n                <dxo-pager [showInfo]=\"true\" [showPageSizeSelector]=\"false\">\n                </dxo-pager>\n                <dxo-selection mode=\"single\"></dxo-selection>\n                <dxi-column dataField=\"eventType\"></dxi-column>\n                <dxi-column dataField=\"access_cost_sar\" cellTemplate=\"cellTemplate1\"></dxi-column>\n                <dxi-column dataField=\"margin_sar\" cellTemplate=\"cellTemplate2\"></dxi-column>\n                <dxi-column dataField=\"ict_cost_sar\" cellTemplate=\"cellTemplate3\"></dxi-column>\n                <dxi-column dataField=\"revenue\" cellTemplate=\"cellTemplate4\"></dxi-column>\n\n\n                <div *dxTemplate=\"let data of 'cellTemplate1'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n                <div *dxTemplate=\"let data of 'cellTemplate2'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n                <div *dxTemplate=\"let data of 'cellTemplate3'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n                <div *dxTemplate=\"let data of 'cellTemplate4'\">\n                    <div [innerHTML]=\"data.value | contentSafeHtml\"></div>\n                </div>\n\n            </dx-data-grid>\n        </ng-container>\n\n    </div>\n</div>" }]
         }], ctorParameters: function () { return [{ type: CommonService }, { type: i2$1.ToastrService }]; }, propDecorators: { chartDataSource: [{
                 type: Input,
                 args: ['chartDataSource']
@@ -6418,6 +6481,11 @@ class GammaAdvanceOperatorTableComponent {
                     this.isLoader = false;
                 }, 200);
             }
+            setTimeout(() => {
+                this.dataSourseForTable = [];
+                this.tableDataConfig['columns'] = [];
+                this.isLoader = false;
+            }, 200);
         }
     }
     ngOnInit() {
@@ -6746,6 +6814,11 @@ class GammaAdvanceChartComponent {
                     this.isLoader = false;
                 }
             }
+            else {
+                setTimeout(() => {
+                    this.isLoader = false;
+                }, 200);
+            }
         }
     }
     ngOnInit() {
@@ -8664,7 +8737,7 @@ class PageConfigComponent {
     }
     updateWidget() {
         let modifiedConfig = this.reformatWidgetConfig(this.dashBoardWidgetConfig, this.newWidgetIndex);
-        modifiedConfig['filterId'] = (modifiedConfig.filters.filterId) ? modifiedConfig.filters.filterId : null;
+        modifiedConfig['filterId'] = (modifiedConfig.filters && modifiedConfig.filters.filterId) ? modifiedConfig.filters.filterId : null;
         delete modifiedConfig['filters'];
         this.service.editAppWidgetConfig(modifiedConfig).subscribe({
             next: (data) => {
@@ -8691,23 +8764,7 @@ class PageConfigComponent {
             widgetProperties: this.addedwidGetConfig,
             pageId: this.pageId,
             filterId: this.selectedFilterId,
-            widgetNode: [
-                {
-                    id: this.commonService.primeryRendomeId(5),
-                    nodeTitle: "",
-                    filterId: "",
-                    nodeProperties: {
-                        "display": true,
-                        "widgetTitle": "",
-                        "width": "w-1/2",
-                        "height": "",
-                    },
-                    compConfig: {
-                        dynamicComponentRefs: [],
-                        viewConfig: []
-                    }
-                }
-            ],
+            widgetNode: [],
             compConfig: {
                 dynamicComponentRefs: [],
                 viewConfig: []
@@ -8895,9 +8952,9 @@ class PageConfigComponent {
             let w_height = (div.widgetProperties.height == "") ? "h-auto" : 'h-[' + div.widgetProperties.height + ']';
             rowDiv.classList.add(div.widgetProperties.width, w_height, 'border');
             const filterDiv = document.createElement('div');
-            if (div.filters) {
-                this.loadFilterComponent(div, filterDiv, div.filters.filterItems);
-            }
+            debugger;
+            const filterItems = (div.filters) ? div.filters.filterItems : [];
+            this.loadFilterComponent(div, filterDiv, filterItems);
             rowDiv.appendChild(filterDiv);
             if (div.widgetNode && div.widgetNode.length && div.widgetNode.length != 0) {
                 const mainItemDiv = document.createElement('div');
@@ -9353,10 +9410,10 @@ class PageConfigComponent {
     }
 }
 PageConfigComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: PageConfigComponent, deps: [{ token: CommonService }, { token: i1.ActivatedRoute }, { token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: ApplicationContentService }, { token: i2$1.ToastrService }, { token: i1.Router }, { token: ApplicationDatssetsCall }], target: i0.ɵɵFactoryTarget.Component });
-PageConfigComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: PageConfigComponent, selector: "app-dashbord-config", viewQueries: [{ propertyName: "dynamicComponentContainer", first: true, predicate: ["dynamicComponentContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "containerRef", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }, { propertyName: "dynamicContainer", first: true, predicate: ["dynamicContainer"], descendants: true, static: true }, { propertyName: "scrollView", first: true, predicate: DxScrollViewComponent, descendants: true }], ngImport: i0, template: "<app-loading *ngIf=\"loadingModal\"></app-loading>\n\n<!-- <div class=\"flex flex-col flex-auto w-full\"> -->\n<div class=\"flex flex-row h-screen\">\n    <div class=\"flex-grow border-r h-full\">\n        <div class=\"scrollable-content\">\n            <!-- <div class=\"flex flex-wrap p-2 border\"> -->\n            <!-- <app-advance-header [filterItems]=\"filterItems\" [pageTitle]=\"'Dashboard'\" [isEditButton]=\"false\"\n                    [isAdvanceButton]=\"true\"></app-advance-header> -->\n            <div class=\"flex flex-wrap my-3\" #dynamicContainer></div>\n\n        </div>\n        <div class=\"flex flex-row justify-center items-center h-16 m-2 border\">\n            <lib-common-header [pageTitle]=\"''\"></lib-common-header>\n            <!-- <div class=\"{{commonService.btn_success_md}} m-2 \" (click)=\"getCreateDataSetPage()\">Create\n                Dataset\n            </div> -->\n            <div class=\"{{commonService.btn_primary_md}} m-2\" (click)=\"addWidget()\">Add Layout\n            </div>\n            <!-- <div class=\"{{commonService.btn_success_md}} m-2\" (click)=\"getCreateViewPage()\">Create\n                View\n            </div> -->\n            <div class=\"{{commonService.btnOthersPurple}} m-2 cursar-pointer\" (click)=\"getViewPage()\">View Page\n            </div>\n            <!-- <div class=\"{{commonService.btn_warning_md}} m-2 cursar-pointer\" (click)=\"getAllPage()\">All Pages\n            </div> -->\n\n        </div>\n    </div>\n    <div class=\"flex-shrink-0 w-1/4 p-2 h-full\">\n        <ng-container *ngIf=\"isDashBoardContent\">\n            <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\" (click)=\"backToMainView()\">\n                Back\n            </div>\n            <ng-container *ngFor=\"let item of page_config.api_config; let i = index\">\n                <div class=\"mb-2 flex flex-row justify-between items-center border-b\">\n                    <div class=\"text-md py-2 font-bold  text-white px-2\">\n                        {{item.widGetConfig.widgetTitle}}\n                    </div>\n                    <div class=\"flex space-x-2\">\n                        <!-- <button (click)=\"editSelectedWidget(item, i)\"\n                            class=\"w-8 h-8 bg-sky-600 hover:bg-blue-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-edit\"></i>\n                        </button> -->\n                        <button\n                            class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-trash-o\"></i>\n                        </button>\n                    </div>\n                </div>\n\n            </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"isWidgetCreationContent\">\n            <h6 class=\"mb-2 font-bold text-lg tracking-tight text-gray-900 dark:text-white border-b pb-3\">\n                <span *ngIf=\"!islayoutCreate\">Widget Settings</span>\n                <span *ngIf=\"islayoutCreate\">Layout Settings</span>\n            </h6>\n            <div class=\"flex flex-row my-4\">\n                <dx-check-box class=\"ml-auto\" [(ngModel)]=\"addedwidGetConfig.display\" text=\"Display\"></dx-check-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Width</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"widget_width\"\n                    [(ngModel)]=\"addedwidGetConfig.width\"></dx-select-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Height</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.height\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <span class=\"text-md my-auto px-2\">Widget Title</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetTitle\"></dx-text-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <span class=\"text-md my-auto px-2\">Widget Name</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetName\"></dx-text-box>\n            </div>\n\n\n            <div class=\"flex flex-row mb-5 justify-between\" *ngIf=\"islayoutCreate\">\n                <span class=\"text-sm my-auto px-2\">Layout Title</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.widgetTitle\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Filter</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                    valueExpr=\"filterId\" [(ngModel)]=\"selectedFilterId\"\n                    (onValueChanged)=\"getFilterValueById($event)\"></dx-select-box>\n            </div>\n            <ng-container *ngIf=\"!isUpdateWidget\">\n                <div class=\"mt-6\" *ngIf=\"!islayoutCreate && isEditMainLayout\">\n                    <ng-container\n                        *ngFor=\"let item of dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode;let i = index\">\n                        <div class=\"mb-2 flex flex-row justify-between items-center border-b \">\n                            <div class=\"text-md py-2 font-bold  text-white px-2\">\n                                {{item.nodeProperties.widgetTitle}}\n                            </div>\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button\n                                    *ngIf=\"i !==  dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button\n                                    class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                                    <i class=\"fa fa-trash-o\"></i>\n                                </button>\n                            </div>\n                        </div>\n\n                    </ng-container>\n                </div>\n            </ng-container>\n\n\n\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Application Views\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <ng-container *ngFor=\"let item of allWidgetInnerContent; let i = index\">\n                        <div class=\"group  w-full flex justify-between border-b items-center\">\n                            <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                                {{item.viewName}}\n                            </div>\n\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button *ngIf=\"i !== allWidgetInnerContent.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentViews(item)\">\n                                    <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentDatasets(item)\">\n                                    <i class=\"fa fa-database\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                                    (click)=\"getDeleteViewFromConfig(i)\">\n                                    <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                                </button>\n                            </div>\n\n                        </div>\n                    </ng-container>\n                </div>\n            </ng-container>\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Add Filter For View\n\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <div class=\"flex flex-row py-3 border-b\">\n                        <dx-check-box [(ngModel)]=\"addedwidGetConfig.isWidgetFilter\"\n                            text=\"Popup Columns Filter Enable\"></dx-check-box>\n                    </div>\n                    <div class=\"flex flex-row my-2 border-b\">\n                        <ng-container *ngFor=\"let item of nodeProperticeFilters; let i = index\">\n                            <div class=\"flex flex-wrap border-b\">\n                                <div class=\"px-1 w-1/3\">\n                                    <div class=\"text-md\">Input Type</div>\n                                    <dx-select-box [items]=\"['text']\" [(ngModel)]=\"item.input_type\"\n                                        value=\"text\"></dx-select-box>\n                                </div>\n                                <div class=\"px-1-1 w-2/3\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Server Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.server_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Local Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.local_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/3\" *ngIf=\"item.input_type == 'select'\">\n                                    <div class=\"text-md\">Columns Name</div>\n                                    <dx-text-box [(ngModel)]=\"item.select_box_option\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\">\n                                    <div class=\"flex justify-end\">\n                                        <div class=\"{{commonService.btn_danger_sm}} w-24 mt-6 text-center\"\n                                            (click)=\"deleteNodeFilter(i)\">Delete Filter</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </ng-container>\n                    </div>\n                    <div class=\"{{commonService.btn_primary_sm}} w-auto text-center\"\n                        (click)=\"getNodeProperticeFilterOption()\">Add\n                        Filter</div>\n                </div>\n            </ng-container>\n\n            <div class=\"flex flex-row justify-end items-center h-16 m-2\">\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n                <ng-container *ngIf=\"!isUpdateWidget\">\n                    <div *ngIf=\"islayoutCreate\"\n                        class=\"{{commonService.btn_success_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addLayoutTOview()\">Add View\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && !isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addWidgetTOview()\">Add Layout\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"updateLayoutWidgetTOview()\">Update Layout\n                    </div>\n\n                </ng-container>\n\n                <div class=\"{{commonService.btn_warning_md}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"updateToView()\" *ngIf=\"isUpdateWidget\">Update View\n                </div>\n\n            </div>\n\n\n            <!-- <pre><code>{{dashBoardWidgetConfig | json}}</code></pre> -->\n        </ng-container>\n        <ng-container *ngIf=\"isChartButtonClick\">\n            <h6\n                class=\"mb-2 font-bold text-md tracking-tight text-gray-900 dark:text-white border-b pb-3 flex  items-center\">\n                <i class=\"fa fa-bar-chart-o mr-2\"></i> Select View\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursor-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n            </h6>\n            <div class=\" h-[80vh] overflow-x-auto\">\n                <div class=\"relative my-2 \">\n                    <input type=\"text\" [(ngModel)]=\"viewToSearch\" (keyup)=\"filterViews()\" (keydown)=\"filterViews()\"\n                        class=\"bg-gray-800 border border-gray-700 text-gray-200 text-sm focus:ring-gray-400 focus:border-gray-500 block w-full p-4 h-8 rounded\"\n                        placeholder=\"Search View\" />\n                    <button type=\"button\" class=\"absolute inset-y-0 right-0 flex items-center pr-6\">\n                        <mat-icon class=\"rotate-90 cursor-pointer\" [svgIcon]=\"'heroicons_outline:search'\"></mat-icon>\n                    </button>\n                </div>\n                <ng-container *ngFor=\"let item of filteredComponentConfig\">\n                    <div class=\"relative group my-3 w-full\">\n                        <!-- Item View Name -->\n                        <div class=\"text-md font-bold border-b py-2 cursar-pointer\">\n                            {{item.viewName}}</div>\n\n                        <!-- Hover Buttons -->\n                        <div\n                            class=\"absolute top-0  right-0 flex space-x-2 opacity-0 group-hover:opacity-100 transition-opacity duration-300 pb-2\">\n                            <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700\">\n                                <i class=\"fa fa-pencil-square-o\" aria-hidden=\"true\"\n                                    (click)=\"editComponentViews(item)\"></i>\n                            </button>\n                            <button class=\"rounded-full p-2 text-white bg-green-500 hover:bg-green-700\"\n                                (click)=\"getComponentConfig(item)\">\n                                <i class=\"fa fa-plus\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n\n        </ng-container>\n        <ng-container *ngIf=\"isDefaultView\">\n            <ng-container *ngFor=\"let item of dashBoardWidgetConfig.widgets; let i = index\">\n                <div class=\"group my-3 w-full flex justify-between border-b items-center\">\n                    <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                        {{item.widgetTitle}}\n                    </div>\n\n                    <div class=\"flex space-x-2\">\n                        <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'up')\">\n                            <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                        </button>\n\n                        <button *ngIf=\"i !== dashBoardWidgetConfig.widgets.length - 1\"\n                            class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'down')\">\n                            <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                            (click)=\"getEditViewFromLayout(item,i)\">\n                            <i class=\"fa fa-pencil-square\" aria-hidden=\"true\"></i>\n\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                            (click)=\"getDeleteViewFromLayout(item,i)\">\n                            <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                        </button>\n\n                    </div>\n                </div>\n            </ng-container>\n        </ng-container>\n\n\n    </div>\n</div>\n<!-- </div> -->\n\n<dx-popup [(visible)]=\"isEditOptionClick\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"{{editViewdataSourceModal.viewName}}\">\n    <div *dxTemplate=\"let data of 'content'\">\n\n        <app-dash-chart [datasetmodal]=\"editViewdataSourceModal\" (getChartConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'chart'\"></app-dash-chart>\n        <app-dash-table [datasetmodal]=\"editViewdataSourceModal\" (getTableConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'table'\"></app-dash-table>\n        <!-- <app-dash-other [datasetmodal]=\"editViewdataSourceModal\" *ngIf=\"editViewdataSourceModal.viewType == 'others'\"\n            (createOtherComponentView)=\"getEmitNewChartCongig($event)\"></app-dash-other> -->\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isCreateDataset\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateDatasetWithDatasetId\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\" (onHidden)=\"getDatasetPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [selectedDatasetId]=\"selectedDatasetId\" [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n<dx-popup [(visible)]=\"isCreateNewViewWithDefaultView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\"\n    [width]=\"1200\" [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\"\n    (onHidden)=\"getViewPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [selectedViewId]=\"selectedViewId\" [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateNewView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isWidgetFilters\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"800\" [height]=\"400\"\n    [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"my-2\">\n            <dx-scroll-view [width]=\"'100%'\" [height]=\"'85%'\">\n                <ng-container *ngFor=\"let item of nodeproperticeFilterDataSource; let i = index\">\n                    <div class=\"flex flex-row my-2\">\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.columnName\"></dx-text-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-select-box [items]=\"['get','let']\" [(ngModel)]=\"item.operator\"\n                                placeholder=\"Operator\"></dx-select-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.value\"></dx-text-box>\n                        </div>\n                    </div>\n                </ng-container>\n\n            </dx-scroll-view>\n            <div class=\"flex justify-end mx-1 flex-grow\">\n                <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\"\n                    (click)=\"submitFilter()\">Submit</button>\n            </div>\n\n        </div>\n\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isAdvanceLayout\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"700\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"flex flex-row px-2 mb-3\">\n            <div class=\"w-2/3 mb-2\">\n                <div class=\"text-md mb-2\">Select Views</div>\n                <dx-tag-box [dataSource]=\"componentConfigDataSource\" valueExpr=\"viewId\" displayExpr=\"viewName\"\n                    [multiline]=\"true\" [showSelectionControls]=\"true\" [(ngModel)]=\"selectedViewsIds\"\n                    [maxDisplayedTags]=\"3\" (onValueChanged)=\"getSelectedColumnSource($event)\" [searchEnabled]=\"true\">\n                </dx-tag-box>\n            </div>\n            <div class=\"w-1/3 px-2\">\n                <button class=\"{{commonService.btn_primary_md}} mt-6\" (click)=\"getProcessForConfig()\">\n                    Add To View\n                </button>\n                <!-- <button class=\"{{commonService.btn_danger_md}} cursor-pointer mt-6\" (click)=\"cancelCdrConfig()\">Cancel\n                                    </button> -->\n            </div>\n        </div>\n        <dx-scroll-view [width]=\"'100%'\" [height]=\"'80%'\">\n\n            <div class=\"m-2 border-b\" *ngIf=\"isProceed\">\n                <ng-container *ngFor=\"let item of advanceLayoutContainer; let i = index;\">\n                    <div class=\"flex flex-row m-2\">\n                        <div class=\"mx-2 w-1/2\">\n                            <div class=\"text-md mb-2\">View Name</div>\n                            <dx-text-box [(ngModel)]=\"item.compConfig.viewConfig[0].viewName\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Title</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.widgetTitle\"></dx-text-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Width</div>\n                            <dx-select-box [searchEnabled]=\"true\" [items]=\"widget_width\"\n                                [(ngModel)]=\"item.nodeProperties.width\"></dx-select-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Height</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.height\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Filter</div>\n                            <dx-select-box [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                                valueExpr=\"filterId\" [(ngModel)]=\"item.filterId\"></dx-select-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mt-8\">\n                                <dx-check-box [(ngModel)]=\"item.nodeProperties.display\" text=\"Display\"></dx-check-box>\n                            </div>\n                        </div>\n                        <div class=\"mx-2\">\n                            <button class=\"{{commonService.btn_danger_sm}} cursor-pointer mt-8\"\n                                (click)=\"deleteView(i)\"><i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n        </dx-scroll-view>\n        <div class=\"flex justify-end mx-1 my-2 flex-grow\">\n            <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\" (click)=\"submitAdvanceView()\">Add\n                Layout</button>\n        </div>\n    </div>\n</dx-popup>", styles: ["::ng-deep #scrollview-demo{min-height:550px}::ng-deep #scrollview{height:auto;position:absolute;top:0;bottom:300px;padding:20px}::ng-deep #scrollview-content{white-space:pre-wrap}.scrollable-content{height:85vh;overflow-y:auto}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i5.DxCheckBoxComponent, selector: "dx-check-box", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "iconSize", "isValid", "name", "readOnly", "rtlEnabled", "tabIndex", "text", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconSizeChange", "isValidChange", "nameChange", "readOnlyChange", "rtlEnabledChange", "tabIndexChange", "textChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "component", type: i4$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "elementAttr", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "elementAttrChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i9$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "component", type: i6$1.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "component", type: i8$1.DxTagBoxComponent, selector: "dx-tag-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "applyValueMode", "buttons", "dataSource", "deferRendering", "disabled", "displayExpr", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hideSelectedItems", "hint", "hoverStateEnabled", "inputAttr", "isValid", "items", "itemTemplate", "label", "labelMode", "maxDisplayedTags", "maxFilterQueryLength", "maxLength", "minSearchLength", "multiline", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectAllMode", "selectAllText", "selectedItems", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showMultiTagOnly", "showSelectionControls", "stylingMode", "tabIndex", "tagTemplate", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCustomItemCreating", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onMultiTagPreparing", "onOpened", "onOptionChanged", "onSelectAllValueChanged", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "applyValueModeChange", "buttonsChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hideSelectedItemsChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxDisplayedTagsChange", "maxFilterQueryLengthChange", "maxLengthChange", "minSearchLengthChange", "multilineChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectAllModeChange", "selectAllTextChange", "selectedItemsChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showMultiTagOnlyChange", "showSelectionControlsChange", "stylingModeChange", "tabIndexChange", "tagTemplateChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "component", type: i11.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LoadingComponent$1, selector: "app-loading" }, { kind: "component", type: CreateCompViewComponent, selector: "app-create-comp-view", inputs: ["kpiTreeData", "isHeader", "selectedViewId"] }, { kind: "component", type: DashChartComponent, selector: "app-dash-chart", inputs: ["datasetmodal"], outputs: ["getChartConfigOutPut"] }, { kind: "component", type: DashTableComponent, selector: "app-dash-table", inputs: ["datasetmodal"], outputs: ["getTableConfigOutPut"] }, { kind: "component", type: CreateDatasetComponent, selector: "app-create-dataset", inputs: ["isHeader", "selectedDatasetId"] }, { kind: "component", type: CommonHeaderComponent, selector: "lib-common-header", inputs: ["pageTitle"] }] });
+PageConfigComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: PageConfigComponent, selector: "app-dashbord-config", viewQueries: [{ propertyName: "dynamicComponentContainer", first: true, predicate: ["dynamicComponentContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "containerRef", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }, { propertyName: "dynamicContainer", first: true, predicate: ["dynamicContainer"], descendants: true, static: true }, { propertyName: "scrollView", first: true, predicate: DxScrollViewComponent, descendants: true }], ngImport: i0, template: "<app-loading *ngIf=\"loadingModal\"></app-loading>\n\n<div class=\"flex flex-row h-[90vh] w-full\">\n    <div class=\"w-3/4 border-r h-full flex flex-col px-2\">\n        <!-- Scrollable content -->\n        <div class=\"flex-grow overflow-y-auto\">\n            <div class=\"flex flex-wrap my-3\" #dynamicContainer></div>\n        </div>\n\n        <!-- Fixed bottom section -->\n        <div class=\"flex flex-row justify-center items-center h-16 m-2 border shrink-0\">\n            <lib-common-header [pageTitle]=\"''\"></lib-common-header>\n            <div class=\"{{commonService.btn_primary_md}} m-2\" (click)=\"addWidget()\">Add Layout</div>\n            <div class=\"{{commonService.btnOthersPurple}} m-2 cursor-pointer\" (click)=\"getViewPage()\">View Page</div>\n        </div>\n    </div>\n    <div class=\"w-1/4 p-2 h-full\">\n        <ng-container *ngIf=\"isDashBoardContent\">\n            <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\" (click)=\"backToMainView()\">\n                Back\n            </div>\n            <ng-container *ngFor=\"let item of page_config.api_config; let i = index\">\n                <div class=\"mb-2 flex flex-row justify-between items-center border-b\">\n                    <div class=\"text-md py-2 font-bold  text-white px-2\">\n                        {{item.widGetConfig.widgetTitle}}\n                    </div>\n                    <div class=\"flex space-x-2\">\n                        <!-- <button (click)=\"editSelectedWidget(item, i)\"\n                            class=\"w-8 h-8 bg-sky-600 hover:bg-blue-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-edit\"></i>\n                        </button> -->\n                        <button\n                            class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-trash-o\"></i>\n                        </button>\n                    </div>\n                </div>\n\n            </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"isWidgetCreationContent\">\n            <h6 class=\"mb-2 font-bold text-lg tracking-tight text-gray-900 dark:text-white border-b pb-3\">\n                <span *ngIf=\"!islayoutCreate\">Widget Settings</span>\n                <span *ngIf=\"islayoutCreate\">Layout Settings</span>\n            </h6>\n            <div class=\"flex flex-row my-4\">\n                <dx-check-box class=\"ml-auto\" [(ngModel)]=\"addedwidGetConfig.display\" text=\"Display\"></dx-check-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Width</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"widget_width\"\n                    [(ngModel)]=\"addedwidGetConfig.width\"></dx-select-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Height</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.height\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <div class=\"text-md my-auto px-2\">Widget Title</div>\n                <div><dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetTitle\"></dx-text-box></div>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <span class=\"text-md my-auto px-2\">Widget Name</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetName\"></dx-text-box>\n            </div>\n\n\n            <div class=\"flex flex-row mb-5 justify-between\" *ngIf=\"islayoutCreate\">\n                <span class=\"text-sm my-auto px-2\">Layout Title</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.widgetTitle\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Filter</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                    valueExpr=\"filterId\" [(ngModel)]=\"selectedFilterId\"\n                    (onValueChanged)=\"getFilterValueById($event)\"></dx-select-box>\n            </div>\n            <ng-container *ngIf=\"!isUpdateWidget\">\n                <div class=\"mt-6\" *ngIf=\"!islayoutCreate && isEditMainLayout\">\n                    <ng-container\n                        *ngFor=\"let item of dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode;let i = index\">\n                        <div class=\"mb-2 flex flex-row justify-between items-center border-b \">\n                            <div class=\"text-md py-2 font-bold  text-white px-2\">\n                                {{item.nodeProperties.widgetTitle}}\n                            </div>\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button\n                                    *ngIf=\"i !==  dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button\n                                    class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                                    <i class=\"fa fa-trash-o\"></i>\n                                </button>\n                            </div>\n                        </div>\n\n                    </ng-container>\n                </div>\n            </ng-container>\n\n\n\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Application Views\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <ng-container *ngFor=\"let item of allWidgetInnerContent; let i = index\">\n                        <div class=\"group  w-full flex justify-between border-b items-center\">\n                            <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                                {{item.viewName}}\n                            </div>\n\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button *ngIf=\"i !== allWidgetInnerContent.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentViews(item)\">\n                                    <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentDatasets(item)\">\n                                    <i class=\"fa fa-database\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                                    (click)=\"getDeleteViewFromConfig(i)\">\n                                    <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                                </button>\n                            </div>\n\n                        </div>\n                    </ng-container>\n                </div>\n            </ng-container>\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Add Filter For View\n\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <div class=\"flex flex-row py-3 border-b\">\n                        <dx-check-box [(ngModel)]=\"addedwidGetConfig.isWidgetFilter\"\n                            text=\"Popup Columns Filter Enable\"></dx-check-box>\n                    </div>\n                    <div class=\"flex flex-row my-2 border-b\">\n                        <ng-container *ngFor=\"let item of nodeProperticeFilters; let i = index\">\n                            <div class=\"flex flex-wrap border-b\">\n                                <div class=\"px-1 w-1/3\">\n                                    <div class=\"text-md\">Input Type</div>\n                                    <dx-select-box [items]=\"['text']\" [(ngModel)]=\"item.input_type\"\n                                        value=\"text\"></dx-select-box>\n                                </div>\n                                <div class=\"px-1-1 w-2/3\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Server Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.server_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Local Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.local_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/3\" *ngIf=\"item.input_type == 'select'\">\n                                    <div class=\"text-md\">Columns Name</div>\n                                    <dx-text-box [(ngModel)]=\"item.select_box_option\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\">\n                                    <div class=\"flex justify-end\">\n                                        <div class=\"{{commonService.btn_danger_sm}} w-24 mt-6 text-center\"\n                                            (click)=\"deleteNodeFilter(i)\">Delete Filter</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </ng-container>\n                    </div>\n                    <div class=\"{{commonService.btn_primary_sm}} w-auto text-center\"\n                        (click)=\"getNodeProperticeFilterOption()\">Add\n                        Filter</div>\n                </div>\n            </ng-container>\n\n            <div class=\"flex flex-row justify-end items-center h-16 m-2\">\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n                <ng-container *ngIf=\"!isUpdateWidget\">\n                    <div *ngIf=\"islayoutCreate\"\n                        class=\"{{commonService.btn_success_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addLayoutTOview()\">Add View\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && !isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addWidgetTOview()\">Add Layout\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"updateLayoutWidgetTOview()\">Update Layout\n                    </div>\n\n                </ng-container>\n\n                <div class=\"{{commonService.btn_warning_md}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"updateToView()\" *ngIf=\"isUpdateWidget\">Update View\n                </div>\n\n            </div>\n\n\n            <!-- <pre><code>{{dashBoardWidgetConfig | json}}</code></pre> -->\n        </ng-container>\n        <ng-container *ngIf=\"isChartButtonClick\">\n            <h6\n                class=\"mb-2 font-bold text-md tracking-tight text-gray-900 dark:text-white border-b pb-3 flex  items-center\">\n                <i class=\"fa fa-bar-chart-o mr-2\"></i> Select View\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursor-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n            </h6>\n            <div class=\" h-[80vh] overflow-x-auto\">\n                <div class=\"relative my-2 \">\n                    <input type=\"text\" [(ngModel)]=\"viewToSearch\" (keyup)=\"filterViews()\" (keydown)=\"filterViews()\"\n                        class=\"bg-gray-800 border border-gray-700 text-gray-200 text-sm focus:ring-gray-400 focus:border-gray-500 block w-full p-4 h-8 rounded\"\n                        placeholder=\"Search View\" />\n                    <button type=\"button\" class=\"absolute inset-y-0 right-0 flex items-center pr-6\">\n                        <mat-icon class=\"rotate-90 cursor-pointer\" [svgIcon]=\"'heroicons_outline:search'\"></mat-icon>\n                    </button>\n                </div>\n                <ng-container *ngFor=\"let item of filteredComponentConfig\">\n                    <div class=\"relative group my-3 w-full\">\n                        <!-- Item View Name -->\n                        <div class=\"text-md font-bold border-b py-2 cursar-pointer\">\n                            {{item.viewName}}</div>\n\n                        <!-- Hover Buttons -->\n                        <div\n                            class=\"absolute top-0  right-0 flex space-x-2 opacity-0 group-hover:opacity-100 transition-opacity duration-300 pb-2\">\n                            <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700\">\n                                <i class=\"fa fa-pencil-square-o\" aria-hidden=\"true\"\n                                    (click)=\"editComponentViews(item)\"></i>\n                            </button>\n                            <button class=\"rounded-full p-2 text-white bg-green-500 hover:bg-green-700\"\n                                (click)=\"getComponentConfig(item)\">\n                                <i class=\"fa fa-plus\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n\n        </ng-container>\n        <ng-container *ngIf=\"isDefaultView\">\n            <ng-container *ngFor=\"let item of dashBoardWidgetConfig.widgets; let i = index\">\n                <div class=\"group my-3 w-full flex justify-between border-b items-center\">\n                    <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                        {{item.widgetTitle}}\n                    </div>\n\n                    <div class=\"flex space-x-2\">\n                        <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'up')\">\n                            <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                        </button>\n\n                        <button *ngIf=\"i !== dashBoardWidgetConfig.widgets.length - 1\"\n                            class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'down')\">\n                            <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                            (click)=\"getEditViewFromLayout(item,i)\">\n                            <i class=\"fa fa-pencil-square\" aria-hidden=\"true\"></i>\n\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                            (click)=\"getDeleteViewFromLayout(item,i)\">\n                            <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                        </button>\n\n                    </div>\n                </div>\n            </ng-container>\n        </ng-container>\n\n\n    </div>\n</div>\n<!-- </div> -->\n\n<dx-popup [(visible)]=\"isEditOptionClick\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"{{editViewdataSourceModal.viewName}}\">\n    <div *dxTemplate=\"let data of 'content'\">\n\n        <app-dash-chart [datasetmodal]=\"editViewdataSourceModal\" (getChartConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'chart'\"></app-dash-chart>\n        <app-dash-table [datasetmodal]=\"editViewdataSourceModal\" (getTableConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'table'\"></app-dash-table>\n        <!-- <app-dash-other [datasetmodal]=\"editViewdataSourceModal\" *ngIf=\"editViewdataSourceModal.viewType == 'others'\"\n            (createOtherComponentView)=\"getEmitNewChartCongig($event)\"></app-dash-other> -->\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isCreateDataset\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateDatasetWithDatasetId\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\" (onHidden)=\"getDatasetPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [selectedDatasetId]=\"selectedDatasetId\" [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n<dx-popup [(visible)]=\"isCreateNewViewWithDefaultView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\"\n    [width]=\"1200\" [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\"\n    (onHidden)=\"getViewPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [selectedViewId]=\"selectedViewId\" [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateNewView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isWidgetFilters\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"800\" [height]=\"400\"\n    [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"my-2\">\n            <dx-scroll-view [width]=\"'100%'\" [height]=\"'85%'\">\n                <ng-container *ngFor=\"let item of nodeproperticeFilterDataSource; let i = index\">\n                    <div class=\"flex flex-row my-2\">\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.columnName\"></dx-text-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-select-box [items]=\"['get','let']\" [(ngModel)]=\"item.operator\"\n                                placeholder=\"Operator\"></dx-select-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.value\"></dx-text-box>\n                        </div>\n                    </div>\n                </ng-container>\n\n            </dx-scroll-view>\n            <div class=\"flex justify-end mx-1 flex-grow\">\n                <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\"\n                    (click)=\"submitFilter()\">Submit</button>\n            </div>\n\n        </div>\n\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isAdvanceLayout\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"700\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"flex flex-row px-2 mb-3\">\n            <div class=\"w-2/3 mb-2\">\n                <div class=\"text-md mb-2\">Select Views</div>\n                <dx-tag-box [dataSource]=\"componentConfigDataSource\" valueExpr=\"viewId\" displayExpr=\"viewName\"\n                    [multiline]=\"true\" [showSelectionControls]=\"true\" [(ngModel)]=\"selectedViewsIds\"\n                    [maxDisplayedTags]=\"3\" (onValueChanged)=\"getSelectedColumnSource($event)\" [searchEnabled]=\"true\">\n                </dx-tag-box>\n            </div>\n            <div class=\"w-1/3 px-2\">\n                <button class=\"{{commonService.btn_primary_md}} mt-6\" (click)=\"getProcessForConfig()\">\n                    Add To View\n                </button>\n                <!-- <button class=\"{{commonService.btn_danger_md}} cursor-pointer mt-6\" (click)=\"cancelCdrConfig()\">Cancel\n                                    </button> -->\n            </div>\n        </div>\n        <dx-scroll-view [width]=\"'100%'\" [height]=\"'80%'\">\n\n            <div class=\"m-2 border-b\" *ngIf=\"isProceed\">\n                <ng-container *ngFor=\"let item of advanceLayoutContainer; let i = index;\">\n                    <div class=\"flex flex-row m-2\">\n                        <div class=\"mx-2 w-1/2\">\n                            <div class=\"text-md mb-2\">View Name</div>\n                            <dx-text-box [(ngModel)]=\"item.compConfig.viewConfig[0].viewName\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Title</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.widgetTitle\"></dx-text-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Width</div>\n                            <dx-select-box [searchEnabled]=\"true\" [items]=\"widget_width\"\n                                [(ngModel)]=\"item.nodeProperties.width\"></dx-select-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Height</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.height\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Filter</div>\n                            <dx-select-box [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                                valueExpr=\"filterId\" [(ngModel)]=\"item.filterId\"></dx-select-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mt-8\">\n                                <dx-check-box [(ngModel)]=\"item.nodeProperties.display\" text=\"Display\"></dx-check-box>\n                            </div>\n                        </div>\n                        <div class=\"mx-2\">\n                            <button class=\"{{commonService.btn_danger_sm}} cursor-pointer mt-8\"\n                                (click)=\"deleteView(i)\"><i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n        </dx-scroll-view>\n        <div class=\"flex justify-end mx-1 my-2 flex-grow\">\n            <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\" (click)=\"submitAdvanceView()\">Add\n                Layout</button>\n        </div>\n    </div>\n</dx-popup>", styles: ["::ng-deep #scrollview-demo{min-height:550px}::ng-deep #scrollview{height:auto;position:absolute;top:0;bottom:300px;padding:20px}::ng-deep #scrollview-content{white-space:pre-wrap}.scrollable-content{height:90vh;overflow-y:auto}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i5.DxCheckBoxComponent, selector: "dx-check-box", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "iconSize", "isValid", "name", "readOnly", "rtlEnabled", "tabIndex", "text", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconSizeChange", "isValidChange", "nameChange", "readOnlyChange", "rtlEnabledChange", "tabIndexChange", "textChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "component", type: i4$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "elementAttr", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "elementAttrChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i9$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "component", type: i6$1.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "component", type: i8$1.DxTagBoxComponent, selector: "dx-tag-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "applyValueMode", "buttons", "dataSource", "deferRendering", "disabled", "displayExpr", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hideSelectedItems", "hint", "hoverStateEnabled", "inputAttr", "isValid", "items", "itemTemplate", "label", "labelMode", "maxDisplayedTags", "maxFilterQueryLength", "maxLength", "minSearchLength", "multiline", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectAllMode", "selectAllText", "selectedItems", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showMultiTagOnly", "showSelectionControls", "stylingMode", "tabIndex", "tagTemplate", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCustomItemCreating", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onMultiTagPreparing", "onOpened", "onOptionChanged", "onSelectAllValueChanged", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "applyValueModeChange", "buttonsChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hideSelectedItemsChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxDisplayedTagsChange", "maxFilterQueryLengthChange", "maxLengthChange", "minSearchLengthChange", "multilineChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectAllModeChange", "selectAllTextChange", "selectedItemsChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showMultiTagOnlyChange", "showSelectionControlsChange", "stylingModeChange", "tabIndexChange", "tagTemplateChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "component", type: i11.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LoadingComponent$1, selector: "app-loading" }, { kind: "component", type: CreateCompViewComponent, selector: "app-create-comp-view", inputs: ["kpiTreeData", "isHeader", "selectedViewId"] }, { kind: "component", type: DashChartComponent, selector: "app-dash-chart", inputs: ["datasetmodal"], outputs: ["getChartConfigOutPut"] }, { kind: "component", type: DashTableComponent, selector: "app-dash-table", inputs: ["datasetmodal"], outputs: ["getTableConfigOutPut"] }, { kind: "component", type: CreateDatasetComponent, selector: "app-create-dataset", inputs: ["isHeader", "selectedDatasetId"] }, { kind: "component", type: CommonHeaderComponent, selector: "lib-common-header", inputs: ["pageTitle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: PageConfigComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-dashbord-config', template: "<app-loading *ngIf=\"loadingModal\"></app-loading>\n\n<!-- <div class=\"flex flex-col flex-auto w-full\"> -->\n<div class=\"flex flex-row h-screen\">\n    <div class=\"flex-grow border-r h-full\">\n        <div class=\"scrollable-content\">\n            <!-- <div class=\"flex flex-wrap p-2 border\"> -->\n            <!-- <app-advance-header [filterItems]=\"filterItems\" [pageTitle]=\"'Dashboard'\" [isEditButton]=\"false\"\n                    [isAdvanceButton]=\"true\"></app-advance-header> -->\n            <div class=\"flex flex-wrap my-3\" #dynamicContainer></div>\n\n        </div>\n        <div class=\"flex flex-row justify-center items-center h-16 m-2 border\">\n            <lib-common-header [pageTitle]=\"''\"></lib-common-header>\n            <!-- <div class=\"{{commonService.btn_success_md}} m-2 \" (click)=\"getCreateDataSetPage()\">Create\n                Dataset\n            </div> -->\n            <div class=\"{{commonService.btn_primary_md}} m-2\" (click)=\"addWidget()\">Add Layout\n            </div>\n            <!-- <div class=\"{{commonService.btn_success_md}} m-2\" (click)=\"getCreateViewPage()\">Create\n                View\n            </div> -->\n            <div class=\"{{commonService.btnOthersPurple}} m-2 cursar-pointer\" (click)=\"getViewPage()\">View Page\n            </div>\n            <!-- <div class=\"{{commonService.btn_warning_md}} m-2 cursar-pointer\" (click)=\"getAllPage()\">All Pages\n            </div> -->\n\n        </div>\n    </div>\n    <div class=\"flex-shrink-0 w-1/4 p-2 h-full\">\n        <ng-container *ngIf=\"isDashBoardContent\">\n            <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\" (click)=\"backToMainView()\">\n                Back\n            </div>\n            <ng-container *ngFor=\"let item of page_config.api_config; let i = index\">\n                <div class=\"mb-2 flex flex-row justify-between items-center border-b\">\n                    <div class=\"text-md py-2 font-bold  text-white px-2\">\n                        {{item.widGetConfig.widgetTitle}}\n                    </div>\n                    <div class=\"flex space-x-2\">\n                        <!-- <button (click)=\"editSelectedWidget(item, i)\"\n                            class=\"w-8 h-8 bg-sky-600 hover:bg-blue-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-edit\"></i>\n                        </button> -->\n                        <button\n                            class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-trash-o\"></i>\n                        </button>\n                    </div>\n                </div>\n\n            </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"isWidgetCreationContent\">\n            <h6 class=\"mb-2 font-bold text-lg tracking-tight text-gray-900 dark:text-white border-b pb-3\">\n                <span *ngIf=\"!islayoutCreate\">Widget Settings</span>\n                <span *ngIf=\"islayoutCreate\">Layout Settings</span>\n            </h6>\n            <div class=\"flex flex-row my-4\">\n                <dx-check-box class=\"ml-auto\" [(ngModel)]=\"addedwidGetConfig.display\" text=\"Display\"></dx-check-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Width</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"widget_width\"\n                    [(ngModel)]=\"addedwidGetConfig.width\"></dx-select-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Height</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.height\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <span class=\"text-md my-auto px-2\">Widget Title</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetTitle\"></dx-text-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <span class=\"text-md my-auto px-2\">Widget Name</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetName\"></dx-text-box>\n            </div>\n\n\n            <div class=\"flex flex-row mb-5 justify-between\" *ngIf=\"islayoutCreate\">\n                <span class=\"text-sm my-auto px-2\">Layout Title</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.widgetTitle\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Filter</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                    valueExpr=\"filterId\" [(ngModel)]=\"selectedFilterId\"\n                    (onValueChanged)=\"getFilterValueById($event)\"></dx-select-box>\n            </div>\n            <ng-container *ngIf=\"!isUpdateWidget\">\n                <div class=\"mt-6\" *ngIf=\"!islayoutCreate && isEditMainLayout\">\n                    <ng-container\n                        *ngFor=\"let item of dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode;let i = index\">\n                        <div class=\"mb-2 flex flex-row justify-between items-center border-b \">\n                            <div class=\"text-md py-2 font-bold  text-white px-2\">\n                                {{item.nodeProperties.widgetTitle}}\n                            </div>\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button\n                                    *ngIf=\"i !==  dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button\n                                    class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                                    <i class=\"fa fa-trash-o\"></i>\n                                </button>\n                            </div>\n                        </div>\n\n                    </ng-container>\n                </div>\n            </ng-container>\n\n\n\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Application Views\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <ng-container *ngFor=\"let item of allWidgetInnerContent; let i = index\">\n                        <div class=\"group  w-full flex justify-between border-b items-center\">\n                            <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                                {{item.viewName}}\n                            </div>\n\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button *ngIf=\"i !== allWidgetInnerContent.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentViews(item)\">\n                                    <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentDatasets(item)\">\n                                    <i class=\"fa fa-database\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                                    (click)=\"getDeleteViewFromConfig(i)\">\n                                    <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                                </button>\n                            </div>\n\n                        </div>\n                    </ng-container>\n                </div>\n            </ng-container>\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Add Filter For View\n\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <div class=\"flex flex-row py-3 border-b\">\n                        <dx-check-box [(ngModel)]=\"addedwidGetConfig.isWidgetFilter\"\n                            text=\"Popup Columns Filter Enable\"></dx-check-box>\n                    </div>\n                    <div class=\"flex flex-row my-2 border-b\">\n                        <ng-container *ngFor=\"let item of nodeProperticeFilters; let i = index\">\n                            <div class=\"flex flex-wrap border-b\">\n                                <div class=\"px-1 w-1/3\">\n                                    <div class=\"text-md\">Input Type</div>\n                                    <dx-select-box [items]=\"['text']\" [(ngModel)]=\"item.input_type\"\n                                        value=\"text\"></dx-select-box>\n                                </div>\n                                <div class=\"px-1-1 w-2/3\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Server Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.server_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Local Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.local_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/3\" *ngIf=\"item.input_type == 'select'\">\n                                    <div class=\"text-md\">Columns Name</div>\n                                    <dx-text-box [(ngModel)]=\"item.select_box_option\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\">\n                                    <div class=\"flex justify-end\">\n                                        <div class=\"{{commonService.btn_danger_sm}} w-24 mt-6 text-center\"\n                                            (click)=\"deleteNodeFilter(i)\">Delete Filter</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </ng-container>\n                    </div>\n                    <div class=\"{{commonService.btn_primary_sm}} w-auto text-center\"\n                        (click)=\"getNodeProperticeFilterOption()\">Add\n                        Filter</div>\n                </div>\n            </ng-container>\n\n            <div class=\"flex flex-row justify-end items-center h-16 m-2\">\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n                <ng-container *ngIf=\"!isUpdateWidget\">\n                    <div *ngIf=\"islayoutCreate\"\n                        class=\"{{commonService.btn_success_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addLayoutTOview()\">Add View\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && !isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addWidgetTOview()\">Add Layout\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"updateLayoutWidgetTOview()\">Update Layout\n                    </div>\n\n                </ng-container>\n\n                <div class=\"{{commonService.btn_warning_md}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"updateToView()\" *ngIf=\"isUpdateWidget\">Update View\n                </div>\n\n            </div>\n\n\n            <!-- <pre><code>{{dashBoardWidgetConfig | json}}</code></pre> -->\n        </ng-container>\n        <ng-container *ngIf=\"isChartButtonClick\">\n            <h6\n                class=\"mb-2 font-bold text-md tracking-tight text-gray-900 dark:text-white border-b pb-3 flex  items-center\">\n                <i class=\"fa fa-bar-chart-o mr-2\"></i> Select View\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursor-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n            </h6>\n            <div class=\" h-[80vh] overflow-x-auto\">\n                <div class=\"relative my-2 \">\n                    <input type=\"text\" [(ngModel)]=\"viewToSearch\" (keyup)=\"filterViews()\" (keydown)=\"filterViews()\"\n                        class=\"bg-gray-800 border border-gray-700 text-gray-200 text-sm focus:ring-gray-400 focus:border-gray-500 block w-full p-4 h-8 rounded\"\n                        placeholder=\"Search View\" />\n                    <button type=\"button\" class=\"absolute inset-y-0 right-0 flex items-center pr-6\">\n                        <mat-icon class=\"rotate-90 cursor-pointer\" [svgIcon]=\"'heroicons_outline:search'\"></mat-icon>\n                    </button>\n                </div>\n                <ng-container *ngFor=\"let item of filteredComponentConfig\">\n                    <div class=\"relative group my-3 w-full\">\n                        <!-- Item View Name -->\n                        <div class=\"text-md font-bold border-b py-2 cursar-pointer\">\n                            {{item.viewName}}</div>\n\n                        <!-- Hover Buttons -->\n                        <div\n                            class=\"absolute top-0  right-0 flex space-x-2 opacity-0 group-hover:opacity-100 transition-opacity duration-300 pb-2\">\n                            <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700\">\n                                <i class=\"fa fa-pencil-square-o\" aria-hidden=\"true\"\n                                    (click)=\"editComponentViews(item)\"></i>\n                            </button>\n                            <button class=\"rounded-full p-2 text-white bg-green-500 hover:bg-green-700\"\n                                (click)=\"getComponentConfig(item)\">\n                                <i class=\"fa fa-plus\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n\n        </ng-container>\n        <ng-container *ngIf=\"isDefaultView\">\n            <ng-container *ngFor=\"let item of dashBoardWidgetConfig.widgets; let i = index\">\n                <div class=\"group my-3 w-full flex justify-between border-b items-center\">\n                    <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                        {{item.widgetTitle}}\n                    </div>\n\n                    <div class=\"flex space-x-2\">\n                        <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'up')\">\n                            <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                        </button>\n\n                        <button *ngIf=\"i !== dashBoardWidgetConfig.widgets.length - 1\"\n                            class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'down')\">\n                            <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                            (click)=\"getEditViewFromLayout(item,i)\">\n                            <i class=\"fa fa-pencil-square\" aria-hidden=\"true\"></i>\n\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                            (click)=\"getDeleteViewFromLayout(item,i)\">\n                            <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                        </button>\n\n                    </div>\n                </div>\n            </ng-container>\n        </ng-container>\n\n\n    </div>\n</div>\n<!-- </div> -->\n\n<dx-popup [(visible)]=\"isEditOptionClick\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"{{editViewdataSourceModal.viewName}}\">\n    <div *dxTemplate=\"let data of 'content'\">\n\n        <app-dash-chart [datasetmodal]=\"editViewdataSourceModal\" (getChartConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'chart'\"></app-dash-chart>\n        <app-dash-table [datasetmodal]=\"editViewdataSourceModal\" (getTableConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'table'\"></app-dash-table>\n        <!-- <app-dash-other [datasetmodal]=\"editViewdataSourceModal\" *ngIf=\"editViewdataSourceModal.viewType == 'others'\"\n            (createOtherComponentView)=\"getEmitNewChartCongig($event)\"></app-dash-other> -->\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isCreateDataset\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateDatasetWithDatasetId\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\" (onHidden)=\"getDatasetPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [selectedDatasetId]=\"selectedDatasetId\" [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n<dx-popup [(visible)]=\"isCreateNewViewWithDefaultView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\"\n    [width]=\"1200\" [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\"\n    (onHidden)=\"getViewPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [selectedViewId]=\"selectedViewId\" [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateNewView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isWidgetFilters\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"800\" [height]=\"400\"\n    [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"my-2\">\n            <dx-scroll-view [width]=\"'100%'\" [height]=\"'85%'\">\n                <ng-container *ngFor=\"let item of nodeproperticeFilterDataSource; let i = index\">\n                    <div class=\"flex flex-row my-2\">\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.columnName\"></dx-text-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-select-box [items]=\"['get','let']\" [(ngModel)]=\"item.operator\"\n                                placeholder=\"Operator\"></dx-select-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.value\"></dx-text-box>\n                        </div>\n                    </div>\n                </ng-container>\n\n            </dx-scroll-view>\n            <div class=\"flex justify-end mx-1 flex-grow\">\n                <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\"\n                    (click)=\"submitFilter()\">Submit</button>\n            </div>\n\n        </div>\n\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isAdvanceLayout\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"700\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"flex flex-row px-2 mb-3\">\n            <div class=\"w-2/3 mb-2\">\n                <div class=\"text-md mb-2\">Select Views</div>\n                <dx-tag-box [dataSource]=\"componentConfigDataSource\" valueExpr=\"viewId\" displayExpr=\"viewName\"\n                    [multiline]=\"true\" [showSelectionControls]=\"true\" [(ngModel)]=\"selectedViewsIds\"\n                    [maxDisplayedTags]=\"3\" (onValueChanged)=\"getSelectedColumnSource($event)\" [searchEnabled]=\"true\">\n                </dx-tag-box>\n            </div>\n            <div class=\"w-1/3 px-2\">\n                <button class=\"{{commonService.btn_primary_md}} mt-6\" (click)=\"getProcessForConfig()\">\n                    Add To View\n                </button>\n                <!-- <button class=\"{{commonService.btn_danger_md}} cursor-pointer mt-6\" (click)=\"cancelCdrConfig()\">Cancel\n                                    </button> -->\n            </div>\n        </div>\n        <dx-scroll-view [width]=\"'100%'\" [height]=\"'80%'\">\n\n            <div class=\"m-2 border-b\" *ngIf=\"isProceed\">\n                <ng-container *ngFor=\"let item of advanceLayoutContainer; let i = index;\">\n                    <div class=\"flex flex-row m-2\">\n                        <div class=\"mx-2 w-1/2\">\n                            <div class=\"text-md mb-2\">View Name</div>\n                            <dx-text-box [(ngModel)]=\"item.compConfig.viewConfig[0].viewName\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Title</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.widgetTitle\"></dx-text-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Width</div>\n                            <dx-select-box [searchEnabled]=\"true\" [items]=\"widget_width\"\n                                [(ngModel)]=\"item.nodeProperties.width\"></dx-select-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Height</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.height\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Filter</div>\n                            <dx-select-box [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                                valueExpr=\"filterId\" [(ngModel)]=\"item.filterId\"></dx-select-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mt-8\">\n                                <dx-check-box [(ngModel)]=\"item.nodeProperties.display\" text=\"Display\"></dx-check-box>\n                            </div>\n                        </div>\n                        <div class=\"mx-2\">\n                            <button class=\"{{commonService.btn_danger_sm}} cursor-pointer mt-8\"\n                                (click)=\"deleteView(i)\"><i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n        </dx-scroll-view>\n        <div class=\"flex justify-end mx-1 my-2 flex-grow\">\n            <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\" (click)=\"submitAdvanceView()\">Add\n                Layout</button>\n        </div>\n    </div>\n</dx-popup>", styles: ["::ng-deep #scrollview-demo{min-height:550px}::ng-deep #scrollview{height:auto;position:absolute;top:0;bottom:300px;padding:20px}::ng-deep #scrollview-content{white-space:pre-wrap}.scrollable-content{height:85vh;overflow-y:auto}\n"] }]
+            args: [{ selector: 'app-dashbord-config', template: "<app-loading *ngIf=\"loadingModal\"></app-loading>\n\n<div class=\"flex flex-row h-[90vh] w-full\">\n    <div class=\"w-3/4 border-r h-full flex flex-col px-2\">\n        <!-- Scrollable content -->\n        <div class=\"flex-grow overflow-y-auto\">\n            <div class=\"flex flex-wrap my-3\" #dynamicContainer></div>\n        </div>\n\n        <!-- Fixed bottom section -->\n        <div class=\"flex flex-row justify-center items-center h-16 m-2 border shrink-0\">\n            <lib-common-header [pageTitle]=\"''\"></lib-common-header>\n            <div class=\"{{commonService.btn_primary_md}} m-2\" (click)=\"addWidget()\">Add Layout</div>\n            <div class=\"{{commonService.btnOthersPurple}} m-2 cursor-pointer\" (click)=\"getViewPage()\">View Page</div>\n        </div>\n    </div>\n    <div class=\"w-1/4 p-2 h-full\">\n        <ng-container *ngIf=\"isDashBoardContent\">\n            <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\" (click)=\"backToMainView()\">\n                Back\n            </div>\n            <ng-container *ngFor=\"let item of page_config.api_config; let i = index\">\n                <div class=\"mb-2 flex flex-row justify-between items-center border-b\">\n                    <div class=\"text-md py-2 font-bold  text-white px-2\">\n                        {{item.widGetConfig.widgetTitle}}\n                    </div>\n                    <div class=\"flex space-x-2\">\n                        <!-- <button (click)=\"editSelectedWidget(item, i)\"\n                            class=\"w-8 h-8 bg-sky-600 hover:bg-blue-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-edit\"></i>\n                        </button> -->\n                        <button\n                            class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                            <i class=\"fa fa-trash-o\"></i>\n                        </button>\n                    </div>\n                </div>\n\n            </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"isWidgetCreationContent\">\n            <h6 class=\"mb-2 font-bold text-lg tracking-tight text-gray-900 dark:text-white border-b pb-3\">\n                <span *ngIf=\"!islayoutCreate\">Widget Settings</span>\n                <span *ngIf=\"islayoutCreate\">Layout Settings</span>\n            </h6>\n            <div class=\"flex flex-row my-4\">\n                <dx-check-box class=\"ml-auto\" [(ngModel)]=\"addedwidGetConfig.display\" text=\"Display\"></dx-check-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Width</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"widget_width\"\n                    [(ngModel)]=\"addedwidGetConfig.width\"></dx-select-box>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Height</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.height\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <div class=\"text-md my-auto px-2\">Widget Title</div>\n                <div><dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetTitle\"></dx-text-box></div>\n            </div>\n            <div class=\"flex flex-row mb-2 justify-between\" *ngIf=\"!islayoutCreate\">\n                <span class=\"text-md my-auto px-2\">Widget Name</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"widgetName\"></dx-text-box>\n            </div>\n\n\n            <div class=\"flex flex-row mb-5 justify-between\" *ngIf=\"islayoutCreate\">\n                <span class=\"text-sm my-auto px-2\">Layout Title</span>\n                <dx-text-box class=\"w-1/2\" [(ngModel)]=\"addedwidGetConfig.widgetTitle\"></dx-text-box>\n            </div>\n\n            <div class=\"flex flex-row mb-2 justify-between\">\n                <span class=\"text-md my-auto px-2\">Filter</span>\n                <dx-select-box class=\"w-1/2\" [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                    valueExpr=\"filterId\" [(ngModel)]=\"selectedFilterId\"\n                    (onValueChanged)=\"getFilterValueById($event)\"></dx-select-box>\n            </div>\n            <ng-container *ngIf=\"!isUpdateWidget\">\n                <div class=\"mt-6\" *ngIf=\"!islayoutCreate && isEditMainLayout\">\n                    <ng-container\n                        *ngFor=\"let item of dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode;let i = index\">\n                        <div class=\"mb-2 flex flex-row justify-between items-center border-b \">\n                            <div class=\"text-md py-2 font-bold  text-white px-2\">\n                                {{item.nodeProperties.widgetTitle}}\n                            </div>\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button\n                                    *ngIf=\"i !==  dashBoardWidgetConfig.widgets[newWidgetIndex].widgetNode.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForPageView(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button\n                                    class=\"w-8 h-8 bg-red-600 hover:bg-red-800 text-white rounded-full flex items-center justify-center\">\n                                    <i class=\"fa fa-trash-o\"></i>\n                                </button>\n                            </div>\n                        </div>\n\n                    </ng-container>\n                </div>\n            </ng-container>\n\n\n\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Application Views\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <ng-container *ngFor=\"let item of allWidgetInnerContent; let i = index\">\n                        <div class=\"group  w-full flex justify-between border-b items-center\">\n                            <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                                {{item.viewName}}\n                            </div>\n\n                            <div class=\"flex space-x-2\">\n                                <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'up')\">\n                                    <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                                </button>\n\n                                <button *ngIf=\"i !== allWidgetInnerContent.length - 1\"\n                                    class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                                    (click)=\"moveItemForColumns(i, 'down')\">\n                                    <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentViews(item)\">\n                                    <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                                    (click)=\"editComponentDatasets(item)\">\n                                    <i class=\"fa fa-database\" aria-hidden=\"true\"></i>\n                                </button>\n                                <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                                    (click)=\"getDeleteViewFromConfig(i)\">\n                                    <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                                </button>\n                            </div>\n\n                        </div>\n                    </ng-container>\n                </div>\n            </ng-container>\n            <ng-container *ngIf=\"isUpdateWidget\">\n                <div class=\"text-sm py-1 font-extrabold border-b bg-gray-700 text-white px-2\"> Add Filter For View\n\n                </div>\n                <div class=\"border-x border-b p-2\">\n                    <div class=\"flex flex-row py-3 border-b\">\n                        <dx-check-box [(ngModel)]=\"addedwidGetConfig.isWidgetFilter\"\n                            text=\"Popup Columns Filter Enable\"></dx-check-box>\n                    </div>\n                    <div class=\"flex flex-row my-2 border-b\">\n                        <ng-container *ngFor=\"let item of nodeProperticeFilters; let i = index\">\n                            <div class=\"flex flex-wrap border-b\">\n                                <div class=\"px-1 w-1/3\">\n                                    <div class=\"text-md\">Input Type</div>\n                                    <dx-select-box [items]=\"['text']\" [(ngModel)]=\"item.input_type\"\n                                        value=\"text\"></dx-select-box>\n                                </div>\n                                <div class=\"px-1-1 w-2/3\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Server Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.server_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\" *ngIf=\"item.input_type == 'text'\">\n                                    <div class=\"text-md\">Local Column</div>\n                                    <dx-text-box [(ngModel)]=\"item.local_column\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/3\" *ngIf=\"item.input_type == 'select'\">\n                                    <div class=\"text-md\">Columns Name</div>\n                                    <dx-text-box [(ngModel)]=\"item.select_box_option\"></dx-text-box>\n                                </div>\n                                <div class=\"px-1-1 w-1/2\">\n                                    <div class=\"flex justify-end\">\n                                        <div class=\"{{commonService.btn_danger_sm}} w-24 mt-6 text-center\"\n                                            (click)=\"deleteNodeFilter(i)\">Delete Filter</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </ng-container>\n                    </div>\n                    <div class=\"{{commonService.btn_primary_sm}} w-auto text-center\"\n                        (click)=\"getNodeProperticeFilterOption()\">Add\n                        Filter</div>\n                </div>\n            </ng-container>\n\n            <div class=\"flex flex-row justify-end items-center h-16 m-2\">\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n                <ng-container *ngIf=\"!isUpdateWidget\">\n                    <div *ngIf=\"islayoutCreate\"\n                        class=\"{{commonService.btn_success_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addLayoutTOview()\">Add View\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && !isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"addWidgetTOview()\">Add Layout\n                    </div>\n                    <div *ngIf=\"!islayoutCreate && isEditMainLayout\"\n                        class=\"{{commonService.btn_primary_md}} m-2 w-fit text-center cursar-pointer\"\n                        (click)=\"updateLayoutWidgetTOview()\">Update Layout\n                    </div>\n\n                </ng-container>\n\n                <div class=\"{{commonService.btn_warning_md}} m-2 w-fit text-center cursar-pointer\"\n                    (click)=\"updateToView()\" *ngIf=\"isUpdateWidget\">Update View\n                </div>\n\n            </div>\n\n\n            <!-- <pre><code>{{dashBoardWidgetConfig | json}}</code></pre> -->\n        </ng-container>\n        <ng-container *ngIf=\"isChartButtonClick\">\n            <h6\n                class=\"mb-2 font-bold text-md tracking-tight text-gray-900 dark:text-white border-b pb-3 flex  items-center\">\n                <i class=\"fa fa-bar-chart-o mr-2\"></i> Select View\n                <div class=\"{{commonService.btnDarkBlack}} m-2 w-fit text-center cursor-pointer\"\n                    (click)=\"backToMainView()\">Back\n                </div>\n            </h6>\n            <div class=\" h-[80vh] overflow-x-auto\">\n                <div class=\"relative my-2 \">\n                    <input type=\"text\" [(ngModel)]=\"viewToSearch\" (keyup)=\"filterViews()\" (keydown)=\"filterViews()\"\n                        class=\"bg-gray-800 border border-gray-700 text-gray-200 text-sm focus:ring-gray-400 focus:border-gray-500 block w-full p-4 h-8 rounded\"\n                        placeholder=\"Search View\" />\n                    <button type=\"button\" class=\"absolute inset-y-0 right-0 flex items-center pr-6\">\n                        <mat-icon class=\"rotate-90 cursor-pointer\" [svgIcon]=\"'heroicons_outline:search'\"></mat-icon>\n                    </button>\n                </div>\n                <ng-container *ngFor=\"let item of filteredComponentConfig\">\n                    <div class=\"relative group my-3 w-full\">\n                        <!-- Item View Name -->\n                        <div class=\"text-md font-bold border-b py-2 cursar-pointer\">\n                            {{item.viewName}}</div>\n\n                        <!-- Hover Buttons -->\n                        <div\n                            class=\"absolute top-0  right-0 flex space-x-2 opacity-0 group-hover:opacity-100 transition-opacity duration-300 pb-2\">\n                            <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700\">\n                                <i class=\"fa fa-pencil-square-o\" aria-hidden=\"true\"\n                                    (click)=\"editComponentViews(item)\"></i>\n                            </button>\n                            <button class=\"rounded-full p-2 text-white bg-green-500 hover:bg-green-700\"\n                                (click)=\"getComponentConfig(item)\">\n                                <i class=\"fa fa-plus\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n\n        </ng-container>\n        <ng-container *ngIf=\"isDefaultView\">\n            <ng-container *ngFor=\"let item of dashBoardWidgetConfig.widgets; let i = index\">\n                <div class=\"group my-3 w-full flex justify-between border-b items-center\">\n                    <div class=\"text-md font-bold  py-2 cursor-pointer\">\n                        {{item.widgetTitle}}\n                    </div>\n\n                    <div class=\"flex space-x-2\">\n                        <button *ngIf=\"i !== 0\" class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'up')\">\n                            <i class=\"fa fa-arrow-up\" aria-hidden=\"true\"></i>\n                        </button>\n\n                        <button *ngIf=\"i !== dashBoardWidgetConfig.widgets.length - 1\"\n                            class=\"{{commonService.btn_light_sm}} cursor-pointer mx-1\"\n                            (click)=\"moveItemForWidget(i, 'down')\">\n                            <i class=\"fa fa-arrow-down\" aria-hidden=\"true\"></i>\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-blue-500 hover:bg-blue-700 mb-2\"\n                            (click)=\"getEditViewFromLayout(item,i)\">\n                            <i class=\"fa fa-pencil-square\" aria-hidden=\"true\"></i>\n\n                        </button>\n                        <button class=\"rounded-full p-2 text-white bg-red-500 hover:bg-red-700 mb-2\"\n                            (click)=\"getDeleteViewFromLayout(item,i)\">\n                            <i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                        </button>\n\n                    </div>\n                </div>\n            </ng-container>\n        </ng-container>\n\n\n    </div>\n</div>\n<!-- </div> -->\n\n<dx-popup [(visible)]=\"isEditOptionClick\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"{{editViewdataSourceModal.viewName}}\">\n    <div *dxTemplate=\"let data of 'content'\">\n\n        <app-dash-chart [datasetmodal]=\"editViewdataSourceModal\" (getChartConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'chart'\"></app-dash-chart>\n        <app-dash-table [datasetmodal]=\"editViewdataSourceModal\" (getTableConfigOutPut)=\"getEmitNewChartCongig($event)\"\n            *ngIf=\"editViewdataSourceModal.viewType == 'table'\"></app-dash-table>\n        <!-- <app-dash-other [datasetmodal]=\"editViewdataSourceModal\" *ngIf=\"editViewdataSourceModal.viewType == 'others'\"\n            (createOtherComponentView)=\"getEmitNewChartCongig($event)\"></app-dash-other> -->\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isCreateDataset\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateDatasetWithDatasetId\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Editor\" (onHidden)=\"getDatasetPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-dataset [selectedDatasetId]=\"selectedDatasetId\" [isHeader]=\"false\"></app-create-dataset>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n<dx-popup [(visible)]=\"isCreateNewViewWithDefaultView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\"\n    [width]=\"1200\" [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\"\n    (onHidden)=\"getViewPopupHide($event)\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [selectedViewId]=\"selectedViewId\" [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isCreateNewView\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"600\" [showTitle]=\"true\" class=\"popup\" title=\"Views Editor\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <dx-scroll-view class=\"h-full\" [width]=\"'100%'\" [height]=\"'100%'\">\n            <app-create-comp-view [isHeader]=\"false\"></app-create-comp-view>\n        </dx-scroll-view>\n    </div>\n</dx-popup>\n\n\n<dx-popup [(visible)]=\"isWidgetFilters\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"800\" [height]=\"400\"\n    [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"my-2\">\n            <dx-scroll-view [width]=\"'100%'\" [height]=\"'85%'\">\n                <ng-container *ngFor=\"let item of nodeproperticeFilterDataSource; let i = index\">\n                    <div class=\"flex flex-row my-2\">\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.columnName\"></dx-text-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-select-box [items]=\"['get','let']\" [(ngModel)]=\"item.operator\"\n                                placeholder=\"Operator\"></dx-select-box>\n                        </div>\n                        <div class=\"m-1\">\n                            <dx-text-box [(ngModel)]=\"item.value\"></dx-text-box>\n                        </div>\n                    </div>\n                </ng-container>\n\n            </dx-scroll-view>\n            <div class=\"flex justify-end mx-1 flex-grow\">\n                <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\"\n                    (click)=\"submitFilter()\">Submit</button>\n            </div>\n\n        </div>\n\n    </div>\n</dx-popup>\n<dx-popup [(visible)]=\"isAdvanceLayout\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"1200\"\n    [height]=\"700\" [showTitle]=\"true\" class=\"popup\" title=\"Dataset Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <div class=\"flex flex-row px-2 mb-3\">\n            <div class=\"w-2/3 mb-2\">\n                <div class=\"text-md mb-2\">Select Views</div>\n                <dx-tag-box [dataSource]=\"componentConfigDataSource\" valueExpr=\"viewId\" displayExpr=\"viewName\"\n                    [multiline]=\"true\" [showSelectionControls]=\"true\" [(ngModel)]=\"selectedViewsIds\"\n                    [maxDisplayedTags]=\"3\" (onValueChanged)=\"getSelectedColumnSource($event)\" [searchEnabled]=\"true\">\n                </dx-tag-box>\n            </div>\n            <div class=\"w-1/3 px-2\">\n                <button class=\"{{commonService.btn_primary_md}} mt-6\" (click)=\"getProcessForConfig()\">\n                    Add To View\n                </button>\n                <!-- <button class=\"{{commonService.btn_danger_md}} cursor-pointer mt-6\" (click)=\"cancelCdrConfig()\">Cancel\n                                    </button> -->\n            </div>\n        </div>\n        <dx-scroll-view [width]=\"'100%'\" [height]=\"'80%'\">\n\n            <div class=\"m-2 border-b\" *ngIf=\"isProceed\">\n                <ng-container *ngFor=\"let item of advanceLayoutContainer; let i = index;\">\n                    <div class=\"flex flex-row m-2\">\n                        <div class=\"mx-2 w-1/2\">\n                            <div class=\"text-md mb-2\">View Name</div>\n                            <dx-text-box [(ngModel)]=\"item.compConfig.viewConfig[0].viewName\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Title</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.widgetTitle\"></dx-text-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Width</div>\n                            <dx-select-box [searchEnabled]=\"true\" [items]=\"widget_width\"\n                                [(ngModel)]=\"item.nodeProperties.width\"></dx-select-box>\n                        </div>\n\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Height</div>\n                            <dx-text-box [(ngModel)]=\"item.nodeProperties.height\"></dx-text-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mb-2\">Widget Filter</div>\n                            <dx-select-box [items]=\"filterDataSource\" displayExpr=\"filterName\" [searchEnabled]=\"true\"\n                                valueExpr=\"filterId\" [(ngModel)]=\"item.filterId\"></dx-select-box>\n                        </div>\n                        <div class=\"mx-2\">\n                            <div class=\"text-md mt-8\">\n                                <dx-check-box [(ngModel)]=\"item.nodeProperties.display\" text=\"Display\"></dx-check-box>\n                            </div>\n                        </div>\n                        <div class=\"mx-2\">\n                            <button class=\"{{commonService.btn_danger_sm}} cursor-pointer mt-8\"\n                                (click)=\"deleteView(i)\"><i class=\"fa fa-trash-o\" aria-hidden=\"true\"></i>\n                            </button>\n                        </div>\n                    </div>\n                </ng-container>\n            </div>\n        </dx-scroll-view>\n        <div class=\"flex justify-end mx-1 my-2 flex-grow\">\n            <button class=\"{{commonService.btn_success_md}} cursor-pointer mt-2\" (click)=\"submitAdvanceView()\">Add\n                Layout</button>\n        </div>\n    </div>\n</dx-popup>", styles: ["::ng-deep #scrollview-demo{min-height:550px}::ng-deep #scrollview{height:auto;position:absolute;top:0;bottom:300px;padding:20px}::ng-deep #scrollview-content{white-space:pre-wrap}.scrollable-content{height:90vh;overflow-y:auto}\n"] }]
         }], ctorParameters: function () { return [{ type: CommonService }, { type: i1.ActivatedRoute }, { type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: ApplicationContentService }, { type: i2$1.ToastrService }, { type: i1.Router }, { type: ApplicationDatssetsCall }]; }, propDecorators: { dynamicComponentContainer: [{
                 type: ViewChild,
                 args: ['dynamicComponentContainer', { read: ViewContainerRef }]