@churchillliving/se-ui-toolkit 6.53.29 → 6.53.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/churchillliving-se-ui-toolkit.umd.js +13 -3
- package/bundles/churchillliving-se-ui-toolkit.umd.js.map +1 -1
- package/churchillliving-se-ui-toolkit.metadata.json +1 -1
- package/esm2015/lib/components/base/form/form.component.js +12 -2
- package/esm2015/lib/components/base/grid/grid.component.js +2 -2
- package/esm2015/lib/components/base/grid/grid.component.ngfactory.js +3 -3
- package/esm2015/lib/components/shared/global-filters/global-filters.component.js +2 -2
- package/esm2015/lib/components/shared/global-filters/global-filters.component.ngfactory.js +3 -3
- package/esm2015/lib/se-ui-toolkit.module.ngfactory.js +1 -1
- package/fesm2015/churchillliving-se-ui-toolkit.js +13 -3
- package/fesm2015/churchillliving-se-ui-toolkit.js.map +1 -1
- package/package.json +1 -1
|
@@ -5429,7 +5429,7 @@
|
|
|
5429
5429
|
GridComponent.decorators = [
|
|
5430
5430
|
{ type: i0.Component, args: [{
|
|
5431
5431
|
selector: 'se-grid',
|
|
5432
|
-
template: "<p-confirmDialog\r\n [style]=\"{ width: '50vw' }\"\r\n *ngIf=\"useInlineCRUD\"\r\n key=\"handleInlineCRUD\"\r\n></p-confirmDialog>\r\n<p-confirmDialog\r\n [style]=\"{ width: '50vw' }\"\r\n *ngIf=\"columnActions.length > 0\"\r\n key=\"handlecolumnActions\"\r\n></p-confirmDialog>\r\n<div class=\"p-mb-2 p-d-flex p-ai-center\"\r\n *ngIf=\"\r\n allowColumnToggle ||\r\n rowActions.length > 0 ||\r\n useInlineCRUD ||\r\n allowExportToExcel ||\r\n allowExportToPdf ||\r\n clearGridFilter\r\n \"\r\n>\r\n<!-- button for apply filterValue on Grid -->\r\n <button\r\n *ngIf=\"filtering && !hideFilter\"\r\n pButton\r\n type=\"button\"\r\n icon=\"pi pi-search\"\r\n (click)=\"applyGirdFilterBtn()\"\r\n [class]=\"\r\n searchGridFilter ? 'p-button-success p-mr-2 p-ml-1' : 'hide-clear-filter-button'\r\n \"\r\n></button>\r\n\r\n<!-- button for clear filterValue on Grid -->\r\n <button\r\n *ngIf=\"filtering && !hideFilter\"\r\n pButton\r\n id=\"clearGridFilterValuesButton\"\r\n type=\"button\"\r\n icon=\"fa-solid fa-rotate-left\"\r\n (click)=\"cleargridFiltersValue()\"\r\n [class]=\"\r\n clearGridFilter ? 'p-button-danger p-mr-2 p-ml-1' : 'hide-clear-filter-button'\r\n \"\r\n></button>\r\n\r\n<!-- button for edit all grid at once -->\r\n<!-- <button\r\n pButton\r\n *ngIf=\"hideEditAllRowsBtn && editAllRows\"\r\n id=\"editBtnGlobalvalues\"\r\n type=\"button\"\r\n [label]=\"'Edit'\"\r\n class=\"p-mr-2 ui-button-info\"\r\n icon=\"pi pi-pencil\"\r\n [class]=\"editRowPermission ? '' : 'p-disabled'\"\r\n (click)=\"editAllRowsAtOnce()\"\r\n ></button> -->\r\n\r\n <!-- button for save all grid at once -->\r\n <button\r\n pButton\r\n *ngIf=\"editAllRows && editRowPermission\"\r\n id=\"saveAllGridValues\"\r\n icon=\"pi pi-check\"\r\n [label]=\"'Save'\"\r\n class=\"p-mr-2 ui-button-info\"\r\n type=\"button\"\r\n (click)=\"saveAllRowsAtOnce()\"\r\n ></button>\r\n\r\n <!-- button for cancel all grid at once -->\r\n <button\r\n pButton\r\n *ngIf=\"editAllRows\"\r\n id=\"editBtnGlobalvalues\"\r\n type=\"button\"\r\n [label]=\"'Cancel'\"\r\n icon=\"pi pi-times\"\r\n class=\"p-mr-2 ui-button-info\"\r\n (click)=\"cancelAllRowsAtOnce()\"\r\n ></button>\r\n\r\n <!-- header Button for multiSelect on Grid -->\r\n <span *ngIf=\"allowColumnToggle\">\r\n <p-multiSelect\r\n [showToggleAll]=\"false\"\r\n [options]=\"columns\"\r\n [(ngModel)]=\"selectedColumns\"\r\n optionLabel=\"header\"\r\n selectedItemsLabel=\"{0} columns selected\"\r\n [style]=\"{ minWidth: '200px' }\"\r\n placeholder=\"Choose Columns\"\r\n >\r\n </p-multiSelect>\r\n </span>\r\n\r\n <!-- header Button for Adding new Row on Grid -->\r\n <button\r\n pButton\r\n *ngIf=\"useInlineCRUD && addRowPermission && !hideOnRowAddBtn\"\r\n type=\"button\"\r\n [label]=\"'Add'\"\r\n pAddRow\r\n [table]=\"componentTableRef\"\r\n [newRow]=\"newGridRow\"\r\n [id]=\"dataKey\"\r\n pTooltip=\"Add New Row\"\r\n tooltipPosition=\"bottom\"\r\n icon=\"pi pi-plus\"\r\n class=\"ui-button-info p-mr-2\"\r\n (click)=\"addNewRow(newGridRow, true)\"\r\n pRipple\r\n ></button>\r\n \r\n<!-- header Button for Excel File on Grid -->\r\n<button\r\n *ngIf=\"allowExportToExcel\"\r\n type=\"button\"\r\n pButton\r\n icon=\"pi pi-file-excel\"\r\n (click)=\"exportExcel()\"\r\n class=\"p-button-success p-mt-0 p-mx-2\"\r\n pTooltip=\"Export to Excel\"\r\n tooltipPosition=\"bottom\"\r\n pRipple\r\n></button>\r\n\r\n<!-- header Button for PDF File on Grid -->\r\n<button\r\n *ngIf=\"allowExportToPdf\"\r\n type=\"button\"\r\n pButton\r\n icon=\"pi pi-file-pdf\"\r\n (click)=\"exportPdf()\"\r\n class=\"p-button-warning p-mr-2\"\r\n pTooltip=\"Export to Pdf\"\r\n tooltipPosition=\"bottom\"\r\n pRipple\r\n></button>\r\n</div>\r\n\r\n<p-table\r\n *ngIf=\"!isGridHidden\"\r\n id=\"my-table\"\r\n [value]=\"rowsData\"\r\n [columns]=\"selectedColumns\"\r\n sortMode=\"multiple\"\r\n [lazy]=\"useServerSideEvents\"\r\n [paginator]=\"pagination\"\r\n [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\r\n [rows]=\"defaultRows\"\r\n [totalRecords]=\"totalRecords\"\r\n [rowsPerPageOptions]=\"setPaginationLength\"\r\n [showCurrentPageReport]=\"showCurrentPageReport\"\r\n currentPageReportTemplate=\"Showing {first} to {last} of {{\r\n totalRecords\r\n }} entries\"\r\n [loading]=\"autoLoadData ? loading : false\"\r\n (onSort)=\"sortDisabled ?? handleSortChange($event)\"\r\n (onFilter)=\"handleFilterChange($event)\"\r\n (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\"\r\n (onPage)=\"handleServerSidePagination($event)\"\r\n #dt\r\n [dataKey]=\"dataKey\"\r\n [(selection)]=\"selectedRows\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n editMode=\"row\"\r\n [editingRowKeys]=\"editingRowKeys\"\r\n [autoLayout]=\"true\"\r\n [rowHover]=\"rowHover\"\r\n [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\"\r\n>\r\n <!-- header Button for Action on Grid -->\r\n <div\r\n *ngIf=\"rowActions.length > 0 && rowActions.length > 0\"\r\n class=\"p-d-flex p-jc-end\"\r\n >\r\n <span *ngFor=\"let rowAction of rowActions\">\r\n <button\r\n pButton\r\n type=\"button\"\r\n [label]=\"rowAction.title\"\r\n [class]=\"rowAction.class\"\r\n (click)=\"rowAction.onClick(selectedRows)\"\r\n ></button>\r\n </span>\r\n </div>\r\n\r\n <!-- header columns on Grid -->\r\n <ng-template pTemplate=\"header\" let-cols>\r\n <tr>\r\n <th *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\r\n Select\r\n </th>\r\n <th\r\n *ngIf=\"setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\r\n >\r\n Actions\r\n </th>\r\n <th\r\n *ngFor=\"let column of cols\"\r\n [pSortableColumn]=\"column.field\"\r\n [style]=\"column.style\"\r\n [pSortableColumnDisabled]=\"sortDisabled ? true : column.sorting === false\"\r\n >\r\n <div style=\"display: flex;align-items: center;white-space: nowrap;\">\r\n <span class=\"flex-grow-1\">{{ column.header }}</span>\r\n <p-sortIcon\r\n *ngIf=\"column.sorting !== false\"\r\n [field]=\"column.field\"\r\n ></p-sortIcon>\r\n </div>\r\n </th>\r\n <th *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\r\n </tr>\r\n <tr *ngIf=\"filtering && !hideFilter\">\r\n <th *ngIf=\"allowSelection\">\r\n <p-tableHeaderCheckbox\r\n *ngIf=\"selectionType === 'multiple'\"\r\n (click)=\"multiCheckBoxOnclick(rowsData)\"\r\n ></p-tableHeaderCheckbox>\r\n </th>\r\n <th *ngIf=\"setActionColumnAsFirst\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n </th>\r\n <th\r\n *ngFor=\"let column of cols\"\r\n [ngSwitch]=\"column?.filter?.type\"\r\n [style]=\"column.style\"\r\n [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\"\r\n >\r\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\r\n <!-- Text input on Header For Filter-->\r\n <p-columnFilter\r\n [type]=\"'text'\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'input'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (keyup)=\"removingFilters($event, column)\"\r\n pInputText\r\n />\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- Numeric input on Header For Filter-->\r\n <p-columnFilter\r\n [type]=\"'numeric'\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'numeric_input'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-inputNumber\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (keyup)=\"removingFilters($event, column)\"\r\n ></p-inputNumber>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- lookup input on Header For Filter-->\r\n <p-columnFilter\r\n [type]=\"'text'\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'lookup_input'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <div class=\"close-icon-wrapper\">\r\n <input\r\n id=\"lookUp_filter\"\r\n autocomplete=\"off\"\r\n type=\"text\"\r\n [(ngModel)]=\"column.value\"\r\n [disabled]=\"column.disabled\"\r\n (click)=\"setFilterLookup(column)\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (keyup)=\"removingFilters($event, column)\"\r\n pInputText\r\n />\r\n <div><button *ngIf=\"column.value\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column)\"></button></div>\r\n </div>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- checkbox on Header For Filter-->\r\n <p-columnFilter\r\n type=\"boolean\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'checkbox'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-checkbox\r\n [binary]=\"true\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\r\n (click)=\"clickCheckBoxFilter(column)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n >\r\n </p-checkbox>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- multiSelect on Header For Filter-->\r\n <p-columnFilter\r\n [field]=\"column.field\"\r\n matchMode=\"in\"\r\n [showMenu]=\"false\"\r\n *ngSwitchCase=\"'multi-select'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-multiSelect\r\n [ngModel]=\"value\"\r\n [options]=\"column.filter.data || []\"\r\n (onChange)=\"filter($event.value)\"\r\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n placeholder=\"Any\"\r\n optionLabel=\"label\"\r\n >\r\n </p-multiSelect>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- dropdown on Header For Filter-->\r\n <p-columnFilter\r\n [field]=\"column.field\"\r\n matchMode=\"in\"\r\n [showMenu]=\"false\"\r\n *ngSwitchCase=\"'dropdown'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-dropdown\r\n [showClear]=\"true\"\r\n [placeholder]=\"'Select'\"\r\n [filter]=\"column.allowSearch\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\r\n [options]=\"column.filter.data || []\"\r\n (onChange)=\"searchDropdownFilter(filter, $event, column)\"\r\n ></p-dropdown>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- calendar on Header For Filter-->\r\n <p-columnFilter\r\n [field]=\"column.field\"\r\n matchMode=\"in\"\r\n [showMenu]=\"false\"\r\n *ngSwitchCase=\"'calendar'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-calendar\r\n [placeholder]=\"'Select-Date'\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n appendTo=\"body\"\r\n (onSelect)=\"selectDate(column)\"\r\n [inputId]=\"column.field\"\r\n hourFormat=\"12\"\r\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\r\n [showButtonBar]=\"true\"\r\n (onClose)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (onClearClick)=\"backspaceEvent($event, column)\"\r\n >\r\n </p-calendar>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- Default Filter For Header -->\r\n <p-columnFilter\r\n [type]=\"\r\n column.type && column.type !== 'link' ? column.type : 'text'\r\n \"\r\n [field]=\"column.field\"\r\n display=\"menu\"\r\n *ngSwitchDefault\r\n >\r\n </p-columnFilter>\r\n </span>\r\n </th>\r\n <th *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Body columns on Grid -->\r\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\r\n <tr\r\n [ngClass]=\"row.highlightrow ? 'highlighted-row' : ''\"\r\n [class]=\"wordWrap ? '' : 'noWrap'\"\r\n (click)=\"!editing && handleRowClick(row)\"\r\n [pEditableRow]=\"row\"\r\n #gridRow\r\n [id]=\"row[dataKey]\"\r\n >\r\n <td *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\r\n <p-tableRadioButton\r\n [value]=\"row\"\r\n *ngIf=\"selectionType === 'single'\"\r\n ></p-tableRadioButton>\r\n <p-tableCheckbox\r\n [value]=\"row\"\r\n *ngIf=\"selectionType === 'multiple'\"\r\n (click)=\"multiCheckBoxOnclick(row)\"\r\n ></p-tableCheckbox>\r\n </td>\r\n\r\n <!-- first actions column -->\r\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\r\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\r\n <i\r\n [title]=\"action.tooltip\"\r\n [class]=\"action.icon\"\r\n (click)=\"handleActionClick($event, action, row)\"\r\n ></i>\r\n </span>\r\n </td>\r\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n <span class=\"setActionColumnWidth\">\r\n <se-grid-row-actions\r\n [editing]=\"editing\"\r\n [editRowPermission]=\"editRowPermission\"\r\n [deleteRowPermission]=\"deleteRowPermission\"\r\n [row]=\"row\"\r\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\r\n (deleteRecordBtn)=\"deleteRecord($event)\"\r\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\r\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\r\n [editAllRows]=\"disabledSaveBtn\"\r\n >\r\n </se-grid-row-actions>\r\n </span>\r\n </td>\r\n\r\n <!-- Grid Rows Data Bindings Start -->\r\n <td\r\n *ngFor=\"let column of selectedColumns\"\r\n [ngSwitch]=\"column.type\"\r\n [style]=\"column.style\"\r\n >\r\n\r\n <!-- Boolean column on Grid -->\r\n <span *ngSwitchCase=\"'boolean'\">\r\n <td *ngIf=\"!editing\">\r\n <p-checkbox\r\n [disabled]=\"true\"\r\n [binary]=\"true\"\r\n (click)=\"selectedRow(row)\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n [(ngModel)]=\"\r\n row[column.field] &&\r\n (row[column.field].toString() === '1' ||\r\n row[column.field].toString().toLowerCase() === 'true' ||\r\n row[column.field].toString().toLowerCase() === 'y')\r\n ? checked\r\n : unChecked\r\n \"\r\n >\r\n </p-checkbox>\r\n </td>\r\n <td *ngIf=\"editing\">\r\n <span *ngSwitchCase=\"'boolean'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <!-- for edit checkBox -->\r\n <p-checkbox\r\n (click)=\"onClickEvent(column, row)\"\r\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [binary]=\"true\"\r\n [(ngModel)]=\"\r\n row[column.field] &&\r\n (row[column.field].toString() === '1' ||\r\n row[column.field].toString().toLowerCase() === 'true' ||\r\n row[column.field].toString().toLowerCase() === 'y')\r\n ? editModeChecked\r\n : editModeunCkecked\r\n \"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n ></p-checkbox>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n {{ row[column.field] }}\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n </td>\r\n </span>\r\n\r\n <!-- link column on Grid -->\r\n <span *ngSwitchCase=\"'link'\">\r\n <!-- link column for HyperLink Case -->\r\n <span *ngIf=\"column.allowSave === false\">\r\n <span\r\n *ngIf=\"column.target !== '_self'\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\r\n >\r\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </a>\r\n </span>\r\n <span\r\n *ngIf=\"column.target === '_self'\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\r\n >\r\n <a [href]=\"row[column.field + '_obj']?.hyperlink\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </a>\r\n </span>\r\n </span>\r\n <!-- link column for Edit Case -->\r\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <span *ngIf=\"column.editable === true || column.editable === undefined\">\r\n <input\r\n *ngIf=\"!row.isNew\"\r\n pInputText\r\n (click)=\"onClickEvent(column, row)\"\r\n type=\"text\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (change)=\"onChangeEvent(column, row)\"\r\n />\r\n <input\r\n pInputText\r\n *ngIf=\"row.isNew\"\r\n type=\"text\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (change)=\"onChangeEvent(column, row)\"\r\n />\r\n </span>\r\n <span *ngIf=\"column.editable === false\" \r\n (click)=\"openLink(row[column.field + '_obj']?.hyperlink)\"\r\n [class]=\"allowDisabled(column,row) ? 'disable-link' : 'hyperlink'\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </span>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span>\r\n <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\" \r\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </a>\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n </span>\r\n\r\n <!-- Iframe column on Grid -->\r\n <span *ngSwitchCase=\"'iframe'\">\r\n <span\r\n class=\"custom-link\"\r\n (click)=\"\r\n gridIFrame(column, row[column.field + '_obj'].hyperlink, row)\r\n \"\r\n [title]=\"\r\n row[column.field + '_obj'] &&\r\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\r\n ? row[column.field] : row[column.field + '_obj']?.displayText\r\n ? row[column.field + '_obj'].displayText\r\n : column.displayText\r\n ? column.displayText\r\n : row[column.field]\r\n \"\r\n >\r\n {{\r\n row[column.field + '_obj'] &&\r\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\r\n ? row[column.field] : row[column.field + '_obj']?.displayText\r\n ? row[column.field + '_obj'].displayText\r\n : column.displayText ? column.displayText : row[column.field]\r\n }}\r\n </span>\r\n </span>\r\n\r\n <!-- dialog column on Grid -->\r\n <span *ngSwitchCase=\"'dialog'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <span\r\n *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n >\r\n <span *ngIf=\"column.editable === true\">\r\n <input\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [name]=\"row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n />\r\n </span>\r\n <span\r\n *ngIf=\"\r\n column.editable === false || column.editable === undefined\r\n \"\r\n [class]=\"\r\n allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\r\n \"\r\n (click)=\"openGridDialog(column, row)\"\r\n >\r\n {{ !column.displayText && row.isNew ? '' : setConditionBaseValue(row, column) }}\r\n </span>\r\n </span>\r\n\r\n <span\r\n *ngIf=\"row[column.field + '_secondType'] === 'date'\"\r\n [title]=\"\r\n row[column.field]\r\n | date: (column.format ? column.format : 'MM/dd/YY')\r\n \"\r\n >\r\n <p-calendar\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n (onClose)=\"onFocusOutEvent(column, row)\"\r\n [appendTo]=\"'body'\"\r\n hourFormat=\"12\"\r\n [showTime]=\"column.showTime\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [timeOnly]=\"column.timeOnly\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n ></p-calendar>\r\n </span>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n [class]=\"row.disabled == false ? 'custom-link' : column.editable === false ? 'custom-link' : allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\"\r\n (click)=\"openGridDialog(column, row)\"\r\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n >\r\n {{ setConditionBaseValue(row, column) }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- lookup Input column on Grid -->\r\n <span *ngSwitchCase=\"'lookup_input'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <div class=\"close-icon-wrapper\">\r\n <input\r\n readonly\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"(column.disabled || column.editable === false) && column.displayField ? row[column.displayField] : typeOf(row[column.field]) === 'object' ?\r\n row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [name]=\"row[column.field]\"\r\n (keyup.tab)=\"selectLookupField(column, row)\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (click)=\"selectLookupField(column, row)\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n \t(blur)=\"onFocusOutEvent(column, row)\"\r\n />\r\n <div *ngIf=\"!allowDisabled(column,row)\"><button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\r\n ? row[column.field].text\r\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column,row)\"></button></div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span *ngIf=\"column.linkId\">\r\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' : '_blank'\"> \r\n {{\r\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n }}\r\n </a>\r\n </span>\r\n <span\r\n *ngIf=\"!column.linkId\"\r\n [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\r\n (click)=\"openLookupHyperlink(column, row)\"\r\n >\r\n {{\r\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- Numeric Input column on Grid -->\r\n <span *ngSwitchCase=\"'numeric'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <!-- for Currency && Decimal && Percent -->\r\n <span class=\"input-number\">\r\n <p-inputNumber\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n [class]=\"\r\n column.errorMessage\r\n ? 'ng-invalid ng-dirty'\r\n : 'form-control'\r\n \"\r\n [showButtons]=\"!column.format ? true : false\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [name]=\"column.field\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (ngModelChange)=\"onChangeEvent(column, row)\"\r\n (onBlur)=\"onFocusOutEvent(column, row)\"\r\n [mode]=\"\r\n column.format &&\r\n column.format.type === 'currency'\r\n ? 'currency'\r\n : 'decimal'\r\n \"\r\n [currency]=\"\r\n column.format &&\r\n column.format.type === 'currency' &&\r\n column.format.formatParams &&\r\n column.format.formatParams.currency\r\n ? column.format.formatParams.currency\r\n : 'USD'\r\n \"\r\n [locale]=\"\r\n column.format &&\r\n column.format.type === 'currency' &&\r\n column.format.formatParams &&\r\n column.format.formatParams.locale\r\n ? column.format.formatParams.locale\r\n : 'en-US'\r\n \"\r\n [minFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\r\n [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\r\n [suffix]=\"\r\n column.format &&\r\n column.format.type === 'percent' && !column?.format?.formatParams?.allowCalculate \r\n ? '%'\r\n : ''\r\n \"\r\n >\r\n </p-inputNumber>\r\n </span>\r\n <ng-template #locked_field\r\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\r\n {{ row[column.field] }}\r\n </span></ng-template\r\n >\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n [title]=\"setNumericFormat(column, row)\">\r\n {{\r\n setNumericFormat(column, row)\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n \r\n <!-- Button column on Grid -->\r\n <span [title]=\"column.value ? column.value : column.icon\">\r\n <div *ngSwitchCase=\"'add_button'\">\r\n <button *ngIf=\"!row.hidegridbtn\"\r\n pButton\r\n type=\"button\"\r\n [icon]=\"row[column.field]?.action?.icon ? row[column.field]?.action?.icon : column.icon\"\r\n [name]=\"column.header\"\r\n class=\"merge-btn\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [label]=\"row[column.field]?.action?.displayText ? row[column.field]?.action?.displayText : column.value\"\r\n [ngStyle]=\"{\r\n background: column.color ? column.color : ''\r\n }\"\r\n (click)=\"onClickButton(column, row)\"\r\n ></button>\r\n </div>\r\n </span>\r\n\r\n <!-- Date column on Grid -->\r\n <span\r\n *ngSwitchCase=\"'date'\"\r\n [title]=\"setConditionBaseValue(row,column)\"\r\n >\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-calendar\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n (onClose)=\"onFocusOutEvent(column, row)\"\r\n [appendTo]=\"'body'\"\r\n hourFormat=\"12\"\r\n [defaultDate]=\"defaultDate\"\r\n [stepMinute] = \"column.minutesInterval ? column.minutesInterval : 1\"\r\n [showTime]=\"column.showTime\"\r\n [timeOnly]=\"column.timeOnly\"\r\n [dateFormat]=\"column.format ? column.format : calendarFormat\"\r\n (keyup)=\"calenderInputValue(column, row)\"\r\n (onShow)=\"onClickEvent(column, row)\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n ></p-calendar>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n {{ setConditionBaseValue(row,column) }}\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n <span *ngSwitchDefault>\r\n <span [ngSwitch]=\"column.type\">\r\n <!-- Dropdown column on Grid -->\r\n <span\r\n *ngSwitchCase=\"'dropdown'\"\r\n [class]=\"dropdownInput ? '' : 'output-dropdown'\"\r\n [title]=\"\r\n setDropdwonReadOnlyValue(row, column)\r\n \"\r\n >\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-dropdown\r\n *ngIf=\"!row[column.field]?.action?.hidden\"\r\n [options]=\"\r\n row[column.field+'_data']\r\n ? row[column.field+'_data']\r\n : column.data\r\n \"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [placeholder]=\"row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field] ? row[column.field] : 'Select'\"\r\n [showClear]=\"row[column.field] ? true : false\"\r\n [optionLabel]=\"column.optionLabel\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [optionValue]=\"column.optionValue\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (onChange)=\"onChangeEvent(column, row)\"\r\n [filter]=\"column.allowSearch\"\r\n ></p-dropdown>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span *ngIf=\"!row[column.field]?.action?.hidden\">\r\n {{\r\n setDropdwonReadOnlyValue(row, column)\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- MultiSelect column on Grid -->\r\n <span *ngSwitchCase=\"'multi-select'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-multiSelect\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n type=\"text\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [options]=\"column.data\"\r\n [optionLabel]=\"column.optionLabel\"\r\n [optionValue]=\"column.optionValue\"\r\n (onChange)=\"onChangeEvent(column, row)\"\r\n (onPanelShow)=\"showOption(column, row)\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [appendTo]=\"'body'\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n >\r\n </p-multiSelect>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n [title]=\"\r\n row[column.displayField]\r\n ? row[column.displayField]\r\n : setMultiSelectData(column, row[column.field])\r\n \"\r\n >\r\n {{\r\n row[column.displayField]\r\n ? row[column.displayField] :\r\n setMultiSelectData(column, row[column.field])\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- AutoComplete Search -->\r\n <span\r\n *ngSwitchCase=\"'AutoComplete'\"\r\n >\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-autoComplete\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n [name]=\"column.header\"\r\n [suggestions]=\"column.data\"\r\n [field]=\"column.displayField\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" \r\n [dropdown]=\"column.showOption\"\r\n (onChange)=\"onChangeEvent(column, row)\"\r\n (click)=\"onClickEvent(column, row)\"\r\n (completeMethod)=\"autoSearch($event, column, row)\"\r\n (onBlur)=\"onFocusOutEvent(column, row)\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [multiple]=\"true\"\r\n >\r\n </p-autoComplete>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\r\n <span *ngFor=\"let value of row[column.field]; let i = index\">\r\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ? value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\r\n </span>\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span> \r\n <!-- Add Generate Report Button -->\r\n <span *ngSwitchCase=\"'report'\"> \r\n <p-cellEditor> \r\n <ng-template pTemplate=\"output\">\r\n <se-generate-report-btn [repId]=\"column.reportId\" [params]=\"column.params\" [showDialog]=\"column.showDialog\"></se-generate-report-btn>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <span *ngSwitchDefault>\r\n <!-- Input column on Grid -->\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <input\r\n pInputText\r\n type=\"text\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\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() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (change)=\"onChangeEvent(column, row)\"\r\n (click)=\"onClickButton(column, row)\"\r\n *ngIf=\"column.field !== dataKey; else locked_field\"\r\n />\r\n <ng-template #locked_field\r\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\r\n {{ row[column.field] }}\r\n </span></ng-template\r\n >\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n (click)=\"onClickEvent(column, row)\"\r\n [title]=\"\r\n column.displayText ? column.displayText : \r\n row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n \"\r\n >\r\n {{\r\n row[column.field]?.action ? row[column.field]?.text : column.displayText ? column.displayText : \r\n row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n </span>\r\n </span>\r\n </td>\r\n <!-- Grid Rows Data Bindings End -->\r\n\r\n <!-- Action column on Grid -->\r\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\r\n <i\r\n [title]=\"action.tooltip\"\r\n [class]=\"action.icon\"\r\n (click)=\"handleActionClick($event, action, row)\"\r\n ></i>\r\n </span>\r\n </td>\r\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n <span class='setActionColumnWidth'>\r\n <se-grid-row-actions\r\n [editing]=\"editing\"\r\n [editRowPermission]=\"editRowPermission\"\r\n [deleteRowPermission]=\"deleteRowPermission\"\r\n [row]=\"row\"\r\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\r\n (deleteRecordBtn)=\"deleteRecord($event)\"\r\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\r\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\r\n [editAllRows]=\"disabledSaveBtn\"\r\n >\r\n </se-grid-row-actions>\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Footer columns on Grid -->\r\n <ng-template pTemplate=\"footer\">\r\n <tr *ngIf=\"aggregateFooter\">\r\n <td *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\r\n <td *ngFor=\"let outerColumn of selectedColumns\" [style]=\"outerColumn.style\">\r\n <div *ngFor=\"let innerColumn of selectedColumns\">\r\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\r\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field.toLowerCase() === outerColumn.field.toLowerCase()) || aggr.displayField && aggr.displayField.toLowerCase() === outerColumn.field.toLowerCase())\">\r\n <div [innerHTML]=\"aggr.aggrValue\">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Footer for Empty Message columns on Grid -->\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"selectedColumns?.length + 1\">No records found.</td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n",
|
|
5432
|
+
template: "<p-confirmDialog\r\n [style]=\"{ width: '50vw' }\"\r\n *ngIf=\"useInlineCRUD\"\r\n key=\"handleInlineCRUD\"\r\n></p-confirmDialog>\r\n<p-confirmDialog\r\n [style]=\"{ width: '50vw' }\"\r\n *ngIf=\"columnActions.length > 0\"\r\n key=\"handlecolumnActions\"\r\n></p-confirmDialog>\r\n<div class=\"p-mb-2 p-d-flex p-ai-center\"\r\n *ngIf=\"\r\n allowColumnToggle ||\r\n rowActions.length > 0 ||\r\n useInlineCRUD ||\r\n allowExportToExcel ||\r\n allowExportToPdf ||\r\n clearGridFilter\r\n \"\r\n>\r\n<!-- button for apply filterValue on Grid -->\r\n <button\r\n *ngIf=\"filtering && !hideFilter\"\r\n pButton\r\n type=\"button\"\r\n icon=\"pi pi-search\"\r\n (click)=\"applyGirdFilterBtn()\"\r\n [class]=\"\r\n searchGridFilter ? 'p-button-success p-mr-2 p-ml-1' : 'hide-clear-filter-button'\r\n \"\r\n></button>\r\n\r\n<!-- button for clear filterValue on Grid -->\r\n <button\r\n *ngIf=\"filtering && !hideFilter\"\r\n pButton\r\n id=\"clearGridFilterValuesButton\"\r\n type=\"button\"\r\n icon=\"pi pi-refresh\"\r\n (click)=\"cleargridFiltersValue()\"\r\n [class]=\"\r\n clearGridFilter ? 'p-button-danger p-mr-2 p-ml-1' : 'hide-clear-filter-button'\r\n \"\r\n></button>\r\n\r\n<!-- button for edit all grid at once -->\r\n<!-- <button\r\n pButton\r\n *ngIf=\"hideEditAllRowsBtn && editAllRows\"\r\n id=\"editBtnGlobalvalues\"\r\n type=\"button\"\r\n [label]=\"'Edit'\"\r\n class=\"p-mr-2 ui-button-info\"\r\n icon=\"pi pi-pencil\"\r\n [class]=\"editRowPermission ? '' : 'p-disabled'\"\r\n (click)=\"editAllRowsAtOnce()\"\r\n ></button> -->\r\n\r\n <!-- button for save all grid at once -->\r\n <button\r\n pButton\r\n *ngIf=\"editAllRows && editRowPermission\"\r\n id=\"saveAllGridValues\"\r\n icon=\"pi pi-check\"\r\n [label]=\"'Save'\"\r\n class=\"p-mr-2 ui-button-info\"\r\n type=\"button\"\r\n (click)=\"saveAllRowsAtOnce()\"\r\n ></button>\r\n\r\n <!-- button for cancel all grid at once -->\r\n <button\r\n pButton\r\n *ngIf=\"editAllRows\"\r\n id=\"editBtnGlobalvalues\"\r\n type=\"button\"\r\n [label]=\"'Cancel'\"\r\n icon=\"pi pi-times\"\r\n class=\"p-mr-2 ui-button-info\"\r\n (click)=\"cancelAllRowsAtOnce()\"\r\n ></button>\r\n\r\n <!-- header Button for multiSelect on Grid -->\r\n <span *ngIf=\"allowColumnToggle\">\r\n <p-multiSelect\r\n [showToggleAll]=\"false\"\r\n [options]=\"columns\"\r\n [(ngModel)]=\"selectedColumns\"\r\n optionLabel=\"header\"\r\n selectedItemsLabel=\"{0} columns selected\"\r\n [style]=\"{ minWidth: '200px' }\"\r\n placeholder=\"Choose Columns\"\r\n >\r\n </p-multiSelect>\r\n </span>\r\n\r\n <!-- header Button for Adding new Row on Grid -->\r\n <button\r\n pButton\r\n *ngIf=\"useInlineCRUD && addRowPermission && !hideOnRowAddBtn\"\r\n type=\"button\"\r\n [label]=\"'Add'\"\r\n pAddRow\r\n [table]=\"componentTableRef\"\r\n [newRow]=\"newGridRow\"\r\n [id]=\"dataKey\"\r\n pTooltip=\"Add New Row\"\r\n tooltipPosition=\"bottom\"\r\n icon=\"pi pi-plus\"\r\n class=\"ui-button-info p-mr-2\"\r\n (click)=\"addNewRow(newGridRow, true)\"\r\n pRipple\r\n ></button>\r\n \r\n<!-- header Button for Excel File on Grid -->\r\n<button\r\n *ngIf=\"allowExportToExcel\"\r\n type=\"button\"\r\n pButton\r\n icon=\"pi pi-file-excel\"\r\n (click)=\"exportExcel()\"\r\n class=\"p-button-success p-mt-0 p-mx-2\"\r\n pTooltip=\"Export to Excel\"\r\n tooltipPosition=\"bottom\"\r\n pRipple\r\n></button>\r\n\r\n<!-- header Button for PDF File on Grid -->\r\n<button\r\n *ngIf=\"allowExportToPdf\"\r\n type=\"button\"\r\n pButton\r\n icon=\"pi pi-file-pdf\"\r\n (click)=\"exportPdf()\"\r\n class=\"p-button-warning p-mr-2\"\r\n pTooltip=\"Export to Pdf\"\r\n tooltipPosition=\"bottom\"\r\n pRipple\r\n></button>\r\n</div>\r\n\r\n<p-table\r\n *ngIf=\"!isGridHidden\"\r\n id=\"my-table\"\r\n [value]=\"rowsData\"\r\n [columns]=\"selectedColumns\"\r\n sortMode=\"multiple\"\r\n [lazy]=\"useServerSideEvents\"\r\n [paginator]=\"pagination\"\r\n [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\r\n [rows]=\"defaultRows\"\r\n [totalRecords]=\"totalRecords\"\r\n [rowsPerPageOptions]=\"setPaginationLength\"\r\n [showCurrentPageReport]=\"showCurrentPageReport\"\r\n currentPageReportTemplate=\"Showing {first} to {last} of {{\r\n totalRecords\r\n }} entries\"\r\n [loading]=\"autoLoadData ? loading : false\"\r\n (onSort)=\"sortDisabled ?? handleSortChange($event)\"\r\n (onFilter)=\"handleFilterChange($event)\"\r\n (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\"\r\n (onPage)=\"handleServerSidePagination($event)\"\r\n #dt\r\n [dataKey]=\"dataKey\"\r\n [(selection)]=\"selectedRows\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n editMode=\"row\"\r\n [editingRowKeys]=\"editingRowKeys\"\r\n [autoLayout]=\"true\"\r\n [rowHover]=\"rowHover\"\r\n [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\"\r\n>\r\n <!-- header Button for Action on Grid -->\r\n <div\r\n *ngIf=\"rowActions.length > 0 && rowActions.length > 0\"\r\n class=\"p-d-flex p-jc-end\"\r\n >\r\n <span *ngFor=\"let rowAction of rowActions\">\r\n <button\r\n pButton\r\n type=\"button\"\r\n [label]=\"rowAction.title\"\r\n [class]=\"rowAction.class\"\r\n (click)=\"rowAction.onClick(selectedRows)\"\r\n ></button>\r\n </span>\r\n </div>\r\n\r\n <!-- header columns on Grid -->\r\n <ng-template pTemplate=\"header\" let-cols>\r\n <tr>\r\n <th *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\r\n Select\r\n </th>\r\n <th\r\n *ngIf=\"setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\r\n >\r\n Actions\r\n </th>\r\n <th\r\n *ngFor=\"let column of cols\"\r\n [pSortableColumn]=\"column.field\"\r\n [style]=\"column.style\"\r\n [pSortableColumnDisabled]=\"sortDisabled ? true : column.sorting === false\"\r\n >\r\n <div style=\"display: flex;align-items: center;white-space: nowrap;\">\r\n <span class=\"flex-grow-1\">{{ column.header }}</span>\r\n <p-sortIcon\r\n *ngIf=\"column.sorting !== false\"\r\n [field]=\"column.field\"\r\n ></p-sortIcon>\r\n </div>\r\n </th>\r\n <th *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\r\n </tr>\r\n <tr *ngIf=\"filtering && !hideFilter\">\r\n <th *ngIf=\"allowSelection\">\r\n <p-tableHeaderCheckbox\r\n *ngIf=\"selectionType === 'multiple'\"\r\n (click)=\"multiCheckBoxOnclick(rowsData)\"\r\n ></p-tableHeaderCheckbox>\r\n </th>\r\n <th *ngIf=\"setActionColumnAsFirst\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n </th>\r\n <th\r\n *ngFor=\"let column of cols\"\r\n [ngSwitch]=\"column?.filter?.type\"\r\n [style]=\"column.style\"\r\n [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\"\r\n >\r\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\r\n <!-- Text input on Header For Filter-->\r\n <p-columnFilter\r\n [type]=\"'text'\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'input'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (keyup)=\"removingFilters($event, column)\"\r\n pInputText\r\n />\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- Numeric input on Header For Filter-->\r\n <p-columnFilter\r\n [type]=\"'numeric'\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'numeric_input'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-inputNumber\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (keyup)=\"removingFilters($event, column)\"\r\n ></p-inputNumber>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- lookup input on Header For Filter-->\r\n <p-columnFilter\r\n [type]=\"'text'\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'lookup_input'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <div class=\"close-icon-wrapper\">\r\n <input\r\n id=\"lookUp_filter\"\r\n autocomplete=\"off\"\r\n type=\"text\"\r\n [(ngModel)]=\"column.value\"\r\n [disabled]=\"column.disabled\"\r\n (click)=\"setFilterLookup(column)\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (keyup)=\"removingFilters($event, column)\"\r\n pInputText\r\n />\r\n <div><button *ngIf=\"column.value\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column)\"></button></div>\r\n </div>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- checkbox on Header For Filter-->\r\n <p-columnFilter\r\n type=\"boolean\"\r\n [field]=\"column.field\"\r\n *ngSwitchCase=\"'checkbox'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-checkbox\r\n [binary]=\"true\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\r\n (click)=\"clickCheckBoxFilter(column)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n >\r\n </p-checkbox>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- multiSelect on Header For Filter-->\r\n <p-columnFilter\r\n [field]=\"column.field\"\r\n matchMode=\"in\"\r\n [showMenu]=\"false\"\r\n *ngSwitchCase=\"'multi-select'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-multiSelect\r\n [ngModel]=\"value\"\r\n [options]=\"column.filter.data || []\"\r\n (onChange)=\"filter($event.value)\"\r\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n placeholder=\"Any\"\r\n optionLabel=\"label\"\r\n >\r\n </p-multiSelect>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- dropdown on Header For Filter-->\r\n <p-columnFilter\r\n [field]=\"column.field\"\r\n matchMode=\"in\"\r\n [showMenu]=\"false\"\r\n *ngSwitchCase=\"'dropdown'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-dropdown\r\n [showClear]=\"true\"\r\n [placeholder]=\"'Select'\"\r\n [filter]=\"column.allowSearch\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\r\n [options]=\"column.filter.data || []\"\r\n (onChange)=\"searchDropdownFilter(filter, $event, column)\"\r\n ></p-dropdown>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- calendar on Header For Filter-->\r\n <p-columnFilter\r\n [field]=\"column.field\"\r\n matchMode=\"in\"\r\n [showMenu]=\"false\"\r\n *ngSwitchCase=\"'calendar'\"\r\n >\r\n <ng-template\r\n pTemplate=\"filter\"\r\n let-value\r\n let-filter=\"filterCallback\"\r\n >\r\n <p-calendar\r\n [placeholder]=\"'Select-Date'\"\r\n [(ngModel)]=\"column.value\"\r\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\r\n appendTo=\"body\"\r\n (onSelect)=\"selectDate(column)\"\r\n [inputId]=\"column.field\"\r\n hourFormat=\"12\"\r\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\r\n [showButtonBar]=\"true\"\r\n (onClose)=\"setFilterFocusOut(column, filter, $event)\"\r\n (keydown)=\"backspaceEvent($event, column)\"\r\n (onClearClick)=\"backspaceEvent($event, column)\"\r\n >\r\n </p-calendar>\r\n </ng-template>\r\n </p-columnFilter>\r\n\r\n <!-- Default Filter For Header -->\r\n <p-columnFilter\r\n [type]=\"\r\n column.type && column.type !== 'link' ? column.type : 'text'\r\n \"\r\n [field]=\"column.field\"\r\n display=\"menu\"\r\n *ngSwitchDefault\r\n >\r\n </p-columnFilter>\r\n </span>\r\n </th>\r\n <th *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Body columns on Grid -->\r\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\r\n <tr\r\n [ngClass]=\"row.highlightrow ? 'highlighted-row' : ''\"\r\n [class]=\"wordWrap ? '' : 'noWrap'\"\r\n (click)=\"!editing && handleRowClick(row)\"\r\n [pEditableRow]=\"row\"\r\n #gridRow\r\n [id]=\"row[dataKey]\"\r\n >\r\n <td *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\r\n <p-tableRadioButton\r\n [value]=\"row\"\r\n *ngIf=\"selectionType === 'single'\"\r\n ></p-tableRadioButton>\r\n <p-tableCheckbox\r\n [value]=\"row\"\r\n *ngIf=\"selectionType === 'multiple'\"\r\n (click)=\"multiCheckBoxOnclick(row)\"\r\n ></p-tableCheckbox>\r\n </td>\r\n\r\n <!-- first actions column -->\r\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\r\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\r\n <i\r\n [title]=\"action.tooltip\"\r\n [class]=\"action.icon\"\r\n (click)=\"handleActionClick($event, action, row)\"\r\n ></i>\r\n </span>\r\n </td>\r\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n <span class=\"setActionColumnWidth\">\r\n <se-grid-row-actions\r\n [editing]=\"editing\"\r\n [editRowPermission]=\"editRowPermission\"\r\n [deleteRowPermission]=\"deleteRowPermission\"\r\n [row]=\"row\"\r\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\r\n (deleteRecordBtn)=\"deleteRecord($event)\"\r\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\r\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\r\n [editAllRows]=\"disabledSaveBtn\"\r\n >\r\n </se-grid-row-actions>\r\n </span>\r\n </td>\r\n\r\n <!-- Grid Rows Data Bindings Start -->\r\n <td\r\n *ngFor=\"let column of selectedColumns\"\r\n [ngSwitch]=\"column.type\"\r\n [style]=\"column.style\"\r\n >\r\n\r\n <!-- Boolean column on Grid -->\r\n <span *ngSwitchCase=\"'boolean'\">\r\n <td *ngIf=\"!editing\">\r\n <p-checkbox\r\n [disabled]=\"true\"\r\n [binary]=\"true\"\r\n (click)=\"selectedRow(row)\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n [(ngModel)]=\"\r\n row[column.field] &&\r\n (row[column.field].toString() === '1' ||\r\n row[column.field].toString().toLowerCase() === 'true' ||\r\n row[column.field].toString().toLowerCase() === 'y')\r\n ? checked\r\n : unChecked\r\n \"\r\n >\r\n </p-checkbox>\r\n </td>\r\n <td *ngIf=\"editing\">\r\n <span *ngSwitchCase=\"'boolean'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <!-- for edit checkBox -->\r\n <p-checkbox\r\n (click)=\"onClickEvent(column, row)\"\r\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [binary]=\"true\"\r\n [(ngModel)]=\"\r\n row[column.field] &&\r\n (row[column.field].toString() === '1' ||\r\n row[column.field].toString().toLowerCase() === 'true' ||\r\n row[column.field].toString().toLowerCase() === 'y')\r\n ? editModeChecked\r\n : editModeunCkecked\r\n \"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n ></p-checkbox>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n {{ row[column.field] }}\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n </td>\r\n </span>\r\n\r\n <!-- link column on Grid -->\r\n <span *ngSwitchCase=\"'link'\">\r\n <!-- link column for HyperLink Case -->\r\n <span *ngIf=\"column.allowSave === false\">\r\n <span\r\n *ngIf=\"column.target !== '_self'\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\r\n >\r\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </a>\r\n </span>\r\n <span\r\n *ngIf=\"column.target === '_self'\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\r\n >\r\n <a [href]=\"row[column.field + '_obj']?.hyperlink\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </a>\r\n </span>\r\n </span>\r\n <!-- link column for Edit Case -->\r\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <span *ngIf=\"column.editable === true || column.editable === undefined\">\r\n <input\r\n *ngIf=\"!row.isNew\"\r\n pInputText\r\n (click)=\"onClickEvent(column, row)\"\r\n type=\"text\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (change)=\"onChangeEvent(column, row)\"\r\n />\r\n <input\r\n pInputText\r\n *ngIf=\"row.isNew\"\r\n type=\"text\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (change)=\"onChangeEvent(column, row)\"\r\n />\r\n </span>\r\n <span *ngIf=\"column.editable === false\" \r\n (click)=\"openLink(row[column.field + '_obj']?.hyperlink)\"\r\n [class]=\"allowDisabled(column,row) ? 'disable-link' : 'hyperlink'\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </span>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span>\r\n <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\" \r\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\r\n {{\r\n setConditionBaseValue(row, column)\r\n }}\r\n </a>\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n </span>\r\n\r\n <!-- Iframe column on Grid -->\r\n <span *ngSwitchCase=\"'iframe'\">\r\n <span\r\n class=\"custom-link\"\r\n (click)=\"\r\n gridIFrame(column, row[column.field + '_obj'].hyperlink, row)\r\n \"\r\n [title]=\"\r\n row[column.field + '_obj'] &&\r\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\r\n ? row[column.field] : row[column.field + '_obj']?.displayText\r\n ? row[column.field + '_obj'].displayText\r\n : column.displayText\r\n ? column.displayText\r\n : row[column.field]\r\n \"\r\n >\r\n {{\r\n row[column.field + '_obj'] &&\r\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\r\n ? row[column.field] : row[column.field + '_obj']?.displayText\r\n ? row[column.field + '_obj'].displayText\r\n : column.displayText ? column.displayText : row[column.field]\r\n }}\r\n </span>\r\n </span>\r\n\r\n <!-- dialog column on Grid -->\r\n <span *ngSwitchCase=\"'dialog'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <span\r\n *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n >\r\n <span *ngIf=\"column.editable === true\">\r\n <input\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [name]=\"row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n />\r\n </span>\r\n <span\r\n *ngIf=\"\r\n column.editable === false || column.editable === undefined\r\n \"\r\n [class]=\"\r\n allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\r\n \"\r\n (click)=\"openGridDialog(column, row)\"\r\n >\r\n {{ !column.displayText && row.isNew ? '' : setConditionBaseValue(row, column) }}\r\n </span>\r\n </span>\r\n\r\n <span\r\n *ngIf=\"row[column.field + '_secondType'] === 'date'\"\r\n [title]=\"\r\n row[column.field]\r\n | date: (column.format ? column.format : 'MM/dd/YY')\r\n \"\r\n >\r\n <p-calendar\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n (onClose)=\"onFocusOutEvent(column, row)\"\r\n [appendTo]=\"'body'\"\r\n hourFormat=\"12\"\r\n [showTime]=\"column.showTime\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [timeOnly]=\"column.timeOnly\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n ></p-calendar>\r\n </span>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n [class]=\"row.disabled == false ? 'custom-link' : column.editable === false ? 'custom-link' : allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\"\r\n (click)=\"openGridDialog(column, row)\"\r\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\r\n [title]=\"setConditionBaseValue(row, column)\"\r\n >\r\n {{ setConditionBaseValue(row, column) }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- lookup Input column on Grid -->\r\n <span *ngSwitchCase=\"'lookup_input'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <div class=\"close-icon-wrapper\">\r\n <input\r\n readonly\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"(column.disabled || column.editable === false) && column.displayField ? row[column.displayField] : typeOf(row[column.field]) === 'object' ?\r\n row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [name]=\"row[column.field]\"\r\n (keyup.tab)=\"selectLookupField(column, row)\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (click)=\"selectLookupField(column, row)\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n \t(blur)=\"onFocusOutEvent(column, row)\"\r\n />\r\n <div *ngIf=\"!allowDisabled(column,row)\"><button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\r\n ? row[column.field].text\r\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column,row)\"></button></div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span *ngIf=\"column.linkId\">\r\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' : '_blank'\"> \r\n {{\r\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n }}\r\n </a>\r\n </span>\r\n <span\r\n *ngIf=\"!column.linkId\"\r\n [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\r\n (click)=\"openLookupHyperlink(column, row)\"\r\n >\r\n {{\r\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- Numeric Input column on Grid -->\r\n <span *ngSwitchCase=\"'numeric'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <!-- for Currency && Decimal && Percent -->\r\n <span class=\"input-number\">\r\n <p-inputNumber\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n [class]=\"\r\n column.errorMessage\r\n ? 'ng-invalid ng-dirty'\r\n : 'form-control'\r\n \"\r\n [showButtons]=\"!column.format ? true : false\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [name]=\"column.field\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (ngModelChange)=\"onChangeEvent(column, row)\"\r\n (onBlur)=\"onFocusOutEvent(column, row)\"\r\n [mode]=\"\r\n column.format &&\r\n column.format.type === 'currency'\r\n ? 'currency'\r\n : 'decimal'\r\n \"\r\n [currency]=\"\r\n column.format &&\r\n column.format.type === 'currency' &&\r\n column.format.formatParams &&\r\n column.format.formatParams.currency\r\n ? column.format.formatParams.currency\r\n : 'USD'\r\n \"\r\n [locale]=\"\r\n column.format &&\r\n column.format.type === 'currency' &&\r\n column.format.formatParams &&\r\n column.format.formatParams.locale\r\n ? column.format.formatParams.locale\r\n : 'en-US'\r\n \"\r\n [minFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\r\n [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\r\n [suffix]=\"\r\n column.format &&\r\n column.format.type === 'percent' && !column?.format?.formatParams?.allowCalculate \r\n ? '%'\r\n : ''\r\n \"\r\n >\r\n </p-inputNumber>\r\n </span>\r\n <ng-template #locked_field\r\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\r\n {{ row[column.field] }}\r\n </span></ng-template\r\n >\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n [title]=\"setNumericFormat(column, row)\">\r\n {{\r\n setNumericFormat(column, row)\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n \r\n <!-- Button column on Grid -->\r\n <span [title]=\"column.value ? column.value : column.icon\">\r\n <div *ngSwitchCase=\"'add_button'\">\r\n <button *ngIf=\"!row.hidegridbtn\"\r\n pButton\r\n type=\"button\"\r\n [icon]=\"row[column.field]?.action?.icon ? row[column.field]?.action?.icon : column.icon\"\r\n [name]=\"column.header\"\r\n class=\"merge-btn\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [label]=\"row[column.field]?.action?.displayText ? row[column.field]?.action?.displayText : column.value\"\r\n [ngStyle]=\"{\r\n background: column.color ? column.color : ''\r\n }\"\r\n (click)=\"onClickButton(column, row)\"\r\n ></button>\r\n </div>\r\n </span>\r\n\r\n <!-- Date column on Grid -->\r\n <span\r\n *ngSwitchCase=\"'date'\"\r\n [title]=\"setConditionBaseValue(row,column)\"\r\n >\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-calendar\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n (onClose)=\"onFocusOutEvent(column, row)\"\r\n [appendTo]=\"'body'\"\r\n hourFormat=\"12\"\r\n [defaultDate]=\"defaultDate\"\r\n [stepMinute] = \"column.minutesInterval ? column.minutesInterval : 1\"\r\n [showTime]=\"column.showTime\"\r\n [timeOnly]=\"column.timeOnly\"\r\n [dateFormat]=\"column.format ? column.format : calendarFormat\"\r\n (keyup)=\"calenderInputValue(column, row)\"\r\n (onShow)=\"onClickEvent(column, row)\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n ></p-calendar>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n {{ setConditionBaseValue(row,column) }}\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n <span *ngSwitchDefault>\r\n <span [ngSwitch]=\"column.type\">\r\n <!-- Dropdown column on Grid -->\r\n <span\r\n *ngSwitchCase=\"'dropdown'\"\r\n [class]=\"dropdownInput ? '' : 'output-dropdown'\"\r\n [title]=\"\r\n setDropdwonReadOnlyValue(row, column)\r\n \"\r\n >\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-dropdown\r\n *ngIf=\"!row[column.field]?.action?.hidden\"\r\n [options]=\"\r\n row[column.field+'_data']\r\n ? row[column.field+'_data']\r\n : column.data\r\n \"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [placeholder]=\"row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field] ? row[column.field] : 'Select'\"\r\n [showClear]=\"row[column.field] ? true : false\"\r\n [optionLabel]=\"column.optionLabel\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [optionValue]=\"column.optionValue\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (onChange)=\"onChangeEvent(column, row)\"\r\n [filter]=\"column.allowSearch\"\r\n ></p-dropdown>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span *ngIf=\"!row[column.field]?.action?.hidden\">\r\n {{\r\n setDropdwonReadOnlyValue(row, column)\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- MultiSelect column on Grid -->\r\n <span *ngSwitchCase=\"'multi-select'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-multiSelect\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n type=\"text\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [options]=\"column.data\"\r\n [optionLabel]=\"column.optionLabel\"\r\n [optionValue]=\"column.optionValue\"\r\n (onChange)=\"onChangeEvent(column, row)\"\r\n (onPanelShow)=\"showOption(column, row)\"\r\n (click)=\"onClickEvent(column, row)\"\r\n [appendTo]=\"'body'\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n >\r\n </p-multiSelect>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n [title]=\"\r\n row[column.displayField]\r\n ? row[column.displayField]\r\n : setMultiSelectData(column, row[column.field])\r\n \"\r\n >\r\n {{\r\n row[column.displayField]\r\n ? row[column.displayField] :\r\n setMultiSelectData(column, row[column.field])\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <!-- AutoComplete Search -->\r\n <span\r\n *ngSwitchCase=\"'AutoComplete'\"\r\n >\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <p-autoComplete\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\n [name]=\"column.header\"\r\n [suggestions]=\"column.data\"\r\n [field]=\"column.displayField\"\r\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\" \r\n [dropdown]=\"column.showOption\"\r\n (onChange)=\"onChangeEvent(column, row)\"\r\n (click)=\"onClickEvent(column, row)\"\r\n (completeMethod)=\"autoSearch($event, column, row)\"\r\n (onBlur)=\"onFocusOutEvent(column, row)\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n [multiple]=\"true\"\r\n >\r\n </p-autoComplete>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\r\n <span *ngFor=\"let value of row[column.field]; let i = index\">\r\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ? value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\r\n </span>\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span> \r\n <!-- Add Generate Report Button -->\r\n <span *ngSwitchCase=\"'report'\"> \r\n <p-cellEditor> \r\n <ng-template pTemplate=\"output\">\r\n <se-generate-report-btn [repId]=\"column.reportId\" [params]=\"column.params\" [showDialog]=\"column.showDialog\"></se-generate-report-btn>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n\r\n <span *ngSwitchDefault>\r\n <!-- Input column on Grid -->\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <input\r\n pInputText\r\n type=\"text\"\r\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\r\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() ?\r\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\r\n [disabled]=\"allowDisabled(column,row)\"\r\n (blur)=\"onFocusOutEvent(column, row)\"\r\n (change)=\"onChangeEvent(column, row)\"\r\n (click)=\"onClickButton(column, row)\"\r\n *ngIf=\"column.field !== dataKey; else locked_field\"\r\n />\r\n <ng-template #locked_field\r\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\r\n {{ row[column.field] }}\r\n </span></ng-template\r\n >\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <span\r\n (click)=\"onClickEvent(column, row)\"\r\n [title]=\"\r\n column.displayText ? column.displayText : \r\n row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n \"\r\n >\r\n {{\r\n row[column.field]?.action ? row[column.field]?.text : column.displayText ? column.displayText : \r\n row[column.displayField]\r\n ? row[column.displayField]\r\n : row[column.field]\r\n }}\r\n </span>\r\n </ng-template>\r\n </p-cellEditor>\r\n </span>\r\n </span>\r\n </span>\r\n </td>\r\n <!-- Grid Rows Data Bindings End -->\r\n\r\n <!-- Action column on Grid -->\r\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\r\n <i\r\n [title]=\"action.tooltip\"\r\n [class]=\"action.icon\"\r\n (click)=\"handleActionClick($event, action, row)\"\r\n ></i>\r\n </span>\r\n </td>\r\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\r\n <span class='setActionColumnWidth'>\r\n <se-grid-row-actions\r\n [editing]=\"editing\"\r\n [editRowPermission]=\"editRowPermission\"\r\n [deleteRowPermission]=\"deleteRowPermission\"\r\n [row]=\"row\"\r\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\r\n (deleteRecordBtn)=\"deleteRecord($event)\"\r\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\r\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\r\n [editAllRows]=\"disabledSaveBtn\"\r\n >\r\n </se-grid-row-actions>\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Footer columns on Grid -->\r\n <ng-template pTemplate=\"footer\">\r\n <tr *ngIf=\"aggregateFooter\">\r\n <td *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\r\n <td *ngFor=\"let outerColumn of selectedColumns\" [style]=\"outerColumn.style\">\r\n <div *ngFor=\"let innerColumn of selectedColumns\">\r\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\r\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field.toLowerCase() === outerColumn.field.toLowerCase()) || aggr.displayField && aggr.displayField.toLowerCase() === outerColumn.field.toLowerCase())\">\r\n <div [innerHTML]=\"aggr.aggrValue\">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Footer for Empty Message columns on Grid -->\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"selectedColumns?.length + 1\">No records found.</td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n",
|
|
5433
5433
|
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}#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"]
|
|
5434
5434
|
},] }
|
|
5435
5435
|
];
|
|
@@ -6162,8 +6162,18 @@
|
|
|
6162
6162
|
//invoke when file upload OR delete a file
|
|
6163
6163
|
FormComponent.prototype.fileOnchangeEvent = function () {
|
|
6164
6164
|
var _this = this;
|
|
6165
|
+
var _a, _b;
|
|
6166
|
+
var cardControl = false;
|
|
6167
|
+
(_b = (_a = this.form) === null || _a === void 0 ? void 0 : _a.formSections) === null || _b === void 0 ? void 0 : _b.forEach(function (formSection) {
|
|
6168
|
+
var _a;
|
|
6169
|
+
if ((_a = formSection === null || formSection === void 0 ? void 0 : formSection.fields) === null || _a === void 0 ? void 0 : _a.some(function (formField) { return (formField === null || formField === void 0 ? void 0 : formField.control) === exports.EFormControl.CARD; })) {
|
|
6170
|
+
cardControl = true;
|
|
6171
|
+
}
|
|
6172
|
+
});
|
|
6165
6173
|
setTimeout(function () {
|
|
6166
|
-
|
|
6174
|
+
if (cardControl) {
|
|
6175
|
+
_this.loadDynamicComponents();
|
|
6176
|
+
}
|
|
6167
6177
|
}, 1000);
|
|
6168
6178
|
};
|
|
6169
6179
|
FormComponent.prototype.ngAfterViewInit = function () {
|
|
@@ -8683,7 +8693,7 @@
|
|
|
8683
8693
|
SeGlobalFilterComponent.decorators = [
|
|
8684
8694
|
{ type: i0.Component, args: [{
|
|
8685
8695
|
selector: 'se-global-filters',
|
|
8686
|
-
template: "<div class=\"p-d-flex p-flex-wrap p-flex-row row\">\r\n <div\r\n [class]=\"globalFilter.hidden ? '' : globalFilter.column ? 'p-col-' + globalFilter.column : 'p-col-3'\"\r\n *ngFor=\"let globalFilter of globalFilters\"\r\n >\r\n <div [ngSwitch]=\"globalFilter.type\">\r\n <!-- Calender control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CALENDAR\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText: 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [placeholder]=\"'Select-Date'\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [inputId]=\"globalFilter.field\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClose)=\"onFocusOutEvent(globalFilter)\"\r\n appendTo=\"body\"\r\n [showButtonBar]=\"true\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup)=\"calendarFocusEvent(globalFilter)\"\r\n >\r\n </p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Calender Range -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.CALENDAR_RANGE\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showPrevious(globalFilter)\"\r\n label=\"Previous {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} <<\"\r\n ></button>\r\n <label class=\"size-10\"\r\n >\r\n <span [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"></span>\r\n <span *ngIf=\"globalFilter.prefix===true || globalFilter.prefix===undefined\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : '' }}\r\n </span>\r\n {{\r\n startDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n to\r\n {{\r\n endDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n <span *ngIf=\"globalFilter.prefix===false\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : ''}}\r\n </span></label\r\n >\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showNext(globalFilter)\"\r\n label=\"Next {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} >>\"\r\n ></button>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Checkbox Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CHECKBOX\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-checkbox\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty': 'p-d-flex p-ai-center'\"\r\n [binary]=\"true\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n ></p-checkbox>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Spacer Control -->\r\n <span *ngIf=\"!globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.SPACER\"\r\n >\r\n <span\r\n [class]=\"\r\n globalFilter.column\r\n ? 'p-col-' + globalFilter.column\r\n : ''\r\n \"\r\n ></span>\r\n </div>\r\n </span>\r\n\r\n <!-- Dropdown Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DROPDOWN\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-dropdown\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [name]=\"globalFilter.displayText\"\r\n [showClear]=\"true\"\r\n [styleClass]=\"globalFilter.field\"\r\n (keyup.Tab)=\"tabFocusEvent(globalFilter)\"\r\n [placeholder]=\"globalFilter.displayText\"\r\n [options]=\"globalFilter.data || []\"\r\n [optionLabel]=\"globalFilter.optionLabel\"\r\n [optionValue]=\"globalFilter.optionValue\"\r\n [filter]=\"globalFilter.allowSearch\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-dropdown>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Input control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.INPUT\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-flex-nowrap align-items-center\">\r\n <input\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1'\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- NumericInput control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERICINPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <input\r\n type=\"number\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n \r\n <!-- Date Range Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DATE_RANGE\">\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar \r\n #rangeCalendar\r\n [showButtonBar]=\"true\"\r\n todayButtonStyleClass=\"p-d-none\"\r\n clearButtonStyleClass=\"p-ml-auto\"\r\n [inputId]=\"globalFilter.displayText\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText : 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [(ngModel)]=\"globalFilter.value\" \r\n selectionMode=\"range\" \r\n appendTo=\"body\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClickOutside)=\"setDateRangeFilterValue(globalFilter)\"\r\n (onBlur)=\"setDateRangeFilterValue(globalFilter)\"\r\n (keyup)=\"calendarFocusEvent(globalFilter, $event)\"\r\n (onClearClick)=\"clearDateRangeValue(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup.enter)=\"applyFilters(true, globalFilter)\"\r\n ></p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Numeric Range control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERIC_RANGE\"\r\n >\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex\">\r\n <div class=\"p-d-flex flex-nowrap align-items-center p-mr-2\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n (onBlur)=\"setNumericRangeValueFrom(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueFrom(globalFilter,true)\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 grow-1 input-number'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n <span class=\"to-numeric\">To</span>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.valueTwo\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1 input-number'\"\r\n (onBlur)=\"setNumericRangeValueTwo(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueTwo(globalFilter,true)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- MultiSelect control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.MULTISELECT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-multiSelect\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [options]=\"globalFilter.data\"\r\n optionLabel=\"label\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n optionValue=\"value\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n [appendTo]=\"'body'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-multiSelect>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Lookup Control Field -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.LOOKUP_INPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <input\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"globalFilter.field\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [name]=\"globalFilter.field\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (click)=\"selectLookupField(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Apply button -->\r\n\r\n<button\r\n*ngIf=\"searchGlobalFilterBtn\"\r\npButton\r\ntype=\"button\"\r\nicon=\"pi pi-search\"\r\nid=\"globalSearchbtn\"\r\n(click)=\"applyFilters()\"\r\nclass=\"p-button-success align-globalFilter-btn p-mb-2\"\r\n></button>\r\n\r\n<!-- Close button -->\r\n<button\r\n*ngIf=\"clearGlobalFilterBtn\"\r\npButton\r\nid=\"clearGlobalFilterBtn\"\r\ntype=\"button\"\r\nicon=\"fa-solid fa-rotate-left\"\r\n(click)=\"clearFilters()\"\r\n[class]=\"hideClearFilterBtn ? 'p-button-success p-mb-2 p-ml-3 align-globalFilter-btn' : 'hide-Global-clear-filter-button'\"\r\n></button>\r\n",
|
|
8696
|
+
template: "<div class=\"p-d-flex p-flex-wrap p-flex-row row\">\r\n <div\r\n [class]=\"globalFilter.hidden ? '' : globalFilter.column ? 'p-col-' + globalFilter.column : 'p-col-3'\"\r\n *ngFor=\"let globalFilter of globalFilters\"\r\n >\r\n <div [ngSwitch]=\"globalFilter.type\">\r\n <!-- Calender control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CALENDAR\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText: 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [placeholder]=\"'Select-Date'\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [inputId]=\"globalFilter.field\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClose)=\"onFocusOutEvent(globalFilter)\"\r\n appendTo=\"body\"\r\n [showButtonBar]=\"true\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup)=\"calendarFocusEvent(globalFilter)\"\r\n >\r\n </p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Calender Range -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.CALENDAR_RANGE\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showPrevious(globalFilter)\"\r\n label=\"Previous {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} <<\"\r\n ></button>\r\n <label class=\"size-10\"\r\n >\r\n <span [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"></span>\r\n <span *ngIf=\"globalFilter.prefix===true || globalFilter.prefix===undefined\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : '' }}\r\n </span>\r\n {{\r\n startDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n to\r\n {{\r\n endDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n <span *ngIf=\"globalFilter.prefix===false\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : ''}}\r\n </span></label\r\n >\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showNext(globalFilter)\"\r\n label=\"Next {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} >>\"\r\n ></button>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Checkbox Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CHECKBOX\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-checkbox\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty': 'p-d-flex p-ai-center'\"\r\n [binary]=\"true\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n ></p-checkbox>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Spacer Control -->\r\n <span *ngIf=\"!globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.SPACER\"\r\n >\r\n <span\r\n [class]=\"\r\n globalFilter.column\r\n ? 'p-col-' + globalFilter.column\r\n : ''\r\n \"\r\n ></span>\r\n </div>\r\n </span>\r\n\r\n <!-- Dropdown Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DROPDOWN\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-dropdown\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [name]=\"globalFilter.displayText\"\r\n [showClear]=\"true\"\r\n [styleClass]=\"globalFilter.field\"\r\n (keyup.Tab)=\"tabFocusEvent(globalFilter)\"\r\n [placeholder]=\"globalFilter.displayText\"\r\n [options]=\"globalFilter.data || []\"\r\n [optionLabel]=\"globalFilter.optionLabel\"\r\n [optionValue]=\"globalFilter.optionValue\"\r\n [filter]=\"globalFilter.allowSearch\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-dropdown>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Input control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.INPUT\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-flex-nowrap align-items-center\">\r\n <input\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1'\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- NumericInput control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERICINPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <input\r\n type=\"number\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n \r\n <!-- Date Range Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DATE_RANGE\">\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar \r\n #rangeCalendar\r\n [showButtonBar]=\"true\"\r\n todayButtonStyleClass=\"p-d-none\"\r\n clearButtonStyleClass=\"p-ml-auto\"\r\n [inputId]=\"globalFilter.displayText\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText : 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [(ngModel)]=\"globalFilter.value\" \r\n selectionMode=\"range\" \r\n appendTo=\"body\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClickOutside)=\"setDateRangeFilterValue(globalFilter)\"\r\n (onBlur)=\"setDateRangeFilterValue(globalFilter)\"\r\n (keyup)=\"calendarFocusEvent(globalFilter, $event)\"\r\n (onClearClick)=\"clearDateRangeValue(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup.enter)=\"applyFilters(true, globalFilter)\"\r\n ></p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Numeric Range control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERIC_RANGE\"\r\n >\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex\">\r\n <div class=\"p-d-flex flex-nowrap align-items-center p-mr-2\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n (onBlur)=\"setNumericRangeValueFrom(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueFrom(globalFilter,true)\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 grow-1 input-number'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n <span class=\"to-numeric\">To</span>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.valueTwo\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1 input-number'\"\r\n (onBlur)=\"setNumericRangeValueTwo(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueTwo(globalFilter,true)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- MultiSelect control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.MULTISELECT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-multiSelect\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [options]=\"globalFilter.data\"\r\n optionLabel=\"label\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n optionValue=\"value\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n [appendTo]=\"'body'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-multiSelect>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Lookup Control Field -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.LOOKUP_INPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <input\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"globalFilter.field\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [name]=\"globalFilter.field\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (click)=\"selectLookupField(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Apply button -->\r\n\r\n<button\r\n*ngIf=\"searchGlobalFilterBtn\"\r\npButton\r\ntype=\"button\"\r\nicon=\"pi pi-search\"\r\nid=\"globalSearchbtn\"\r\n(click)=\"applyFilters()\"\r\nclass=\"p-button-success align-globalFilter-btn p-mb-2\"\r\n></button>\r\n\r\n<!-- Close button -->\r\n<button\r\n*ngIf=\"clearGlobalFilterBtn\"\r\npButton\r\nid=\"clearGlobalFilterBtn\"\r\ntype=\"button\"\r\nicon=\"pi pi-refresh\"\r\n(click)=\"clearFilters()\"\r\n[class]=\"hideClearFilterBtn ? 'p-button-success p-mb-2 p-ml-3 align-globalFilter-btn' : 'hide-Global-clear-filter-button'\"\r\n></button>\r\n",
|
|
8687
8697
|
styles: ["*{font-family:\"Lato\",sans-serif}.pi{font-family:\"primeicons\"}#toast-container{background:black}.grow-1{flex-grow:1}.w-100{width:100%}.size-10{font-size:10px}.center-content{width:100%!important}.custom-link{color:#4e87f1;cursor:pointer;text-decoration:none}.center-content+app-sidebar{position:relative}.row{margin-left:-.5rem;margin-right:-.5rem}p-calendar{display:flex;justify-content:stretch}p-checkbox{height:42px}.p-dialog .p-dialog-content{overflow:visible!important}:host ::ng-deep input,:host ::ng-deep p-calendar,:host ::ng-deep .p-calendar,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .custom-btn button{background:#efefef;border:#eee;border-radius:0;padding:5px 15px;font-size:12px;color:#585858;margin:0 5px}:host ::ng-deep .custom-btn button:hover{background-color:#dad5d5;color:#000}:host ::ng-deep .input-number{border:0;border-radius:2px;padding:5px 6px}:host ::ng-deep .input-number input{margin:-8px -23px -8px -8px;border:0;padding-right:10px;border-radius:3px}:host ::ng-deep .input-number button{color:#2d2d2d;width:15px;height:6;border:0;background-color:#fff}: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 .input-number .p-inputnumber-button-group{visibility:hidden}:host ::ng-deep .input-number:hover .p-inputnumber-button-group{visibility:visible}:host ::ng-deep .to-numeric{font-size:13px;margin:3px;color:#636363;padding-top:4px}.error{color:red}.hide-Global-clear-filter-button{display:none}.align-globalFilter-btn{float:left;margin:10px 5px 0 0}\n"]
|
|
8688
8698
|
},] }
|
|
8689
8699
|
];
|