@churchillliving/se-ui-toolkit 6.53.294 → 6.53.297

package/bundles/churchillliving-se-ui-toolkit.umd.js

@@ -2874,7 +2874,7 @@
               column.data = _this.setDataFields(response.records);
           });
       };
-      GridService.prototype.addAutoCompleteValue = function (uniqueKey, value, column) {
+      GridService.prototype.addAutoCompleteValue = function (uniqueKey, value, column, row) {
           var _a, _b;
           return __awaiter(this, void 0, void 0, function () {
               var newValue, i;
@@ -2886,7 +2886,7 @@
                           newValue[uniqueKey.values[i].name] = value;
                       }
                       else {
-                          newValue[uniqueKey.values[i].name] = uniqueKey.values[i].value;
+                          newValue[uniqueKey.values[i].name] = this.getSoftCodingValue(uniqueKey.values[i].value, row);
                       }
                   }
                   this.requestService
@@ -2902,6 +2902,19 @@
               });
           });
       };
+      GridService.prototype.getSoftCodingValue = function (value, row) {
+          var returnValue;
+          if (value.toString().includes('{') && value.toString().includes('}')) {
+              value = value.replace("{", "").replace("}", "");
+              var rowKeys = Object.keys(row);
+              var key = rowKeys === null || rowKeys === void 0 ? void 0 : rowKeys.find(function (x) { var _a; return (x === null || x === void 0 ? void 0 : x.toLowerCase()) === ((_a = value === null || value === void 0 ? void 0 : value.toString()) === null || _a === void 0 ? void 0 : _a.toLowerCase()); });
+              returnValue = row[key];
+          }
+          else {
+              returnValue = value;
+          }
+          return returnValue;
+      };
       // add simple dropdown grid column without
       GridService.prototype.addDropdownColumn = function (columnInfo, showFilter, dropDownProp) {
           if (showFilter === void 0) { showFilter = true; }
@@ -4167,8 +4180,8 @@
                               var _a, _b, _c, _d, _e;
                               // convert string that contains comma into arrays
                               if (row[column.field] &&
-                                  ((_a = row[column.field]) === null || _a === void 0 ? void 0 : _a.toString().includes(','))) {
-                                  row[column.field] = (_c = (_b = row[column.field]) === null || _b === void 0 ? void 0 : _b.toString().split(',')) === null || _c === void 0 ? void 0 : _c.map(function (value) {
+                                  ((_a = row[column.field]) === null || _a === void 0 ? void 0 : _a.toString().includes(';'))) {
+                                  row[column.field] = (_c = (_b = row[column.field]) === null || _b === void 0 ? void 0 : _b.toString().split(';')) === null || _c === void 0 ? void 0 : _c.map(function (value) {
                                       var _3;
                                       return (_3 = {}, _3[column.displayField.toLowerCase()] = value, _3);
                                   });
@@ -5514,24 +5527,45 @@
               var ref = this.openLookupDialog(obj_2);
               draggableDialog((column === null || column === void 0 ? void 0 : column.field) ? column === null || column === void 0 ? void 0 : column.field : column === null || column === void 0 ? void 0 : column.header);
               ref.onClose.subscribe(function (res) {
+                  var _a, _b, _c;
                   if (column.onReturn) {
                       column.onReturn(res, row);
                   }
                   if (res) {
                       var value = setDialogResponse(column, column.lookupControl, res);
+                      res = objConvertToLower(res);
+                      var valueField = (_c = (_b = (_a = column === null || column === void 0 ? void 0 : column.lookupControl) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.valueField) === null || _c === void 0 ? void 0 : _c.toLowerCase();
                       if (column.displayField) {
-                          row[column.field] = {
-                              text: res[column.displayField.toLowerCase()],
-                              value: res[column.field.toLowerCase()],
-                          };
+                          if (valueField) {
+                              row[column.field] = {
+                                  text: res[valueField],
+                                  value: res[valueField],
+                              };
+                          }
+                          else {
+                              row[column.field] = {
+                                  text: res[column.displayField.toLowerCase()],
+                                  value: res[column.field.toLowerCase()],
+                              };
+                          }
                           _this.lookupObject = row[column.field];
                       }
                       else if (value && value.value) {
                           value['field'] = column.field;
-                          row[column.field] = value.value;
+                          if (valueField) {
+                              row[column.field] = res[valueField];
+                          }
+                          else {
+                              row[column.field] = value.value;
+                          }
                       }
                       else {
-                          row[column.field] = res[column.field.toLowerCase()];
+                          if (valueField) {
+                              row[column.field] = res[valueField];
+                          }
+                          else {
+                              row[column.field] = res[column.field.toLowerCase()];
+                          }
                       }
                   }
                   if (row[column.field] !== obj_2.selection) {
@@ -5575,16 +5609,16 @@
           }
           this.calenderPreviousValue = '';
       };
-      GridComponent.prototype.onAutoCompleteFocusOut = function (e, column) {
+      GridComponent.prototype.onAutoCompleteFocusOut = function (e, column, row) {
           if (column.type == exports.EGridColumnType.AUTOCOMPLETE) {
               if (column.allowAutoCompleteSave && e.target.value && !column.data.length) {
                   ///check the correct format if data.contains cuz its an array of arrays with objects.
                   if (confirm("Do you want to add " + e.target.value + " to the selection?")) {
                       if (column.uniqueKey) {
                           var message = this.gridService
-                              .addAutoCompleteValue(column.uniqueKey, e.target.value, column)
+                              .addAutoCompleteValue(column.uniqueKey, e.target.value, column, row)
                               .then(function () {
-                              console.log('after save', message);
+                              //console.log('after save', message);
                               setTimeout(function () {
                                   if (column.onReturn) {
                                       column.onReturn(e.target.value, column);
@@ -6067,7 +6101,7 @@
   GridComponent.decorators = [
       { type: i0.Component, args: [{
                   selector: 'se-grid',
-                  template: "<p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n<p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"columnActions.length > 0\"\n  key=\"handlecolumnActions\"></p-confirmDialog>\n<div class=\"p-mb-2 p-d-flex p-ai-center\" *ngIf=\"\n    allowColumnToggle ||\n    rowActions.length > 0 ||\n    useInlineCRUD ||\n    allowExportToExcel ||\n    allowExportToPdf ||\n    clearGridFilter\n  \">\n  <!-- button for apply filterValue on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton type=\"button\" icon=\"pi pi-search\" (click)=\"applyGirdFilterBtn()\"\n    [class]=\"\n  searchGridFilter ? 'p-button-success p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n  \"></button>\n\n  <!-- button for clear filterValue on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n    icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n      clearGridFilter ? 'p-button-danger p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n    \"></button>\n\n  <!-- button for edit all grid at once -->\n  <!-- <button\n    pButton\n    *ngIf=\"hideEditAllRowsBtn && editAllRows\"\n    id=\"editBtnGlobalvalues\"\n    type=\"button\"\n    [label]=\"'Edit'\"\n    class=\"p-mr-2 ui-button-info\"\n    icon=\"pi pi-pencil\"\n    [class]=\"editRowPermission ? '' : 'p-disabled'\"\n    (click)=\"editAllRowsAtOnce()\"\n  ></button> -->\n\n  <!-- button for save all grid at once -->\n  <button pButton *ngIf=\"editAllRows && editRowPermission &&!hideGridSaveButton\" id=\"saveAllGridValues\"\n    icon=\"pi pi-check\" [label]=\"'Save'\"\n    [class]=\"hideGridSaveButton ? 'hide-clear-filter-button' : 'p-mr-2 ui-button-info'\" type=\"button\"\n    (click)=\"saveAllRowsAtOnce()\"></button>\n\n  <!-- button for cancel all grid at once -->\n  <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\" [label]=\"'Cancel'\"\n    icon=\"pi pi-times\" class=\"p-mr-2 ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n  <!-- header Button for multiSelect on Grid -->\n  <span *ngIf=\"allowColumnToggle\">\n    <p-multiSelect [showToggleAll]=\"false\" [options]=\"columns\" [(ngModel)]=\"selectedColumns\" optionLabel=\"header\"\n      selectedItemsLabel=\"{0} columns selected\" [style]=\"{ minWidth: '200px' }\" placeholder=\"Choose Columns\">\n    </p-multiSelect>\n  </span>\n\n  <!-- <button\n  pButton\n  *ngIf=\"showRefreshBtn\"\n  type=\"button\"\n  [label]=\"'Refresh'\"\n  icon=\"pi pi-refresh\"\n  (click)=\"refresh()\"\n  class=\"ui-button-info p-mr-2\"\n></button> -->\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\" [newRow]=\"newGridRow\" [id]=\"dataKey\" pTooltip=\"Add New Row\" tooltipPosition=\"bottom\"\n    icon=\"pi pi-plus\" class=\"ui-button-info p-mr-2 p-ml-2\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n  <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info p-mr-2 p-ml-2\">\n    <se-generate-report-btn [repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n      [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n  </div>\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 p-mt-0 p-mx-2\" 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 p-mr-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n</div>\n\n<p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n  [lazy]=\"useServerSideEvents\" [paginator]=\"pagination\" [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\n  [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\" [rowsPerPageOptions]=\"setPaginationLength\"\n  [showCurrentPageReport]=\"showCurrentPageReport\" currentPageReportTemplate=\"Showing {first} to {last} of {{\n    totalRecords\n  }} entries\" [loading]=\"autoLoadData && !setGridRefreshTime ? loading : false\"\n  (onSort)=\"sortDisabled ?? handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n  (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\" (onPage)=\"handleServerSidePagination($event)\" #dt\n  [dataKey]=\"dataKey\" [(selection)]=\"selectedRows\" [scrollable]=\"scrollable\" [scrollHeight]=\"scrollHeight\"\n  editMode=\"row\" [editingRowKeys]=\"editingRowKeys\" [autoLayout]=\"true\" [rowHover]=\"rowHover\"\n  [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\">\n  <!-- header Button for Action on Grid -->\n  <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"p-d-flex p-jc-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 *ngIf=\"allowSelection && selectionType === 'multiple'\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n        <div style=\"display: flex;align-items: center;margin: 0 auto;\">\n          <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n          <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n            (click)=\"multiCheckBoxOnclick(rowsData, $event)\"></p-tableHeaderCheckbox>\n        </div>\n      </th>\n      <th *ngIf=\"allowSelection && selectionType === 'single'\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n        Select\n      </th>\n      <th\n        *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n        Actions\n      </th>\n      <th *ngFor=\"let column of cols\" [pSortableColumn]=\"column.field\"\n        [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n        [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n        [style]=\"column?.type === 'multiple' ? 'justify-content: center' : column.style\">\n        <div style=\"display: flex;align-items: center;white-space: nowrap;\">\n          <span [class]=\"'flex-grow-1'\">{{ column.header }}</span>\n          <span *ngIf=\"column.isRequired\">*</span>\n          <p-sortIcon *ngIf=\"column.sorting !== false && column?.type !== 'multiple'\"\n            [field]=\"column.field\"></p-sortIcon>\n        </div>\n      </th>\n      <th\n        *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\n    </tr>\n    <tr *ngIf=\"filtering && !hideFilter\">\n      <th *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n      <th *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n      </th>\n      <th *ngFor=\"let column of cols\" [ngSwitch]=\"column?.filter?.type\" [style]=\"column.style\"\n        [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\">\n        <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n          <!-- Text input on Header For Filter-->\n          <p-columnFilter [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <input type=\"text\" [(ngModel)]=\"column.value\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\" pInputText />\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Numeric input on Header For Filter-->\n          <p-columnFilter [type]=\"'numeric'\" [field]=\"column.field\" *ngSwitchCase=\"'numeric_input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-inputNumber [(ngModel)]=\"column.value\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onBlur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\"></p-inputNumber>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- lookup input on Header For Filter-->\n          <p-columnFilter [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'lookup_input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <div class=\"close-icon-wrapper\">\n                <input id=\"lookUp_filter\" autocomplete=\"off\" type=\"text\" [(ngModel)]=\"column.value\"\n                  (click)=\"setFilterLookup(column)\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                  (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                  (keyup)=\"removingFilters($event, column)\" pInputText />\n                <div><button *ngIf=\"column.value\" icon=\"pi pi-times\" pButton type=\"button\"\n                    (click)=\"lookupClearValue(column)\"></button></div>\n              </div>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- checkbox on Header For Filter-->\n          <p-columnFilter 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.value\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onChange)=\"setFilterFocusOut(column, filter, $event)\" (click)=\"clickCheckBoxFilter(column)\"\n                (keydown)=\"backspaceEvent($event, column)\">\n              </p-checkbox>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- multiSelect on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'multi-select'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-multiSelect [ngModel]=\"value\" [options]=\"column.filter.data || []\" (onChange)=\"filter($event.value)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                placeholder=\"Any\" optionLabel=\"label\">\n              </p-multiSelect>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- dropdown on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *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.value\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n                [options]=\"column.filter.data || []\"\n                (onChange)=\"searchDropdownFilter(filter, $event, column)\"></p-dropdown>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- calendar on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'calendar'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-calendar [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.value\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\" appendTo=\"body\" (onSelect)=\"selectDate(column)\"\n                [inputId]=\"column.field\" hourFormat=\"12\" (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\n                [showButtonBar]=\"true\" (onClose)=\"setFilterFocusOut(column, filter, $event)\"\n                (keydown)=\"backspaceEvent($event, column)\" (onClearClick)=\"backspaceEvent($event, column)\">\n              </p-calendar>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Default Filter For Header  -->\n          <p-columnFilter [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\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 [ngClass]=\"row?.highlightrow ? 'highlighted-row' : ''\"\n      [class]=\"wordWrap ? 'p-selectable-row' : 'noWrap p-selectable-row'\" (click)=\"!editing && handleRowClick(row)\"\n      [pEditableRow]=\"row\" #gridRow [id]=\"row[dataKey]\">\n      <td *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n        <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"\n          (click)=\"multiCheckBoxOnclick(row , $event, true)\"></p-tableRadioButton>\n        <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"\n          (click)=\"multiCheckBoxOnclick(row, $event)\"></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 && 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\n        <!-- Boolean column on Grid -->\n        <span *ngSwitchCase=\"'boolean'\">\n      <td *ngIf=\"!editing\">\n        <p-checkbox [disabled]=\"!column.allowEdit ?? true\" [binary]=\"true\" (click)=\"onClickEvent(column, row)\"\n          (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (blur)=\"onFocusOutEvent(column, row)\" [(ngModel)]=\"\n            row[column.field] &&\n            (row[column.field].toString() === '1' ||\n            row[column.field].toString().toLowerCase() === 'true' ||\n            row[column.field].toString().toLowerCase() === 'y')\n                ? Checked\n                : unChecked\n               \">\n        </p-checkbox>\n      </td>\n      <td *ngIf=\"editing\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <!-- for edit checkBox -->\n            <p-checkbox (click)=\"onClickEvent(column, row)\" (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n              [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [(ngModel)]=\"\n                  row[column.field] &&\n                  (row[column.field].toString() === '1' ||\n                    row[column.field].toString().toLowerCase() === 'true' ||\n                    row[column.field].toString().toLowerCase() === 'y')\n                    ? editModeChecked\n                    : editModeunCkecked\n                \" (blur)=\"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 *ngSwitchCase=\"'link'\">\n        <!-- link column for HyperLink Case -->\n        <span *ngIf=\"column.allowSave === false\">\n          <span *ngIf=\"column.target !== '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\"\n            [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n            <a [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\n              {{\n              setConditionBaseValue(row, column)\n              }}\n            </a>\n          </span>\n          <span *ngIf=\"column.target === '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\"\n            [class]=\"column.editable === false ? '' :  allowDisabled(column,row) ? 'disable-link' : ''\">\n            <a [href]=\"row[column.field + '_obj']?.hyperlink\">\n              {{\n              setConditionBaseValue(row, column)\n              }}\n            </a>\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\">\n              <span\n                *ngIf=\"(column.editable === true || column.editable === undefined) && (column.editLink === true || column.editLink === undefined)\">\n                <input *ngIf=\"!row.isNew\" pInputText (click)=\"onClickEvent(column, row)\" type=\"text\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n                <input pInputText *ngIf=\"row.isNew\" type=\"text\" (click)=\"onClickEvent(column, row)\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n              </span>\n              <span *ngIf=\"column.editable === false\"\n                [class]=\"allowDisabled(column,row) ? 'disable-link' : 'hyperlink'\">\n                {{\n                setConditionBaseValue(row, column)\n                }}\n              </span>\n              <span *ngIf=\"column.editLink === false\">\n                <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n                  [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n                  {{\n                  setConditionBaseValue(row, column)\n                  }}\n                </a>\n              </span>\n            </ng-template>\n            <ng-template pTemplate=\"output\">\n              <span>\n                <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n                  [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n                  {{\n                  setConditionBaseValue(row, column)\n                  }}\n                </a>\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          >  \n          <i *ngIf=\"column.icon; else noIcon\"[class]=\"column.icon\"></i>\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\n                *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\" \n                [title]=\"setConditionBaseValue(row, column) \"\n              >\n                <span *ngIf=\"column.editable === true\">\n                  <input\n                  readonly\n                    [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                    [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                    type=\"text\"\n                    pInputText\n                    (click)=\"selectLookupField(column, row)\"\n                    [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n                    [name]=\"row[column.field]\"\n                    [disabled]=\"allowDisabled(column,row)\"\n                    (blur)=\"onFocusOutEvent(column, row)\"\n                  />\n                </span>\n                <span\n                  *ngIf=\"column.editable === false || column.editable === undefined\n                  \" [class]=\"\n                  allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\n                  \" (click)=\"openGridDialog(column, row)\">\n\n                <i *ngIf=\"column.icon; else noIcon\" [class]=\"column.icon\"></i>\n                <ng-template #noIcon>{{ !column.displayText && row.isNew ? '' : setConditionBaseValue(row, column)\n                  }}</ng-template>\n\n\n              </span>\n            </span>\n\n            <span *ngIf=\"row[column.field + '_secondType'] === 'date'\" [title]=\"\n                  row[column.field]\n                    | date: (column.format ? column.format : 'MM/dd/YY')\n                \">\n              <p-calendar [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n                [appendTo]=\"'body'\" hourFormat=\"12\" [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\"\n                [timeOnly]=\"column.timeOnly\"\n                [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n                [disabled]=\"allowDisabled(column,row)\"></p-calendar>\n            </span>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span\n              [class]=\"row.disabled == false ? 'custom-link' : column.editable === false ? 'custom-link' : allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\"\n              (click)=\"openGridDialog(column, row)\" *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\n              [title]=\"setConditionBaseValue(row, column)\">\n              <i *ngIf=\"column.icon; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>{{ setConditionBaseValue(row, column) }}</ng-template>\n\n              <!-- {{ setConditionBaseValue(row, column) }} -->\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\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 readonly type=\"text\" pInputText\n                [(ngModel)]=\"(column.disabled || column.editable === false) && column.displayField ? row[column.displayField] : typeOf(row[column.field]) === 'object' ?\n                row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [name]=\"row[column.field]\"\n                (keyup.tab)=\"selectLookupField(column, row)\" [disabled]=\"allowDisabled(column,row)\"\n                (click)=\"selectLookupField(column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\" (blur)=\"onFocusOutEvent(column, row)\" />\n              <div *ngIf=\"!allowDisabled(column,row)\"><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></div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span *ngIf=\"column.linkId\">\n              <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' :  '_blank'\">\n                {{\n                typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text :\n                row[column.displayField]\n                ? row[column.displayField]\n                : row[column.field]\n                }}\n              </a>\n            </span>\n            <span *ngIf=\"!column.linkId\" [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\n              (click)=\"openLookupHyperlink(column, row)\">\n              {{\n              typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text :\n              row[column.displayField]\n              ? row[column.displayField]\n              : row[column.field]\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 class=\"input-number\">\n              <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n                    column.errorMessage\n                      ? 'ng-invalid ng-dirty'\n                      : 'form-control'\n                  \" [showButtons]=\"!column.format ? true : false\"\n                [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [name]=\"column.field\"\n                [disabled]=\"allowDisabled(column,row)\" (ngModelChange)=\"onChangeEvent(column, row)\"\n                (onBlur)=\"onFocusOutEvent(column, row)\" [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 ? setNumericMinMxFraction(column) : '0'\"\n                [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(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\" [title]=\"row[column.field]\">\n                {{ row[column.field] }}\n              </span></ng-template>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span [title]=\"setNumericFormat(column, row)\">\n              {{\n              setNumericFormat(column, row)\n              }}\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- Button column on Grid -->\n      <span>\n        <div *ngSwitchCase=\"'add_button'\">\n          <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n            [icon]=\"row[column.field]?.action?.icon ? row[column.field]?.action?.icon : column.icon\"\n            [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n            [label]=\"row[column.field]?.action?.displayText ? row[column.field]?.action?.displayText : column.value\"\n            [ngStyle]=\"{\n              background: column.color ? column.color : ''\n            }\" (click)=\"onClickButton(column, row)\"></button>\n        </div>\n      </span>\n\n      <!-- Date column on Grid -->\n      <span *ngSwitchCase=\"'date'\" [title]=\"setConditionBaseValue(row,column)\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <p-calendar\n              [class]=\"column.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)=\"calenderInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n              [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n              [showButtonBar]=\"!column.timeOnly\"></p-calendar>\n            <!-- [todayButtonStyleClass]=\"column.timeOnly ? 'hide-today-btn' : 'show-today-btn'\" -->\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            {{ setConditionBaseValue(row,column) }}\n          </ng-template>\n        </p-cellEditor>\n      </span>\n      <span *ngSwitchDefault>\n        <span [ngSwitch]=\"column.type\">\n          <!-- Dropdown column on Grid -->\n          <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\" [title]=\"\n              setDropdwonReadOnlyValue(row, column)\n              \">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-dropdown *ngIf=\"!row[column.field]?.action?.hidden\" [options]=\"\n                      row[column.field+'_data']\n                        ? row[column.field+'_data']\n                        : column.data\n                    \"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n                  [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n                    ? row[column.displayField]\n                    : row[column.field] ? row[column.field] : 'Select'\" [showClear]=\"row[column.field] ? true : false\"\n                  [optionLabel]=\"column.optionLabel\" (click)=\"onClickEvent(column, row)\"\n                  [optionValue]=\"column.optionValue\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (onChange)=\"onChangeEvent(column, row)\" [filter]=\"column.allowSearch\"></p-dropdown>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span *ngIf=\"!row[column.field]?.action?.hidden\">\n                  {{\n                  setDropdwonReadOnlyValue(row, column)\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <!-- MultiSelect column on Grid -->\n          <span *ngSwitchCase=\"'multi-select'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-multiSelect [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n                  [options]=\"column.data\" [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 [title]=\"\n                      row[column.displayField]\n                        ? row[column.displayField]\n                        : setMultiSelectData(column, row[column.field])\n                    \">\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 [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [name]=\"column.header\"\n                  [suggestions]=\"column.data\" [field]=\"column.displayField\"\n                  [(ngModel)]=\"row[column.field]?.action && row[column.field]?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field]?.action?.displayField.toLowerCase()] : typeOf(row[column.field]) === 'object' && row[column.field]?.text ? row[column.field]?.text : row[column.field]\"\n                  [dropdown]=\"column.showOption\" (onChange)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickEvent(column, row)\" (completeMethod)=\"autoSearch($event, column, row)\"\n                  (onBlur)=\"onFocusOutEvent(column, row)\" [disabled]=\"allowDisabled(column,row)\" [multiple]=\"true\"\n                  (keydown.enter)=\"onAutoCompleteFocusOut($event, column)\">\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                    {{ column.displayField ? row[column.displayField?.toLowerCase()] : 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              </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 [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n              <ng-template pTemplate=\"input\">\n                <se-generate-report-btn [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <span *ngSwitchDefault>\n            <!-- Input column on Grid -->\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <input pInputText type=\"text\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                  [(ngModel)]=\"row.undefined ? '' : allowDisabled(column,row) && row[column.displayField] ? row[column.displayField] : typeOf(row[column.field]) === 'object' && (row[column.field]?.action || row[column.field]?.text) ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                     row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n                  (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickButton(column, row)\" *ngIf=\"column.field !== dataKey; else locked_field\" />\n                <ng-template #locked_field><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n                    {{ row[column.field] }}\n                  </span></ng-template>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span (click)=\"onClickEvent(column, row)\" [title]=\"\n                    column.displayText ? column.displayText : \n                      row[column.displayField]\n                        ? row[column.displayField]\n                        : row[column.field]\n                    \">\n                  {{\n                  row[column.field]?.action ? row[column.field]?.text : column.displayText ? column.displayText :\n                  row[column.displayField]\n                  ? row[column.displayField]\n                  : row[column.field]\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n        </span>\n      </span>\n      </td>\n      <!-- Grid Rows Data Bindings End -->\n\n      <!-- Action column on Grid -->\n      <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\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\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' : ''\">\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 *ngFor=\"let outerColumn of selectedColumns\" [style]=\"outerColumn.style\">\n        <div *ngFor=\"let innerColumn of selectedColumns\">\n          <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n            <div\n              *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) || 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>\n      <td [attr.colspan]=\"selectedColumns?.length + 1\">No records found.</td>\n    </tr>\n  </ng-template>\n</p-table>",
+                  template: "<p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n<p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"columnActions.length > 0\"\n  key=\"handlecolumnActions\"></p-confirmDialog>\n<div class=\"p-mb-2 p-d-flex p-ai-center\" *ngIf=\"\n    allowColumnToggle ||\n    rowActions.length > 0 ||\n    useInlineCRUD ||\n    allowExportToExcel ||\n    allowExportToPdf ||\n    clearGridFilter\n  \">\n  <!-- button for apply filterValue on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton type=\"button\" icon=\"pi pi-search\" (click)=\"applyGirdFilterBtn()\"\n    [class]=\"\n  searchGridFilter ? 'p-button-success p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n  \"></button>\n\n  <!-- button for clear filterValue on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n    icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n      clearGridFilter ? 'p-button-danger p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n    \"></button>\n\n  <!-- button for edit all grid at once -->\n  <!-- <button\n    pButton\n    *ngIf=\"hideEditAllRowsBtn && editAllRows\"\n    id=\"editBtnGlobalvalues\"\n    type=\"button\"\n    [label]=\"'Edit'\"\n    class=\"p-mr-2 ui-button-info\"\n    icon=\"pi pi-pencil\"\n    [class]=\"editRowPermission ? '' : 'p-disabled'\"\n    (click)=\"editAllRowsAtOnce()\"\n  ></button> -->\n\n  <!-- button for save all grid at once -->\n  <button pButton *ngIf=\"editAllRows && editRowPermission &&!hideGridSaveButton\" id=\"saveAllGridValues\"\n    icon=\"pi pi-check\" [label]=\"'Save'\"\n    [class]=\"hideGridSaveButton ? 'hide-clear-filter-button' : 'p-mr-2 ui-button-info'\" type=\"button\"\n    (click)=\"saveAllRowsAtOnce()\"></button>\n\n  <!-- button for cancel all grid at once -->\n  <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\" [label]=\"'Cancel'\"\n    icon=\"pi pi-times\" class=\"p-mr-2 ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n  <!-- header Button for multiSelect on Grid -->\n  <span *ngIf=\"allowColumnToggle\">\n    <p-multiSelect [showToggleAll]=\"false\" [options]=\"columns\" [(ngModel)]=\"selectedColumns\" optionLabel=\"header\"\n      selectedItemsLabel=\"{0} columns selected\" [style]=\"{ minWidth: '200px' }\" placeholder=\"Choose Columns\">\n    </p-multiSelect>\n  </span>\n\n  <!-- <button\n  pButton\n  *ngIf=\"showRefreshBtn\"\n  type=\"button\"\n  [label]=\"'Refresh'\"\n  icon=\"pi pi-refresh\"\n  (click)=\"refresh()\"\n  class=\"ui-button-info p-mr-2\"\n></button> -->\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\" [newRow]=\"newGridRow\" [id]=\"dataKey\" pTooltip=\"Add New Row\" tooltipPosition=\"bottom\"\n    icon=\"pi pi-plus\" class=\"ui-button-info p-mr-2 p-ml-2\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n  <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info p-mr-2 p-ml-2\">\n    <se-generate-report-btn [repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n      [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n  </div>\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 p-mt-0 p-mx-2\" 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 p-mr-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n</div>\n\n<p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n  [lazy]=\"useServerSideEvents\" [paginator]=\"pagination\" [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\n  [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\" [rowsPerPageOptions]=\"setPaginationLength\"\n  [showCurrentPageReport]=\"showCurrentPageReport\" currentPageReportTemplate=\"Showing {first} to {last} of {{\n    totalRecords\n  }} entries\" [loading]=\"autoLoadData && !setGridRefreshTime ? loading : false\"\n  (onSort)=\"sortDisabled ?? handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n  (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\" (onPage)=\"handleServerSidePagination($event)\" #dt\n  [dataKey]=\"dataKey\" [(selection)]=\"selectedRows\" [scrollable]=\"scrollable\" [scrollHeight]=\"scrollHeight\"\n  editMode=\"row\" [editingRowKeys]=\"editingRowKeys\" [autoLayout]=\"true\" [rowHover]=\"rowHover\"\n  [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\">\n  <!-- header Button for Action on Grid -->\n  <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"p-d-flex p-jc-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 *ngIf=\"allowSelection && selectionType === 'multiple'\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n        <div style=\"display: flex;align-items: center;margin: 0 auto;\">\n          <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n          <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n            (click)=\"multiCheckBoxOnclick(rowsData, $event)\"></p-tableHeaderCheckbox>\n        </div>\n      </th>\n      <th *ngIf=\"allowSelection && selectionType === 'single'\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n        Select\n      </th>\n      <th\n        *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n        Actions\n      </th>\n      <th *ngFor=\"let column of cols\" [pSortableColumn]=\"column.field\"\n        [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n        [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n        [style]=\"column?.type === 'multiple' ? 'justify-content: center' : column.style\">\n        <div style=\"display: flex;align-items: center;white-space: nowrap;\">\n          <span [class]=\"'flex-grow-1'\">{{ column.header }}</span>\n          <span *ngIf=\"column.isRequired\">*</span>\n          <p-sortIcon *ngIf=\"column.sorting !== false && column?.type !== 'multiple'\"\n            [field]=\"column.field\"></p-sortIcon>\n        </div>\n      </th>\n      <th\n        *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\n    </tr>\n    <tr *ngIf=\"filtering && !hideFilter\">\n      <th *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n      <th *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n      </th>\n      <th *ngFor=\"let column of cols\" [ngSwitch]=\"column?.filter?.type\" [style]=\"column.style\"\n        [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\">\n        <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n          <!-- Text input on Header For Filter-->\n          <p-columnFilter [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <input type=\"text\" [(ngModel)]=\"column.value\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\" pInputText />\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Numeric input on Header For Filter-->\n          <p-columnFilter [type]=\"'numeric'\" [field]=\"column.field\" *ngSwitchCase=\"'numeric_input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-inputNumber [(ngModel)]=\"column.value\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onBlur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\"></p-inputNumber>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- lookup input on Header For Filter-->\n          <p-columnFilter [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'lookup_input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <div class=\"close-icon-wrapper\">\n                <input id=\"lookUp_filter\" autocomplete=\"off\" type=\"text\" [(ngModel)]=\"column.value\"\n                  (click)=\"setFilterLookup(column)\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                  (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                  (keyup)=\"removingFilters($event, column)\" pInputText />\n                <div><button *ngIf=\"column.value\" icon=\"pi pi-times\" pButton type=\"button\"\n                    (click)=\"lookupClearValue(column)\"></button></div>\n              </div>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- checkbox on Header For Filter-->\n          <p-columnFilter 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.value\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onChange)=\"setFilterFocusOut(column, filter, $event)\" (click)=\"clickCheckBoxFilter(column)\"\n                (keydown)=\"backspaceEvent($event, column)\">\n              </p-checkbox>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- multiSelect on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'multi-select'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-multiSelect [ngModel]=\"value\" [options]=\"column.filter.data || []\" (onChange)=\"filter($event.value)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                placeholder=\"Any\" optionLabel=\"label\">\n              </p-multiSelect>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- dropdown on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *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.value\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n                [options]=\"column.filter.data || []\"\n                (onChange)=\"searchDropdownFilter(filter, $event, column)\"></p-dropdown>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- calendar on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'calendar'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-calendar [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.value\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\" appendTo=\"body\" (onSelect)=\"selectDate(column)\"\n                [inputId]=\"column.field\" hourFormat=\"12\" (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\n                [showButtonBar]=\"true\" (onClose)=\"setFilterFocusOut(column, filter, $event)\"\n                (keydown)=\"backspaceEvent($event, column)\" (onClearClick)=\"backspaceEvent($event, column)\">\n              </p-calendar>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Default Filter For Header  -->\n          <p-columnFilter [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\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 [ngClass]=\"row?.highlightrow ? 'highlighted-row' : ''\"\n      [class]=\"wordWrap ? 'p-selectable-row' : 'noWrap p-selectable-row'\" (click)=\"!editing && handleRowClick(row)\"\n      [pEditableRow]=\"row\" #gridRow [id]=\"row[dataKey]\">\n      <td *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n        <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"\n          (click)=\"multiCheckBoxOnclick(row , $event, true)\"></p-tableRadioButton>\n        <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"\n          (click)=\"multiCheckBoxOnclick(row, $event)\"></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 && 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\n        <!-- Boolean column on Grid -->\n        <span *ngSwitchCase=\"'boolean'\">\n      <td *ngIf=\"!editing\">\n        <p-checkbox [disabled]=\"!column.allowEdit ?? true\" [binary]=\"true\" (click)=\"onClickEvent(column, row)\"\n          (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (blur)=\"onFocusOutEvent(column, row)\" [(ngModel)]=\"\n            row[column.field] &&\n            (row[column.field].toString() === '1' ||\n            row[column.field].toString().toLowerCase() === 'true' ||\n            row[column.field].toString().toLowerCase() === 'y')\n                ? Checked\n                : unChecked\n               \">\n        </p-checkbox>\n      </td>\n      <td *ngIf=\"editing\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <!-- for edit checkBox -->\n            <p-checkbox (click)=\"onClickEvent(column, row)\" (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n              [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [(ngModel)]=\"\n                  row[column.field] &&\n                  (row[column.field].toString() === '1' ||\n                    row[column.field].toString().toLowerCase() === 'true' ||\n                    row[column.field].toString().toLowerCase() === 'y')\n                    ? editModeChecked\n                    : editModeunCkecked\n                \" (blur)=\"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 *ngSwitchCase=\"'link'\">\n        <!-- link column for HyperLink Case -->\n        <span *ngIf=\"column.allowSave === false\">\n          <span *ngIf=\"column.target !== '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\"\n            [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n            <a [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\n              {{\n              setConditionBaseValue(row, column)\n              }}\n            </a>\n          </span>\n          <span *ngIf=\"column.target === '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\"\n            [class]=\"column.editable === false ? '' :  allowDisabled(column,row) ? 'disable-link' : ''\">\n            <a [href]=\"row[column.field + '_obj']?.hyperlink\">\n              {{\n              setConditionBaseValue(row, column)\n              }}\n            </a>\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\">\n              <span\n                *ngIf=\"(column.editable === true || column.editable === undefined) && (column.editLink === true || column.editLink === undefined)\">\n                <input *ngIf=\"!row.isNew\" pInputText (click)=\"onClickEvent(column, row)\" type=\"text\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n                <input pInputText *ngIf=\"row.isNew\" type=\"text\" (click)=\"onClickEvent(column, row)\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n              </span>\n              <span *ngIf=\"column.editable === false\"\n                [class]=\"allowDisabled(column,row) ? 'disable-link' : 'hyperlink'\">\n                {{\n                setConditionBaseValue(row, column)\n                }}\n              </span>\n              <span *ngIf=\"column.editLink === false\">\n                <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n                  [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n                  {{\n                  setConditionBaseValue(row, column)\n                  }}\n                </a>\n              </span>\n            </ng-template>\n            <ng-template pTemplate=\"output\">\n              <span>\n                <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n                  [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n                  {{\n                  setConditionBaseValue(row, column)\n                  }}\n                </a>\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          >  \n          <i *ngIf=\"column.icon; else noIcon\"[class]=\"column.icon\"></i>\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\n                *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\" \n                [title]=\"setConditionBaseValue(row, column) \"\n              >\n                <span *ngIf=\"column.editable === true\">\n                  <input\n                  readonly\n                    [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                    [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                    type=\"text\"\n                    pInputText\n                    (click)=\"selectLookupField(column, row)\"\n                    [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n                    [name]=\"row[column.field]\"\n                    [disabled]=\"allowDisabled(column,row)\"\n                    (blur)=\"onFocusOutEvent(column, row)\"\n                  />\n                </span>\n                <span\n                  *ngIf=\"column.editable === false || column.editable === undefined\n                  \" [class]=\"\n                  allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\n                  \" (click)=\"openGridDialog(column, row)\">\n\n                <i *ngIf=\"column.icon; else noIcon\" [class]=\"column.icon\"></i>\n                <ng-template #noIcon>{{ !column.displayText && row.isNew ? '' : setConditionBaseValue(row, column)\n                  }}</ng-template>\n\n\n              </span>\n            </span>\n\n            <span *ngIf=\"row[column.field + '_secondType'] === 'date'\" [title]=\"\n                  row[column.field]\n                    | date: (column.format ? column.format : 'MM/dd/YY')\n                \">\n              <p-calendar [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n                [appendTo]=\"'body'\" hourFormat=\"12\" [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\"\n                [timeOnly]=\"column.timeOnly\"\n                [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n                [disabled]=\"allowDisabled(column,row)\"></p-calendar>\n            </span>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span\n              [class]=\"row.disabled == false ? 'custom-link' : column.editable === false ? 'custom-link' : allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\"\n              (click)=\"openGridDialog(column, row)\" *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\n              [title]=\"setConditionBaseValue(row, column)\">\n              <i *ngIf=\"column.icon; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>{{ setConditionBaseValue(row, column) }}</ng-template>\n\n              <!-- {{ setConditionBaseValue(row, column) }} -->\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\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 readonly type=\"text\" pInputText\n                [(ngModel)]=\"(column.disabled || column.editable === false) && column.displayField ? row[column.displayField] : typeOf(row[column.field]) === 'object' ?\n                row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [name]=\"row[column.field]\"\n                (keyup.tab)=\"selectLookupField(column, row)\" [disabled]=\"allowDisabled(column,row)\"\n                (click)=\"selectLookupField(column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\" (blur)=\"onFocusOutEvent(column, row)\" />\n              <div *ngIf=\"!allowDisabled(column,row)\"><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></div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span *ngIf=\"column.linkId\">\n              <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' :  '_blank'\">\n                {{\n                typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text :\n                row[column.displayField]\n                ? row[column.displayField]\n                : row[column.field]\n                }}\n              </a>\n            </span>\n            <span *ngIf=\"!column.linkId\" [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\n              (click)=\"openLookupHyperlink(column, row)\">\n              {{\n              typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text :\n              row[column.displayField]\n              ? row[column.displayField]\n              : row[column.field]\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 class=\"input-number\">\n              <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n                    column.errorMessage\n                      ? 'ng-invalid ng-dirty'\n                      : 'form-control'\n                  \" [showButtons]=\"!column.format ? true : false\"\n                [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [name]=\"column.field\"\n                [disabled]=\"allowDisabled(column,row)\" (ngModelChange)=\"onChangeEvent(column, row)\"\n                (onBlur)=\"onFocusOutEvent(column, row)\" [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 ? setNumericMinMxFraction(column) : '0'\"\n                [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(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\" [title]=\"row[column.field]\">\n                {{ row[column.field] }}\n              </span></ng-template>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span [title]=\"setNumericFormat(column, row)\">\n              {{\n              setNumericFormat(column, row)\n              }}\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- Button column on Grid -->\n      <span>\n        <div *ngSwitchCase=\"'add_button'\">\n          <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n            [icon]=\"row[column.field]?.action?.icon ? row[column.field]?.action?.icon : column.icon\"\n            [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n            [label]=\"row[column.field]?.action?.displayText ? row[column.field]?.action?.displayText : column.value\"\n            [ngStyle]=\"{\n              background: column.color ? column.color : ''\n            }\" (click)=\"onClickButton(column, row)\"></button>\n        </div>\n      </span>\n\n      <!-- Date column on Grid -->\n      <span *ngSwitchCase=\"'date'\" [title]=\"setConditionBaseValue(row,column)\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <p-calendar\n              [class]=\"column.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)=\"calenderInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n              [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n              [showButtonBar]=\"!column.timeOnly\"></p-calendar>\n            <!-- [todayButtonStyleClass]=\"column.timeOnly ? 'hide-today-btn' : 'show-today-btn'\" -->\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            {{ setConditionBaseValue(row,column) }}\n          </ng-template>\n        </p-cellEditor>\n      </span>\n      <span *ngSwitchDefault>\n        <span [ngSwitch]=\"column.type\">\n          <!-- Dropdown column on Grid -->\n          <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\" [title]=\"\n              setDropdwonReadOnlyValue(row, column)\n              \">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-dropdown *ngIf=\"!row[column.field]?.action?.hidden\" [options]=\"\n                      row[column.field+'_data']\n                        ? row[column.field+'_data']\n                        : column.data\n                    \"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n                  [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n                    ? row[column.displayField]\n                    : row[column.field] ? row[column.field] : 'Select'\" [showClear]=\"row[column.field] ? true : false\"\n                  [optionLabel]=\"column.optionLabel\" (click)=\"onClickEvent(column, row)\"\n                  [optionValue]=\"column.optionValue\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (onChange)=\"onChangeEvent(column, row)\" [filter]=\"column.allowSearch\"></p-dropdown>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span *ngIf=\"!row[column.field]?.action?.hidden\">\n                  {{\n                  setDropdwonReadOnlyValue(row, column)\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <!-- MultiSelect column on Grid -->\n          <span *ngSwitchCase=\"'multi-select'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-multiSelect [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\"\n                  [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n                  [options]=\"column.data\" [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 [title]=\"\n                      row[column.displayField]\n                        ? row[column.displayField]\n                        : setMultiSelectData(column, row[column.field])\n                    \">\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 [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [name]=\"column.header\"\n                  [suggestions]=\"column.data\" [field]=\"column.displayField\"\n                  [(ngModel)]=\"row[column.field]?.action && row[column.field]?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field]?.action?.displayField.toLowerCase()] : typeOf(row[column.field]) === 'object' && row[column.field]?.text ? row[column.field]?.text : row[column.field]\"\n                  [dropdown]=\"column.showOption\" (onChange)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickEvent(column, row)\" (completeMethod)=\"autoSearch($event, column, row)\"\n                  (onBlur)=\"onFocusOutEvent(column, row)\" [disabled]=\"allowDisabled(column,row)\" [multiple]=\"true\"\n                  (keydown.enter)=\"onAutoCompleteFocusOut($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                    {{ column.displayField ? row[column.displayField?.toLowerCase()] : 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              </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 [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n              <ng-template pTemplate=\"input\">\n                <se-generate-report-btn [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <span *ngSwitchDefault>\n            <!-- Input column on Grid -->\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <input pInputText type=\"text\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                  [(ngModel)]=\"row.undefined ? '' : allowDisabled(column,row) && row[column.displayField] ? row[column.displayField] : typeOf(row[column.field]) === 'object' && (row[column.field]?.action || row[column.field]?.text) ? row[column.field]?.action?.displayField?.toLowerCase() ?\n                     row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n                  (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickButton(column, row)\" *ngIf=\"column.field !== dataKey; else locked_field\" />\n                <ng-template #locked_field><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n                    {{ row[column.field] }}\n                  </span></ng-template>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span (click)=\"onClickEvent(column, row)\" [title]=\"\n                    column.displayText ? column.displayText : \n                      row[column.displayField]\n                        ? row[column.displayField]\n                        : row[column.field]\n                    \">\n                  {{\n                  row[column.field]?.action ? row[column.field]?.text : column.displayText ? column.displayText :\n                  row[column.displayField]\n                  ? row[column.displayField]\n                  : row[column.field]\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n        </span>\n      </span>\n      </td>\n      <!-- Grid Rows Data Bindings End -->\n\n      <!-- Action column on Grid -->\n      <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\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\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' : ''\">\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 *ngFor=\"let outerColumn of selectedColumns\" [style]=\"outerColumn.style\">\n        <div *ngFor=\"let innerColumn of selectedColumns\">\n          <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n            <div\n              *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) || 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>\n      <td [attr.colspan]=\"selectedColumns?.length + 1\">No records found.</td>\n    </tr>\n  </ng-template>\n</p-table>",
                   styles: [".action-btn{margin-right:10px;cursor:pointer}:host ::ng-deep .two-action-btn{flex:0!important;flex-basis:6%!important}:host ::ng-deep .three-action-btn{flex:0!important;flex-basis:8%!important}:host ::ng-deep .p-column-filter-clear-button{display:none}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .horizontal-scroll .p-datatable{position:relative;width:calc(100vw - 263px);overflow:auto;height:calc(100vh - 134px)}:host ::ng-deep .horizontal-scroll .p-datatable th,:host ::ng-deep .horizontal-scroll .p-datatable td{min-width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:0 1rem!important}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td span{vertical-align:middle}:host ::ng-deep td[ng-reflect-ng-switch=multi-select] span{overflow:visible!important}:host ::ng-deep td[ng-reflect-ng-switch=dropdown] span{overflow:visible!important}:host ::ng-deep .input-number{border:0;border-radius:2px;padding:5px 0}:host ::ng-deep .input-number input{border:0;padding:0 10px 0 0;outline:none!important;box-shadow:none!important}:host ::ng-deep .input-number button{color:#2d2d2d;width:15px;height:12px;border:0;background-color:#eee}:host ::ng-deep .input-number button:hover{color:#2d2d2d;background-color:#ddd}:host ::ng-deep .input-number button span{font-size:12px}:host ::ng-deep .hide-filter-icon .p-column-filter-menu-button{display:none}.disable-link{color:#e4b7b8;pointer-events:none;text-decoration:underline;opacity:.5}.hyperlink{color:#cc7272;text-decoration:underline;cursor:pointer}.custom-link{color:#205dcf;cursor:pointer;font-size:12px}.setActionColumnWidth{display:flex}.noWrap td span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-width:100%}.highlighted-row{background-color:#dee2e6!important}td[ng-reflect-ng-switch=AutoComplete] span{overflow:visible!important}.hide-clear-filter-button{display:none!important}#hide-border{border-bottom:0!important}p-celleditor p-inputnumber{border:0}.merge-btn{margin-top:2px;line-height:14px}.close-icon-wrapper{position:relative}.close-icon-wrapper input{width:100%}.close-icon-wrapper button{position:absolute;right:5px;top:6px;width:25px;height:25px;background:unset;color:#777;border:0}\n"]
               },] }
   ];