npm - gamma-app-controller - Versions diffs - 1.0.2 → 1.0.5 - Mend

gamma-app-controller 1.0.2 → 1.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/fesm2020/gamma-app-controller.mjs CHANGED Viewed

@@ -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']
@@ -4948,10 +5011,18 @@ class CreateCompViewComponent {
     }
     getDatasetForPlainJson(dataset) {
         let requestapi = dataset.config.api + '?datasetId=' + dataset.datasetId;
+        this.dataSourceModal = {};
         this.service.getJsonDatasetPayload(requestapi).subscribe({
             next: (data) => {
                 this.dataSourceModal['data'] = data.slice(0, 1);
+                const payload = data["Payload"] || data;
+                this.dataSourceModal['data'] = payload;
+                this.dataSourceModal['requestId'] = dataset.config.serviceId;
+                this.dataSourceModal['api'] = dataset.config.api;
+                this.dataSourceModal['selectedViewType'] = this.selectedViewType;
+                this.dataSourceModal['selectedWidgetConfig'] = (this.selectedDataSet.selectedWidgetConfig) ? this.selectedDataSet.selectedWidgetConfig : undefined;
                 this.isLoader = false;
+                this.isGenerate = true;
             },
             error: (err) => {
                 console.error('Error:', err);
@@ -6285,10 +6356,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 +6489,11 @@ class GammaAdvanceOperatorTableComponent {
                     this.isLoader = false;
                 }, 200);
             }
+            setTimeout(() => {
+                this.dataSourseForTable = [];
+                this.tableDataConfig['columns'] = [];
+                this.isLoader = false;
+            }, 200);
         }
     }
     ngOnInit() {
@@ -6746,6 +6822,11 @@ class GammaAdvanceChartComponent {
                     this.isLoader = false;
                 }
             }
+            else {
+                setTimeout(() => {
+                    this.isLoader = false;
+                }, 200);
+            }
         }
     }
     ngOnInit() {
@@ -8664,7 +8745,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 +8772,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 +8960,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');
@@ -8973,8 +9038,13 @@ class PageConfigComponent {
                 let apiCalls = [];
                 this.service.getAppDatasetConfig(element.datasetId).subscribe({
                     next: (dataset) => {
-                        const datasetWithLimit = this.setDataSetsLimit(dataset);
-                        apiCalls.push(this.datasetService.getDataFromDataSet(datasetWithLimit, datasetWithLimit.datasetId, this.defaultApplyedFilter));
+                        if (dataset.datasetType !== "sqlQuery" && dataset.datasetType !== "plainjson") {
+                            const datasetWithLimit = this.setDataSetsLimit(dataset);
+                            apiCalls.push(this.datasetService.getDataFromDataSet(datasetWithLimit, datasetWithLimit.datasetId, this.defaultApplyedFilter));
+                        }
+                        else {
+                            apiCalls.push(this.datasetService.getDataFromDataSet(dataset, dataset.datasetId, this.defaultApplyedFilter));
+                        }
                         Promise.all(apiCalls).then(() => {
                             this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
                             element.kpiConfig['dataSource'] = this.uniqueDataSetObject[element.datasetId];
@@ -9353,10 +9423,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 }]