@churchillliving/se-ui-toolkit 6.56.20 → 6.56.21
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.
|
@@ -10978,42 +10978,90 @@ class GridComponent {
|
|
|
10978
10978
|
}
|
|
10979
10979
|
this.saveColumnWidths();
|
|
10980
10980
|
}
|
|
10981
|
+
onColumnHeaderDblClick(event, columnHeader, dt) {
|
|
10982
|
+
event.preventDefault();
|
|
10983
|
+
event.stopPropagation();
|
|
10984
|
+
console.log('Double click detected - auto-fitting all columns');
|
|
10985
|
+
// Auto-fit all columns instead of just the one clicked
|
|
10986
|
+
this.selectedColumns.forEach((column) => {
|
|
10987
|
+
this.autoFitColumnWidth(column.header, dt);
|
|
10988
|
+
});
|
|
10989
|
+
}
|
|
10981
10990
|
autoFitColumnWidth(columnHeader, dt) {
|
|
10982
|
-
if (!dt?.el?.nativeElement)
|
|
10991
|
+
if (!columnHeader || !dt?.el?.nativeElement) {
|
|
10992
|
+
console.log('Missing columnHeader or dt');
|
|
10983
10993
|
return;
|
|
10994
|
+
}
|
|
10984
10995
|
const table = dt.el.nativeElement;
|
|
10985
10996
|
const headerCell = table.querySelector(`th[id="${columnHeader}"]`);
|
|
10986
|
-
if (!headerCell)
|
|
10997
|
+
if (!headerCell) {
|
|
10998
|
+
console.log('Header cell not found for:', columnHeader);
|
|
10987
10999
|
return;
|
|
10988
|
-
|
|
10989
|
-
|
|
11000
|
+
}
|
|
11001
|
+
const headerRow = headerCell.parentElement;
|
|
11002
|
+
if (!headerRow) {
|
|
11003
|
+
console.log('Header row not found');
|
|
10990
11004
|
return;
|
|
10991
|
-
|
|
11005
|
+
}
|
|
11006
|
+
const cellIndex = Array.from(headerRow.children).indexOf(headerCell);
|
|
11007
|
+
if (cellIndex < 0) {
|
|
11008
|
+
console.log('Cell index not found');
|
|
11009
|
+
return;
|
|
11010
|
+
}
|
|
11011
|
+
const tbody = table.querySelector('tbody');
|
|
11012
|
+
if (!tbody) {
|
|
11013
|
+
console.log('tbody not found');
|
|
11014
|
+
return;
|
|
11015
|
+
}
|
|
11016
|
+
const rows = tbody.querySelectorAll('tr');
|
|
10992
11017
|
let maxWidth = headerCell.scrollWidth;
|
|
10993
|
-
|
|
11018
|
+
console.log('Header cell scrollWidth:', maxWidth);
|
|
11019
|
+
rows.forEach((row) => {
|
|
10994
11020
|
const cell = row.children[cellIndex];
|
|
10995
|
-
if (cell
|
|
10996
|
-
|
|
11021
|
+
if (cell) {
|
|
11022
|
+
const scrollWidth = cell.scrollWidth;
|
|
11023
|
+
console.log('Cell scrollWidth:', scrollWidth);
|
|
11024
|
+
if (scrollWidth > maxWidth) {
|
|
11025
|
+
maxWidth = scrollWidth;
|
|
11026
|
+
}
|
|
10997
11027
|
}
|
|
10998
11028
|
});
|
|
10999
11029
|
const column = this.selectedColumns.find((col) => col.header?.toLowerCase() === columnHeader?.toLowerCase());
|
|
11000
11030
|
if (column) {
|
|
11001
|
-
|
|
11031
|
+
const padding = 12;
|
|
11032
|
+
const newWidth = Math.ceil(maxWidth + padding);
|
|
11033
|
+
console.log('Setting column width to:', newWidth);
|
|
11034
|
+
// Remove width constraints from CSS for this column
|
|
11035
|
+
const styleSheets = document.styleSheets;
|
|
11036
|
+
for (let i = 0; i < styleSheets.length; i++) {
|
|
11037
|
+
try {
|
|
11038
|
+
const rules = styleSheets[i].cssRules;
|
|
11039
|
+
for (let j = rules.length - 1; j >= 0; j--) {
|
|
11040
|
+
const rule = rules[j];
|
|
11041
|
+
if (rule.selectorText && rule.selectorText.includes(`nth-child(${cellIndex + 1})`) &&
|
|
11042
|
+
rule.selectorText.includes('GridComponentTable')) {
|
|
11043
|
+
console.log('Removing CSS rule:', rule.selectorText);
|
|
11044
|
+
styleSheets[i].deleteRule(j);
|
|
11045
|
+
}
|
|
11046
|
+
}
|
|
11047
|
+
}
|
|
11048
|
+
catch (e) {
|
|
11049
|
+
// CORS errors on external stylesheets, ignore
|
|
11050
|
+
}
|
|
11051
|
+
}
|
|
11052
|
+
column['customWidth'] = newWidth;
|
|
11053
|
+
column['columnWidth'] = newWidth;
|
|
11054
|
+
// Update through data binding
|
|
11055
|
+
this.selectedColumns = [...this.selectedColumns];
|
|
11002
11056
|
this.saveColumnWidths();
|
|
11057
|
+
// Force table recalculation
|
|
11058
|
+
this.cdr.detectChanges();
|
|
11059
|
+
setTimeout(() => {
|
|
11060
|
+
this.cdr.detectChanges();
|
|
11061
|
+
}, 50);
|
|
11003
11062
|
}
|
|
11004
|
-
|
|
11005
|
-
|
|
11006
|
-
const target = event.target;
|
|
11007
|
-
const th = target.closest('th[pResizableColumn]');
|
|
11008
|
-
if (!th)
|
|
11009
|
-
return;
|
|
11010
|
-
const rect = th.getBoundingClientRect();
|
|
11011
|
-
const threshold = 15;
|
|
11012
|
-
const distanceFromRight = rect.right - event.clientX;
|
|
11013
|
-
if (distanceFromRight <= threshold && distanceFromRight >= 0) {
|
|
11014
|
-
event.preventDefault();
|
|
11015
|
-
event.stopPropagation();
|
|
11016
|
-
this.autoFitColumnWidth(columnHeader, dt);
|
|
11063
|
+
else {
|
|
11064
|
+
console.log('Column not found in selectedColumns');
|
|
11017
11065
|
}
|
|
11018
11066
|
}
|
|
11019
11067
|
saveColumnWidths(toggleColumns = []) {
|
|
@@ -14547,11 +14595,11 @@ class GridComponent {
|
|
|
14547
14595
|
this.moreMenu?.toggle(event);
|
|
14548
14596
|
}
|
|
14549
14597
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GridComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: SystemConfigService }, { token: i1$1.DialogService }, { token: FormService }, { token: GridService }, { token: AlertService }, { token: AuthenticationService }, { token: i0.ElementRef }, { token: i1$3.DecimalPipe }, { token: PageLoggerService }, { token: HyperlinkService }, { token: i0.ChangeDetectorRef }, { token: i6.Router }, { token: i1$3.DatePipe }, { token: i0.NgZone }, { token: i3.ConfirmationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: RequestService }, { token: i0.ApplicationRef }, { token: i1$1.DynamicDialogConfig, optional: true }, { token: i1$1.DynamicDialogRef, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14550
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: GridComponent, selector: "se-grid", inputs: { activeTestMode: "activeTestMode", selectedRows: "selectedRows", setGridRefreshTime: "setGridRefreshTime", addDataKeyValue: "addDataKeyValue", stopDialogClose: "stopDialogClose", autoCheckNewRow: "autoCheckNewRow", showRefreshBtn: "showRefreshBtn", hideRefreshBtn: "hideRefreshBtn", horizontalScroll: "horizontalScroll", hideDeleteBtn: "hideDeleteBtn", hideEditBtn: "hideEditBtn", hideAddBtn: "hideAddBtn", loading: "loading", autoLoadData: "autoLoadData", rowStyle: "rowStyle", allowSelection: "allowSelection", selectionColumnWidth: "selectionColumnWidth", allowSelectionHeader: "allowSelectionHeader", hideGridSaveButton: "hideGridSaveButton", hideGridCancelButton: "hideGridCancelButton", allowExportToPdf: "allowExportToPdf", allowExportToExcel: "allowExportToExcel", setActionColumnAsFirst: "setActionColumnAsFirst", useInlineCRUD: "useInlineCRUD", preventNewRow: "preventNewRow", rowActions: "rowActions", selectionType: "selectionType", dataKey: "dataKey", clearGridFilter: "clearGridFilter", searchGridFilter: "searchGridFilter", scrollable: "scrollable", scrollHeight: "scrollHeight", tableStyle: "tableStyle", wordWrap: "wordWrap", ellipsis: "ellipsis", newGridRow: "newGridRow", filtering: "filtering", reportButtons: "reportButtons", rowHover: "rowHover", hideFilterOptions: "hideFilterOptions", autoComplete: "autoComplete", setPaginationLength: "setPaginationLength", rows: "rows", globalFilterData: "globalFilterData", columns: "columns", permissions: "permissions", allowColumnToggle: "allowColumnToggle", hideFilter: "hideFilter", lookupFilters: "lookupFilters", pagination: "pagination", showCurrentPageReport: "showCurrentPageReport", totalRecords: "totalRecords", aggregatedResult: "aggregatedResult", showconfirmDialog: "showconfirmDialog", saveAllData: "saveAllData", defaultRows: "defaultRows", columnActions: "columnActions", useServerSideEvents: "useServerSideEvents", enableClientSideFiltering: "enableClientSideFiltering", globalFilterFields: "globalFilterFields", allowCaching: "allowCaching", allowPersistence: "allowPersistence", softCaching: "softCaching", editAllRows: "editAllRows", gridName: "gridName", autoResize: "autoResize", allowTextCopy: "allowTextCopy" }, outputs: { inlineRowCancel: "inlineRowCancel", rowsChange: "rowsChange", onRowClick: "onRowClick", onCheckBoxFilterClick: "onCheckBoxFilterClick", onRowCheckBox: "onRowCheckBox", onSortChange: "onSortChange", onFilterChange: "onFilterChange", onMultiSelectionChange: "onMultiSelectionChange", onApplyFilter: "onApplyFilter", isIncludedAllColumns: "isIncludedAllColumns", onServerSideEventChange: "onServerSideEventChange", onPageChange: "onPageChange", onRowUpdate: "onRowUpdate", onRowOrderChanged: "onRowOrderChanged", onCancelAllRows: "onCancelAllRows", onRowDelete: "onRowDelete", onRowAdd: "onRowAdd", onGridRowActions: "onGridRowActions", onGridRowEdit: "onGridRowEdit", onGridRowAdd: "onGridRowAdd" }, host: { listeners: { "copy": "handleCopyOrCut($event)", "cut": "handleCopyOrCut($event)", "click": "onClick($event.target)", "window:beforeunload": "beforeunloadHandler($event)" } }, viewQueries: [{ propertyName: "panelOverlayViewContainer", first: true, predicate: ["viewContainerRef"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "table", first: true, predicate: ["dt"], descendants: true }, { propertyName: "moreMenu", first: true, predicate: ["moreMenu"], descendants: true }, { propertyName: "gridRow", predicate: ["gridRow"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"grid-component-wrapper\">\n <p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n <p-confirmDialog class=\"grid-component-confirm-dialog\" *ngIf=\"columnActions.length > 0\"\n key=\"handlecolumnActions\"></p-confirmDialog>\n <div class=\"global-filter-buttons-wrapper flex align-items-center\">\n\n <!-- button for apply value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter ) || showFilterbtn)\" pButton type=\"button\" icon=\"pi pi-search\"\n (click)=\"applyGridFilterBtn()\" [class]=\"\n searchGridFilter ? 'p-button-success apply-filter-btn filter-btn' : 'hide-clear-filter-button apply-filter-btn filter-btn'\n \"></button>\n\n <!-- button for clear value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter )|| showFilterbtn)\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n clearGridFilter ? 'filter-btn' : 'hide-clear-filter-button filter-btn'\n \" class='global-refresh global-btn'></button>\n\n <!-- button for save all grid at once -->\n <button pButton *ngIf=\"editAllRows && editRowPermission\" id=\"saveAllGridValues\" icon=\"pi pi-check\" [label]=\"'Save'\"\n [class]=\"hideGridSaveButton ? 'hide-clear-filter-button save-all-grid' : 'ui-button-info save-all-grid'\"\n type=\"button\" (click)=\"saveAllRowsAtOnce()\"></button>\n\n <!-- button for cancel all grid at once -->\n <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\"\n [label]=\"'Cancel'\" icon=\"pi pi-times\" class=\"ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n <!-- header Button for multiSelect on Grid -->\n <span *ngIf=\"allowColumnToggle\">\n <p-multiSelect [showToggleAll]=\"false\" optionDisabled=\"false\" [options]=\"selectedToggleColumns\"\n [(ngModel)]=\"selectedColumns\" optionLabel=\"header\" selectedItemsLabel=\"{0} columns selected\"\n class=\"grid-component-multiselect-header-button\" placeholder=\"Choose Columns\">\n </p-multiSelect>\n </span>\n\n <!-- header Button for Adding new Row on Grid -->\n <button pButton *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\" type=\"button\" [label]=\"'Add'\" pAddRow\n [table]=\"componentTableRef\" [preventNewRow]=\"preventNewRow\" [newRow]=\"newGridRow\" [id]=\"dataKey\"\n pTooltip=\"Add New Row\" tooltipPosition=\"bottom\" icon=\"pi pi-plus\"\n [class]=\"'ui-button-info global-add-btn'+gridName\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n\n <!-- header Button for Excel File on Grid -->\n <button *ngIf=\"allowExportToExcel\" type=\"button\" pButton icon=\"pi pi-file-excel\" (click)=\"exportExcel()\"\n class=\"p-button-success\" pTooltip=\"Export to Excel\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- header Button for PDF File on Grid -->\n <button *ngIf=\"allowExportToPdf\" type=\"button\" pButton icon=\"pi pi-file-pdf\" (click)=\"exportPdf()\"\n class=\"p-button-warning mr-2 ml-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info mr-2 ml-2\">\n <se-generate-report-btn *ngIf =\"!reportButton.hidden\"[repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n </div> -->\n\n <ng-content></ng-content>\n\n <ng-container *ngFor=\"let reportButton of reportButtons\">\n <se-generate-report-btn *ngIf=\"!reportButton.hidden\" [repInfo]=\"reportButton\" [label]=\"reportButton.label\"\n [params]=\"reportButton.params\" [icon]=\"reportButton.icon\" [class]=\"reportButton.class\"\n [showDialog]=\"reportButton.showDialog\" [reportType]=\" reportButton.reportType\"\n [reportHeader]=\"reportButton.reportHeader\" [reportFooter]=\"reportButton.reportFooter\"></se-generate-report-btn>\n </ng-container>\n\n </div>\n\n <p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n [lazy]=\"useServerSideEvents || pagination\" [paginator]=\"pagination\"\n [alwaysShowPaginator]=\"pagination && totalRecords > 0\" [globalFilterFields]=\"globalFilterFields\"\n [class]=\"' grid-component-main-table ' + (pagination || !rowsData.length ? ' pagination ' : '') + (tableStyle.includes('width') ? ' hasTableWidthStyle ' : '') + (autoResize ? '' : 'table-layout-auto') \"\n (onColResize)=\"onColumnResize($event,dt)\" [resizableColumns]=\"true\" responsiveLayout=\"scroll\"\n columnResizeMode=\"expand\" [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\"\n [rowsPerPageOptions]=\"setPaginationLength\" [showCurrentPageReport]=\"showCurrentPageReport\"\n currentPageReportTemplate=\"Showing {first} to {last} of {{\n totalRecords\n }} entries\" [loading]=\"!setGridRefreshTime ? loading : false\"\n (onSort)=\"sortDisabled ? '' : handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n (onLazyLoad)=\"shouldRunServerSide($event) ? handleServerSideEvents($event, dt) : null\"\n (onPage)=\"gridService.columnFocusedOut ? showConfirmation($event) : handleServerSidePagination($event)\" #dt\n [dataKey]=\"dataKey\" [selection]=\"selectedRows\" (selectionChange)=\"onTableSelectionChange($event)\" selectionMode=\"multiple\" [scrollable]=\"scrollable\"\n [tableStyle]=\"tableStyle\" [scrollHeight]=\"scrollHeight\" editMode=\"row\" [editingRowKeys]=\"editingRowKeys\"\n [rowHover]=\"rowHover\" [ngClass]=\"setClassaAndId(dt)\" (onRowReorder)=\"onRowReorder($event)\">\n\n <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"flex justify-content-end\">\n <span *ngFor=\"let rowAction of rowActions\">\n <button pButton type=\"button\" [label]=\"rowAction.title\" [class]=\"rowAction.class\"\n (click)=\"rowAction.onClick(selectedRows)\"></button>\n </span>\n </div>\n\n <!-- header columns on Grid -->\n <ng-template pTemplate=\"header\" let-cols>\n <tr>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'multiple'\" class=\"grid-component-selection\"\n id=\"{{allowSelectionHeader}}\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-2\n table-header-inner-div div-last-inner-html-is-icon\">\n <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n (onChange)=\"handleHeaderCheckboxChange($event)\"></p-tableHeaderCheckbox>\n </div>\n </span>\n </th>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'single'\" id=\"Select\" data-title-element=\"self\"\n class=\"grid-component-selection\">\n Select\n </th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn' \" data-title-element=\"self\">\n Actions\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [attr.data-column-header]=\"column?.header\" [pSortableColumn]=\"column.field\"\n [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n class=\"column?.type === 'multiple' ? 'grid-component-select-th-column-type-multiple' : '\"\n (dblclick)=\"onColumnHeaderDblClick($event, column.header, dt)\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-1 table-header-inner-div div-last-inner-html-is-icon\">\n <span [attr.data-title-element]=\"'self'\" [class]=\"'flex-grow-1'\">{{ column.header }}\n <span *ngIf=\"column.isRequired\" class=\"grid-component required-star\">*</span>\n </span>\n <p-sortIcon\n *ngIf=\"column.sorting !== false && column?.type !== 'multiple' && (!(editAllRows && pagination) || sortIconHidden)\"\n [field]=\"column.field\" (click)=\"handleCustomSorting()\"></p-sortIcon>\n </div>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn id=\"MoreActions\" class=\"more-actions-th\">More</th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" data-title-element=\"self\">Actions</th>\n </tr>\n <tr *ngIf=\"filtering && !hideFilter\">\n <th pResizableColumn *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n <th pResizableColumn *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && useInlineCRUD\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [ngSwitch]=\"column?.filter?.type\"\n [class]=\"hideFilterOptions ? 'hide-table-filter temp' : 'temp'\">\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n <!-- Text input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <input type=\"text\" [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </ng-template>\n </p-columnFilter>\n\n <!-- Numeric input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'numeric'\" [field]=\"column.field\"\n *ngSwitchCase=\"'numeric_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-inputNumber [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\"\n [attr.autocomplete]=\"column.filterAutoComplete === true ? 'on' : 'off'\"></p-inputNumber>\n </ng-template>\n </p-columnFilter>\n\n <!-- lookup input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" matchMode=\"equals\"\n *ngSwitchCase=\"'lookup_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <div class=\"close-icon-wrapper grid-component lookup-filter-wrapper\">\n <div class=\"lookup-filter-input-wrapper\">\n <input [id]=\"column.field?.toLowerCase() + '_filter'\" class=\"grid-component lookup-filter\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n type=\"text\" [ngModel]=\"lookupFilterInputNgModel(column)\"\n (ngModelChange)=\"changeLookupInputNgModel('lookupFilter', column, $event)\"\n (click)=\"setFilterLookup(column)\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </div>\n <div class=\"direct-wrapper-close-icon-lookup\">\n <button *ngIf=\"column.filterValue\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column)\">\n </button>\n </div>\n </div>\n </ng-template>\n </p-columnFilter>\n\n <!-- checkbox on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" type=\"boolean\" [field]=\"column.field\" *ngSwitchCase=\"'checkbox'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-checkbox [binary]=\"true\" [disabled]=\"column.disabled\" [ngModel]=\"column.filterValue\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\n (ngModelChange)=\"clickCheckBoxFilter(column, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n </p-checkbox>\n </ng-template>\n </p-columnFilter>\n\n <!-- multiSelect on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'multi-select'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-multiSelect [(ngModel)]=\"column.filterValue\" [options]=\"column.filter.data || []\" [appendTo]=\"'body'\"\n [name]=\"column.field\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n [optionValue]=\"column.optionValue\" [optionLabel]=\"column.optionLabel\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n\n </p-multiSelect>\n </ng-template>\n </p-columnFilter>\n\n <!-- dropdown on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'dropdown'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-dropdown [showClear]=\"true\" [placeholder]=\"'Select'\" [filter]=\"column.allowSearch\"\n [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n [options]=\"column.filter.data || []\" (onChange)=\"searchDropdownFilter(filter, $event, column)\"\n [appendTo]=\"'body'\" filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n </p-columnFilter>\n\n <!-- calendar on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'calendar'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-datepicker [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.filterValue\"\n [class]=\"column.field + '-filter-input'\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n appendTo=\"body\" (onSelect)=\"selectDate(column)\" [inputId]=\"column.field\" hourFormat=\"12\"\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\" [showButtonBar]=\"true\"\n (onClose)=\"setFilterFocusOut(column, filter, $event)\" [dateFormat]=\"calendarFormat\"\n (ngModelChange)=\"calendarInputValue(column, {}, true)\" (onClearClick)=\"backspaceEvent($event, column)\"\n (keydown)=\"setFilterFocusOut(column, filter, $event)\">\n </p-datepicker>\n </ng-template>\n </p-columnFilter>\n\n <!-- Default Filter For Header -->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"\n column.type && column.type !== 'link' ? column.type : 'text'\n \" [field]=\"column.field\" display=\"menu\" *ngSwitchDefault>\n </p-columnFilter>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn class=\"more-actions-th\"></th>\n <th pResizableColumn\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n </tr>\n </ng-template>\n\n <!-- Body columns on Grid -->\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n <tr [style]=\"rowStyle\" [ngClass]=\"{\n 'highlighted-row': row?.highlightrow,\n 'ellipsis-true': ellipsis,\n 'p-selectable-row wordWrapTrue': wordWrap,\n 'wordWrapFalse p-selectable-row': !wordWrap\n }\" (click)=\"selectedRowRecord = row\" [pEditableRow]=\"row\" [pReorderableRow]=\"ri\" #gridRow [id]=\"row[dataKey]\">\n <td *ngIf=\"allowSelection\" class=\"grid-component-selection\" pReorderableRowHandle>\n <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"></p-tableRadioButton>\n <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"></p-tableCheckbox>\n </td>\n\n <!-- first actions column -->\n <!-- <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class=\"setActionColumnWidth\">\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n\n <!-- Grid Rows Data Bindings Start -->\n <td *ngFor=\"let column of selectedColumns\" [ngSwitch]=\"column.type\" [style]=\"column.style\"\n [class]=\"column.style ? '' : 'w-static-col'\" [attr.data-column-field]=\"column?.field\"\n [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-overlay' : ''\" pReorderableRowHandle>\n <span [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-wrapper' : ''\"\n (mouseenter)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? addDynamicPanelOverlayComponent(column.hoverData, overlayPanel, $event, row) : ''\"\n (mouseleave)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? mouseLeaveEvent(overlayPanel) : ''\">\n <span class=\"td-content-wrapper\" [style]=\"column.style\">\n\n <!-- Boolean column on Grid -->\n <span *ngSwitchCase=\"'boolean'\">\n <td *ngIf=\"!editing && row[column.field + '_obj']?.show != false\">\n <p-checkbox [ngClass]=\"{'disabled-checkbox': column.disabled}\" [binary]=\"true\"\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (change)=\"onFocusOutEvent(column, row)\"\n [ngModel]=\"getCheckboxValue(row, column)\">\n </p-checkbox>\n </td>\n <td *ngIf=\"editing\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for edit checkBox -->\n <p-checkbox (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [ngModel]=\"getCheckboxValue(row, column)\"\n (change)=\"onFocusOutEvent(column, row)\"></p-checkbox>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ row[column.field] }}\n </ng-template>\n </p-cellEditor>\n </td>\n </span>\n\n <!-- link column on Grid -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'a,input'\" *ngSwitchCase=\"'link'\">\n <!-- link column for HyperLink Case -->\n <span *ngIf=\"column.allowSave === false\">\n <span *ngIf=\"column.target !== '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n <span *ngIf=\"column.target === '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\" allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]='column.target' pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </span>\n <!-- link column for Edit Case -->\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <span *ngIf=\"(column.editable === true ) && (column.editLink === true )\">\n <input *ngIf=\"!row.isNew\" pInputText\n [ngModel]=\"row[column.field + '_obj']?.displayField || row[column.field] || ''\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj'].displayField = $event : row[column.field] = $event\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\" type=\"text\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n <input pInputText *ngIf=\"row.isNew\" type=\"text\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj']?.displayField : row[column.field] = $event\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n </span>\n <!-- <span *ngIf=\"column.editable === false|| column.editable === undefined\" >\n <a class=\"custom-link\" (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" [target]='column.target'\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\" [title]=\"column.header\"></i>\n <ng-template #noIcon>\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </ng-template>\n \n </a>\n </span> -->\n <span\n *ngIf=\"(column.editLink === false|| column.editLink === undefined)&&(column.editable === false|| column.editable === undefined)\">\n <a class=\"d-inline\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [class]=\"column.icon\" [title]=\"column.header\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n\n </a>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [style]=\"column.style\" class=\"custom-link\"\n [class]=\"column.editable === false || allowDisabled(column,row) ? 'disabled-link' : ''\">\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\" pReorderableRowHandle>\n <i *ngIf=\"column.icon&& !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [title]=\"column.header\" [class]=\"column.icon\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n\n <!-- Iframe column on Grid -->\n <span *ngSwitchCase=\"'iframe'\">\n <span class=\"custom-link\" (click)=\"gridIFrame(column, row[column.field + '_obj']?.hyperlink, row)\" [title]=\"\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText\n ? column.displayText\n : row[column.field]\n\n \">\n <button class=\"custom-icon-btn\" *ngIf=\"column.icon; else noIcon\" [disabled]=\"column.disabled\">\n <i [class]=\"column.icon\" [title]=\"column.header\"></i>\n </button>\n <ng-template #noIcon>\n {{\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText ? column.displayText : row[column.field]\n }}\n </ng-template>\n </span>\n </span>\n\n <!-- dialog column on Grid -->\n <span *ngSwitchCase=\"'dialog'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span *ngIf=\"column?.filter?.type !== 'calendar' && !row?.hidegridbtn\">\n <span *ngIf=\"column.editable === true && !row[column.field+'_obj']?.hideFieldValue\"\n pReorderableRowHandle>\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\" readonly\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" pInputText\n (click)=\"selectLookupField(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" />\n\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"column.editable === false || column.editable === undefined\n \" class=\"custom-link\" [style]=\"column.style\" [class]=\"\n allowDisabled(column,row) ? 'disabled-link' : ''\n \" (click)=\"openGridDialog(column, row, $event)\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>{{ (!column.displayText && row.isNew ) ||\n row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row, column)\n }}</ng-template>\n </span>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && column.editable === true\"\n [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <p-datepicker\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\" [appendTo]=\"'body'\" hourFormat=\"12\"\n [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\" [timeOnly]=\"column.timeOnly\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ?\n row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\"></p-datepicker>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && !column.editable\" class=\"custom-link\"\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\">{{ row[column.field+'_obj']?.hideFieldValue ? '' :\n setConditionBaseValue(row, column) }}\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"custom-link\" [style]=\"column.style\" pReorderableRowHandle\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [title]=\"column.hoverData ? '' : column.header\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"></i>\n <ng-template #noIcon>{{ row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row,\n column) }}</ng-template>\n <!-- {{ setConditionBaseValue(row, column) }}\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\" -->\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- test -->\n <!-- lookup Input column on Grid -->\n <span *ngSwitchCase=\"'lookup_input'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <div class=\"close-icon-wrapper\">\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\"\n [readonly]=\"!isLookupInputEditable(column, row)\" type=\"text\" [ngModel]=\"lookupInputNgModel(row, column)\"\n (ngModelChange)=\"changeLookupInputNgModel(row, column, $event)\" [disabled]=\"allowDisabled(column,row)\"\n (click)=\"isLookupInputEditable(column, row) ? onClickEvent(column, row) : selectLookupField(column, row)\"\n (change)=\"onChangeEvent(column, row)\" (keydown.enter)=\"onLookupInputEnter($event, column, row)\"\n (paste)=\"onLookupInputPaste($event, column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" />\n <div *ngIf=\"!allowDisabled(column,row)\">\n <button\n *ngIf=\"isLookupInputEditable(column, row) && (row[column.field + '_obj']?.lookupControl?.component || column.lookupControl?.component)\"\n icon=\"pi pi-search\" pButton type=\"button\" (click)=\"selectLookupField(column, row)\"></button>\n <button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n ? row[column.field].text\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column,row)\"></button>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"column.linkId\">\n <a [attr.data-title-element]=\"column.hoverData ? null : 'self'\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target === '_self' ? '' : '_blank'\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </a>\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"!column.linkId\" [style]=\"column.style\"\n [class]=\"column.lookupControl?.component && column.editLink === true ? 'custom-link' : ''\"\n (click)=\"openLookupHyperlink(column, row)\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Numeric Input column on Grid -->\n <span *ngSwitchCase=\"'numeric'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for Currency && Decimal && Percent -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'input'\" class=\"input-number\"\n pReorderableRowHandle>\n <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n row[column.field.toLowerCase()+'_obj']?.errorMessage\n ? 'ng-invalid ng-dirty'\n : 'form-control'\n \" [showButtons]=\"false\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"column.field\" [disabled]=\"allowDisabled(column,row)\" (onFocus)=\"onFocusEvent(column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\" autocomplete=\"off\" (keydown)=\"allowLeadingDot($event)\" [mode]=\"\n column.format &&\n column.format.type === 'currency'\n ? 'currency'\n : 'decimal'\n \" [currency]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.currency\n ? column.format.formatParams.currency\n : 'USD'\n \" [locale]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.locale\n ? column.format.formatParams.locale\n : 'en-US'\n \" [minFractionDigits]=\"column.format ? setNumericMinFraction(column) : '0'\"\n [maxFractionDigits]=\"column.format ? setNumericMaxFraction(column) : '0'\" [suffix]=\"\n column.format &&\n column.format.type === 'percent' && \n '%'\n \n \">\n </p-inputNumber>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\" pReorderableRowHandle>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n setNumericFormat(column, row)\n }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Button column on Grid -->\n <span *ngSwitchCase=\"'add_button'\">\n <div>\n <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n class=\"grid-component-grid-add-btn\" (click)=\"onClickButton(column, row)\"></button>\n </div>\n </span>\n\n <!-- Generate File Button column on Grid -->\n <span *ngSwitchCase=\"'generate_file_button'\">\n <se-generate-import-file\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [dialogData]=\"column.data\" [selectedRow]=\"row\"></se-generate-import-file>\n </span>\n\n <!-- Send email Button column on Grid -->\n <span *ngSwitchCase=\"'send_email_button'\">\n <se-email-generate-btn\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\" [column]=\"column\"\n [selectedRow]=\"row\"></se-email-generate-btn>\n </span>\n\n <!-- Date column on Grid -->\n <!-- calendar selector -->\n <span *ngSwitchCase=\"'date'\"\n [attr.data-title-element]=\"column.hoverData? null: editAllRows ? 'input' : 'self' \">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <p-datepicker [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\" hourFormat=\"12\" [defaultDate]=\"defaultDate\"\n [stepMinute]=\"column.minutesInterval ? column.minutesInterval : 1\" [showTime]=\"column.showTime\"\n [timeOnly]=\"column.timeOnly\" [dateFormat]=\"column.format ? column.format.type : calendarFormat\"\n (keyup)=\"calendarInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"onCalendarModelChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n [showButtonBar]=\"!column.timeOnly\"></p-datepicker>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed white-space-nowrap text-center border-readonly\">\n {{ setConditionBaseValue(row,column) }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n\n <span *ngSwitchDefault>\n <span [ngSwitch]=\"column.type\">\n <!-- Dropdown column on Grid -->\n <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\"\n [attr.data-title-element]=\" column.hoverData? null: editAllRows ? '.p-dropdown-label' : 'self'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-dropdown *ngIf=\"!row[column.field+'_obj']?.hidden\" [options]=\"\n row[column.field?.toLowerCase()+'_data']\n ? row[column.field?.toLowerCase()+'_data']\n : column.data\n \"\n [ngModel]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField?.toLowerCase() ? row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n ? row[column.displayField]\n : row[column.field] ? row[column.field] : 'Select'\"\n [showClear]=\"row[column.field] ? true : false\" [optionLabel]=\"column.optionLabel\"\n (click)=\"onClickEvent(column, row)\" [optionValue]=\"column.optionValue\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n (onChange)=\"onChangeEvent(column, row)\" [appendTo]=\"'body'\" [filter]=\"column.allowSearch\"\n filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed border-readonly\">\n <ng-container *ngIf=\"!row[column.field+'_obj']?.hidden\">\n <a *ngIf=\"column.displayAsLink\" class=\"custom-link\"\n [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]='column.target'>\n {{ setDropdwonReadOnlyValue(row, column) }}\n </a>\n <span *ngIf=\"!column.displayAsLink\">\n {{ setDropdwonReadOnlyValue(row, column) }}\n </span>\n </ng-container>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- MultiSelect column on Grid -->\n <!-- [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n row[column.field]\" -->\n <span *ngSwitchCase=\"'multi-select'\"\n [attr.data-title-element]=\"column.hoverData ? null : '.p-multiselect-label'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-multiSelect\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" [(ngModel)]=\"row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [options]=\"row[column.field.toLowerCase() + '_data'] ? row[column.field.toLowerCase() + '_data'] : column.data\"\n [optionLabel]=\"column.optionLabel\" [optionValue]=\"column.optionValue\"\n (onChange)=\"onChangeEvent(column, row)\" (onPanelShow)=\"showOption(column, row)\"\n (click)=\"onClickEvent(column, row)\" [appendTo]=\"'body'\" (blur)=\"onFocusOutEvent(column, row)\">\n </p-multiSelect>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n row[column.displayField]\n ? row[column.displayField] :\n setMultiSelectData(column, row[column.field])\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- AutoComplete Search -->\n <span *ngSwitchCase=\"'AutoComplete'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-autoComplete\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [name]=\"column.header\"\n [suggestions]=\"column.data\" (onSelect)=\"autoCompleteSelectedValue(row, column, $event)\"\n [field]=\"column.optionLabel ? column.optionLabel?.toLowerCase() : column.displayField ? column.displayField?.toLowerCase() : column.field?.toLowerCase()\"\n [ngModel]=\"getAutoCompleteNgModel(row, column)\"\n (ngModelChange)=\"changeAutoCompleteNgModel(row, column, $event)\" [dropdown]=\"column.showOption\"\n (ngModelChange)=\"onChangeEvent(column, row)\" (click)=\"onClickEvent(column, row)\"\n (completeMethod)=\"autoSearch($event, column, row)\" (onBlur)=\"onFocusOutEvent(column, row, $event)\"\n [disabled]=\"allowDisabled(column,row)\" [appendTo]=\"'body'\" [multiple]=\"true\"\n (keydown.enter)=\"onAutoCompleteKeyEnterEvent($event, column, row)\">\n </p-autoComplete>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n </span>\n </span>\n <span\n *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.field] && !column.displayField\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.field] : value[column.field] + ';' : value[column.field] }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n <!-- Add Generate Report Button -->\n <span *ngSwitchCase=\"'report'\">\n <p-cellEditor>\n <ng-template pTemplate=\"output\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [class]=\"column.class\" [showDialog]=\"column.showDialog\"\n [icon]=\"column.icon\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n <ng-template pTemplate=\"input\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [icon]=\"column.icon\" [class]=\"column.class\"\n [showDialog]=\"column.showDialog\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <span *ngSwitchDefault [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <!-- Input column on Grid -->\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n\n <textarea *ngIf=\"column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]])\"\n [(ngModel)]=\"row[column.field]\" [attr.data-cell]=\"column.field + '-' + row[dataKey]\"\n class=\"prime-textarea\"\n style=\"resize: none; min-width: 200px; min-height: 40px; word-break: break-word; text-align: justify; overflow: hidden;\"\n [disabled]=\"allowDisabled(column,row)\" (blur)=\"onTextareaBlur(column, row)\"\n (keydown.enter)=\"onTextareaEnter($event, column, row)\" autofocus></textarea>\n\n <input\n *ngIf=\"!column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]]) && column.field !== dataKey\"\n [type]=\"row[column.field+'_obj']?.textType?row[column.field+'_obj']?.textType:column.textType?column.textType:'text'\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [ngModel]=\"setInputNgModel(row, column)\"\n (ngModelChange)=\"onInputChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n (click)=\"onClickButton(column, row)\" />\n <span *ngIf=\"!(editAllRows || editingRowKeys[row[dataKey]])\">\n {{ row[column.field] }}\n </span>\n\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n (click)=\"changePasswordType(column, row)\" [title]=\"column.header\"></i>\n </span>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n <span (click)=\"onClickEvent(column, row)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self' \"\n [class]=\"row[column.field+'_obj']?.textType ?(row[column.field+'_obj']?.textType=='password' ?'password':'') :column.textType=='password'?'password':''\">\n {{ setTextBoxReadOnlyValue(row, column) }}\n </span>\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n [title]=\"column.header\" (click)=\"changePasswordType(column, row)\"></i>\n </span>\n </span>\n </span>\n </ng-template>\n\n </p-cellEditor>\n </span>\n </span>\n </span>\n\n </span>\n </span>\n </td>\n <!-- Grid Rows Data Bindings End -->\n\n <!-- More actions column (ellipsis) -->\n <td *ngIf=\"hasMoreItems(row)\" class=\"for-more-actions\">\n <button pButton type=\"button\" icon=\"pi pi-ellipsis-v\" class=\"p-button-text\" (click)=\"showMore($event, row)\"\n aria-label=\"More actions\"></button>\n </td>\n\n <!-- Action column on Grid -->\n <!-- <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\n class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" class=\"for-buttons\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class='setActionColumnWidth'>\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n </tr>\n </ng-template>\n\n <!-- Footer columns on Grid -->\n <ng-template pTemplate=\"footer\">\n <tr *ngIf=\"aggregateFooter\">\n <td\n *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngFor=\"let outerColumn of selectedColumns\" class=\"grid-component-outer-column\" [style]=\"outerColumn.style\">\n <div *ngFor=\"let innerColumn of selectedColumns\">\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) ||\n aggr.displayField && aggr.displayField?.toLowerCase() === outerColumn.field?.toLowerCase())\">\n <div [innerHTML]=\"aggr.aggrValue\">\n </div>\n </div>\n </div>\n </div>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\"></td>\n </tr>\n </ng-template>\n\n <!-- Footer for Empty Message columns on Grid -->\n <ng-template pTemplate=\"emptymessage\">\n <tr class=\"grid-component no-records-found\">\n <td [attr.colspan]=\"selectedColumns?.length + 1\">{{totalRecords==0? 'No records found':''}}</td>\n </tr>\n </ng-template>\n </p-table>\n <p-overlayPanel [style]=\"overlayPanelStyle\" #overlayPanel>\n <ng-container #viewContainerRef></ng-container>\n </p-overlayPanel>\n <p-menu #moreMenu [popup]=\"true\" [model]=\"currentMoreMenu\" appendTo=\"body\" styleClass=\"grid-more-menu\"></p-menu>\n</div>\n", styles: [":host ::ng-deep .table-layout-auto table{table-layout:auto;width:max-content!important}:host ::ng-deep .prime-input{font-family:Roboto;font-size:12px;color:#484848;background:#fff;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none;border-radius:3px;border:none}:host ::ng-deep .prime-input:focus{outline:none;border-color:transparent;box-shadow:0 0 0 2px #0003}:host ::ng-deep .prime-textarea{font-family:Roboto;font-size:12px;color:#484848;background:#fff;border-radius:3px;border:1px solid #bdbdbd;width:100%;resize:both;min-height:40px;min-width:100px;transition:box-shadow .2s;box-sizing:border-box}:host ::ng-deep .prime-textarea:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 2px #1976d21a}:host ::ng-deep .td-wrapper{height:30px;display:flex;align-items:center;position:relative;z-index:99999}:host ::ng-deep html:not(:has(p-accordion)) .grid-container{padding:.5rem!important}:host ::ng-deep .grid-container{display:flex;flex-direction:column}:host ::ng-deep [data-title]{position:static}:host ::ng-deep [data-title]:not([input]):hover:before{position:absolute;content:attr(data-title);background-color:#fff;color:#000;border:.5px solid black;padding:.17em .5em;z-index:3;margin-top:18px;margin-left:18px}:host ::ng-deep .grid-component-main-table .p-datatable-resizable-table>.p-datatable-tbody>tr>td:has(span:hover){overflow:visible!important;position:relative;z-index:3}:host ::ng-deep .p-multiselect{max-width:100%}:host ::ng-deep .password{-webkit-text-security:disc}:host ::ng-deep .p-calendar .p-inputtext{width:100%}:host ::ng-deep .for-more-actions{width:48px;text-align:center;vertical-align:middle}:host ::ng-deep .for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.25rem}:host ::ng-deep .more-menu .more-menu-item{display:block;width:100%;text-align:left}:host ::ng-deep th.more-actions-th,:host ::ng-deep td.for-more-actions{position:-webkit-sticky;position:sticky;right:0;background:#fff;z-index:10}:host ::ng-deep .column-filter-clear-button{display:none}:host ::ng-deep .apply-filter-btn{float:unset!important}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .hide-table-filter .p-column-filter-menu-button,:host ::ng-deep .hide-table-filter .p-column-filter-clear-button{display:none!important}:host ::ng-deep .hide-filter-icon .column-filter-menu-button{display:none}.disabled-link,.disabled-link a,.disabled-link label,.disabled-link span,.disabled-link div,.disable-label-control,.disabled-link.custom-link,.disabled-link.custom-link a,.disabled-link.custom-link label,.disabled-link.custom-link span,.disabled-link.custom-link div,.disable-label-control.custom-link{pointer-events:none;color:#83baf8}.custom-link{color:#205dcf;font-size:12px}.custom-link:not(.disabled-link){cursor:pointer}.mr-2{margin-right:10px;display:block}.highlighted-row{background-color:#dee2e6!important}.hide-clear-filter-button{display:none!important}.grid-more-menu .p-menu-list{min-width:180px;max-width:260px;padding:.25rem 0}.grid-more-menu .p-menuitem-link{padding:.4rem .75rem;font-size:13px;color:#2d2d2d}.grid-more-menu .p-menuitem-link .p-menuitem-icon{margin-right:.6rem;font-size:14px;color:#5a5a5a}.grid-more-menu .p-menuitem-link:hover{background:#f5f7fa}.for-more-actions{width:48px;text-align:center;vertical-align:middle;padding:0}.for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.15rem;border-radius:4px}html:not(:has(p-accordion)) .grid-container.col-8 button{float:none!important}.grid-container{padding:.5rem!important}:host ::ng-deep .p-datatable-resizable-table>.p-datatable-thead>tr>th{overflow:visible!important}:host ::ng-deep .p-multiselect .p-multiselect-trigger{top:6px}:host ::ng-deep button.custom-icon-btn{background:transparent!important;border:0!important;outline:none!important;padding:0!important}:host ::ng-deep button.custom-icon-btn:focus{outline:none}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight,:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight .p-sortable-column-icon{color:#343434!important}:host ::ng-deep .center-content{display:flex;flex-direction:column}:host ::ng-deep .p-overlaypanel .p-overlaypanel-content{width:400px;height:300px;overflow-y:auto!important}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{z-index:11!important}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row{position:relative}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row:hover{z-index:10!important}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row .td-wrapper{height:0px;display:flex!important;align-items:center;position:relative;z-index:9}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover .td-wrapper{height:30px}:host ::ng-deep .p-overlaypanel{z-index:999999!important}:host ::ng-deep .more-column-cell{display:flex;align-items:center;justify-content:center}:host ::ng-deep .more-ellipsis-btn{background:transparent!important;border:0!important;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .more-option{display:flex;align-items:center;width:100%;text-align:left;padding:6px 8px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{position:relative;padding:1px 5px!important;pointer-events:all}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row td.td-overlay:before{content:\"\";display:block;position:absolute;z-index:999999;background:#0000;inset:0}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover td.td-overlay:before{display:none;animation:mouse-in 1s ease-in-out}@keyframes mouse-in{0%{display:block}25%{display:none}to{display:none}}.disabled-checkbox{pointer-events:none;opacity:.6;background-color:#f5f5f5;color:#999}.action-btn-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i13.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i13.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i13.CellEditor, selector: "p-cellEditor" }, { kind: "component", type: i13.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i13.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i13.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i13.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i13.ReorderableRowHandle, selector: "[pReorderableRowHandle]" }, { kind: "directive", type: i13.ReorderableRow, selector: "[pReorderableRow]", inputs: ["pReorderableRow", "pReorderableRowDisabled"] }, { kind: "directive", type: i13.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "component", type: i13.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i14$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i11.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i14.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: i15.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "directive", type: i4.Ripple, selector: "[pRipple]" }, { kind: "directive", type: i5$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i23$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i20.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i22.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "component", type: i23.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled", "fluid"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: i17$1.OverlayPanel, selector: "p-overlayPanel, p-overlaypanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: GridRowActionsComponent, selector: "se-grid-row-actions", inputs: ["editing", "editRowPermission", "deleteRowPermission", "hideDeleteBtn", "hideEditBtn", "editAllRows", "row"], outputs: ["onRowEditInitBtn", "deleteRecordBtn", "onRowEditSaveBtn", "onRowEditCancelBtn"] }, { kind: "directive", type: AddRowDirective, selector: "[pAddRow]", inputs: ["table", "newRow", "id", "preventNewRow"] }, { kind: "component", type: GenerateReportBtnComponent, selector: "se-generate-report-btn", inputs: ["repInfo", "mappedFields", "label", "icon", "params", "class", "reportHeader", "reportFooter", "reportType", "showDialog", "form"] }, { kind: "component", type: GenerateFileComponent, selector: "se-generate-import-file", inputs: ["label", "icon", "showDialog", "dialogData", "selectedRow"] }, { kind: "component", type: EmailGenerateBtnComponent, selector: "se-email-generate-btn", inputs: ["label", "icon", "showDialog", "column", "selectedRow"] }] }); }
|
|
14598
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: GridComponent, selector: "se-grid", inputs: { activeTestMode: "activeTestMode", selectedRows: "selectedRows", setGridRefreshTime: "setGridRefreshTime", addDataKeyValue: "addDataKeyValue", stopDialogClose: "stopDialogClose", autoCheckNewRow: "autoCheckNewRow", showRefreshBtn: "showRefreshBtn", hideRefreshBtn: "hideRefreshBtn", horizontalScroll: "horizontalScroll", hideDeleteBtn: "hideDeleteBtn", hideEditBtn: "hideEditBtn", hideAddBtn: "hideAddBtn", loading: "loading", autoLoadData: "autoLoadData", rowStyle: "rowStyle", allowSelection: "allowSelection", selectionColumnWidth: "selectionColumnWidth", allowSelectionHeader: "allowSelectionHeader", hideGridSaveButton: "hideGridSaveButton", hideGridCancelButton: "hideGridCancelButton", allowExportToPdf: "allowExportToPdf", allowExportToExcel: "allowExportToExcel", setActionColumnAsFirst: "setActionColumnAsFirst", useInlineCRUD: "useInlineCRUD", preventNewRow: "preventNewRow", rowActions: "rowActions", selectionType: "selectionType", dataKey: "dataKey", clearGridFilter: "clearGridFilter", searchGridFilter: "searchGridFilter", scrollable: "scrollable", scrollHeight: "scrollHeight", tableStyle: "tableStyle", wordWrap: "wordWrap", ellipsis: "ellipsis", newGridRow: "newGridRow", filtering: "filtering", reportButtons: "reportButtons", rowHover: "rowHover", hideFilterOptions: "hideFilterOptions", autoComplete: "autoComplete", setPaginationLength: "setPaginationLength", rows: "rows", globalFilterData: "globalFilterData", columns: "columns", permissions: "permissions", allowColumnToggle: "allowColumnToggle", hideFilter: "hideFilter", lookupFilters: "lookupFilters", pagination: "pagination", showCurrentPageReport: "showCurrentPageReport", totalRecords: "totalRecords", aggregatedResult: "aggregatedResult", showconfirmDialog: "showconfirmDialog", saveAllData: "saveAllData", defaultRows: "defaultRows", columnActions: "columnActions", useServerSideEvents: "useServerSideEvents", enableClientSideFiltering: "enableClientSideFiltering", globalFilterFields: "globalFilterFields", allowCaching: "allowCaching", allowPersistence: "allowPersistence", softCaching: "softCaching", editAllRows: "editAllRows", gridName: "gridName", autoResize: "autoResize", allowTextCopy: "allowTextCopy" }, outputs: { inlineRowCancel: "inlineRowCancel", rowsChange: "rowsChange", onRowClick: "onRowClick", onCheckBoxFilterClick: "onCheckBoxFilterClick", onRowCheckBox: "onRowCheckBox", onSortChange: "onSortChange", onFilterChange: "onFilterChange", onMultiSelectionChange: "onMultiSelectionChange", onApplyFilter: "onApplyFilter", isIncludedAllColumns: "isIncludedAllColumns", onServerSideEventChange: "onServerSideEventChange", onPageChange: "onPageChange", onRowUpdate: "onRowUpdate", onRowOrderChanged: "onRowOrderChanged", onCancelAllRows: "onCancelAllRows", onRowDelete: "onRowDelete", onRowAdd: "onRowAdd", onGridRowActions: "onGridRowActions", onGridRowEdit: "onGridRowEdit", onGridRowAdd: "onGridRowAdd" }, host: { listeners: { "copy": "handleCopyOrCut($event)", "cut": "handleCopyOrCut($event)", "click": "onClick($event.target)", "window:beforeunload": "beforeunloadHandler($event)" } }, viewQueries: [{ propertyName: "panelOverlayViewContainer", first: true, predicate: ["viewContainerRef"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "table", first: true, predicate: ["dt"], descendants: true }, { propertyName: "moreMenu", first: true, predicate: ["moreMenu"], descendants: true }, { propertyName: "gridRow", predicate: ["gridRow"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"grid-component-wrapper\">\n <p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n <p-confirmDialog class=\"grid-component-confirm-dialog\" *ngIf=\"columnActions.length > 0\"\n key=\"handlecolumnActions\"></p-confirmDialog>\n <div class=\"global-filter-buttons-wrapper flex align-items-center\">\n\n <!-- button for apply value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter ) || showFilterbtn)\" pButton type=\"button\" icon=\"pi pi-search\"\n (click)=\"applyGridFilterBtn()\" [class]=\"\n searchGridFilter ? 'p-button-success apply-filter-btn filter-btn' : 'hide-clear-filter-button apply-filter-btn filter-btn'\n \"></button>\n\n <!-- button for clear value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter )|| showFilterbtn)\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n clearGridFilter ? 'filter-btn' : 'hide-clear-filter-button filter-btn'\n \" class='global-refresh global-btn'></button>\n\n <!-- button for save all grid at once -->\n <button pButton *ngIf=\"editAllRows && editRowPermission\" id=\"saveAllGridValues\" icon=\"pi pi-check\" [label]=\"'Save'\"\n [class]=\"hideGridSaveButton ? 'hide-clear-filter-button save-all-grid' : 'ui-button-info save-all-grid'\"\n type=\"button\" (click)=\"saveAllRowsAtOnce()\"></button>\n\n <!-- button for cancel all grid at once -->\n <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\"\n [label]=\"'Cancel'\" icon=\"pi pi-times\" class=\"ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n <!-- header Button for multiSelect on Grid -->\n <span *ngIf=\"allowColumnToggle\">\n <p-multiSelect [showToggleAll]=\"false\" optionDisabled=\"false\" [options]=\"selectedToggleColumns\"\n [(ngModel)]=\"selectedColumns\" optionLabel=\"header\" selectedItemsLabel=\"{0} columns selected\"\n class=\"grid-component-multiselect-header-button\" placeholder=\"Choose Columns\">\n </p-multiSelect>\n </span>\n\n <!-- header Button for Adding new Row on Grid -->\n <button pButton *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\" type=\"button\" [label]=\"'Add'\" pAddRow\n [table]=\"componentTableRef\" [preventNewRow]=\"preventNewRow\" [newRow]=\"newGridRow\" [id]=\"dataKey\"\n pTooltip=\"Add New Row\" tooltipPosition=\"bottom\" icon=\"pi pi-plus\"\n [class]=\"'ui-button-info global-add-btn'+gridName\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n\n <!-- header Button for Excel File on Grid -->\n <button *ngIf=\"allowExportToExcel\" type=\"button\" pButton icon=\"pi pi-file-excel\" (click)=\"exportExcel()\"\n class=\"p-button-success\" pTooltip=\"Export to Excel\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- header Button for PDF File on Grid -->\n <button *ngIf=\"allowExportToPdf\" type=\"button\" pButton icon=\"pi pi-file-pdf\" (click)=\"exportPdf()\"\n class=\"p-button-warning mr-2 ml-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info mr-2 ml-2\">\n <se-generate-report-btn *ngIf =\"!reportButton.hidden\"[repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n </div> -->\n\n <ng-content></ng-content>\n\n <ng-container *ngFor=\"let reportButton of reportButtons\">\n <se-generate-report-btn *ngIf=\"!reportButton.hidden\" [repInfo]=\"reportButton\" [label]=\"reportButton.label\"\n [params]=\"reportButton.params\" [icon]=\"reportButton.icon\" [class]=\"reportButton.class\"\n [showDialog]=\"reportButton.showDialog\" [reportType]=\" reportButton.reportType\"\n [reportHeader]=\"reportButton.reportHeader\" [reportFooter]=\"reportButton.reportFooter\"></se-generate-report-btn>\n </ng-container>\n\n </div>\n\n <p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n [lazy]=\"useServerSideEvents || pagination\" [paginator]=\"pagination\"\n [alwaysShowPaginator]=\"pagination && totalRecords > 0\" [globalFilterFields]=\"globalFilterFields\"\n [class]=\"' grid-component-main-table ' + (pagination || !rowsData.length ? ' pagination ' : '') + (tableStyle.includes('width') ? ' hasTableWidthStyle ' : '') + (autoResize ? '' : 'table-layout-auto') \"\n (onColResize)=\"onColumnResize($event,dt)\" [resizableColumns]=\"true\" responsiveLayout=\"scroll\"\n columnResizeMode=\"expand\" [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\"\n [rowsPerPageOptions]=\"setPaginationLength\" [showCurrentPageReport]=\"showCurrentPageReport\"\n currentPageReportTemplate=\"Showing {first} to {last} of {{\n totalRecords\n }} entries\" [loading]=\"!setGridRefreshTime ? loading : false\"\n (onSort)=\"sortDisabled ? '' : handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n (onLazyLoad)=\"shouldRunServerSide($event) ? handleServerSideEvents($event, dt) : null\"\n (onPage)=\"gridService.columnFocusedOut ? showConfirmation($event) : handleServerSidePagination($event)\" #dt\n [dataKey]=\"dataKey\" [selection]=\"selectedRows\" (selectionChange)=\"onTableSelectionChange($event)\" selectionMode=\"multiple\" [scrollable]=\"scrollable\"\n [tableStyle]=\"tableStyle\" [scrollHeight]=\"scrollHeight\" editMode=\"row\" [editingRowKeys]=\"editingRowKeys\"\n [rowHover]=\"rowHover\" [ngClass]=\"setClassaAndId(dt)\" (onRowReorder)=\"onRowReorder($event)\">\n\n <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"flex justify-content-end\">\n <span *ngFor=\"let rowAction of rowActions\">\n <button pButton type=\"button\" [label]=\"rowAction.title\" [class]=\"rowAction.class\"\n (click)=\"rowAction.onClick(selectedRows)\"></button>\n </span>\n </div>\n\n <!-- header columns on Grid -->\n <ng-template pTemplate=\"header\" let-cols>\n <tr>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'multiple'\" class=\"grid-component-selection\"\n id=\"{{allowSelectionHeader}}\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-2\n table-header-inner-div div-last-inner-html-is-icon\">\n <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n (onChange)=\"handleHeaderCheckboxChange($event)\"></p-tableHeaderCheckbox>\n </div>\n </span>\n </th>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'single'\" id=\"Select\" data-title-element=\"self\"\n class=\"grid-component-selection\">\n Select\n </th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn' \" data-title-element=\"self\">\n Actions\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [attr.data-column-header]=\"column?.header\" [pSortableColumn]=\"column.field\"\n [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n class=\"column?.type === 'multiple' ? 'grid-component-select-th-column-type-multiple' : ''\"\n (dblclick)=\"onColumnHeaderDblClick($event, column.header, dt)\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-1 table-header-inner-div div-last-inner-html-is-icon\">\n <span [attr.data-title-element]=\"'self'\" [class]=\"'flex-grow-1'\">{{ column.header }}\n <span *ngIf=\"column.isRequired\" class=\"grid-component required-star\">*</span>\n </span>\n <p-sortIcon\n *ngIf=\"column.sorting !== false && column?.type !== 'multiple' && (!(editAllRows && pagination) || sortIconHidden)\"\n [field]=\"column.field\" (click)=\"handleCustomSorting()\"></p-sortIcon>\n </div>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn id=\"MoreActions\" class=\"more-actions-th\">More</th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" data-title-element=\"self\">Actions</th>\n </tr>\n <tr *ngIf=\"filtering && !hideFilter\">\n <th pResizableColumn *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n <th pResizableColumn *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && useInlineCRUD\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [ngSwitch]=\"column?.filter?.type\"\n [class]=\"hideFilterOptions ? 'hide-table-filter temp' : 'temp'\">\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n <!-- Text input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <input type=\"text\" [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </ng-template>\n </p-columnFilter>\n\n <!-- Numeric input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'numeric'\" [field]=\"column.field\"\n *ngSwitchCase=\"'numeric_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-inputNumber [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\"\n [attr.autocomplete]=\"column.filterAutoComplete === true ? 'on' : 'off'\"></p-inputNumber>\n </ng-template>\n </p-columnFilter>\n\n <!-- lookup input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" matchMode=\"equals\"\n *ngSwitchCase=\"'lookup_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <div class=\"close-icon-wrapper grid-component lookup-filter-wrapper\">\n <div class=\"lookup-filter-input-wrapper\">\n <input [id]=\"column.field?.toLowerCase() + '_filter'\" class=\"grid-component lookup-filter\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n type=\"text\" [ngModel]=\"lookupFilterInputNgModel(column)\"\n (ngModelChange)=\"changeLookupInputNgModel('lookupFilter', column, $event)\"\n (click)=\"setFilterLookup(column)\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </div>\n <div class=\"direct-wrapper-close-icon-lookup\">\n <button *ngIf=\"column.filterValue\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column)\">\n </button>\n </div>\n </div>\n </ng-template>\n </p-columnFilter>\n\n <!-- checkbox on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" type=\"boolean\" [field]=\"column.field\" *ngSwitchCase=\"'checkbox'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-checkbox [binary]=\"true\" [disabled]=\"column.disabled\" [ngModel]=\"column.filterValue\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\n (ngModelChange)=\"clickCheckBoxFilter(column, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n </p-checkbox>\n </ng-template>\n </p-columnFilter>\n\n <!-- multiSelect on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'multi-select'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-multiSelect [(ngModel)]=\"column.filterValue\" [options]=\"column.filter.data || []\" [appendTo]=\"'body'\"\n [name]=\"column.field\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n [optionValue]=\"column.optionValue\" [optionLabel]=\"column.optionLabel\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n\n </p-multiSelect>\n </ng-template>\n </p-columnFilter>\n\n <!-- dropdown on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'dropdown'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-dropdown [showClear]=\"true\" [placeholder]=\"'Select'\" [filter]=\"column.allowSearch\"\n [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n [options]=\"column.filter.data || []\" (onChange)=\"searchDropdownFilter(filter, $event, column)\"\n [appendTo]=\"'body'\" filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n </p-columnFilter>\n\n <!-- calendar on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'calendar'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-datepicker [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.filterValue\"\n [class]=\"column.field + '-filter-input'\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n appendTo=\"body\" (onSelect)=\"selectDate(column)\" [inputId]=\"column.field\" hourFormat=\"12\"\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\" [showButtonBar]=\"true\"\n (onClose)=\"setFilterFocusOut(column, filter, $event)\" [dateFormat]=\"calendarFormat\"\n (ngModelChange)=\"calendarInputValue(column, {}, true)\" (onClearClick)=\"backspaceEvent($event, column)\"\n (keydown)=\"setFilterFocusOut(column, filter, $event)\">\n </p-datepicker>\n </ng-template>\n </p-columnFilter>\n\n <!-- Default Filter For Header -->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"\n column.type && column.type !== 'link' ? column.type : 'text'\n \" [field]=\"column.field\" display=\"menu\" *ngSwitchDefault>\n </p-columnFilter>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn class=\"more-actions-th\"></th>\n <th pResizableColumn\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n </tr>\n </ng-template>\n\n <!-- Body columns on Grid -->\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n <tr [style]=\"rowStyle\" [ngClass]=\"{\n 'highlighted-row': row?.highlightrow,\n 'ellipsis-true': ellipsis,\n 'p-selectable-row wordWrapTrue': wordWrap,\n 'wordWrapFalse p-selectable-row': !wordWrap\n }\" (click)=\"selectedRowRecord = row\" [pEditableRow]=\"row\" [pReorderableRow]=\"ri\" #gridRow [id]=\"row[dataKey]\">\n <td *ngIf=\"allowSelection\" class=\"grid-component-selection\" pReorderableRowHandle>\n <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"></p-tableRadioButton>\n <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"></p-tableCheckbox>\n </td>\n\n <!-- first actions column -->\n <!-- <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class=\"setActionColumnWidth\">\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n\n <!-- Grid Rows Data Bindings Start -->\n <td *ngFor=\"let column of selectedColumns\" [ngSwitch]=\"column.type\" [style]=\"column.style\"\n [class]=\"column.style ? '' : 'w-static-col'\" [attr.data-column-field]=\"column?.field\"\n [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-overlay' : ''\" pReorderableRowHandle>\n <span [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-wrapper' : ''\"\n (mouseenter)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? addDynamicPanelOverlayComponent(column.hoverData, overlayPanel, $event, row) : ''\"\n (mouseleave)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? mouseLeaveEvent(overlayPanel) : ''\">\n <span class=\"td-content-wrapper\" [style]=\"column.style\">\n\n <!-- Boolean column on Grid -->\n <span *ngSwitchCase=\"'boolean'\">\n <td *ngIf=\"!editing && row[column.field + '_obj']?.show != false\">\n <p-checkbox [ngClass]=\"{'disabled-checkbox': column.disabled}\" [binary]=\"true\"\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (change)=\"onFocusOutEvent(column, row)\"\n [ngModel]=\"getCheckboxValue(row, column)\">\n </p-checkbox>\n </td>\n <td *ngIf=\"editing\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for edit checkBox -->\n <p-checkbox (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [ngModel]=\"getCheckboxValue(row, column)\"\n (change)=\"onFocusOutEvent(column, row)\"></p-checkbox>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ row[column.field] }}\n </ng-template>\n </p-cellEditor>\n </td>\n </span>\n\n <!-- link column on Grid -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'a,input'\" *ngSwitchCase=\"'link'\">\n <!-- link column for HyperLink Case -->\n <span *ngIf=\"column.allowSave === false\">\n <span *ngIf=\"column.target !== '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n <span *ngIf=\"column.target === '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\" allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]='column.target' pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </span>\n <!-- link column for Edit Case -->\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <span *ngIf=\"(column.editable === true ) && (column.editLink === true )\">\n <input *ngIf=\"!row.isNew\" pInputText\n [ngModel]=\"row[column.field + '_obj']?.displayField || row[column.field] || ''\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj'].displayField = $event : row[column.field] = $event\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\" type=\"text\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n <input pInputText *ngIf=\"row.isNew\" type=\"text\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj']?.displayField : row[column.field] = $event\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n </span>\n <!-- <span *ngIf=\"column.editable === false|| column.editable === undefined\" >\n <a class=\"custom-link\" (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" [target]='column.target'\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\" [title]=\"column.header\"></i>\n <ng-template #noIcon>\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </ng-template>\n \n </a>\n </span> -->\n <span\n *ngIf=\"(column.editLink === false|| column.editLink === undefined)&&(column.editable === false|| column.editable === undefined)\">\n <a class=\"d-inline\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [class]=\"column.icon\" [title]=\"column.header\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n\n </a>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [style]=\"column.style\" class=\"custom-link\"\n [class]=\"column.editable === false || allowDisabled(column,row) ? 'disabled-link' : ''\">\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\" pReorderableRowHandle>\n <i *ngIf=\"column.icon&& !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [title]=\"column.header\" [class]=\"column.icon\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n\n <!-- Iframe column on Grid -->\n <span *ngSwitchCase=\"'iframe'\">\n <span class=\"custom-link\" (click)=\"gridIFrame(column, row[column.field + '_obj']?.hyperlink, row)\" [title]=\"\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText\n ? column.displayText\n : row[column.field]\n\n \">\n <button class=\"custom-icon-btn\" *ngIf=\"column.icon; else noIcon\" [disabled]=\"column.disabled\">\n <i [class]=\"column.icon\" [title]=\"column.header\"></i>\n </button>\n <ng-template #noIcon>\n {{\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText ? column.displayText : row[column.field]\n }}\n </ng-template>\n </span>\n </span>\n\n <!-- dialog column on Grid -->\n <span *ngSwitchCase=\"'dialog'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span *ngIf=\"column?.filter?.type !== 'calendar' && !row?.hidegridbtn\">\n <span *ngIf=\"column.editable === true && !row[column.field+'_obj']?.hideFieldValue\"\n pReorderableRowHandle>\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\" readonly\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" pInputText\n (click)=\"selectLookupField(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" />\n\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"column.editable === false || column.editable === undefined\n \" class=\"custom-link\" [style]=\"column.style\" [class]=\"\n allowDisabled(column,row) ? 'disabled-link' : ''\n \" (click)=\"openGridDialog(column, row, $event)\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>{{ (!column.displayText && row.isNew ) ||\n row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row, column)\n }}</ng-template>\n </span>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && column.editable === true\"\n [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <p-datepicker\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\" [appendTo]=\"'body'\" hourFormat=\"12\"\n [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\" [timeOnly]=\"column.timeOnly\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ?\n row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\"></p-datepicker>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && !column.editable\" class=\"custom-link\"\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\">{{ row[column.field+'_obj']?.hideFieldValue ? '' :\n setConditionBaseValue(row, column) }}\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"custom-link\" [style]=\"column.style\" pReorderableRowHandle\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [title]=\"column.hoverData ? '' : column.header\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"></i>\n <ng-template #noIcon>{{ row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row,\n column) }}</ng-template>\n <!-- {{ setConditionBaseValue(row, column) }}\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\" -->\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- test -->\n <!-- lookup Input column on Grid -->\n <span *ngSwitchCase=\"'lookup_input'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <div class=\"close-icon-wrapper\">\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\"\n [readonly]=\"!isLookupInputEditable(column, row)\" type=\"text\" [ngModel]=\"lookupInputNgModel(row, column)\"\n (ngModelChange)=\"changeLookupInputNgModel(row, column, $event)\" [disabled]=\"allowDisabled(column,row)\"\n (click)=\"isLookupInputEditable(column, row) ? onClickEvent(column, row) : selectLookupField(column, row)\"\n (change)=\"onChangeEvent(column, row)\" (keydown.enter)=\"onLookupInputEnter($event, column, row)\"\n (paste)=\"onLookupInputPaste($event, column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" />\n <div *ngIf=\"!allowDisabled(column,row)\">\n <button\n *ngIf=\"isLookupInputEditable(column, row) && (row[column.field + '_obj']?.lookupControl?.component || column.lookupControl?.component)\"\n icon=\"pi pi-search\" pButton type=\"button\" (click)=\"selectLookupField(column, row)\"></button>\n <button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n ? row[column.field].text\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column,row)\"></button>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"column.linkId\">\n <a [attr.data-title-element]=\"column.hoverData ? null : 'self'\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target === '_self' ? '' : '_blank'\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </a>\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"!column.linkId\" [style]=\"column.style\"\n [class]=\"column.lookupControl?.component && column.editLink === true ? 'custom-link' : ''\"\n (click)=\"openLookupHyperlink(column, row)\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Numeric Input column on Grid -->\n <span *ngSwitchCase=\"'numeric'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for Currency && Decimal && Percent -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'input'\" class=\"input-number\"\n pReorderableRowHandle>\n <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n row[column.field.toLowerCase()+'_obj']?.errorMessage\n ? 'ng-invalid ng-dirty'\n : 'form-control'\n \" [showButtons]=\"false\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"column.field\" [disabled]=\"allowDisabled(column,row)\" (onFocus)=\"onFocusEvent(column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\" autocomplete=\"off\" (keydown)=\"allowLeadingDot($event)\" [mode]=\"\n column.format &&\n column.format.type === 'currency'\n ? 'currency'\n : 'decimal'\n \" [currency]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.currency\n ? column.format.formatParams.currency\n : 'USD'\n \" [locale]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.locale\n ? column.format.formatParams.locale\n : 'en-US'\n \" [minFractionDigits]=\"column.format ? setNumericMinFraction(column) : '0'\"\n [maxFractionDigits]=\"column.format ? setNumericMaxFraction(column) : '0'\" [suffix]=\"\n column.format &&\n column.format.type === 'percent' && \n '%'\n \n \">\n </p-inputNumber>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\" pReorderableRowHandle>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n setNumericFormat(column, row)\n }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Button column on Grid -->\n <span *ngSwitchCase=\"'add_button'\">\n <div>\n <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n class=\"grid-component-grid-add-btn\" (click)=\"onClickButton(column, row)\"></button>\n </div>\n </span>\n\n <!-- Generate File Button column on Grid -->\n <span *ngSwitchCase=\"'generate_file_button'\">\n <se-generate-import-file\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [dialogData]=\"column.data\" [selectedRow]=\"row\"></se-generate-import-file>\n </span>\n\n <!-- Send email Button column on Grid -->\n <span *ngSwitchCase=\"'send_email_button'\">\n <se-email-generate-btn\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\" [column]=\"column\"\n [selectedRow]=\"row\"></se-email-generate-btn>\n </span>\n\n <!-- Date column on Grid -->\n <!-- calendar selector -->\n <span *ngSwitchCase=\"'date'\"\n [attr.data-title-element]=\"column.hoverData? null: editAllRows ? 'input' : 'self' \">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <p-datepicker [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\" hourFormat=\"12\" [defaultDate]=\"defaultDate\"\n [stepMinute]=\"column.minutesInterval ? column.minutesInterval : 1\" [showTime]=\"column.showTime\"\n [timeOnly]=\"column.timeOnly\" [dateFormat]=\"column.format ? column.format.type : calendarFormat\"\n (keyup)=\"calendarInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"onCalendarModelChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n [showButtonBar]=\"!column.timeOnly\"></p-datepicker>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed white-space-nowrap text-center border-readonly\">\n {{ setConditionBaseValue(row,column) }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n\n <span *ngSwitchDefault>\n <span [ngSwitch]=\"column.type\">\n <!-- Dropdown column on Grid -->\n <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\"\n [attr.data-title-element]=\" column.hoverData? null: editAllRows ? '.p-dropdown-label' : 'self'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-dropdown *ngIf=\"!row[column.field+'_obj']?.hidden\" [options]=\"\n row[column.field?.toLowerCase()+'_data']\n ? row[column.field?.toLowerCase()+'_data']\n : column.data\n \"\n [ngModel]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField?.toLowerCase() ? row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n ? row[column.displayField]\n : row[column.field] ? row[column.field] : 'Select'\"\n [showClear]=\"row[column.field] ? true : false\" [optionLabel]=\"column.optionLabel\"\n (click)=\"onClickEvent(column, row)\" [optionValue]=\"column.optionValue\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n (onChange)=\"onChangeEvent(column, row)\" [appendTo]=\"'body'\" [filter]=\"column.allowSearch\"\n filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed border-readonly\">\n <ng-container *ngIf=\"!row[column.field+'_obj']?.hidden\">\n <a *ngIf=\"column.displayAsLink\" class=\"custom-link\"\n [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]='column.target'>\n {{ setDropdwonReadOnlyValue(row, column) }}\n </a>\n <span *ngIf=\"!column.displayAsLink\">\n {{ setDropdwonReadOnlyValue(row, column) }}\n </span>\n </ng-container>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- MultiSelect column on Grid -->\n <!-- [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n row[column.field]\" -->\n <span *ngSwitchCase=\"'multi-select'\"\n [attr.data-title-element]=\"column.hoverData ? null : '.p-multiselect-label'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-multiSelect\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" [(ngModel)]=\"row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [options]=\"row[column.field.toLowerCase() + '_data'] ? row[column.field.toLowerCase() + '_data'] : column.data\"\n [optionLabel]=\"column.optionLabel\" [optionValue]=\"column.optionValue\"\n (onChange)=\"onChangeEvent(column, row)\" (onPanelShow)=\"showOption(column, row)\"\n (click)=\"onClickEvent(column, row)\" [appendTo]=\"'body'\" (blur)=\"onFocusOutEvent(column, row)\">\n </p-multiSelect>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n row[column.displayField]\n ? row[column.displayField] :\n setMultiSelectData(column, row[column.field])\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- AutoComplete Search -->\n <span *ngSwitchCase=\"'AutoComplete'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-autoComplete\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [name]=\"column.header\"\n [suggestions]=\"column.data\" (onSelect)=\"autoCompleteSelectedValue(row, column, $event)\"\n [field]=\"column.optionLabel ? column.optionLabel?.toLowerCase() : column.displayField ? column.displayField?.toLowerCase() : column.field?.toLowerCase()\"\n [ngModel]=\"getAutoCompleteNgModel(row, column)\"\n (ngModelChange)=\"changeAutoCompleteNgModel(row, column, $event)\" [dropdown]=\"column.showOption\"\n (ngModelChange)=\"onChangeEvent(column, row)\" (click)=\"onClickEvent(column, row)\"\n (completeMethod)=\"autoSearch($event, column, row)\" (onBlur)=\"onFocusOutEvent(column, row, $event)\"\n [disabled]=\"allowDisabled(column,row)\" [appendTo]=\"'body'\" [multiple]=\"true\"\n (keydown.enter)=\"onAutoCompleteKeyEnterEvent($event, column, row)\">\n </p-autoComplete>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n </span>\n </span>\n <span\n *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.field] && !column.displayField\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.field] : value[column.field] + ';' : value[column.field] }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n <!-- Add Generate Report Button -->\n <span *ngSwitchCase=\"'report'\">\n <p-cellEditor>\n <ng-template pTemplate=\"output\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [class]=\"column.class\" [showDialog]=\"column.showDialog\"\n [icon]=\"column.icon\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n <ng-template pTemplate=\"input\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [icon]=\"column.icon\" [class]=\"column.class\"\n [showDialog]=\"column.showDialog\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <span *ngSwitchDefault [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <!-- Input column on Grid -->\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n\n <textarea *ngIf=\"column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]])\"\n [(ngModel)]=\"row[column.field]\" [attr.data-cell]=\"column.field + '-' + row[dataKey]\"\n class=\"prime-textarea\"\n style=\"resize: none; min-width: 200px; min-height: 40px; word-break: break-word; text-align: justify; overflow: hidden;\"\n [disabled]=\"allowDisabled(column,row)\" (blur)=\"onTextareaBlur(column, row)\"\n (keydown.enter)=\"onTextareaEnter($event, column, row)\" autofocus></textarea>\n\n <input\n *ngIf=\"!column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]]) && column.field !== dataKey\"\n [type]=\"row[column.field+'_obj']?.textType?row[column.field+'_obj']?.textType:column.textType?column.textType:'text'\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [ngModel]=\"setInputNgModel(row, column)\"\n (ngModelChange)=\"onInputChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n (click)=\"onClickButton(column, row)\" />\n <span *ngIf=\"!(editAllRows || editingRowKeys[row[dataKey]])\">\n {{ row[column.field] }}\n </span>\n\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n (click)=\"changePasswordType(column, row)\" [title]=\"column.header\"></i>\n </span>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n <span (click)=\"onClickEvent(column, row)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self' \"\n [class]=\"row[column.field+'_obj']?.textType ?(row[column.field+'_obj']?.textType=='password' ?'password':'') :column.textType=='password'?'password':''\">\n {{ setTextBoxReadOnlyValue(row, column) }}\n </span>\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n [title]=\"column.header\" (click)=\"changePasswordType(column, row)\"></i>\n </span>\n </span>\n </span>\n </ng-template>\n\n </p-cellEditor>\n </span>\n </span>\n </span>\n\n </span>\n </span>\n </td>\n <!-- Grid Rows Data Bindings End -->\n\n <!-- More actions column (ellipsis) -->\n <td *ngIf=\"hasMoreItems(row)\" class=\"for-more-actions\">\n <button pButton type=\"button\" icon=\"pi pi-ellipsis-v\" class=\"p-button-text\" (click)=\"showMore($event, row)\"\n aria-label=\"More actions\"></button>\n </td>\n\n <!-- Action column on Grid -->\n <!-- <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\n class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" class=\"for-buttons\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class='setActionColumnWidth'>\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n </tr>\n </ng-template>\n\n <!-- Footer columns on Grid -->\n <ng-template pTemplate=\"footer\">\n <tr *ngIf=\"aggregateFooter\">\n <td\n *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngFor=\"let outerColumn of selectedColumns\" class=\"grid-component-outer-column\" [style]=\"outerColumn.style\">\n <div *ngFor=\"let innerColumn of selectedColumns\">\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) ||\n aggr.displayField && aggr.displayField?.toLowerCase() === outerColumn.field?.toLowerCase())\">\n <div [innerHTML]=\"aggr.aggrValue\">\n </div>\n </div>\n </div>\n </div>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\"></td>\n </tr>\n </ng-template>\n\n <!-- Footer for Empty Message columns on Grid -->\n <ng-template pTemplate=\"emptymessage\">\n <tr class=\"grid-component no-records-found\">\n <td [attr.colspan]=\"selectedColumns?.length + 1\">{{totalRecords==0? 'No records found':''}}</td>\n </tr>\n </ng-template>\n </p-table>\n <p-overlayPanel [style]=\"overlayPanelStyle\" #overlayPanel>\n <ng-container #viewContainerRef></ng-container>\n </p-overlayPanel>\n <p-menu #moreMenu [popup]=\"true\" [model]=\"currentMoreMenu\" appendTo=\"body\" styleClass=\"grid-more-menu\"></p-menu>\n</div>\n", styles: [":host ::ng-deep .table-layout-auto table{table-layout:auto;width:max-content!important}:host ::ng-deep .prime-input{font-family:Roboto;font-size:12px;color:#484848;background:#fff;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none;border-radius:3px;border:none}:host ::ng-deep .prime-input:focus{outline:none;border-color:transparent;box-shadow:0 0 0 2px #0003}:host ::ng-deep .prime-textarea{font-family:Roboto;font-size:12px;color:#484848;background:#fff;border-radius:3px;border:1px solid #bdbdbd;width:100%;resize:both;min-height:40px;min-width:100px;transition:box-shadow .2s;box-sizing:border-box}:host ::ng-deep .prime-textarea:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 2px #1976d21a}:host ::ng-deep .td-wrapper{height:30px;display:flex;align-items:center;position:relative;z-index:99999}:host ::ng-deep html:not(:has(p-accordion)) .grid-container{padding:.5rem!important}:host ::ng-deep .grid-container{display:flex;flex-direction:column}:host ::ng-deep [data-title]{position:static}:host ::ng-deep [data-title]:not([input]):hover:before{position:absolute;content:attr(data-title);background-color:#fff;color:#000;border:.5px solid black;padding:.17em .5em;z-index:3;margin-top:18px;margin-left:18px}:host ::ng-deep .grid-component-main-table .p-datatable-resizable-table>.p-datatable-tbody>tr>td:has(span:hover){overflow:visible!important;position:relative;z-index:3}:host ::ng-deep .p-multiselect{max-width:100%}:host ::ng-deep .password{-webkit-text-security:disc}:host ::ng-deep .p-calendar .p-inputtext{width:100%}:host ::ng-deep .for-more-actions{width:48px;text-align:center;vertical-align:middle}:host ::ng-deep .for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.25rem}:host ::ng-deep .more-menu .more-menu-item{display:block;width:100%;text-align:left}:host ::ng-deep th.more-actions-th,:host ::ng-deep td.for-more-actions{position:-webkit-sticky;position:sticky;right:0;background:#fff;z-index:10}:host ::ng-deep .column-filter-clear-button{display:none}:host ::ng-deep .apply-filter-btn{float:unset!important}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .hide-table-filter .p-column-filter-menu-button,:host ::ng-deep .hide-table-filter .p-column-filter-clear-button{display:none!important}:host ::ng-deep .hide-filter-icon .column-filter-menu-button{display:none}.disabled-link,.disabled-link a,.disabled-link label,.disabled-link span,.disabled-link div,.disable-label-control,.disabled-link.custom-link,.disabled-link.custom-link a,.disabled-link.custom-link label,.disabled-link.custom-link span,.disabled-link.custom-link div,.disable-label-control.custom-link{pointer-events:none;color:#83baf8}.custom-link{color:#205dcf;font-size:12px}.custom-link:not(.disabled-link){cursor:pointer}.mr-2{margin-right:10px;display:block}.highlighted-row{background-color:#dee2e6!important}.hide-clear-filter-button{display:none!important}.grid-more-menu .p-menu-list{min-width:180px;max-width:260px;padding:.25rem 0}.grid-more-menu .p-menuitem-link{padding:.4rem .75rem;font-size:13px;color:#2d2d2d}.grid-more-menu .p-menuitem-link .p-menuitem-icon{margin-right:.6rem;font-size:14px;color:#5a5a5a}.grid-more-menu .p-menuitem-link:hover{background:#f5f7fa}.for-more-actions{width:48px;text-align:center;vertical-align:middle;padding:0}.for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.15rem;border-radius:4px}html:not(:has(p-accordion)) .grid-container.col-8 button{float:none!important}.grid-container{padding:.5rem!important}:host ::ng-deep .p-datatable-resizable-table>.p-datatable-thead>tr>th{overflow:visible!important}:host ::ng-deep .p-multiselect .p-multiselect-trigger{top:6px}:host ::ng-deep button.custom-icon-btn{background:transparent!important;border:0!important;outline:none!important;padding:0!important}:host ::ng-deep button.custom-icon-btn:focus{outline:none}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight,:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight .p-sortable-column-icon{color:#343434!important}:host ::ng-deep .center-content{display:flex;flex-direction:column}:host ::ng-deep .p-overlaypanel .p-overlaypanel-content{width:400px;height:300px;overflow-y:auto!important}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{z-index:11!important}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row{position:relative}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row:hover{z-index:10!important}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row .td-wrapper{height:0px;display:flex!important;align-items:center;position:relative;z-index:9}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover .td-wrapper{height:30px}:host ::ng-deep .p-overlaypanel{z-index:999999!important}:host ::ng-deep .more-column-cell{display:flex;align-items:center;justify-content:center}:host ::ng-deep .more-ellipsis-btn{background:transparent!important;border:0!important;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .more-option{display:flex;align-items:center;width:100%;text-align:left;padding:6px 8px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{position:relative;padding:1px 5px!important;pointer-events:all}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row td.td-overlay:before{content:\"\";display:block;position:absolute;z-index:999999;background:#0000;inset:0}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover td.td-overlay:before{display:none;animation:mouse-in 1s ease-in-out}@keyframes mouse-in{0%{display:block}25%{display:none}to{display:none}}.disabled-checkbox{pointer-events:none;opacity:.6;background-color:#f5f5f5;color:#999}.action-btn-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i13.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i13.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i13.CellEditor, selector: "p-cellEditor" }, { kind: "component", type: i13.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i13.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i13.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i13.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i13.ReorderableRowHandle, selector: "[pReorderableRowHandle]" }, { kind: "directive", type: i13.ReorderableRow, selector: "[pReorderableRow]", inputs: ["pReorderableRow", "pReorderableRowDisabled"] }, { kind: "directive", type: i13.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "component", type: i13.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i14$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i11.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i14.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: i15.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "directive", type: i4.Ripple, selector: "[pRipple]" }, { kind: "directive", type: i5$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i23$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i20.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i22.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "component", type: i23.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled", "fluid"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: i17$1.OverlayPanel, selector: "p-overlayPanel, p-overlaypanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: GridRowActionsComponent, selector: "se-grid-row-actions", inputs: ["editing", "editRowPermission", "deleteRowPermission", "hideDeleteBtn", "hideEditBtn", "editAllRows", "row"], outputs: ["onRowEditInitBtn", "deleteRecordBtn", "onRowEditSaveBtn", "onRowEditCancelBtn"] }, { kind: "directive", type: AddRowDirective, selector: "[pAddRow]", inputs: ["table", "newRow", "id", "preventNewRow"] }, { kind: "component", type: GenerateReportBtnComponent, selector: "se-generate-report-btn", inputs: ["repInfo", "mappedFields", "label", "icon", "params", "class", "reportHeader", "reportFooter", "reportType", "showDialog", "form"] }, { kind: "component", type: GenerateFileComponent, selector: "se-generate-import-file", inputs: ["label", "icon", "showDialog", "dialogData", "selectedRow"] }, { kind: "component", type: EmailGenerateBtnComponent, selector: "se-email-generate-btn", inputs: ["label", "icon", "showDialog", "column", "selectedRow"] }] }); }
|
|
14551
14599
|
}
|
|
14552
14600
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GridComponent, decorators: [{
|
|
14553
14601
|
type: Component,
|
|
14554
|
-
args: [{ selector: 'se-grid', template: "<div class=\"grid-component-wrapper\">\n <p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n <p-confirmDialog class=\"grid-component-confirm-dialog\" *ngIf=\"columnActions.length > 0\"\n key=\"handlecolumnActions\"></p-confirmDialog>\n <div class=\"global-filter-buttons-wrapper flex align-items-center\">\n\n <!-- button for apply value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter ) || showFilterbtn)\" pButton type=\"button\" icon=\"pi pi-search\"\n (click)=\"applyGridFilterBtn()\" [class]=\"\n searchGridFilter ? 'p-button-success apply-filter-btn filter-btn' : 'hide-clear-filter-button apply-filter-btn filter-btn'\n \"></button>\n\n <!-- button for clear value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter )|| showFilterbtn)\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n clearGridFilter ? 'filter-btn' : 'hide-clear-filter-button filter-btn'\n \" class='global-refresh global-btn'></button>\n\n <!-- button for save all grid at once -->\n <button pButton *ngIf=\"editAllRows && editRowPermission\" id=\"saveAllGridValues\" icon=\"pi pi-check\" [label]=\"'Save'\"\n [class]=\"hideGridSaveButton ? 'hide-clear-filter-button save-all-grid' : 'ui-button-info save-all-grid'\"\n type=\"button\" (click)=\"saveAllRowsAtOnce()\"></button>\n\n <!-- button for cancel all grid at once -->\n <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\"\n [label]=\"'Cancel'\" icon=\"pi pi-times\" class=\"ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n <!-- header Button for multiSelect on Grid -->\n <span *ngIf=\"allowColumnToggle\">\n <p-multiSelect [showToggleAll]=\"false\" optionDisabled=\"false\" [options]=\"selectedToggleColumns\"\n [(ngModel)]=\"selectedColumns\" optionLabel=\"header\" selectedItemsLabel=\"{0} columns selected\"\n class=\"grid-component-multiselect-header-button\" placeholder=\"Choose Columns\">\n </p-multiSelect>\n </span>\n\n <!-- header Button for Adding new Row on Grid -->\n <button pButton *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\" type=\"button\" [label]=\"'Add'\" pAddRow\n [table]=\"componentTableRef\" [preventNewRow]=\"preventNewRow\" [newRow]=\"newGridRow\" [id]=\"dataKey\"\n pTooltip=\"Add New Row\" tooltipPosition=\"bottom\" icon=\"pi pi-plus\"\n [class]=\"'ui-button-info global-add-btn'+gridName\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n\n <!-- header Button for Excel File on Grid -->\n <button *ngIf=\"allowExportToExcel\" type=\"button\" pButton icon=\"pi pi-file-excel\" (click)=\"exportExcel()\"\n class=\"p-button-success\" pTooltip=\"Export to Excel\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- header Button for PDF File on Grid -->\n <button *ngIf=\"allowExportToPdf\" type=\"button\" pButton icon=\"pi pi-file-pdf\" (click)=\"exportPdf()\"\n class=\"p-button-warning mr-2 ml-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info mr-2 ml-2\">\n <se-generate-report-btn *ngIf =\"!reportButton.hidden\"[repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n </div> -->\n\n <ng-content></ng-content>\n\n <ng-container *ngFor=\"let reportButton of reportButtons\">\n <se-generate-report-btn *ngIf=\"!reportButton.hidden\" [repInfo]=\"reportButton\" [label]=\"reportButton.label\"\n [params]=\"reportButton.params\" [icon]=\"reportButton.icon\" [class]=\"reportButton.class\"\n [showDialog]=\"reportButton.showDialog\" [reportType]=\" reportButton.reportType\"\n [reportHeader]=\"reportButton.reportHeader\" [reportFooter]=\"reportButton.reportFooter\"></se-generate-report-btn>\n </ng-container>\n\n </div>\n\n <p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n [lazy]=\"useServerSideEvents || pagination\" [paginator]=\"pagination\"\n [alwaysShowPaginator]=\"pagination && totalRecords > 0\" [globalFilterFields]=\"globalFilterFields\"\n [class]=\"' grid-component-main-table ' + (pagination || !rowsData.length ? ' pagination ' : '') + (tableStyle.includes('width') ? ' hasTableWidthStyle ' : '') + (autoResize ? '' : 'table-layout-auto') \"\n (onColResize)=\"onColumnResize($event,dt)\" [resizableColumns]=\"true\" responsiveLayout=\"scroll\"\n columnResizeMode=\"expand\" [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\"\n [rowsPerPageOptions]=\"setPaginationLength\" [showCurrentPageReport]=\"showCurrentPageReport\"\n currentPageReportTemplate=\"Showing {first} to {last} of {{\n totalRecords\n }} entries\" [loading]=\"!setGridRefreshTime ? loading : false\"\n (onSort)=\"sortDisabled ? '' : handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n (onLazyLoad)=\"shouldRunServerSide($event) ? handleServerSideEvents($event, dt) : null\"\n (onPage)=\"gridService.columnFocusedOut ? showConfirmation($event) : handleServerSidePagination($event)\" #dt\n [dataKey]=\"dataKey\" [selection]=\"selectedRows\" (selectionChange)=\"onTableSelectionChange($event)\" selectionMode=\"multiple\" [scrollable]=\"scrollable\"\n [tableStyle]=\"tableStyle\" [scrollHeight]=\"scrollHeight\" editMode=\"row\" [editingRowKeys]=\"editingRowKeys\"\n [rowHover]=\"rowHover\" [ngClass]=\"setClassaAndId(dt)\" (onRowReorder)=\"onRowReorder($event)\">\n\n <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"flex justify-content-end\">\n <span *ngFor=\"let rowAction of rowActions\">\n <button pButton type=\"button\" [label]=\"rowAction.title\" [class]=\"rowAction.class\"\n (click)=\"rowAction.onClick(selectedRows)\"></button>\n </span>\n </div>\n\n <!-- header columns on Grid -->\n <ng-template pTemplate=\"header\" let-cols>\n <tr>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'multiple'\" class=\"grid-component-selection\"\n id=\"{{allowSelectionHeader}}\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-2\n table-header-inner-div div-last-inner-html-is-icon\">\n <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n (onChange)=\"handleHeaderCheckboxChange($event)\"></p-tableHeaderCheckbox>\n </div>\n </span>\n </th>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'single'\" id=\"Select\" data-title-element=\"self\"\n class=\"grid-component-selection\">\n Select\n </th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn' \" data-title-element=\"self\">\n Actions\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [attr.data-column-header]=\"column?.header\" [pSortableColumn]=\"column.field\"\n [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n class=\"column?.type === 'multiple' ? 'grid-component-select-th-column-type-multiple' : '\"\n (dblclick)=\"onColumnHeaderDblClick($event, column.header, dt)\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-1 table-header-inner-div div-last-inner-html-is-icon\">\n <span [attr.data-title-element]=\"'self'\" [class]=\"'flex-grow-1'\">{{ column.header }}\n <span *ngIf=\"column.isRequired\" class=\"grid-component required-star\">*</span>\n </span>\n <p-sortIcon\n *ngIf=\"column.sorting !== false && column?.type !== 'multiple' && (!(editAllRows && pagination) || sortIconHidden)\"\n [field]=\"column.field\" (click)=\"handleCustomSorting()\"></p-sortIcon>\n </div>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn id=\"MoreActions\" class=\"more-actions-th\">More</th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" data-title-element=\"self\">Actions</th>\n </tr>\n <tr *ngIf=\"filtering && !hideFilter\">\n <th pResizableColumn *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n <th pResizableColumn *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && useInlineCRUD\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [ngSwitch]=\"column?.filter?.type\"\n [class]=\"hideFilterOptions ? 'hide-table-filter temp' : 'temp'\">\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n <!-- Text input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <input type=\"text\" [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </ng-template>\n </p-columnFilter>\n\n <!-- Numeric input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'numeric'\" [field]=\"column.field\"\n *ngSwitchCase=\"'numeric_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-inputNumber [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\"\n [attr.autocomplete]=\"column.filterAutoComplete === true ? 'on' : 'off'\"></p-inputNumber>\n </ng-template>\n </p-columnFilter>\n\n <!-- lookup input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" matchMode=\"equals\"\n *ngSwitchCase=\"'lookup_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <div class=\"close-icon-wrapper grid-component lookup-filter-wrapper\">\n <div class=\"lookup-filter-input-wrapper\">\n <input [id]=\"column.field?.toLowerCase() + '_filter'\" class=\"grid-component lookup-filter\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n type=\"text\" [ngModel]=\"lookupFilterInputNgModel(column)\"\n (ngModelChange)=\"changeLookupInputNgModel('lookupFilter', column, $event)\"\n (click)=\"setFilterLookup(column)\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </div>\n <div class=\"direct-wrapper-close-icon-lookup\">\n <button *ngIf=\"column.filterValue\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column)\">\n </button>\n </div>\n </div>\n </ng-template>\n </p-columnFilter>\n\n <!-- checkbox on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" type=\"boolean\" [field]=\"column.field\" *ngSwitchCase=\"'checkbox'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-checkbox [binary]=\"true\" [disabled]=\"column.disabled\" [ngModel]=\"column.filterValue\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\n (ngModelChange)=\"clickCheckBoxFilter(column, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n </p-checkbox>\n </ng-template>\n </p-columnFilter>\n\n <!-- multiSelect on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'multi-select'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-multiSelect [(ngModel)]=\"column.filterValue\" [options]=\"column.filter.data || []\" [appendTo]=\"'body'\"\n [name]=\"column.field\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n [optionValue]=\"column.optionValue\" [optionLabel]=\"column.optionLabel\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n\n </p-multiSelect>\n </ng-template>\n </p-columnFilter>\n\n <!-- dropdown on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'dropdown'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-dropdown [showClear]=\"true\" [placeholder]=\"'Select'\" [filter]=\"column.allowSearch\"\n [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n [options]=\"column.filter.data || []\" (onChange)=\"searchDropdownFilter(filter, $event, column)\"\n [appendTo]=\"'body'\" filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n </p-columnFilter>\n\n <!-- calendar on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'calendar'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-datepicker [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.filterValue\"\n [class]=\"column.field + '-filter-input'\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n appendTo=\"body\" (onSelect)=\"selectDate(column)\" [inputId]=\"column.field\" hourFormat=\"12\"\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\" [showButtonBar]=\"true\"\n (onClose)=\"setFilterFocusOut(column, filter, $event)\" [dateFormat]=\"calendarFormat\"\n (ngModelChange)=\"calendarInputValue(column, {}, true)\" (onClearClick)=\"backspaceEvent($event, column)\"\n (keydown)=\"setFilterFocusOut(column, filter, $event)\">\n </p-datepicker>\n </ng-template>\n </p-columnFilter>\n\n <!-- Default Filter For Header -->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"\n column.type && column.type !== 'link' ? column.type : 'text'\n \" [field]=\"column.field\" display=\"menu\" *ngSwitchDefault>\n </p-columnFilter>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn class=\"more-actions-th\"></th>\n <th pResizableColumn\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n </tr>\n </ng-template>\n\n <!-- Body columns on Grid -->\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n <tr [style]=\"rowStyle\" [ngClass]=\"{\n 'highlighted-row': row?.highlightrow,\n 'ellipsis-true': ellipsis,\n 'p-selectable-row wordWrapTrue': wordWrap,\n 'wordWrapFalse p-selectable-row': !wordWrap\n }\" (click)=\"selectedRowRecord = row\" [pEditableRow]=\"row\" [pReorderableRow]=\"ri\" #gridRow [id]=\"row[dataKey]\">\n <td *ngIf=\"allowSelection\" class=\"grid-component-selection\" pReorderableRowHandle>\n <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"></p-tableRadioButton>\n <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"></p-tableCheckbox>\n </td>\n\n <!-- first actions column -->\n <!-- <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class=\"setActionColumnWidth\">\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n\n <!-- Grid Rows Data Bindings Start -->\n <td *ngFor=\"let column of selectedColumns\" [ngSwitch]=\"column.type\" [style]=\"column.style\"\n [class]=\"column.style ? '' : 'w-static-col'\" [attr.data-column-field]=\"column?.field\"\n [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-overlay' : ''\" pReorderableRowHandle>\n <span [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-wrapper' : ''\"\n (mouseenter)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? addDynamicPanelOverlayComponent(column.hoverData, overlayPanel, $event, row) : ''\"\n (mouseleave)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? mouseLeaveEvent(overlayPanel) : ''\">\n <span class=\"td-content-wrapper\" [style]=\"column.style\">\n\n <!-- Boolean column on Grid -->\n <span *ngSwitchCase=\"'boolean'\">\n <td *ngIf=\"!editing && row[column.field + '_obj']?.show != false\">\n <p-checkbox [ngClass]=\"{'disabled-checkbox': column.disabled}\" [binary]=\"true\"\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (change)=\"onFocusOutEvent(column, row)\"\n [ngModel]=\"getCheckboxValue(row, column)\">\n </p-checkbox>\n </td>\n <td *ngIf=\"editing\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for edit checkBox -->\n <p-checkbox (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [ngModel]=\"getCheckboxValue(row, column)\"\n (change)=\"onFocusOutEvent(column, row)\"></p-checkbox>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ row[column.field] }}\n </ng-template>\n </p-cellEditor>\n </td>\n </span>\n\n <!-- link column on Grid -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'a,input'\" *ngSwitchCase=\"'link'\">\n <!-- link column for HyperLink Case -->\n <span *ngIf=\"column.allowSave === false\">\n <span *ngIf=\"column.target !== '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n <span *ngIf=\"column.target === '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\" allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]='column.target' pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </span>\n <!-- link column for Edit Case -->\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <span *ngIf=\"(column.editable === true ) && (column.editLink === true )\">\n <input *ngIf=\"!row.isNew\" pInputText\n [ngModel]=\"row[column.field + '_obj']?.displayField || row[column.field] || ''\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj'].displayField = $event : row[column.field] = $event\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\" type=\"text\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n <input pInputText *ngIf=\"row.isNew\" type=\"text\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj']?.displayField : row[column.field] = $event\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n </span>\n <!-- <span *ngIf=\"column.editable === false|| column.editable === undefined\" >\n <a class=\"custom-link\" (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" [target]='column.target'\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\" [title]=\"column.header\"></i>\n <ng-template #noIcon>\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </ng-template>\n \n </a>\n </span> -->\n <span\n *ngIf=\"(column.editLink === false|| column.editLink === undefined)&&(column.editable === false|| column.editable === undefined)\">\n <a class=\"d-inline\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [class]=\"column.icon\" [title]=\"column.header\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n\n </a>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [style]=\"column.style\" class=\"custom-link\"\n [class]=\"column.editable === false || allowDisabled(column,row) ? 'disabled-link' : ''\">\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\" pReorderableRowHandle>\n <i *ngIf=\"column.icon&& !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [title]=\"column.header\" [class]=\"column.icon\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n\n <!-- Iframe column on Grid -->\n <span *ngSwitchCase=\"'iframe'\">\n <span class=\"custom-link\" (click)=\"gridIFrame(column, row[column.field + '_obj']?.hyperlink, row)\" [title]=\"\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText\n ? column.displayText\n : row[column.field]\n\n \">\n <button class=\"custom-icon-btn\" *ngIf=\"column.icon; else noIcon\" [disabled]=\"column.disabled\">\n <i [class]=\"column.icon\" [title]=\"column.header\"></i>\n </button>\n <ng-template #noIcon>\n {{\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText ? column.displayText : row[column.field]\n }}\n </ng-template>\n </span>\n </span>\n\n <!-- dialog column on Grid -->\n <span *ngSwitchCase=\"'dialog'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span *ngIf=\"column?.filter?.type !== 'calendar' && !row?.hidegridbtn\">\n <span *ngIf=\"column.editable === true && !row[column.field+'_obj']?.hideFieldValue\"\n pReorderableRowHandle>\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\" readonly\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" pInputText\n (click)=\"selectLookupField(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" />\n\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"column.editable === false || column.editable === undefined\n \" class=\"custom-link\" [style]=\"column.style\" [class]=\"\n allowDisabled(column,row) ? 'disabled-link' : ''\n \" (click)=\"openGridDialog(column, row, $event)\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>{{ (!column.displayText && row.isNew ) ||\n row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row, column)\n }}</ng-template>\n </span>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && column.editable === true\"\n [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <p-datepicker\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\" [appendTo]=\"'body'\" hourFormat=\"12\"\n [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\" [timeOnly]=\"column.timeOnly\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ?\n row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\"></p-datepicker>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && !column.editable\" class=\"custom-link\"\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\">{{ row[column.field+'_obj']?.hideFieldValue ? '' :\n setConditionBaseValue(row, column) }}\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"custom-link\" [style]=\"column.style\" pReorderableRowHandle\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [title]=\"column.hoverData ? '' : column.header\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"></i>\n <ng-template #noIcon>{{ row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row,\n column) }}</ng-template>\n <!-- {{ setConditionBaseValue(row, column) }}\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\" -->\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- test -->\n <!-- lookup Input column on Grid -->\n <span *ngSwitchCase=\"'lookup_input'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <div class=\"close-icon-wrapper\">\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\"\n [readonly]=\"!isLookupInputEditable(column, row)\" type=\"text\" [ngModel]=\"lookupInputNgModel(row, column)\"\n (ngModelChange)=\"changeLookupInputNgModel(row, column, $event)\" [disabled]=\"allowDisabled(column,row)\"\n (click)=\"isLookupInputEditable(column, row) ? onClickEvent(column, row) : selectLookupField(column, row)\"\n (change)=\"onChangeEvent(column, row)\" (keydown.enter)=\"onLookupInputEnter($event, column, row)\"\n (paste)=\"onLookupInputPaste($event, column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" />\n <div *ngIf=\"!allowDisabled(column,row)\">\n <button\n *ngIf=\"isLookupInputEditable(column, row) && (row[column.field + '_obj']?.lookupControl?.component || column.lookupControl?.component)\"\n icon=\"pi pi-search\" pButton type=\"button\" (click)=\"selectLookupField(column, row)\"></button>\n <button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n ? row[column.field].text\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column,row)\"></button>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"column.linkId\">\n <a [attr.data-title-element]=\"column.hoverData ? null : 'self'\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target === '_self' ? '' : '_blank'\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </a>\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"!column.linkId\" [style]=\"column.style\"\n [class]=\"column.lookupControl?.component && column.editLink === true ? 'custom-link' : ''\"\n (click)=\"openLookupHyperlink(column, row)\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Numeric Input column on Grid -->\n <span *ngSwitchCase=\"'numeric'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for Currency && Decimal && Percent -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'input'\" class=\"input-number\"\n pReorderableRowHandle>\n <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n row[column.field.toLowerCase()+'_obj']?.errorMessage\n ? 'ng-invalid ng-dirty'\n : 'form-control'\n \" [showButtons]=\"false\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"column.field\" [disabled]=\"allowDisabled(column,row)\" (onFocus)=\"onFocusEvent(column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\" autocomplete=\"off\" (keydown)=\"allowLeadingDot($event)\" [mode]=\"\n column.format &&\n column.format.type === 'currency'\n ? 'currency'\n : 'decimal'\n \" [currency]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.currency\n ? column.format.formatParams.currency\n : 'USD'\n \" [locale]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.locale\n ? column.format.formatParams.locale\n : 'en-US'\n \" [minFractionDigits]=\"column.format ? setNumericMinFraction(column) : '0'\"\n [maxFractionDigits]=\"column.format ? setNumericMaxFraction(column) : '0'\" [suffix]=\"\n column.format &&\n column.format.type === 'percent' && \n '%'\n \n \">\n </p-inputNumber>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\" pReorderableRowHandle>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n setNumericFormat(column, row)\n }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Button column on Grid -->\n <span *ngSwitchCase=\"'add_button'\">\n <div>\n <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n class=\"grid-component-grid-add-btn\" (click)=\"onClickButton(column, row)\"></button>\n </div>\n </span>\n\n <!-- Generate File Button column on Grid -->\n <span *ngSwitchCase=\"'generate_file_button'\">\n <se-generate-import-file\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [dialogData]=\"column.data\" [selectedRow]=\"row\"></se-generate-import-file>\n </span>\n\n <!-- Send email Button column on Grid -->\n <span *ngSwitchCase=\"'send_email_button'\">\n <se-email-generate-btn\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\" [column]=\"column\"\n [selectedRow]=\"row\"></se-email-generate-btn>\n </span>\n\n <!-- Date column on Grid -->\n <!-- calendar selector -->\n <span *ngSwitchCase=\"'date'\"\n [attr.data-title-element]=\"column.hoverData? null: editAllRows ? 'input' : 'self' \">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <p-datepicker [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\" hourFormat=\"12\" [defaultDate]=\"defaultDate\"\n [stepMinute]=\"column.minutesInterval ? column.minutesInterval : 1\" [showTime]=\"column.showTime\"\n [timeOnly]=\"column.timeOnly\" [dateFormat]=\"column.format ? column.format.type : calendarFormat\"\n (keyup)=\"calendarInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"onCalendarModelChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n [showButtonBar]=\"!column.timeOnly\"></p-datepicker>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed white-space-nowrap text-center border-readonly\">\n {{ setConditionBaseValue(row,column) }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n\n <span *ngSwitchDefault>\n <span [ngSwitch]=\"column.type\">\n <!-- Dropdown column on Grid -->\n <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\"\n [attr.data-title-element]=\" column.hoverData? null: editAllRows ? '.p-dropdown-label' : 'self'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-dropdown *ngIf=\"!row[column.field+'_obj']?.hidden\" [options]=\"\n row[column.field?.toLowerCase()+'_data']\n ? row[column.field?.toLowerCase()+'_data']\n : column.data\n \"\n [ngModel]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField?.toLowerCase() ? row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n ? row[column.displayField]\n : row[column.field] ? row[column.field] : 'Select'\"\n [showClear]=\"row[column.field] ? true : false\" [optionLabel]=\"column.optionLabel\"\n (click)=\"onClickEvent(column, row)\" [optionValue]=\"column.optionValue\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n (onChange)=\"onChangeEvent(column, row)\" [appendTo]=\"'body'\" [filter]=\"column.allowSearch\"\n filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed border-readonly\">\n <ng-container *ngIf=\"!row[column.field+'_obj']?.hidden\">\n <a *ngIf=\"column.displayAsLink\" class=\"custom-link\"\n [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]='column.target'>\n {{ setDropdwonReadOnlyValue(row, column) }}\n </a>\n <span *ngIf=\"!column.displayAsLink\">\n {{ setDropdwonReadOnlyValue(row, column) }}\n </span>\n </ng-container>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- MultiSelect column on Grid -->\n <!-- [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n row[column.field]\" -->\n <span *ngSwitchCase=\"'multi-select'\"\n [attr.data-title-element]=\"column.hoverData ? null : '.p-multiselect-label'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-multiSelect\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" [(ngModel)]=\"row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [options]=\"row[column.field.toLowerCase() + '_data'] ? row[column.field.toLowerCase() + '_data'] : column.data\"\n [optionLabel]=\"column.optionLabel\" [optionValue]=\"column.optionValue\"\n (onChange)=\"onChangeEvent(column, row)\" (onPanelShow)=\"showOption(column, row)\"\n (click)=\"onClickEvent(column, row)\" [appendTo]=\"'body'\" (blur)=\"onFocusOutEvent(column, row)\">\n </p-multiSelect>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n row[column.displayField]\n ? row[column.displayField] :\n setMultiSelectData(column, row[column.field])\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- AutoComplete Search -->\n <span *ngSwitchCase=\"'AutoComplete'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-autoComplete\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [name]=\"column.header\"\n [suggestions]=\"column.data\" (onSelect)=\"autoCompleteSelectedValue(row, column, $event)\"\n [field]=\"column.optionLabel ? column.optionLabel?.toLowerCase() : column.displayField ? column.displayField?.toLowerCase() : column.field?.toLowerCase()\"\n [ngModel]=\"getAutoCompleteNgModel(row, column)\"\n (ngModelChange)=\"changeAutoCompleteNgModel(row, column, $event)\" [dropdown]=\"column.showOption\"\n (ngModelChange)=\"onChangeEvent(column, row)\" (click)=\"onClickEvent(column, row)\"\n (completeMethod)=\"autoSearch($event, column, row)\" (onBlur)=\"onFocusOutEvent(column, row, $event)\"\n [disabled]=\"allowDisabled(column,row)\" [appendTo]=\"'body'\" [multiple]=\"true\"\n (keydown.enter)=\"onAutoCompleteKeyEnterEvent($event, column, row)\">\n </p-autoComplete>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n </span>\n </span>\n <span\n *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.field] && !column.displayField\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.field] : value[column.field] + ';' : value[column.field] }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n <!-- Add Generate Report Button -->\n <span *ngSwitchCase=\"'report'\">\n <p-cellEditor>\n <ng-template pTemplate=\"output\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [class]=\"column.class\" [showDialog]=\"column.showDialog\"\n [icon]=\"column.icon\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n <ng-template pTemplate=\"input\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [icon]=\"column.icon\" [class]=\"column.class\"\n [showDialog]=\"column.showDialog\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <span *ngSwitchDefault [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <!-- Input column on Grid -->\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n\n <textarea *ngIf=\"column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]])\"\n [(ngModel)]=\"row[column.field]\" [attr.data-cell]=\"column.field + '-' + row[dataKey]\"\n class=\"prime-textarea\"\n style=\"resize: none; min-width: 200px; min-height: 40px; word-break: break-word; text-align: justify; overflow: hidden;\"\n [disabled]=\"allowDisabled(column,row)\" (blur)=\"onTextareaBlur(column, row)\"\n (keydown.enter)=\"onTextareaEnter($event, column, row)\" autofocus></textarea>\n\n <input\n *ngIf=\"!column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]]) && column.field !== dataKey\"\n [type]=\"row[column.field+'_obj']?.textType?row[column.field+'_obj']?.textType:column.textType?column.textType:'text'\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [ngModel]=\"setInputNgModel(row, column)\"\n (ngModelChange)=\"onInputChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n (click)=\"onClickButton(column, row)\" />\n <span *ngIf=\"!(editAllRows || editingRowKeys[row[dataKey]])\">\n {{ row[column.field] }}\n </span>\n\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n (click)=\"changePasswordType(column, row)\" [title]=\"column.header\"></i>\n </span>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n <span (click)=\"onClickEvent(column, row)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self' \"\n [class]=\"row[column.field+'_obj']?.textType ?(row[column.field+'_obj']?.textType=='password' ?'password':'') :column.textType=='password'?'password':''\">\n {{ setTextBoxReadOnlyValue(row, column) }}\n </span>\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n [title]=\"column.header\" (click)=\"changePasswordType(column, row)\"></i>\n </span>\n </span>\n </span>\n </ng-template>\n\n </p-cellEditor>\n </span>\n </span>\n </span>\n\n </span>\n </span>\n </td>\n <!-- Grid Rows Data Bindings End -->\n\n <!-- More actions column (ellipsis) -->\n <td *ngIf=\"hasMoreItems(row)\" class=\"for-more-actions\">\n <button pButton type=\"button\" icon=\"pi pi-ellipsis-v\" class=\"p-button-text\" (click)=\"showMore($event, row)\"\n aria-label=\"More actions\"></button>\n </td>\n\n <!-- Action column on Grid -->\n <!-- <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\n class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" class=\"for-buttons\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class='setActionColumnWidth'>\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n </tr>\n </ng-template>\n\n <!-- Footer columns on Grid -->\n <ng-template pTemplate=\"footer\">\n <tr *ngIf=\"aggregateFooter\">\n <td\n *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngFor=\"let outerColumn of selectedColumns\" class=\"grid-component-outer-column\" [style]=\"outerColumn.style\">\n <div *ngFor=\"let innerColumn of selectedColumns\">\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) ||\n aggr.displayField && aggr.displayField?.toLowerCase() === outerColumn.field?.toLowerCase())\">\n <div [innerHTML]=\"aggr.aggrValue\">\n </div>\n </div>\n </div>\n </div>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\"></td>\n </tr>\n </ng-template>\n\n <!-- Footer for Empty Message columns on Grid -->\n <ng-template pTemplate=\"emptymessage\">\n <tr class=\"grid-component no-records-found\">\n <td [attr.colspan]=\"selectedColumns?.length + 1\">{{totalRecords==0? 'No records found':''}}</td>\n </tr>\n </ng-template>\n </p-table>\n <p-overlayPanel [style]=\"overlayPanelStyle\" #overlayPanel>\n <ng-container #viewContainerRef></ng-container>\n </p-overlayPanel>\n <p-menu #moreMenu [popup]=\"true\" [model]=\"currentMoreMenu\" appendTo=\"body\" styleClass=\"grid-more-menu\"></p-menu>\n</div>\n", styles: [":host ::ng-deep .table-layout-auto table{table-layout:auto;width:max-content!important}:host ::ng-deep .prime-input{font-family:Roboto;font-size:12px;color:#484848;background:#fff;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none;border-radius:3px;border:none}:host ::ng-deep .prime-input:focus{outline:none;border-color:transparent;box-shadow:0 0 0 2px #0003}:host ::ng-deep .prime-textarea{font-family:Roboto;font-size:12px;color:#484848;background:#fff;border-radius:3px;border:1px solid #bdbdbd;width:100%;resize:both;min-height:40px;min-width:100px;transition:box-shadow .2s;box-sizing:border-box}:host ::ng-deep .prime-textarea:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 2px #1976d21a}:host ::ng-deep .td-wrapper{height:30px;display:flex;align-items:center;position:relative;z-index:99999}:host ::ng-deep html:not(:has(p-accordion)) .grid-container{padding:.5rem!important}:host ::ng-deep .grid-container{display:flex;flex-direction:column}:host ::ng-deep [data-title]{position:static}:host ::ng-deep [data-title]:not([input]):hover:before{position:absolute;content:attr(data-title);background-color:#fff;color:#000;border:.5px solid black;padding:.17em .5em;z-index:3;margin-top:18px;margin-left:18px}:host ::ng-deep .grid-component-main-table .p-datatable-resizable-table>.p-datatable-tbody>tr>td:has(span:hover){overflow:visible!important;position:relative;z-index:3}:host ::ng-deep .p-multiselect{max-width:100%}:host ::ng-deep .password{-webkit-text-security:disc}:host ::ng-deep .p-calendar .p-inputtext{width:100%}:host ::ng-deep .for-more-actions{width:48px;text-align:center;vertical-align:middle}:host ::ng-deep .for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.25rem}:host ::ng-deep .more-menu .more-menu-item{display:block;width:100%;text-align:left}:host ::ng-deep th.more-actions-th,:host ::ng-deep td.for-more-actions{position:-webkit-sticky;position:sticky;right:0;background:#fff;z-index:10}:host ::ng-deep .column-filter-clear-button{display:none}:host ::ng-deep .apply-filter-btn{float:unset!important}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .hide-table-filter .p-column-filter-menu-button,:host ::ng-deep .hide-table-filter .p-column-filter-clear-button{display:none!important}:host ::ng-deep .hide-filter-icon .column-filter-menu-button{display:none}.disabled-link,.disabled-link a,.disabled-link label,.disabled-link span,.disabled-link div,.disable-label-control,.disabled-link.custom-link,.disabled-link.custom-link a,.disabled-link.custom-link label,.disabled-link.custom-link span,.disabled-link.custom-link div,.disable-label-control.custom-link{pointer-events:none;color:#83baf8}.custom-link{color:#205dcf;font-size:12px}.custom-link:not(.disabled-link){cursor:pointer}.mr-2{margin-right:10px;display:block}.highlighted-row{background-color:#dee2e6!important}.hide-clear-filter-button{display:none!important}.grid-more-menu .p-menu-list{min-width:180px;max-width:260px;padding:.25rem 0}.grid-more-menu .p-menuitem-link{padding:.4rem .75rem;font-size:13px;color:#2d2d2d}.grid-more-menu .p-menuitem-link .p-menuitem-icon{margin-right:.6rem;font-size:14px;color:#5a5a5a}.grid-more-menu .p-menuitem-link:hover{background:#f5f7fa}.for-more-actions{width:48px;text-align:center;vertical-align:middle;padding:0}.for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.15rem;border-radius:4px}html:not(:has(p-accordion)) .grid-container.col-8 button{float:none!important}.grid-container{padding:.5rem!important}:host ::ng-deep .p-datatable-resizable-table>.p-datatable-thead>tr>th{overflow:visible!important}:host ::ng-deep .p-multiselect .p-multiselect-trigger{top:6px}:host ::ng-deep button.custom-icon-btn{background:transparent!important;border:0!important;outline:none!important;padding:0!important}:host ::ng-deep button.custom-icon-btn:focus{outline:none}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight,:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight .p-sortable-column-icon{color:#343434!important}:host ::ng-deep .center-content{display:flex;flex-direction:column}:host ::ng-deep .p-overlaypanel .p-overlaypanel-content{width:400px;height:300px;overflow-y:auto!important}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{z-index:11!important}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row{position:relative}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row:hover{z-index:10!important}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row .td-wrapper{height:0px;display:flex!important;align-items:center;position:relative;z-index:9}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover .td-wrapper{height:30px}:host ::ng-deep .p-overlaypanel{z-index:999999!important}:host ::ng-deep .more-column-cell{display:flex;align-items:center;justify-content:center}:host ::ng-deep .more-ellipsis-btn{background:transparent!important;border:0!important;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .more-option{display:flex;align-items:center;width:100%;text-align:left;padding:6px 8px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{position:relative;padding:1px 5px!important;pointer-events:all}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row td.td-overlay:before{content:\"\";display:block;position:absolute;z-index:999999;background:#0000;inset:0}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover td.td-overlay:before{display:none;animation:mouse-in 1s ease-in-out}@keyframes mouse-in{0%{display:block}25%{display:none}to{display:none}}.disabled-checkbox{pointer-events:none;opacity:.6;background-color:#f5f5f5;color:#999}.action-btn-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}\n"] }]
|
|
14602
|
+
args: [{ selector: 'se-grid', template: "<div class=\"grid-component-wrapper\">\n <p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n <p-confirmDialog class=\"grid-component-confirm-dialog\" *ngIf=\"columnActions.length > 0\"\n key=\"handlecolumnActions\"></p-confirmDialog>\n <div class=\"global-filter-buttons-wrapper flex align-items-center\">\n\n <!-- button for apply value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter ) || showFilterbtn)\" pButton type=\"button\" icon=\"pi pi-search\"\n (click)=\"applyGridFilterBtn()\" [class]=\"\n searchGridFilter ? 'p-button-success apply-filter-btn filter-btn' : 'hide-clear-filter-button apply-filter-btn filter-btn'\n \"></button>\n\n <!-- button for clear value on Grid -->\n <button *ngIf=\"((filtering && !hideFilter )|| showFilterbtn)\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n clearGridFilter ? 'filter-btn' : 'hide-clear-filter-button filter-btn'\n \" class='global-refresh global-btn'></button>\n\n <!-- button for save all grid at once -->\n <button pButton *ngIf=\"editAllRows && editRowPermission\" id=\"saveAllGridValues\" icon=\"pi pi-check\" [label]=\"'Save'\"\n [class]=\"hideGridSaveButton ? 'hide-clear-filter-button save-all-grid' : 'ui-button-info save-all-grid'\"\n type=\"button\" (click)=\"saveAllRowsAtOnce()\"></button>\n\n <!-- button for cancel all grid at once -->\n <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\"\n [label]=\"'Cancel'\" icon=\"pi pi-times\" class=\"ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n <!-- header Button for multiSelect on Grid -->\n <span *ngIf=\"allowColumnToggle\">\n <p-multiSelect [showToggleAll]=\"false\" optionDisabled=\"false\" [options]=\"selectedToggleColumns\"\n [(ngModel)]=\"selectedColumns\" optionLabel=\"header\" selectedItemsLabel=\"{0} columns selected\"\n class=\"grid-component-multiselect-header-button\" placeholder=\"Choose Columns\">\n </p-multiSelect>\n </span>\n\n <!-- header Button for Adding new Row on Grid -->\n <button pButton *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\" type=\"button\" [label]=\"'Add'\" pAddRow\n [table]=\"componentTableRef\" [preventNewRow]=\"preventNewRow\" [newRow]=\"newGridRow\" [id]=\"dataKey\"\n pTooltip=\"Add New Row\" tooltipPosition=\"bottom\" icon=\"pi pi-plus\"\n [class]=\"'ui-button-info global-add-btn'+gridName\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n\n <!-- header Button for Excel File on Grid -->\n <button *ngIf=\"allowExportToExcel\" type=\"button\" pButton icon=\"pi pi-file-excel\" (click)=\"exportExcel()\"\n class=\"p-button-success\" pTooltip=\"Export to Excel\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- header Button for PDF File on Grid -->\n <button *ngIf=\"allowExportToPdf\" type=\"button\" pButton icon=\"pi pi-file-pdf\" (click)=\"exportPdf()\"\n class=\"p-button-warning mr-2 ml-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n\n <!-- <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info mr-2 ml-2\">\n <se-generate-report-btn *ngIf =\"!reportButton.hidden\"[repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n </div> -->\n\n <ng-content></ng-content>\n\n <ng-container *ngFor=\"let reportButton of reportButtons\">\n <se-generate-report-btn *ngIf=\"!reportButton.hidden\" [repInfo]=\"reportButton\" [label]=\"reportButton.label\"\n [params]=\"reportButton.params\" [icon]=\"reportButton.icon\" [class]=\"reportButton.class\"\n [showDialog]=\"reportButton.showDialog\" [reportType]=\" reportButton.reportType\"\n [reportHeader]=\"reportButton.reportHeader\" [reportFooter]=\"reportButton.reportFooter\"></se-generate-report-btn>\n </ng-container>\n\n </div>\n\n <p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n [lazy]=\"useServerSideEvents || pagination\" [paginator]=\"pagination\"\n [alwaysShowPaginator]=\"pagination && totalRecords > 0\" [globalFilterFields]=\"globalFilterFields\"\n [class]=\"' grid-component-main-table ' + (pagination || !rowsData.length ? ' pagination ' : '') + (tableStyle.includes('width') ? ' hasTableWidthStyle ' : '') + (autoResize ? '' : 'table-layout-auto') \"\n (onColResize)=\"onColumnResize($event,dt)\" [resizableColumns]=\"true\" responsiveLayout=\"scroll\"\n columnResizeMode=\"expand\" [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\"\n [rowsPerPageOptions]=\"setPaginationLength\" [showCurrentPageReport]=\"showCurrentPageReport\"\n currentPageReportTemplate=\"Showing {first} to {last} of {{\n totalRecords\n }} entries\" [loading]=\"!setGridRefreshTime ? loading : false\"\n (onSort)=\"sortDisabled ? '' : handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n (onLazyLoad)=\"shouldRunServerSide($event) ? handleServerSideEvents($event, dt) : null\"\n (onPage)=\"gridService.columnFocusedOut ? showConfirmation($event) : handleServerSidePagination($event)\" #dt\n [dataKey]=\"dataKey\" [selection]=\"selectedRows\" (selectionChange)=\"onTableSelectionChange($event)\" selectionMode=\"multiple\" [scrollable]=\"scrollable\"\n [tableStyle]=\"tableStyle\" [scrollHeight]=\"scrollHeight\" editMode=\"row\" [editingRowKeys]=\"editingRowKeys\"\n [rowHover]=\"rowHover\" [ngClass]=\"setClassaAndId(dt)\" (onRowReorder)=\"onRowReorder($event)\">\n\n <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"flex justify-content-end\">\n <span *ngFor=\"let rowAction of rowActions\">\n <button pButton type=\"button\" [label]=\"rowAction.title\" [class]=\"rowAction.class\"\n (click)=\"rowAction.onClick(selectedRows)\"></button>\n </span>\n </div>\n\n <!-- header columns on Grid -->\n <ng-template pTemplate=\"header\" let-cols>\n <tr>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'multiple'\" class=\"grid-component-selection\"\n id=\"{{allowSelectionHeader}}\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-2\n table-header-inner-div div-last-inner-html-is-icon\">\n <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n (onChange)=\"handleHeaderCheckboxChange($event)\"></p-tableHeaderCheckbox>\n </div>\n </span>\n </th>\n <th pResizableColumn *ngIf=\"allowSelection && selectionType === 'single'\" id=\"Select\" data-title-element=\"self\"\n class=\"grid-component-selection\">\n Select\n </th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn' \" data-title-element=\"self\">\n Actions\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [attr.data-column-header]=\"column?.header\" [pSortableColumn]=\"column.field\"\n [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n class=\"column?.type === 'multiple' ? 'grid-component-select-th-column-type-multiple' : ''\"\n (dblclick)=\"onColumnHeaderDblClick($event, column.header, dt)\">\n <span class=\"th-content-wrapper\">\n <div class=\"grid-component-table-header-inner-div-1 table-header-inner-div div-last-inner-html-is-icon\">\n <span [attr.data-title-element]=\"'self'\" [class]=\"'flex-grow-1'\">{{ column.header }}\n <span *ngIf=\"column.isRequired\" class=\"grid-component required-star\">*</span>\n </span>\n <p-sortIcon\n *ngIf=\"column.sorting !== false && column?.type !== 'multiple' && (!(editAllRows && pagination) || sortIconHidden)\"\n [field]=\"column.field\" (click)=\"handleCustomSorting()\"></p-sortIcon>\n </div>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn id=\"MoreActions\" class=\"more-actions-th\">More</th>\n <th pResizableColumn id=\"Actions\"\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" data-title-element=\"self\">Actions</th>\n </tr>\n <tr *ngIf=\"filtering && !hideFilter\">\n <th pResizableColumn *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n <th pResizableColumn *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && useInlineCRUD\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n </th>\n <th pResizableColumn *ngFor=\"let column of cols\"\n [style.width]=\"column?.columnWidth ? column?.columnWidth+'px' : column?.customWidth+'px'\"\n id=\"{{column.header}}\" [ngSwitch]=\"column?.filter?.type\"\n [class]=\"hideFilterOptions ? 'hide-table-filter temp' : 'temp'\">\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n <!-- Text input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <input type=\"text\" [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </ng-template>\n </p-columnFilter>\n\n <!-- Numeric input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'numeric'\" [field]=\"column.field\"\n *ngSwitchCase=\"'numeric_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-inputNumber [(ngModel)]=\"column.filterValue\" [class]=\"column?.field?.toLowerCase()\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\"\n [attr.autocomplete]=\"column.filterAutoComplete === true ? 'on' : 'off'\"></p-inputNumber>\n </ng-template>\n </p-columnFilter>\n\n <!-- lookup input on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"'text'\" [field]=\"column.field\" matchMode=\"equals\"\n *ngSwitchCase=\"'lookup_input'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <div class=\"close-icon-wrapper grid-component lookup-filter-wrapper\">\n <div class=\"lookup-filter-input-wrapper\">\n <input [id]=\"column.field?.toLowerCase() + '_filter'\" class=\"grid-component lookup-filter\"\n [attr.autocomplete]=\"(column.autoComplete === false || column.filterAutoComplete === false || autoComplete === false) ? 'off' : 'on'\"\n type=\"text\" [ngModel]=\"lookupFilterInputNgModel(column)\"\n (ngModelChange)=\"changeLookupInputNgModel('lookupFilter', column, $event)\"\n (click)=\"setFilterLookup(column)\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\" [name]=\"column.field\"\n (keyup)=\"removingFilters($event, column);backspaceEvent($event, column)\" pInputText />\n </div>\n <div class=\"direct-wrapper-close-icon-lookup\">\n <button *ngIf=\"column.filterValue\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column)\">\n </button>\n </div>\n </div>\n </ng-template>\n </p-columnFilter>\n\n <!-- checkbox on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" type=\"boolean\" [field]=\"column.field\" *ngSwitchCase=\"'checkbox'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-checkbox [binary]=\"true\" [disabled]=\"column.disabled\" [ngModel]=\"column.filterValue\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\n (ngModelChange)=\"clickCheckBoxFilter(column, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n </p-checkbox>\n </ng-template>\n </p-columnFilter>\n\n <!-- multiSelect on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'multi-select'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-multiSelect [(ngModel)]=\"column.filterValue\" [options]=\"column.filter.data || []\" [appendTo]=\"'body'\"\n [name]=\"column.field\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n [optionValue]=\"column.optionValue\" [optionLabel]=\"column.optionLabel\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\">\n\n </p-multiSelect>\n </ng-template>\n </p-columnFilter>\n\n <!-- dropdown on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'dropdown'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-dropdown [showClear]=\"true\" [placeholder]=\"'Select'\" [filter]=\"column.allowSearch\"\n [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n [options]=\"column.filter.data || []\" (onChange)=\"searchDropdownFilter(filter, $event, column)\"\n [appendTo]=\"'body'\" filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n </p-columnFilter>\n\n <!-- calendar on Header For Filter-->\n <p-columnFilter class=\"no-filter-icon\" [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\"\n *ngSwitchCase=\"'calendar'\">\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n <p-datepicker [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.filterValue\"\n [class]=\"column.field + '-filter-input'\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n appendTo=\"body\" (onSelect)=\"selectDate(column)\" [inputId]=\"column.field\" hourFormat=\"12\"\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\" [showButtonBar]=\"true\"\n (onClose)=\"setFilterFocusOut(column, filter, $event)\" [dateFormat]=\"calendarFormat\"\n (ngModelChange)=\"calendarInputValue(column, {}, true)\" (onClearClick)=\"backspaceEvent($event, column)\"\n (keydown)=\"setFilterFocusOut(column, filter, $event)\">\n </p-datepicker>\n </ng-template>\n </p-columnFilter>\n\n <!-- Default Filter For Header -->\n <p-columnFilter class=\"no-filter-icon\" [type]=\"\n column.type && column.type !== 'link' ? column.type : 'text'\n \" [field]=\"column.field\" display=\"menu\" *ngSwitchDefault>\n </p-columnFilter>\n </span>\n </th>\n <th *ngIf=\"hasMoreColumns()\" pResizableColumn class=\"more-actions-th\"></th>\n <th pResizableColumn\n *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n </tr>\n </ng-template>\n\n <!-- Body columns on Grid -->\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n <tr [style]=\"rowStyle\" [ngClass]=\"{\n 'highlighted-row': row?.highlightrow,\n 'ellipsis-true': ellipsis,\n 'p-selectable-row wordWrapTrue': wordWrap,\n 'wordWrapFalse p-selectable-row': !wordWrap\n }\" (click)=\"selectedRowRecord = row\" [pEditableRow]=\"row\" [pReorderableRow]=\"ri\" #gridRow [id]=\"row[dataKey]\">\n <td *ngIf=\"allowSelection\" class=\"grid-component-selection\" pReorderableRowHandle>\n <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"></p-tableRadioButton>\n <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"></p-tableCheckbox>\n </td>\n\n <!-- first actions column -->\n <!-- <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class=\"setActionColumnWidth\">\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n\n <!-- Grid Rows Data Bindings Start -->\n <td *ngFor=\"let column of selectedColumns\" [ngSwitch]=\"column.type\" [style]=\"column.style\"\n [class]=\"column.style ? '' : 'w-static-col'\" [attr.data-column-field]=\"column?.field\"\n [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-overlay' : ''\" pReorderableRowHandle>\n <span [ngClass]=\"column.hoverData && !column.isTextarea ? 'td-wrapper' : ''\"\n (mouseenter)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? addDynamicPanelOverlayComponent(column.hoverData, overlayPanel, $event, row) : ''\"\n (mouseleave)=\"(column.hoverData && column.hoverData.component && !column.isTextarea) ? mouseLeaveEvent(overlayPanel) : ''\">\n <span class=\"td-content-wrapper\" [style]=\"column.style\">\n\n <!-- Boolean column on Grid -->\n <span *ngSwitchCase=\"'boolean'\">\n <td *ngIf=\"!editing && row[column.field + '_obj']?.show != false\">\n <p-checkbox [ngClass]=\"{'disabled-checkbox': column.disabled}\" [binary]=\"true\"\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (change)=\"onFocusOutEvent(column, row)\"\n [ngModel]=\"getCheckboxValue(row, column)\">\n </p-checkbox>\n </td>\n <td *ngIf=\"editing\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for edit checkBox -->\n <p-checkbox (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [ngModel]=\"getCheckboxValue(row, column)\"\n (change)=\"onFocusOutEvent(column, row)\"></p-checkbox>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ row[column.field] }}\n </ng-template>\n </p-cellEditor>\n </td>\n </span>\n\n <!-- link column on Grid -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'a,input'\" *ngSwitchCase=\"'link'\">\n <!-- link column for HyperLink Case -->\n <span *ngIf=\"column.allowSave === false\">\n <span *ngIf=\"column.target !== '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n <span *ngIf=\"column.target === '_self'\" [style]=\"column.style\"\n [attr.data-title-element]=\"column.hoverData ? null : 'a'\" class=\"custom-link\"\n [class]=\" allowDisabled(column,row) ? 'disabled-link' : ''\" pReorderableRowHandle>\n\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]='column.target' pReorderableRowHandle>\n <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </span>\n <!-- link column for Edit Case -->\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <span *ngIf=\"(column.editable === true ) && (column.editLink === true )\">\n <input *ngIf=\"!row.isNew\" pInputText\n [ngModel]=\"row[column.field + '_obj']?.displayField || row[column.field] || ''\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj'].displayField = $event : row[column.field] = $event\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\" type=\"text\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n <input pInputText *ngIf=\"row.isNew\" type=\"text\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[column.field + '_obj']?.displayField : row[column.field] = $event\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" (change)=\"onChangeEvent(column, row)\" />\n </span>\n <!-- <span *ngIf=\"column.editable === false|| column.editable === undefined\" >\n <a class=\"custom-link\" (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" [target]='column.target'\n [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\" [title]=\"column.header\"></i>\n <ng-template #noIcon>\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </ng-template>\n \n </a>\n </span> -->\n <span\n *ngIf=\"(column.editLink === false|| column.editLink === undefined)&&(column.editable === false|| column.editable === undefined)\">\n <a class=\"d-inline\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disabled-link' : ''\">\n <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [class]=\"column.icon\" [title]=\"column.header\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n\n </a>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [style]=\"column.style\" class=\"custom-link\"\n [class]=\"column.editable === false || allowDisabled(column,row) ? 'disabled-link' : ''\">\n <a class=\"d-inline\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target ? column.target : '_blank'\" pReorderableRowHandle>\n <i *ngIf=\"column.icon&& !row[column.field+'_obj']?.hideFieldValue; else noIcon\"\n [title]=\"column.header\" [class]=\"column.icon\"\n (click)=\"column?.onClick ? onClickEvent(column, row) : ''\"></i>\n <ng-template #noIcon>\n <span (click)=\"column?.onClick ? onClickEvent(column, row) : ''\">\n {{\n row[column.field+'_obj']?.hideFieldValue?'':\n setConditionBaseValue(row, column)\n }}\n </span>\n </ng-template>\n </a>\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n\n <!-- Iframe column on Grid -->\n <span *ngSwitchCase=\"'iframe'\">\n <span class=\"custom-link\" (click)=\"gridIFrame(column, row[column.field + '_obj']?.hyperlink, row)\" [title]=\"\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText\n ? column.displayText\n : row[column.field]\n\n \">\n <button class=\"custom-icon-btn\" *ngIf=\"column.icon; else noIcon\" [disabled]=\"column.disabled\">\n <i [class]=\"column.icon\" [title]=\"column.header\"></i>\n </button>\n <ng-template #noIcon>\n {{\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText ? column.displayText : row[column.field]\n }}\n </ng-template>\n </span>\n </span>\n\n <!-- dialog column on Grid -->\n <span *ngSwitchCase=\"'dialog'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span *ngIf=\"column?.filter?.type !== 'calendar' && !row?.hidegridbtn\">\n <span *ngIf=\"column.editable === true && !row[column.field+'_obj']?.hideFieldValue\"\n pReorderableRowHandle>\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\" readonly\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" pInputText\n (click)=\"selectLookupField(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" />\n\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"column.editable === false || column.editable === undefined\n \" class=\"custom-link\" [style]=\"column.style\" [class]=\"\n allowDisabled(column,row) ? 'disabled-link' : ''\n \" (click)=\"openGridDialog(column, row, $event)\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [title]=\"column.header\"></i>\n <ng-template #noIcon>{{ (!column.displayText && row.isNew ) ||\n row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row, column)\n }}</ng-template>\n </span>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && column.editable === true\"\n [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <p-datepicker\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\" [appendTo]=\"'body'\" hourFormat=\"12\"\n [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\" [timeOnly]=\"column.timeOnly\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ?\n row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\"></p-datepicker>\n </span>\n <span *ngIf=\"column?.filter?.type === 'calendar' && !column.editable\" class=\"custom-link\"\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\">{{ row[column.field+'_obj']?.hideFieldValue ? '' :\n setConditionBaseValue(row, column) }}\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"custom-link\" [style]=\"column.style\" pReorderableRowHandle\n [class]=\"row.disabled || allowDisabled(column,row) ? 'disabled-link' : ''\"\n (click)=\"openGridDialog(column, row, $event)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n <i *ngIf=\"(column.icon || row[column.field+'_obj']?.icon) && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\"\n [title]=\"column.hoverData ? '' : column.header\"\n [class]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"></i>\n <ng-template #noIcon>{{ row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row,\n column) }}</ng-template>\n <!-- {{ setConditionBaseValue(row, column) }}\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\" -->\n\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- test -->\n <!-- lookup Input column on Grid -->\n <span *ngSwitchCase=\"'lookup_input'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <div class=\"close-icon-wrapper\">\n <input [attr.data-title-element]=\"column.hoverData ? null : 'self'\"\n [readonly]=\"!isLookupInputEditable(column, row)\" type=\"text\" [ngModel]=\"lookupInputNgModel(row, column)\"\n (ngModelChange)=\"changeLookupInputNgModel(row, column, $event)\" [disabled]=\"allowDisabled(column,row)\"\n (click)=\"isLookupInputEditable(column, row) ? onClickEvent(column, row) : selectLookupField(column, row)\"\n (change)=\"onChangeEvent(column, row)\" (keydown.enter)=\"onLookupInputEnter($event, column, row)\"\n (paste)=\"onLookupInputPaste($event, column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n (blur)=\"onFocusOutEvent(column, row)\" [attr.autocomplete]=\"(column.autoComplete === false || autoComplete === false) ? 'off' : 'on'\" />\n <div *ngIf=\"!allowDisabled(column,row)\">\n <button\n *ngIf=\"isLookupInputEditable(column, row) && (row[column.field + '_obj']?.lookupControl?.component || column.lookupControl?.component)\"\n icon=\"pi pi-search\" pButton type=\"button\" (click)=\"selectLookupField(column, row)\"></button>\n <button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n ? row[column.field].text\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\"\n (click)=\"lookupClearValue(column,row)\"></button>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"column.linkId\">\n <a [attr.data-title-element]=\"column.hoverData ? null : 'self'\" [href]=\"row[column.field + '_obj']?.hyperlink\"\n [target]=\"column.target === '_self' ? '' : '_blank'\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </a>\n </span>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\" *ngIf=\"!column.linkId\" [style]=\"column.style\"\n [class]=\"column.lookupControl?.component && column.editLink === true ? 'custom-link' : ''\"\n (click)=\"openLookupHyperlink(column, row)\">\n {{\n setLookupReadOnlyValue(row, column)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Numeric Input column on Grid -->\n <span *ngSwitchCase=\"'numeric'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for Currency && Decimal && Percent -->\n <span [attr.data-title-element]=\"column.hoverData ? null : 'input'\" class=\"input-number\"\n pReorderableRowHandle>\n <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n row[column.field.toLowerCase()+'_obj']?.errorMessage\n ? 'ng-invalid ng-dirty'\n : 'form-control'\n \" [showButtons]=\"false\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField ? row[row[column.field + '_obj']?.displayField?.toLowerCase()] : row[column.field] = $event\"\n [name]=\"column.field\" [disabled]=\"allowDisabled(column,row)\" (onFocus)=\"onFocusEvent(column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\" autocomplete=\"off\" (keydown)=\"allowLeadingDot($event)\" [mode]=\"\n column.format &&\n column.format.type === 'currency'\n ? 'currency'\n : 'decimal'\n \" [currency]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.currency\n ? column.format.formatParams.currency\n : 'USD'\n \" [locale]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.locale\n ? column.format.formatParams.locale\n : 'en-US'\n \" [minFractionDigits]=\"column.format ? setNumericMinFraction(column) : '0'\"\n [maxFractionDigits]=\"column.format ? setNumericMaxFraction(column) : '0'\" [suffix]=\"\n column.format &&\n column.format.type === 'percent' && \n '%'\n \n \">\n </p-inputNumber>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\" pReorderableRowHandle>\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n setNumericFormat(column, row)\n }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Button column on Grid -->\n <span *ngSwitchCase=\"'add_button'\">\n <div>\n <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n class=\"grid-component-grid-add-btn\" (click)=\"onClickButton(column, row)\"></button>\n </div>\n </span>\n\n <!-- Generate File Button column on Grid -->\n <span *ngSwitchCase=\"'generate_file_button'\">\n <se-generate-import-file\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n [dialogData]=\"column.data\" [selectedRow]=\"row\"></se-generate-import-file>\n </span>\n\n <!-- Send email Button column on Grid -->\n <span *ngSwitchCase=\"'send_email_button'\">\n <se-email-generate-btn\n [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\" [column]=\"column\"\n [selectedRow]=\"row\"></se-email-generate-btn>\n </span>\n\n <!-- Date column on Grid -->\n <!-- calendar selector -->\n <span *ngSwitchCase=\"'date'\"\n [attr.data-title-element]=\"column.hoverData? null: editAllRows ? 'input' : 'self' \">\n <p-cellEditor>\n <ng-template pTemplate=\"input\" pReorderableRowHandle>\n <p-datepicker [minDate]=\"column.minDate\" [maxDate]=\"column.maxDate\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\" hourFormat=\"12\" [defaultDate]=\"defaultDate\"\n [stepMinute]=\"column.minutesInterval ? column.minutesInterval : 1\" [showTime]=\"column.showTime\"\n [timeOnly]=\"column.timeOnly\" [dateFormat]=\"column.format ? column.format.type : calendarFormat\"\n (keyup)=\"calendarInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n [ngModel]=\"row[column.field+'_obj']?.displayField ? row[column.field+'_obj']?.displayField : row[column.field]\"\n (ngModelChange)=\"onCalendarModelChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n [showButtonBar]=\"!column.timeOnly\"></p-datepicker>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed white-space-nowrap text-center border-readonly\">\n {{ setConditionBaseValue(row,column) }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n\n <span *ngSwitchDefault>\n <span [ngSwitch]=\"column.type\">\n <!-- Dropdown column on Grid -->\n <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\"\n [attr.data-title-element]=\" column.hoverData? null: editAllRows ? '.p-dropdown-label' : 'self'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-dropdown *ngIf=\"!row[column.field+'_obj']?.hidden\" [options]=\"\n row[column.field?.toLowerCase()+'_data']\n ? row[column.field?.toLowerCase()+'_data']\n : column.data\n \"\n [ngModel]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n (ngModelChange)=\"row[column.field + '_obj']?.displayField?.toLowerCase() ? row[row[column.field + '_obj']?.displayField.toLowerCase()] : row[column.field] = $event\"\n [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n ? row[column.displayField]\n : row[column.field] ? row[column.field] : 'Select'\"\n [showClear]=\"row[column.field] ? true : false\" [optionLabel]=\"column.optionLabel\"\n (click)=\"onClickEvent(column, row)\" [optionValue]=\"column.optionValue\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n (onChange)=\"onChangeEvent(column, row)\" [appendTo]=\"'body'\" [filter]=\"column.allowSearch\"\n filterMatchMode=\"startsWith\"></p-dropdown>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed border-readonly\">\n <ng-container *ngIf=\"!row[column.field+'_obj']?.hidden\">\n <a *ngIf=\"column.displayAsLink\" class=\"custom-link\"\n [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]='column.target'>\n {{ setDropdwonReadOnlyValue(row, column) }}\n </a>\n <span *ngIf=\"!column.displayAsLink\">\n {{ setDropdwonReadOnlyValue(row, column) }}\n </span>\n </ng-container>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- MultiSelect column on Grid -->\n <!-- [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n row[column.field]\" -->\n <span *ngSwitchCase=\"'multi-select'\"\n [attr.data-title-element]=\"column.hoverData ? null : '.p-multiselect-label'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-multiSelect\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\" [(ngModel)]=\"row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [options]=\"row[column.field.toLowerCase() + '_data'] ? row[column.field.toLowerCase() + '_data'] : column.data\"\n [optionLabel]=\"column.optionLabel\" [optionValue]=\"column.optionValue\"\n (onChange)=\"onChangeEvent(column, row)\" (onPanelShow)=\"showOption(column, row)\"\n (click)=\"onClickEvent(column, row)\" [appendTo]=\"'body'\" (blur)=\"onFocusOutEvent(column, row)\">\n </p-multiSelect>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{\n row[column.displayField]\n ? row[column.displayField] :\n setMultiSelectData(column, row[column.field])\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- AutoComplete Search -->\n <span *ngSwitchCase=\"'AutoComplete'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-autoComplete\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [name]=\"column.header\"\n [suggestions]=\"column.data\" (onSelect)=\"autoCompleteSelectedValue(row, column, $event)\"\n [field]=\"column.optionLabel ? column.optionLabel?.toLowerCase() : column.displayField ? column.displayField?.toLowerCase() : column.field?.toLowerCase()\"\n [ngModel]=\"getAutoCompleteNgModel(row, column)\"\n (ngModelChange)=\"changeAutoCompleteNgModel(row, column, $event)\" [dropdown]=\"column.showOption\"\n (ngModelChange)=\"onChangeEvent(column, row)\" (click)=\"onClickEvent(column, row)\"\n (completeMethod)=\"autoSearch($event, column, row)\" (onBlur)=\"onFocusOutEvent(column, row, $event)\"\n [disabled]=\"allowDisabled(column,row)\" [appendTo]=\"'body'\" [multiple]=\"true\"\n (keydown.enter)=\"onAutoCompleteKeyEnterEvent($event, column, row)\">\n </p-autoComplete>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n </span>\n </span>\n <span\n *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.field] && !column.displayField\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n value[column.field] : value[column.field] + ';' : value[column.field] }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n <!-- Add Generate Report Button -->\n <span *ngSwitchCase=\"'report'\">\n <p-cellEditor>\n <ng-template pTemplate=\"output\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [class]=\"column.class\" [showDialog]=\"column.showDialog\"\n [icon]=\"column.icon\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n <ng-template pTemplate=\"input\">\n <se-generate-report-btn [repInfo]=\"setReportName(column, row)\" [label]=\"column.label\"\n [params]=\"setReportParams(column, row)\" [icon]=\"column.icon\" [class]=\"column.class\"\n [showDialog]=\"column.showDialog\" [reportType]=\"column.reportType\"></se-generate-report-btn>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <span *ngSwitchDefault [attr.data-title-element]=\"column.hoverData ? null : 'input'\">\n <!-- Input column on Grid -->\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n\n <textarea *ngIf=\"column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]])\"\n [(ngModel)]=\"row[column.field]\" [attr.data-cell]=\"column.field + '-' + row[dataKey]\"\n class=\"prime-textarea\"\n style=\"resize: none; min-width: 200px; min-height: 40px; word-break: break-word; text-align: justify; overflow: hidden;\"\n [disabled]=\"allowDisabled(column,row)\" (blur)=\"onTextareaBlur(column, row)\"\n (keydown.enter)=\"onTextareaEnter($event, column, row)\" autofocus></textarea>\n\n <input\n *ngIf=\"!column.isTextarea && (editAllRows || editingRowKeys[row[dataKey]]) && column.field !== dataKey\"\n [type]=\"row[column.field+'_obj']?.textType?row[column.field+'_obj']?.textType:column.textType?column.textType:'text'\"\n [class]=\"row[column.field.toLowerCase()+'_obj']?.errorMessage ? 'ng-invalid ng-dirty' : 'prime-input'\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [ngModel]=\"setInputNgModel(row, column)\"\n (ngModelChange)=\"onInputChange($event, row, column)\" [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n (click)=\"onClickButton(column, row)\" />\n <span *ngIf=\"!(editAllRows || editingRowKeys[row[dataKey]])\">\n {{ row[column.field] }}\n </span>\n\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n (click)=\"changePasswordType(column, row)\" [title]=\"column.header\"></i>\n </span>\n </span>\n <ng-template #locked_field><span *ngIf=\"!row.isNew\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self'\">\n {{ row[column.field] }}\n </span></ng-template>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span class=\"text-layout-fixed\">\n <span [style]=\"column.style ? column.style : 'display:flex'\">\n <span (click)=\"onClickEvent(column, row)\"\n [attr.data-title-element]=\"column.hoverData ? null : 'self' \"\n [class]=\"row[column.field+'_obj']?.textType ?(row[column.field+'_obj']?.textType=='password' ?'password':'') :column.textType=='password'?'password':''\">\n {{ setTextBoxReadOnlyValue(row, column) }}\n </span>\n <span style=\"float:right\" *ngIf=\"column.format=='password'\">\n <i [class]=\"row[column.field+'_obj']?(row[column.field+'_obj'].textType=='password'?'pi pi-eye':'pi pi-eye-slash'):column.textType=='password'?'pi pi-eye':'pi pi-eye-slash'\"\n [title]=\"column.header\" (click)=\"changePasswordType(column, row)\"></i>\n </span>\n </span>\n </span>\n </ng-template>\n\n </p-cellEditor>\n </span>\n </span>\n </span>\n\n </span>\n </span>\n </td>\n <!-- Grid Rows Data Bindings End -->\n\n <!-- More actions column (ellipsis) -->\n <td *ngIf=\"hasMoreItems(row)\" class=\"for-more-actions\">\n <button pButton type=\"button\" icon=\"pi pi-ellipsis-v\" class=\"p-button-text\" (click)=\"showMore($event, row)\"\n aria-label=\"More actions\"></button>\n </td>\n\n <!-- Action column on Grid -->\n <!-- <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\n class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n </span>\n </td> -->\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" class=\"for-buttons\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <ng-container *ngFor=\"let action of columnActions\">\n <span class=\"action-btn\" *ngIf=\"action.visible ? action.visible(row) : true\">\n <i [title]=\"action.tooltip\" [class]=\"action.icon\"\n [class.action-btn-disabled]=\"action.disabled ? action.disabled(row) : false\"\n (click)=\"(action.disabled && action.disabled(row)) ? null : handleActionClick($event, action, row)\"></i>\n </span>\n </ng-container>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" class=\"for-buttons\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class='setActionColumnWidth'>\n <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\">\n </se-grid-row-actions>\n </span>\n </td>\n </tr>\n </ng-template>\n\n <!-- Footer columns on Grid -->\n <ng-template pTemplate=\"footer\">\n <tr *ngIf=\"aggregateFooter\">\n <td\n *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngFor=\"let outerColumn of selectedColumns\" class=\"grid-component-outer-column\" [style]=\"outerColumn.style\">\n <div *ngFor=\"let innerColumn of selectedColumns\">\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) ||\n aggr.displayField && aggr.displayField?.toLowerCase() === outerColumn.field?.toLowerCase())\">\n <div [innerHTML]=\"aggr.aggrValue\">\n </div>\n </div>\n </div>\n </div>\n </td>\n <td\n *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\"></td>\n </tr>\n </ng-template>\n\n <!-- Footer for Empty Message columns on Grid -->\n <ng-template pTemplate=\"emptymessage\">\n <tr class=\"grid-component no-records-found\">\n <td [attr.colspan]=\"selectedColumns?.length + 1\">{{totalRecords==0? 'No records found':''}}</td>\n </tr>\n </ng-template>\n </p-table>\n <p-overlayPanel [style]=\"overlayPanelStyle\" #overlayPanel>\n <ng-container #viewContainerRef></ng-container>\n </p-overlayPanel>\n <p-menu #moreMenu [popup]=\"true\" [model]=\"currentMoreMenu\" appendTo=\"body\" styleClass=\"grid-more-menu\"></p-menu>\n</div>\n", styles: [":host ::ng-deep .table-layout-auto table{table-layout:auto;width:max-content!important}:host ::ng-deep .prime-input{font-family:Roboto;font-size:12px;color:#484848;background:#fff;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none;border-radius:3px;border:none}:host ::ng-deep .prime-input:focus{outline:none;border-color:transparent;box-shadow:0 0 0 2px #0003}:host ::ng-deep .prime-textarea{font-family:Roboto;font-size:12px;color:#484848;background:#fff;border-radius:3px;border:1px solid #bdbdbd;width:100%;resize:both;min-height:40px;min-width:100px;transition:box-shadow .2s;box-sizing:border-box}:host ::ng-deep .prime-textarea:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 2px #1976d21a}:host ::ng-deep .td-wrapper{height:30px;display:flex;align-items:center;position:relative;z-index:99999}:host ::ng-deep html:not(:has(p-accordion)) .grid-container{padding:.5rem!important}:host ::ng-deep .grid-container{display:flex;flex-direction:column}:host ::ng-deep [data-title]{position:static}:host ::ng-deep [data-title]:not([input]):hover:before{position:absolute;content:attr(data-title);background-color:#fff;color:#000;border:.5px solid black;padding:.17em .5em;z-index:3;margin-top:18px;margin-left:18px}:host ::ng-deep .grid-component-main-table .p-datatable-resizable-table>.p-datatable-tbody>tr>td:has(span:hover){overflow:visible!important;position:relative;z-index:3}:host ::ng-deep .p-multiselect{max-width:100%}:host ::ng-deep .password{-webkit-text-security:disc}:host ::ng-deep .p-calendar .p-inputtext{width:100%}:host ::ng-deep .for-more-actions{width:48px;text-align:center;vertical-align:middle}:host ::ng-deep .for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.25rem}:host ::ng-deep .more-menu .more-menu-item{display:block;width:100%;text-align:left}:host ::ng-deep th.more-actions-th,:host ::ng-deep td.for-more-actions{position:-webkit-sticky;position:sticky;right:0;background:#fff;z-index:10}:host ::ng-deep .column-filter-clear-button{display:none}:host ::ng-deep .apply-filter-btn{float:unset!important}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .hide-table-filter .p-column-filter-menu-button,:host ::ng-deep .hide-table-filter .p-column-filter-clear-button{display:none!important}:host ::ng-deep .hide-filter-icon .column-filter-menu-button{display:none}.disabled-link,.disabled-link a,.disabled-link label,.disabled-link span,.disabled-link div,.disable-label-control,.disabled-link.custom-link,.disabled-link.custom-link a,.disabled-link.custom-link label,.disabled-link.custom-link span,.disabled-link.custom-link div,.disable-label-control.custom-link{pointer-events:none;color:#83baf8}.custom-link{color:#205dcf;font-size:12px}.custom-link:not(.disabled-link){cursor:pointer}.mr-2{margin-right:10px;display:block}.highlighted-row{background-color:#dee2e6!important}.hide-clear-filter-button{display:none!important}.grid-more-menu .p-menu-list{min-width:180px;max-width:260px;padding:.25rem 0}.grid-more-menu .p-menuitem-link{padding:.4rem .75rem;font-size:13px;color:#2d2d2d}.grid-more-menu .p-menuitem-link .p-menuitem-icon{margin-right:.6rem;font-size:14px;color:#5a5a5a}.grid-more-menu .p-menuitem-link:hover{background:#f5f7fa}.for-more-actions{width:48px;text-align:center;vertical-align:middle;padding:0}.for-more-actions .p-button{min-width:36px;height:36px;line-height:36px;padding:.15rem;border-radius:4px}html:not(:has(p-accordion)) .grid-container.col-8 button{float:none!important}.grid-container{padding:.5rem!important}:host ::ng-deep .p-datatable-resizable-table>.p-datatable-thead>tr>th{overflow:visible!important}:host ::ng-deep .p-multiselect .p-multiselect-trigger{top:6px}:host ::ng-deep button.custom-icon-btn{background:transparent!important;border:0!important;outline:none!important;padding:0!important}:host ::ng-deep button.custom-icon-btn:focus{outline:none}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight,:host ::ng-deep .p-datatable .p-sortable-column.p-highlight.sort-highlight .p-sortable-column-icon{color:#343434!important}:host ::ng-deep .center-content{display:flex;flex-direction:column}:host ::ng-deep .p-overlaypanel .p-overlaypanel-content{width:400px;height:300px;overflow-y:auto!important}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{z-index:11!important}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row{position:relative}:host ::ng-deep .p-datatable-hoverable-rows .p-datatable-tbody .p-selectable-row:hover{z-index:10!important}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row .td-wrapper{height:0px;display:flex!important;align-items:center;position:relative;z-index:9}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover .td-wrapper{height:30px}:host ::ng-deep .p-overlaypanel{z-index:999999!important}:host ::ng-deep .more-column-cell{display:flex;align-items:center;justify-content:center}:host ::ng-deep .more-ellipsis-btn{background:transparent!important;border:0!important;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .more-option{display:flex;align-items:center;width:100%;text-align:left;padding:6px 8px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{position:relative;padding:1px 5px!important;pointer-events:all}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row td.td-overlay:before{content:\"\";display:block;position:absolute;z-index:999999;background:#0000;inset:0}:host ::ng-deep .p-datatable-hoverable-rows .p-selectable-row:hover td.td-overlay:before{display:none;animation:mouse-in 1s ease-in-out}@keyframes mouse-in{0%{display:block}25%{display:none}to{display:none}}.disabled-checkbox{pointer-events:none;opacity:.6;background-color:#f5f5f5;color:#999}.action-btn-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}\n"] }]
|
|
14555
14603
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: SystemConfigService }, { type: i1$1.DialogService }, { type: FormService }, { type: GridService }, { type: AlertService }, { type: AuthenticationService }, { type: i0.ElementRef }, { type: i1$3.DecimalPipe }, { type: PageLoggerService }, { type: HyperlinkService }, { type: i0.ChangeDetectorRef }, { type: i6.Router }, { type: i1$3.DatePipe }, { type: i0.NgZone }, { type: i3.ConfirmationService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: RequestService }, { type: i0.ApplicationRef }, { type: i1$1.DynamicDialogConfig, decorators: [{
|
|
14556
14604
|
type: Optional
|
|
14557
14605
|
}] }, { type: i1$1.DynamicDialogRef, decorators: [{
|