@rangertechnologies/ngnxt 2.1.290 → 2.1.291
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/fesm2022/rangertechnologies-ngnxt.mjs +64 -53
- package/fesm2022/rangertechnologies-ngnxt.mjs.map +1 -1
- package/lib/components/file-upload/file-upload.component.d.ts +1 -4
- package/lib/components/list-view-filter/list-view-filter.component.d.ts +5 -2
- package/lib/pages/questionbook/questionbook.component.d.ts +0 -1
- package/package.json +1 -1
- package/rangertechnologies-ngnxt-2.1.291.tgz +0 -0
- package/rangertechnologies-ngnxt-2.1.290.tgz +0 -0
|
@@ -48373,11 +48373,11 @@ class NxtPagination {
|
|
|
48373
48373
|
this.event.emit({ "length": this.collectionSize, "pageSize": this.pageSize, "pageIndex": this.currentPage });
|
|
48374
48374
|
}
|
|
48375
48375
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NxtPagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
48376
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: NxtPagination, isStandalone: true, selector: "nxt-pagination", inputs: { pageSizeOptions: "pageSizeOptions", collectionSize: "collectionSize", pageSize: "pageSize", currentPage: "currentPage", maxSize: "maxSize", firstLastButtons: "firstLastButtons", nextPreviousButtons: "nextPreviousButtons", small: "small" }, outputs: { event: "event" }, usesOnChanges: true, ngImport: i0, template: "<!-- SKS24JAN25 -->\n<div class=\"flex content-space-between main-cont\">\n <div class=\"info\">\n <div *ngIf=\"endIndex\">\n {{'SHOWING_DATA' | nxtCustomTranslate : 'Showing data'}} {{ startIndex + 1 }} {{'TO' | nxtCustomTranslate : 'to'}} {{ endIndex }} {{'OF' | nxtCustomTranslate : 'of'}} {{ collectionSize }} {{'ENTRIES' | nxtCustomTranslate : 'entries'}} \n </div>\n </div>\n <div>\n <ul [class]=\"small ? 'pagination pagination-sm' : 'pagination'\" style=\"align-items: center;\">\n <!-- select button -->\n <div style=\"font-size: 14px; font-weight: 400; padding-right: 10px; align-items: center;\" for=\"perPage\">{{'RESULT_PER_PAGE' | nxtCustomTranslate : 'Result per page'}}</div>\n <div class=\"dropdown-wrapper\">\n <select id=\"perPage\" [ngModel]=\"pageSize\" (ngModelChange)=\"onPageSizeChange($event)\">\n <option *ngFor=\"let size of pageSizeOptions\" [value]=\"size\">{{ size }}</option>\n </select>\n <svg class=\"dropdown-arrow\" width=\"9\" height=\"6\" viewBox=\"0 0 9 6\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.684136 0.767477C0.922999 0.5378 1.30282 0.545248 1.5325 0.784111L4.5 3.93431L7.4675 0.784111C7.69718 0.545248 8.077 0.5378 8.31587 0.767477C8.55473 0.997153 8.56218 1.37698 8.3325 1.61584L4.9325 5.21584C4.81938 5.33349 4.66321 5.39998 4.5 5.39998C4.33679 5.39998 4.18062 5.33349 4.0675 5.21584L0.667501 1.61584C0.437825 1.37698 0.445272 0.997153 0.684136 0.767477Z\" fill=\"#626262\"/>\n </svg> \n </div> \n <!-- first button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\" >\n <button class=\"page-link\" (click)=\"selectPageNumber(1)\">\u00AB\u00AB</button>\n </li>\n <!-- last button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\">\n <button class=\"page-link\" (click)=\"selectPageNumber(totalPages.length)\">\u00BB\u00BB</button>\n </li>\n <!-- previous button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\" >\n <button class=\"page-link\" (click)=\"previous()\">\u00AB</button>\n </li>\n <!-- page numbers -->\n <ng-container *ngFor=\"let p of totalPages; index as i\">\n <li *ngIf=\"i + 1 >= currentPage - maxSize && i + 1 <= currentPage + maxSize\" [class]=\"currentPage === i + 1 ? 'page-item active' : 'page-item'\">\n <button class=\"page-link\" (click)=\"selectPageNumber(i + 1)\">\n {{ i + 1 }}\n </button>\n </li>\n </ng-container>\n <!-- next button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\">\n <button class=\"page-link\" (click)=\"next()\">\u00BB</button>\n </li>\n </ul>\n </div>\n </div>\n ", styles: [".info{color:#b5b7c0;font-size:14px;font-weight:500}button{background:#f5f5f5;border:1px solid #E9E9E9;padding:2px 10px;cursor:pointer;transition:.3s}button:hover{border:1px solid #E9E9E9;background:#fff;color:#404b52!important}button:disabled{opacity:.5;color:#73797d;cursor:not-allowed}button.active{background:#5088ff;color:#fff;border-color:#5088ff}select{margin-right:10px}select.value{font-size:2px;margin-right:10px}.main-cont{align-items:center}#perPage{font-size:14px;color:#313131;background-color:#fff;border:1px solid #E9E9E9;border-radius:4px;padding-top:2px;padding-left:7px;padding-bottom:2px;font-weight:400;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative}#perPage:hover{background-color:#f5f5f5;color:#404b52!important}.dropdown-wrapper{position:relative;display:inline-block;width:60px;margin-right:10px}.dropdown-wrapper select{width:88%;padding:7px;font-size:16px;border:1px solid #ccc;border-radius:4px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background:none}.dropdown-wrapper .dropdown-arrow{position:absolute;right:15px;top:50%;transform:translateY(-50%);pointer-events:none;color:#333}li{color:#404b52!important;font-family:inter,sans-serif!important;font-size:12px!important;padding:6px!important}::ng-deep .pagination{--bs-pagination-font-size: none !important;margin-bottom:unset}::ng-deep .page-item:not(:first-child) .page-link{border-radius:4px!important}.page-link{color:#404b52!important}::ng-deep .page-link.active,.active>.page-link{color:#fff!important}::ng-deep .page-link.active:hover,.active>.page-link:hover{color:#000!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }] });
|
|
48376
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: NxtPagination, isStandalone: true, selector: "nxt-pagination", inputs: { pageSizeOptions: "pageSizeOptions", collectionSize: "collectionSize", pageSize: "pageSize", currentPage: "currentPage", maxSize: "maxSize", firstLastButtons: "firstLastButtons", nextPreviousButtons: "nextPreviousButtons", small: "small" }, outputs: { event: "event" }, usesOnChanges: true, ngImport: i0, template: "<!-- SKS24JAN25 -->\n<div class=\"flex content-space-between main-cont\">\n <div class=\"info\" style=\"padding-left: 6px;\">\n <div *ngIf=\"endIndex\">\n {{'SHOWING_DATA' | nxtCustomTranslate : 'Showing data'}} {{ startIndex + 1 }} {{'TO' | nxtCustomTranslate : 'to'}} {{ endIndex }} {{'OF' | nxtCustomTranslate : 'of'}} {{ collectionSize }} {{'ENTRIES' | nxtCustomTranslate : 'entries'}} \n </div>\n </div>\n <div>\n <ul [class]=\"small ? 'pagination pagination-sm' : 'pagination'\" style=\"align-items: center;\">\n <!-- select button -->\n <div style=\"font-size: 14px; font-weight: 400; padding-right: 10px; align-items: center;\" for=\"perPage\">{{'RESULT_PER_PAGE' | nxtCustomTranslate : 'Result per page'}}</div>\n <div class=\"dropdown-wrapper\">\n <select id=\"perPage\" [ngModel]=\"pageSize\" (ngModelChange)=\"onPageSizeChange($event)\">\n <option *ngFor=\"let size of pageSizeOptions\" [value]=\"size\">{{ size }}</option>\n </select>\n <svg class=\"dropdown-arrow\" width=\"9\" height=\"6\" viewBox=\"0 0 9 6\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.684136 0.767477C0.922999 0.5378 1.30282 0.545248 1.5325 0.784111L4.5 3.93431L7.4675 0.784111C7.69718 0.545248 8.077 0.5378 8.31587 0.767477C8.55473 0.997153 8.56218 1.37698 8.3325 1.61584L4.9325 5.21584C4.81938 5.33349 4.66321 5.39998 4.5 5.39998C4.33679 5.39998 4.18062 5.33349 4.0675 5.21584L0.667501 1.61584C0.437825 1.37698 0.445272 0.997153 0.684136 0.767477Z\" fill=\"#626262\"/>\n </svg> \n </div> \n <!-- first button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\" >\n <button class=\"page-link\" (click)=\"selectPageNumber(1)\">\u00AB\u00AB</button>\n </li>\n <!-- last button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\">\n <button class=\"page-link\" (click)=\"selectPageNumber(totalPages.length)\">\u00BB\u00BB</button>\n </li>\n <!-- previous button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\" >\n <button class=\"page-link\" (click)=\"previous()\">\u00AB</button>\n </li>\n <!-- page numbers -->\n <ng-container *ngFor=\"let p of totalPages; index as i\">\n <li *ngIf=\"i + 1 >= currentPage - maxSize && i + 1 <= currentPage + maxSize\" [class]=\"currentPage === i + 1 ? 'page-item active' : 'page-item'\">\n <button class=\"page-link\" (click)=\"selectPageNumber(i + 1)\">\n {{ i + 1 }}\n </button>\n </li>\n </ng-container>\n <!-- next button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\">\n <button class=\"page-link\" (click)=\"next()\">\u00BB</button>\n </li>\n </ul>\n </div>\n </div>\n ", styles: [".info{color:#b5b7c0;font-size:14px;font-weight:500}button{background:#f5f5f5;border:1px solid #E9E9E9;padding:2px 10px;cursor:pointer;transition:.3s}button:hover{border:1px solid #E9E9E9;background:#fff;color:#404b52!important}button:disabled{opacity:.5;color:#73797d;cursor:not-allowed}button.active{background:#5088ff;color:#fff;border-color:#5088ff}select{margin-right:10px}select.value{font-size:2px;margin-right:10px}.main-cont{align-items:center}#perPage{font-size:14px;color:#313131;background-color:#fff;border:1px solid #E9E9E9;border-radius:4px;padding-top:2px;padding-left:7px;padding-bottom:2px;font-weight:400;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative}#perPage:hover{background-color:#f5f5f5;color:#404b52!important}.dropdown-wrapper{position:relative;display:inline-block;width:60px;margin-right:10px}.dropdown-wrapper select{width:88%;padding:7px;font-size:16px;border:1px solid #ccc;border-radius:4px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background:none}.dropdown-wrapper .dropdown-arrow{position:absolute;right:15px;top:50%;transform:translateY(-50%);pointer-events:none;color:#333}li{color:#404b52!important;font-family:inter,sans-serif!important;font-size:12px!important;padding:6px!important}::ng-deep .pagination{--bs-pagination-font-size: none !important;margin-bottom:unset}::ng-deep .page-item:not(:first-child) .page-link{border-radius:4px!important}.page-link{color:#404b52!important}::ng-deep .page-link.active,.active>.page-link{color:#fff!important}::ng-deep .page-link.active:hover,.active>.page-link:hover{color:#000!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }] });
|
|
48377
48377
|
}
|
|
48378
48378
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NxtPagination, decorators: [{
|
|
48379
48379
|
type: Component,
|
|
48380
|
-
args: [{ selector: 'nxt-pagination', standalone: true, imports: [CommonModule, FormsModule, NxtCustomTranslatePipe], template: "<!-- SKS24JAN25 -->\n<div class=\"flex content-space-between main-cont\">\n <div class=\"info\">\n <div *ngIf=\"endIndex\">\n {{'SHOWING_DATA' | nxtCustomTranslate : 'Showing data'}} {{ startIndex + 1 }} {{'TO' | nxtCustomTranslate : 'to'}} {{ endIndex }} {{'OF' | nxtCustomTranslate : 'of'}} {{ collectionSize }} {{'ENTRIES' | nxtCustomTranslate : 'entries'}} \n </div>\n </div>\n <div>\n <ul [class]=\"small ? 'pagination pagination-sm' : 'pagination'\" style=\"align-items: center;\">\n <!-- select button -->\n <div style=\"font-size: 14px; font-weight: 400; padding-right: 10px; align-items: center;\" for=\"perPage\">{{'RESULT_PER_PAGE' | nxtCustomTranslate : 'Result per page'}}</div>\n <div class=\"dropdown-wrapper\">\n <select id=\"perPage\" [ngModel]=\"pageSize\" (ngModelChange)=\"onPageSizeChange($event)\">\n <option *ngFor=\"let size of pageSizeOptions\" [value]=\"size\">{{ size }}</option>\n </select>\n <svg class=\"dropdown-arrow\" width=\"9\" height=\"6\" viewBox=\"0 0 9 6\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.684136 0.767477C0.922999 0.5378 1.30282 0.545248 1.5325 0.784111L4.5 3.93431L7.4675 0.784111C7.69718 0.545248 8.077 0.5378 8.31587 0.767477C8.55473 0.997153 8.56218 1.37698 8.3325 1.61584L4.9325 5.21584C4.81938 5.33349 4.66321 5.39998 4.5 5.39998C4.33679 5.39998 4.18062 5.33349 4.0675 5.21584L0.667501 1.61584C0.437825 1.37698 0.445272 0.997153 0.684136 0.767477Z\" fill=\"#626262\"/>\n </svg> \n </div> \n <!-- first button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\" >\n <button class=\"page-link\" (click)=\"selectPageNumber(1)\">\u00AB\u00AB</button>\n </li>\n <!-- last button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\">\n <button class=\"page-link\" (click)=\"selectPageNumber(totalPages.length)\">\u00BB\u00BB</button>\n </li>\n <!-- previous button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\" >\n <button class=\"page-link\" (click)=\"previous()\">\u00AB</button>\n </li>\n <!-- page numbers -->\n <ng-container *ngFor=\"let p of totalPages; index as i\">\n <li *ngIf=\"i + 1 >= currentPage - maxSize && i + 1 <= currentPage + maxSize\" [class]=\"currentPage === i + 1 ? 'page-item active' : 'page-item'\">\n <button class=\"page-link\" (click)=\"selectPageNumber(i + 1)\">\n {{ i + 1 }}\n </button>\n </li>\n </ng-container>\n <!-- next button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\">\n <button class=\"page-link\" (click)=\"next()\">\u00BB</button>\n </li>\n </ul>\n </div>\n </div>\n ", styles: [".info{color:#b5b7c0;font-size:14px;font-weight:500}button{background:#f5f5f5;border:1px solid #E9E9E9;padding:2px 10px;cursor:pointer;transition:.3s}button:hover{border:1px solid #E9E9E9;background:#fff;color:#404b52!important}button:disabled{opacity:.5;color:#73797d;cursor:not-allowed}button.active{background:#5088ff;color:#fff;border-color:#5088ff}select{margin-right:10px}select.value{font-size:2px;margin-right:10px}.main-cont{align-items:center}#perPage{font-size:14px;color:#313131;background-color:#fff;border:1px solid #E9E9E9;border-radius:4px;padding-top:2px;padding-left:7px;padding-bottom:2px;font-weight:400;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative}#perPage:hover{background-color:#f5f5f5;color:#404b52!important}.dropdown-wrapper{position:relative;display:inline-block;width:60px;margin-right:10px}.dropdown-wrapper select{width:88%;padding:7px;font-size:16px;border:1px solid #ccc;border-radius:4px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background:none}.dropdown-wrapper .dropdown-arrow{position:absolute;right:15px;top:50%;transform:translateY(-50%);pointer-events:none;color:#333}li{color:#404b52!important;font-family:inter,sans-serif!important;font-size:12px!important;padding:6px!important}::ng-deep .pagination{--bs-pagination-font-size: none !important;margin-bottom:unset}::ng-deep .page-item:not(:first-child) .page-link{border-radius:4px!important}.page-link{color:#404b52!important}::ng-deep .page-link.active,.active>.page-link{color:#fff!important}::ng-deep .page-link.active:hover,.active>.page-link:hover{color:#000!important}\n"] }]
|
|
48380
|
+
args: [{ selector: 'nxt-pagination', standalone: true, imports: [CommonModule, FormsModule, NxtCustomTranslatePipe], template: "<!-- SKS24JAN25 -->\n<div class=\"flex content-space-between main-cont\">\n <div class=\"info\" style=\"padding-left: 6px;\">\n <div *ngIf=\"endIndex\">\n {{'SHOWING_DATA' | nxtCustomTranslate : 'Showing data'}} {{ startIndex + 1 }} {{'TO' | nxtCustomTranslate : 'to'}} {{ endIndex }} {{'OF' | nxtCustomTranslate : 'of'}} {{ collectionSize }} {{'ENTRIES' | nxtCustomTranslate : 'entries'}} \n </div>\n </div>\n <div>\n <ul [class]=\"small ? 'pagination pagination-sm' : 'pagination'\" style=\"align-items: center;\">\n <!-- select button -->\n <div style=\"font-size: 14px; font-weight: 400; padding-right: 10px; align-items: center;\" for=\"perPage\">{{'RESULT_PER_PAGE' | nxtCustomTranslate : 'Result per page'}}</div>\n <div class=\"dropdown-wrapper\">\n <select id=\"perPage\" [ngModel]=\"pageSize\" (ngModelChange)=\"onPageSizeChange($event)\">\n <option *ngFor=\"let size of pageSizeOptions\" [value]=\"size\">{{ size }}</option>\n </select>\n <svg class=\"dropdown-arrow\" width=\"9\" height=\"6\" viewBox=\"0 0 9 6\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.684136 0.767477C0.922999 0.5378 1.30282 0.545248 1.5325 0.784111L4.5 3.93431L7.4675 0.784111C7.69718 0.545248 8.077 0.5378 8.31587 0.767477C8.55473 0.997153 8.56218 1.37698 8.3325 1.61584L4.9325 5.21584C4.81938 5.33349 4.66321 5.39998 4.5 5.39998C4.33679 5.39998 4.18062 5.33349 4.0675 5.21584L0.667501 1.61584C0.437825 1.37698 0.445272 0.997153 0.684136 0.767477Z\" fill=\"#626262\"/>\n </svg> \n </div> \n <!-- first button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\" >\n <button class=\"page-link\" (click)=\"selectPageNumber(1)\">\u00AB\u00AB</button>\n </li>\n <!-- last button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"firstLastButtons\">\n <button class=\"page-link\" (click)=\"selectPageNumber(totalPages.length)\">\u00BB\u00BB</button>\n </li>\n <!-- previous button -->\n <li [class]=\"currentPage === 1 ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\" >\n <button class=\"page-link\" (click)=\"previous()\">\u00AB</button>\n </li>\n <!-- page numbers -->\n <ng-container *ngFor=\"let p of totalPages; index as i\">\n <li *ngIf=\"i + 1 >= currentPage - maxSize && i + 1 <= currentPage + maxSize\" [class]=\"currentPage === i + 1 ? 'page-item active' : 'page-item'\">\n <button class=\"page-link\" (click)=\"selectPageNumber(i + 1)\">\n {{ i + 1 }}\n </button>\n </li>\n </ng-container>\n <!-- next button -->\n <li [class]=\"currentPage === totalPages.length ? 'page-item disabled' : 'page-item'\" *ngIf=\"nextPreviousButtons\">\n <button class=\"page-link\" (click)=\"next()\">\u00BB</button>\n </li>\n </ul>\n </div>\n </div>\n ", styles: [".info{color:#b5b7c0;font-size:14px;font-weight:500}button{background:#f5f5f5;border:1px solid #E9E9E9;padding:2px 10px;cursor:pointer;transition:.3s}button:hover{border:1px solid #E9E9E9;background:#fff;color:#404b52!important}button:disabled{opacity:.5;color:#73797d;cursor:not-allowed}button.active{background:#5088ff;color:#fff;border-color:#5088ff}select{margin-right:10px}select.value{font-size:2px;margin-right:10px}.main-cont{align-items:center}#perPage{font-size:14px;color:#313131;background-color:#fff;border:1px solid #E9E9E9;border-radius:4px;padding-top:2px;padding-left:7px;padding-bottom:2px;font-weight:400;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative}#perPage:hover{background-color:#f5f5f5;color:#404b52!important}.dropdown-wrapper{position:relative;display:inline-block;width:60px;margin-right:10px}.dropdown-wrapper select{width:88%;padding:7px;font-size:16px;border:1px solid #ccc;border-radius:4px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background:none}.dropdown-wrapper .dropdown-arrow{position:absolute;right:15px;top:50%;transform:translateY(-50%);pointer-events:none;color:#333}li{color:#404b52!important;font-family:inter,sans-serif!important;font-size:12px!important;padding:6px!important}::ng-deep .pagination{--bs-pagination-font-size: none !important;margin-bottom:unset}::ng-deep .page-item:not(:first-child) .page-link{border-radius:4px!important}.page-link{color:#404b52!important}::ng-deep .page-link.active,.active>.page-link{color:#fff!important}::ng-deep .page-link.active:hover,.active>.page-link:hover{color:#000!important}\n"] }]
|
|
48381
48381
|
}], ctorParameters: () => [], propDecorators: { event: [{
|
|
48382
48382
|
type: Output
|
|
48383
48383
|
}], pageSizeOptions: [{
|
|
@@ -48532,7 +48532,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
48532
48532
|
class ListViewFilterComponent {
|
|
48533
48533
|
fb;
|
|
48534
48534
|
nxtCustomTranslate;
|
|
48535
|
+
dataService;
|
|
48535
48536
|
listViews = [];
|
|
48537
|
+
tableData = [];
|
|
48536
48538
|
tableFilterArray = [];
|
|
48537
48539
|
selectedView = '';
|
|
48538
48540
|
displayedColumns = [];
|
|
@@ -48574,9 +48576,10 @@ class ListViewFilterComponent {
|
|
|
48574
48576
|
"_id": "6818bfe226163850ecb084ee",
|
|
48575
48577
|
"id": "6818bfe226163850ecb084ee"
|
|
48576
48578
|
};
|
|
48577
|
-
constructor(fb, nxtCustomTranslate) {
|
|
48579
|
+
constructor(fb, nxtCustomTranslate, dataService) {
|
|
48578
48580
|
this.fb = fb;
|
|
48579
48581
|
this.nxtCustomTranslate = nxtCustomTranslate;
|
|
48582
|
+
this.dataService = dataService;
|
|
48580
48583
|
this.editingView = this.fb.group({
|
|
48581
48584
|
filterName: ['', Validators.required],
|
|
48582
48585
|
order: [0, [Validators.required, Validators.min(0)]],
|
|
@@ -48610,6 +48613,28 @@ class ListViewFilterComponent {
|
|
|
48610
48613
|
this.selectedViewPath = this.selectedView === 'All Data' ? this.listViews[0].labelPath : this.selectedView;
|
|
48611
48614
|
}
|
|
48612
48615
|
}
|
|
48616
|
+
// SKS9oct25 filter condtion lable retain
|
|
48617
|
+
if (this.listViews?.length > 0 && this.displayedColumns?.length > 0) {
|
|
48618
|
+
for (const listView of this.listViews) {
|
|
48619
|
+
if (listView?.conditions?.length > 0) {
|
|
48620
|
+
for (const cond of listView?.conditions) {
|
|
48621
|
+
for (const col of this.displayedColumns) {
|
|
48622
|
+
if (cond.field === col.filterField) {
|
|
48623
|
+
cond.field = col.label;
|
|
48624
|
+
}
|
|
48625
|
+
if (cond.field === col.label && col.filterValue) {
|
|
48626
|
+
for (const tableData of this.tableData) {
|
|
48627
|
+
let res = this.dataService.getValue(tableData, col.filterValue);
|
|
48628
|
+
if (res === cond.value) {
|
|
48629
|
+
cond.value = this.dataService.getValue(tableData, col.fieldName) || cond.value;
|
|
48630
|
+
}
|
|
48631
|
+
}
|
|
48632
|
+
}
|
|
48633
|
+
}
|
|
48634
|
+
}
|
|
48635
|
+
}
|
|
48636
|
+
}
|
|
48637
|
+
}
|
|
48613
48638
|
if (this.tableFilterArray) {
|
|
48614
48639
|
this.tableFilterArrayTrans = this.tableFilterArray;
|
|
48615
48640
|
this.tableFilterArrayTrans.forEach((ele) => {
|
|
@@ -48662,6 +48687,28 @@ class ListViewFilterComponent {
|
|
|
48662
48687
|
this.selectedViewPath = this.selectedView === 'All Data' ? this.listViews[0].labelPath : this.selectedView;
|
|
48663
48688
|
}
|
|
48664
48689
|
}
|
|
48690
|
+
// SKS9oct25 filter condtion lable retain
|
|
48691
|
+
if (this.listViews?.length > 0 && this.displayedColumns?.length > 0) {
|
|
48692
|
+
for (const listView of this.listViews) {
|
|
48693
|
+
if (listView?.conditions?.length > 0) {
|
|
48694
|
+
for (const cond of listView?.conditions) {
|
|
48695
|
+
for (const col of this.displayedColumns) {
|
|
48696
|
+
if (cond.field === col.filterField) {
|
|
48697
|
+
cond.field = col.label;
|
|
48698
|
+
}
|
|
48699
|
+
if (cond.field === col.label && col.filterValue) {
|
|
48700
|
+
for (const tableData of this.tableData) {
|
|
48701
|
+
let res = this.dataService.getValue(tableData, col.filterValue);
|
|
48702
|
+
if (res === cond.value) {
|
|
48703
|
+
cond.value = this.dataService.getValue(tableData, col.fieldName) || cond.value;
|
|
48704
|
+
}
|
|
48705
|
+
}
|
|
48706
|
+
}
|
|
48707
|
+
}
|
|
48708
|
+
}
|
|
48709
|
+
}
|
|
48710
|
+
}
|
|
48711
|
+
}
|
|
48665
48712
|
this.conditions = this.editingView.get('conditions');
|
|
48666
48713
|
this.columns = this.editingView.get('columns');
|
|
48667
48714
|
}
|
|
@@ -48938,13 +48985,15 @@ class ListViewFilterComponent {
|
|
|
48938
48985
|
this.isDropdownOpen = false;
|
|
48939
48986
|
}
|
|
48940
48987
|
}
|
|
48941
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ListViewFilterComponent, deps: [{ token: i6.FormBuilder }, { token: NxtCustomTranslatePipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
48942
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ListViewFilterComponent, isStandalone: true, selector: "app-list-view-filter", inputs: { listViews: "listViews", tableFilterArray: "tableFilterArray", selectedView: "selectedView", displayedColumns: "displayedColumns", availableOperators: "availableOperators" }, outputs: { listViewEmit: "listViewEmit" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [NxtCustomTranslatePipe], usesOnChanges: true, ngImport: i0, template: "<div class=\"list-view-filter\">\n <div class=\"custom-dropdown\">\n <div class=\"filter-label\">{{'DATA_RELATED_TO' | nxtCustomTranslate : 'Data Related to'}}</div>\n <div class=\"select-wrapper\">\n <svg class=\"filter-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"24\" height=\"24\" rx=\"5\" fill=\"#F1F1F1\" />\n <path d=\"M5.51288 4.5H12.1879C12.7429 4.5 13.2004 4.9575 13.2004 5.5125V6.62249C13.2004 7.02749 12.9454 7.53 12.6979 7.785L10.5229 9.705C10.2229 9.96 10.0204 10.4625 10.0204 10.8675V13.0425C10.0204 13.3425 9.8179 13.7475 9.5629 13.905L8.85789 14.3625C8.19789 14.7675 7.29037 14.31 7.29037 13.5V10.8225C7.29037 10.47 7.08789 10.0125 6.88539 9.75751L4.96539 7.7325C4.71039 7.4775 4.5079 7.02749 4.5079 6.71999V5.5575C4.5004 4.9575 4.95788 4.5 5.51288 4.5Z\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M4.5 11.9999V14.2499C4.5 17.9999 6 19.4999 9.75 19.4999H14.25C18 19.4999 19.5 17.9999 19.5 14.2499V9.74994C19.5 7.40994 18.915 5.93993 17.5575 5.17493C17.175 4.95743 16.41 4.79243 15.7125 4.67993\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.75 12.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M11.25 15.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <div class=\"custom-dropdown\">\n <div class=\"selected-option\" style=\"cursor: pointer;\" (click)=\"toggleDropdown()\">\n <div>\n {{ selectedViewPath || selectedView | nxtCustomTranslate : selectedView}}\n </div>\n <svg style=\"cursor: pointer;\" class=\"chevron-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\" fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 list view Drop down-->\n <div *ngIf=\"isDropdownOpen\" class=\"dropdown-options-container\">\n <ul class=\"dropdown-options\">\n <li *ngFor=\"let view of listViews\" [class.selected]=\"selectedView === view.filterName\" (click)=\"selectListView(view)\" class=\"list-view-item\">\n <span class=\"view-name\">{{ view.labelPath || view.filterName | nxtCustomTranslate : view.filterName }}</span>\n <div *ngIf=\"!view.system\" class=\"actions\">\n <div class=\"edit-icon\" (click)=\"startEdit(view, $event)\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" fill=\"#000000\" width=\"16px\" height=\"16px\" viewBox=\"0 0 0.48 0.48\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0.44 0.145a0.02 0.02 0 0 0 -0.006 -0.014l-0.085 -0.085a0.02 0.02 0 0 0 -0.014 -0.006 0.02 0.02 0 0 0 -0.014 0.006l-0.057 0.057L0.046 0.321a0.02 0.02 0 0 0 -0.006 0.014V0.42a0.02 0.02 0 0 0 0.02 0.02h0.085a0.02 0.02 0 0 0 0.015 -0.006l0.217 -0.219L0.434 0.16a0.024 0.024 0 0 0 0.004 -0.007 0.02 0.02 0 0 0 0 -0.005 0.014 0.014 0 0 0 0 -0.003ZM0.137 0.4H0.08v-0.057l0.199 -0.199 0.057 0.057ZM0.363 0.173l-0.057 -0.057 0.028 -0.028 0.056 0.056Z\"/></svg>\n </div>\n <div class=\"delete-icon\" (click)=\"confirmDelete(view, $event)\" *ngIf=\"listViews.length > 1\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </li>\n </ul>\n <div class=\"add-filter\" style=\"cursor: pointer;\" (click)=\"startAdd()\">\n <div class=\"add-icon\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n <span>{{'NEW_LIST_VIEW' | nxtCustomTranslate : 'New List View'}}</span>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 Add New List View-->\n <div *ngIf=\"isModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <div class=\"modal-header-div\">\n {{ (isAdding ? 'ADD_NEW_LIST_VIEW' : 'EDIT_LIST_VIEW') | nxtCustomTranslate : (isAdding ? 'Add New List View' : 'Edit List View') }} \n <span class=\"close\" (click)=\"closeModal()\">×</span>\n </div>\n <form [formGroup]=\"editingView\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label style=\"display: flex;\">{{'NAME' | nxtCustomTranslate :'Name'}}<div style=\"color: red; padding-left: 3px;\">*</div></label>\n <input formControlName=\"filterName\" [placeholder]=\"'ENTER_LIST_VIEW_NAME' | nxtCustomTranslate : 'Enter list view name'\" required>\n <div *ngIf=\"editingView.get('filterName')?.invalid && (editingView.get('filterName')?.dirty || editingView.get('filterName')?.touched)\" class=\"error-message\">\n {{ 'NAME_IS_REQ' | nxtCustomTranslate : 'Name is required'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'ORDER' | nxtCustomTranslate : 'Order'}}</label>\n <input type=\"number\" formControlName=\"order\" [placeholder]=\" 'ENTER_DISPLAY_ORDER' | nxtCustomTranslate : 'Enter display order'\" required>\n <div *ngIf=\"editingView.get('order')?.invalid && (editingView.get('order')?.dirty || editingView.get('order')?.touched)\" class=\"error-message\">\n {{'ORDER_IS_REQ_AND_BE_A_NUM' | nxtCustomTranslate : 'Order is required and must be a number'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'DEFAULT_VIEW' | nxtCustomTranslate : 'Default View'}}</label>\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" formControlName=\"isDefault\" id=\"isDefault\">\n <label for=\"isDefault\" class=\"toggle-button\"></label>\n </div>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'FILTERS' | nxtCustomTranslate : 'Filters'}}</h3>\n <span class=\"section-description\">{{'DEFINE_CONDITIONS_FOR_FILTERED_LIST_VIEW' | nxtCustomTranslate : 'Define conditions for filtered list view'}}</span>\n </div>\n <div formArrayName=\"conditions\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"column-cell\">{{'COLUMN' | nxtCustomTranslate : 'Column'}}</div>\n <div class=\"operator-cell\">{{'OPERATOR' | nxtCustomTranslate : 'Operator'}}</div>\n <div class=\"value-cell\">{{'VALUE' | nxtCustomTranslate : 'Value'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let filter of conditions.controls; let i = index\" [formGroupName]=\"i\" class=\"filter-row\">\n <div class=\"column-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"field\" [value]=\"getLabelByFieldName(conditions.at(i).get('field').value)\" (focus)=\"onFocus('field', i)\" (blur)=\"onBlur('field', i)\" [placeholder]=\"'ENTER_OR_SELECT_COLUMN' | nxtCustomTranslate : 'Enter or select column'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnDropdownOpen[i]\">\n <div *ngFor=\"let field of getFilteredColumns(conditions.at(i).get('field').value)\" class=\"dropdown-item\" (click)=\"selectOption('field', i, field.label)\">\n {{ field.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"filter.get('field')?.invalid && (filter.get('field')?.dirty || filter.get('field')?.touched)\" class=\"error-message\">\n {{'COLUMN_IS_REQ' | nxtCustomTranslate : 'Column is required'}}.\n </div>\n </div>\n \n <div class=\"operator-cell\">\n <div class=\"listview-custom-select\">\n <input\n [value]=\"getOperatorLabel(conditions.at(i).get('operator').value)\"\n (input)=\"onOperatorInput($event.target.value, i)\"\n (focus)=\"onFocus('operator', i)\"\n (blur)=\"onBlur('operator', i)\"\n [placeholder]=\"'ENTER_OR_SELECT_OPERATOR' | nxtCustomTranslate : 'Enter or select operator'\"\n />\n \n <div class=\"dropdown-list\" *ngIf=\"isOperatorDropdownOpen[i]\">\n <div\n *ngFor=\"let operator of getFilteredOperators(operatorInput[i])\"\n class=\"dropdown-item\"\n (click)=\"selectOption('operator', i, operator.value)\"\n >\n {{ operator.label }}\n </div>\n </div>\n </div> \n <div *ngIf=\"filter.get('operator')?.invalid && (filter.get('operator')?.dirty || filter.get('operator')?.touched)\" class=\"error-message\">\n {{'OPERATOR_IS_REQ' | nxtCustomTranslate : 'Operator is required'}}.\n </div>\n </div>\n \n <div class=\"value-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"value\" (focus)=\"onFocus('value', i)\" (blur)=\"onBlur('value', i)\" [placeholder]=\"'ENTER_OR_SELECT_VALUE' | nxtCustomTranslate : 'Enter or select value'\">\n <div class=\"dropdown-list\" *ngIf=\"isValueDropdownOpen[i] && getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)?.length > 0\">\n <div *ngFor=\"let val of getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)\" class=\"dropdown-item\" (click)=\"selectOption('value', i, val)\">\n {{ val }}\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"filter.get('value')?.invalid && (filter.get('value')?.dirty || filter.get('value')?.touched)\" class=\"error-message\">\n {{'VALUE_IS_REQUIRED' | nxtCustomTranslate : 'Value is required'}}.\n </div> -->\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeFilter(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addFilter()\" [matTooltip]=\"'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'}}</span>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'COLUMNS' | nxtCustomTranslate : 'Columns'}}</h3>\n <span class=\"section-description\">{{'SELECT_FIELD_TO_DISPLAY_IN_TABLE' | nxtCustomTranslate : 'Select field to display in table'}}</span>\n </div>\n <div formArrayName=\"columns\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"name-cell\">{{'COLUMN_NAME' | nxtCustomTranslate : 'Column Name'}}</div>\n <div class=\"bool-cell\">{{'SORTABLE' | nxtCustomTranslate : 'Sortable'}}</div>\n <div class=\"bool-cell\">{{'FILTERABLE' | nxtCustomTranslate :'Filterable'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let field of columns.controls; let i = index\" [formGroupName]=\"i\" class=\"column-row\">\n <div class=\"name-cell\">\n <div class=\"listview-custom-select\">\n <input \n formControlName=\"name\" \n (focus)=\"onFocus('columnName', i)\" \n (blur)=\"onBlur('columnName', i)\" \n (input)=\"onManualInput($event.target.value, i)\"\n [placeholder]=\"'ENTER_OR_SELECT_COLUMN_NAME' | nxtCustomTranslate : 'Enter or select column name'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnNameDropdownOpen[i]\">\n <div *ngFor=\"let colName of getColumnColumns(columns.at(i).get('name').value)\" class=\"dropdown-item\" (click)=\"selectOption('columnName', i, colName.label); isColumnNameDropdownOpen[i] = false\">\n {{ colName.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"field.get('name')?.invalid && (field.get('name')?.dirty || field.get('name')?.touched)\" class=\"error-message\">\n {{'COLUMN_NAME_IS_REQ' | nxtCustomTranslate : 'Column name is required'}}.\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'sortable-' + i\" formControlName=\"sortable\">\n <label [for]=\"'sortable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'filterable-' + i\" formControlName=\"filterable\">\n <label [for]=\"'filterable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeColumn(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addColumn()\" [matTooltip]=\"'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'}}</span>\n </div>\n </div>\n <div *ngIf=\"conditions.length === 0 && columns.length === 0\" class=\"error-message\">\n {{'AT_LEAST_ONE_FILTER_OR_ONE_COLUMN_IS_REQ' | nxtCustomTranslate : ' At least one filter or one column is required'}}.\n </div> \n <div class=\"form-actions\">\n <button type=\"button\" class=\"save-button\" (click)=\"save()\" [disabled]=\"!editingView.valid || (conditions.length === 0 && columns.length === 0)\">{{'SAVE' | nxtCustomTranslate : 'Save'}}</button>\n <button type=\"button\" (click)=\"closeModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </form>\n </div>\n </div>\n <!-- SKS3MAY25 Delete List View-->\n <div *ngIf=\"isDeleteModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <h2>{{'DELETE_LIST_VIEW' | nxtCustomTranslate : 'Delete List View'}}</h2>\n <p>{{'ARE_YOU_SURE_YOU_WANT_TO_DELETE' | nxtCustomTranslate : 'Are you sure you want to delete'}} \"{{ viewToDelete?.filterName }}\"?</p>\n <div class=\"form-delete\">\n <button type=\"button\" (click)=\"deleteConfirmed()\">{{'DELETE' | nxtCustomTranslate : 'Delete'}}</button>\n <button type=\"button\" (click)=\"closeDeleteModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </div>\n </div>\n</div>", styles: [".list-view-filter{padding-left:10px;padding-right:10px}.filter-label{font-size:11px;color:#747577;margin-right:8px}.select-wrapper{display:flex;align-items:center;cursor:pointer}.custom-dropdown{position:relative;cursor:pointer;display:inline-block}.selected-option{padding:2px 5px;font-size:16px;font-weight:700;display:flex;gap:8px}.chevron-icon{cursor:pointer;background-color:#f5f5f5;border-radius:5px}.dropdown-options-container{position:absolute;top:100%;display:flex;flex-direction:column;border:1px solid #ccc;background:#fff;box-shadow:0 2px 8px #0000001a;z-index:1000;min-width:250px}.dropdown-options{background:#fff;list-style:none;padding:0;margin:0;white-space:nowrap;width:100%;max-height:300px;overflow-y:auto}.dropdown-options li{padding:8px;cursor:pointer}.dropdown-options li:hover{background-color:#f1f1f1b4}.dropdown-options li.selected{background-color:#ececec;font-weight:600}.list-view-item{display:flex;justify-content:space-between;padding:8px;cursor:pointer;border-bottom:1px solid #f0f0f0}.list-view-item:hover{background-color:#cce6ff35}.edit-icon,.delete-icon{cursor:pointer;color:#666;transition:color .2s}.edit-icon:hover{color:#007bff}.delete-icon:hover{color:#dc3545}.add-filter{background-color:#fff;padding:10px;border-top:1px solid #dddddd;cursor:pointer;display:flex;align-items:center;gap:8px;width:100%}.add-filter:hover{background-color:#f8f9fa}.add-icon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.modal-content{background-color:#fff;border-radius:8px;padding:24px;width:700px;max-width:95%;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #00000026}.modal-content h2{margin-top:0;margin-bottom:20px;font-size:20px;color:#333}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500}.form-group input{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.toggle-wrapper{position:relative;display:inline-block}.toggle-wrapper input[type=checkbox]{opacity:0;width:0;height:0}.toggle-button{position:relative;display:inline-block;width:50px;height:24px;background-color:#ccc;border-radius:24px;transition:.3s;cursor:pointer}.toggle-button:before{position:absolute;content:\"\";height:20px;width:20px;left:2px;bottom:2px;background-color:#fff;border-radius:50%;transition:.3s}input[type=checkbox]:checked+.toggle-button{background-color:#007bff}input[type=checkbox]:checked+.toggle-button:before{transform:translate(20px)}.toggle-wrapper.small .toggle-button{width:40px;height:20px}.toggle-wrapper.small .toggle-button:before{height:16px;width:16px}input[type=checkbox]:checked+.toggle-button.small:before{transform:translate(20px)}.section-header{padding-bottom:8px}.section-header h3{margin:0 0 4px;font-size:16px;color:#333}.section-description{font-size:12px;color:#777}.table-container{border:1px solid #e0e0e0;border-radius:4px}.table-header{display:grid;background-color:#f8f9fa;font-weight:600;font-size:12px;padding:8px 12px;border-bottom:1px solid #e0e0e0}.filter-row,.column-row{display:grid;padding:8px 12px;border-bottom:1px solid #f0f0f0;align-items:center}.filter-row,.column-row,.table-header{grid-template-columns:1fr 1fr 1fr auto;gap:10px}.table-header.column-header{grid-template-columns:1fr 1fr 1fr auto}.column-cell,.operator-cell,.value-cell,.name-cell,.bool-cell,.action-cell{padding:5px}.action-cell{display:flex;justify-content:center}.listview-custom-select{position:relative;width:100%}.listview-custom-select input{border:none;font-size:12px}.dropdown-list{position:absolute;top:100%;left:0;width:100%;max-height:200px;overflow-y:auto;background:#fff;border:1px solid #ddd;border-top:none;border-radius:0 0 4px 4px;z-index:10;box-shadow:0 4px 8px #0000001a}.dropdown-item{padding:8px 12px;cursor:pointer}.dropdown-item:hover{background-color:#f5f5f5}.add-row{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer}.add-row:hover{background-color:#f8f9fa}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.dicon-container{padding:2px;border:1px solid #ffb5b5;border-radius:5px;margin-left:3px;margin-right:3px;display:flex}.delete-icon{display:flex;justify-content:center;align-items:center}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.delete-icon:hover svg path{stroke:#ff7575!important;fill:transparent!important}.edit-icon:hover svg path{fill:#007bff!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.form-delete{display:flex;justify-content:flex-end;gap:12px}.form-actions button,.form-delete button{padding:8px 16px;border-radius:4px;font-size:14px;cursor:pointer;transition:background-color .2s}.form-actions button:first-child{background-color:#007bff;color:#fff;border:1px solid #007bff}.form-actions button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-delete button:first-child{background-color:#dc3545;color:#fff;border:1px solid #dc3545}.form-delete button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-actions button:hover,.form-delete button:hover{opacity:.9}.cursor-pointer{cursor:pointer}.flex{display:flex}.form-row{display:flex;gap:16px;align-items:flex-start}.form-group{min-width:0;margin-bottom:0!important}.error-message{color:#dc3545;font-size:12px;margin-top:4px}.listview-custom-select input[readonly]{cursor:pointer;background-color:#fff}.error-message{color:#ff2c10;font-size:.875rem;margin-bottom:.5rem}.save-button:disabled{background-color:#ccc!important;color:#666!important;cursor:not-allowed!important}.modal-header-div{display:flex;justify-content:space-between;font-size:18px;padding-bottom:10px}.close{color:#aaa;float:right;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.list-view-item{position:relative}.actions{display:none;position:absolute;right:8px;top:50%;transform:translateY(-50%)}.list-view-item:hover .actions{display:flex;gap:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i6.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i6.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i6.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
48988
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ListViewFilterComponent, deps: [{ token: i6.FormBuilder }, { token: NxtCustomTranslatePipe }, { token: DataService }], target: i0.ɵɵFactoryTarget.Component });
|
|
48989
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ListViewFilterComponent, isStandalone: true, selector: "app-list-view-filter", inputs: { listViews: "listViews", tableData: "tableData", tableFilterArray: "tableFilterArray", selectedView: "selectedView", displayedColumns: "displayedColumns", availableOperators: "availableOperators" }, outputs: { listViewEmit: "listViewEmit" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [NxtCustomTranslatePipe], usesOnChanges: true, ngImport: i0, template: "<div class=\"list-view-filter\">\n <div class=\"custom-dropdown\">\n <div class=\"filter-label\">{{'DATA_RELATED_TO' | nxtCustomTranslate : 'Data Related to'}}</div>\n <div class=\"select-wrapper\">\n <svg class=\"filter-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"24\" height=\"24\" rx=\"5\" fill=\"#F1F1F1\" />\n <path d=\"M5.51288 4.5H12.1879C12.7429 4.5 13.2004 4.9575 13.2004 5.5125V6.62249C13.2004 7.02749 12.9454 7.53 12.6979 7.785L10.5229 9.705C10.2229 9.96 10.0204 10.4625 10.0204 10.8675V13.0425C10.0204 13.3425 9.8179 13.7475 9.5629 13.905L8.85789 14.3625C8.19789 14.7675 7.29037 14.31 7.29037 13.5V10.8225C7.29037 10.47 7.08789 10.0125 6.88539 9.75751L4.96539 7.7325C4.71039 7.4775 4.5079 7.02749 4.5079 6.71999V5.5575C4.5004 4.9575 4.95788 4.5 5.51288 4.5Z\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M4.5 11.9999V14.2499C4.5 17.9999 6 19.4999 9.75 19.4999H14.25C18 19.4999 19.5 17.9999 19.5 14.2499V9.74994C19.5 7.40994 18.915 5.93993 17.5575 5.17493C17.175 4.95743 16.41 4.79243 15.7125 4.67993\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.75 12.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M11.25 15.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <div class=\"custom-dropdown\">\n <div class=\"selected-option\" style=\"cursor: pointer;\" (click)=\"toggleDropdown()\">\n <div>\n {{ selectedViewPath || selectedView | nxtCustomTranslate : selectedView}}\n </div>\n <svg style=\"cursor: pointer;\" class=\"chevron-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\" fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 list view Drop down-->\n <div *ngIf=\"isDropdownOpen\" class=\"dropdown-options-container\">\n <ul class=\"dropdown-options\">\n <li *ngFor=\"let view of listViews\" [class.selected]=\"selectedView === view.filterName\" (click)=\"selectListView(view)\" class=\"list-view-item\">\n <span class=\"view-name\">{{ view.labelPath || view.filterName | nxtCustomTranslate : view.filterName }}</span>\n <div *ngIf=\"!view.system\" class=\"actions\">\n <div class=\"edit-icon\" (click)=\"startEdit(view, $event)\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" fill=\"#000000\" width=\"16px\" height=\"16px\" viewBox=\"0 0 0.48 0.48\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0.44 0.145a0.02 0.02 0 0 0 -0.006 -0.014l-0.085 -0.085a0.02 0.02 0 0 0 -0.014 -0.006 0.02 0.02 0 0 0 -0.014 0.006l-0.057 0.057L0.046 0.321a0.02 0.02 0 0 0 -0.006 0.014V0.42a0.02 0.02 0 0 0 0.02 0.02h0.085a0.02 0.02 0 0 0 0.015 -0.006l0.217 -0.219L0.434 0.16a0.024 0.024 0 0 0 0.004 -0.007 0.02 0.02 0 0 0 0 -0.005 0.014 0.014 0 0 0 0 -0.003ZM0.137 0.4H0.08v-0.057l0.199 -0.199 0.057 0.057ZM0.363 0.173l-0.057 -0.057 0.028 -0.028 0.056 0.056Z\"/></svg>\n </div>\n <div class=\"delete-icon\" (click)=\"confirmDelete(view, $event)\" *ngIf=\"listViews.length > 1\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </li>\n </ul>\n <div class=\"add-filter\" style=\"cursor: pointer;\" (click)=\"startAdd()\">\n <div class=\"add-icon\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n <span>{{'NEW_LIST_VIEW' | nxtCustomTranslate : 'New List View'}}</span>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 Add New List View-->\n <div *ngIf=\"isModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <div class=\"modal-header-div\">\n {{ (isAdding ? 'ADD_NEW_LIST_VIEW' : 'EDIT_LIST_VIEW') | nxtCustomTranslate : (isAdding ? 'Add New List View' : 'Edit List View') }} \n <span class=\"close\" (click)=\"closeModal()\">×</span>\n </div>\n <form [formGroup]=\"editingView\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label style=\"display: flex;\">{{'NAME' | nxtCustomTranslate :'Name'}}<div style=\"color: red; padding-left: 3px;\">*</div></label>\n <input formControlName=\"filterName\" [placeholder]=\"'ENTER_LIST_VIEW_NAME' | nxtCustomTranslate : 'Enter list view name'\" required>\n <div *ngIf=\"editingView.get('filterName')?.invalid && (editingView.get('filterName')?.dirty || editingView.get('filterName')?.touched)\" class=\"error-message\">\n {{ 'NAME_IS_REQ' | nxtCustomTranslate : 'Name is required'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'ORDER' | nxtCustomTranslate : 'Order'}}</label>\n <input type=\"number\" formControlName=\"order\" [placeholder]=\" 'ENTER_DISPLAY_ORDER' | nxtCustomTranslate : 'Enter display order'\" required>\n <div *ngIf=\"editingView.get('order')?.invalid && (editingView.get('order')?.dirty || editingView.get('order')?.touched)\" class=\"error-message\">\n {{'ORDER_IS_REQ_AND_BE_A_NUM' | nxtCustomTranslate : 'Order is required and must be a number'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'DEFAULT_VIEW' | nxtCustomTranslate : 'Default View'}}</label>\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" formControlName=\"isDefault\" id=\"isDefault\">\n <label for=\"isDefault\" class=\"toggle-button\"></label>\n </div>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'FILTERS' | nxtCustomTranslate : 'Filters'}}</h3>\n <span class=\"section-description\">{{'DEFINE_CONDITIONS_FOR_FILTERED_LIST_VIEW' | nxtCustomTranslate : 'Define conditions for filtered list view'}}</span>\n </div>\n <div formArrayName=\"conditions\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"column-cell\">{{'COLUMN' | nxtCustomTranslate : 'Column'}}</div>\n <div class=\"operator-cell\">{{'OPERATOR' | nxtCustomTranslate : 'Operator'}}</div>\n <div class=\"value-cell\">{{'VALUE' | nxtCustomTranslate : 'Value'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let filter of conditions.controls; let i = index\" [formGroupName]=\"i\" class=\"filter-row\">\n <div class=\"column-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"field\" [value]=\"getLabelByFieldName(conditions.at(i).get('field').value)\" (focus)=\"onFocus('field', i)\" (blur)=\"onBlur('field', i)\" [placeholder]=\"'ENTER_OR_SELECT_COLUMN' | nxtCustomTranslate : 'Enter or select column'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnDropdownOpen[i]\">\n <div *ngFor=\"let field of getFilteredColumns(conditions.at(i).get('field').value)\" class=\"dropdown-item\" (click)=\"selectOption('field', i, field.label)\">\n {{ field.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"filter.get('field')?.invalid && (filter.get('field')?.dirty || filter.get('field')?.touched)\" class=\"error-message\">\n {{'COLUMN_IS_REQ' | nxtCustomTranslate : 'Column is required'}}.\n </div>\n </div>\n \n <div class=\"operator-cell\">\n <div class=\"listview-custom-select\">\n <input\n [value]=\"getOperatorLabel(conditions.at(i).get('operator').value)\"\n (input)=\"onOperatorInput($event.target.value, i)\"\n (focus)=\"onFocus('operator', i)\"\n (blur)=\"onBlur('operator', i)\"\n [placeholder]=\"'ENTER_OR_SELECT_OPERATOR' | nxtCustomTranslate : 'Enter or select operator'\"\n />\n \n <div class=\"dropdown-list\" *ngIf=\"isOperatorDropdownOpen[i]\">\n <div\n *ngFor=\"let operator of getFilteredOperators(operatorInput[i])\"\n class=\"dropdown-item\"\n (click)=\"selectOption('operator', i, operator.value)\"\n >\n {{ operator.label }}\n </div>\n </div>\n </div> \n <div *ngIf=\"filter.get('operator')?.invalid && (filter.get('operator')?.dirty || filter.get('operator')?.touched)\" class=\"error-message\">\n {{'OPERATOR_IS_REQ' | nxtCustomTranslate : 'Operator is required'}}.\n </div>\n </div>\n \n <div class=\"value-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"value\" (focus)=\"onFocus('value', i)\" (blur)=\"onBlur('value', i)\" [placeholder]=\"'ENTER_OR_SELECT_VALUE' | nxtCustomTranslate : 'Enter or select value'\">\n <div class=\"dropdown-list\" *ngIf=\"isValueDropdownOpen[i] && getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)?.length > 0\">\n <div *ngFor=\"let val of getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)\" class=\"dropdown-item\" (click)=\"selectOption('value', i, val)\">\n {{ val }}\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"filter.get('value')?.invalid && (filter.get('value')?.dirty || filter.get('value')?.touched)\" class=\"error-message\">\n {{'VALUE_IS_REQUIRED' | nxtCustomTranslate : 'Value is required'}}.\n </div> -->\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeFilter(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addFilter()\" [matTooltip]=\"'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'}}</span>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'COLUMNS' | nxtCustomTranslate : 'Columns'}}</h3>\n <span class=\"section-description\">{{'SELECT_FIELD_TO_DISPLAY_IN_TABLE' | nxtCustomTranslate : 'Select field to display in table'}}</span>\n </div>\n <div formArrayName=\"columns\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"name-cell\">{{'COLUMN_NAME' | nxtCustomTranslate : 'Column Name'}}</div>\n <div class=\"bool-cell\">{{'SORTABLE' | nxtCustomTranslate : 'Sortable'}}</div>\n <div class=\"bool-cell\">{{'FILTERABLE' | nxtCustomTranslate :'Filterable'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let field of columns.controls; let i = index\" [formGroupName]=\"i\" class=\"column-row\">\n <div class=\"name-cell\">\n <div class=\"listview-custom-select\">\n <input \n formControlName=\"name\" \n (focus)=\"onFocus('columnName', i)\" \n (blur)=\"onBlur('columnName', i)\" \n (input)=\"onManualInput($event.target.value, i)\"\n [placeholder]=\"'ENTER_OR_SELECT_COLUMN_NAME' | nxtCustomTranslate : 'Enter or select column name'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnNameDropdownOpen[i]\">\n <div *ngFor=\"let colName of getColumnColumns(columns.at(i).get('name').value)\" class=\"dropdown-item\" (click)=\"selectOption('columnName', i, colName.label); isColumnNameDropdownOpen[i] = false\">\n {{ colName.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"field.get('name')?.invalid && (field.get('name')?.dirty || field.get('name')?.touched)\" class=\"error-message\">\n {{'COLUMN_NAME_IS_REQ' | nxtCustomTranslate : 'Column name is required'}}.\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'sortable-' + i\" formControlName=\"sortable\">\n <label [for]=\"'sortable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'filterable-' + i\" formControlName=\"filterable\">\n <label [for]=\"'filterable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeColumn(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addColumn()\" [matTooltip]=\"'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'}}</span>\n </div>\n </div>\n <div *ngIf=\"conditions.length === 0 && columns.length === 0\" class=\"error-message\">\n {{'AT_LEAST_ONE_FILTER_OR_ONE_COLUMN_IS_REQ' | nxtCustomTranslate : ' At least one filter or one column is required'}}.\n </div> \n <div class=\"form-actions\">\n <button type=\"button\" class=\"save-button\" (click)=\"save()\" [disabled]=\"!editingView.valid || (conditions.length === 0 && columns.length === 0)\">{{'SAVE' | nxtCustomTranslate : 'Save'}}</button>\n <button type=\"button\" (click)=\"closeModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </form>\n </div>\n </div>\n <!-- SKS3MAY25 Delete List View-->\n <div *ngIf=\"isDeleteModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <h2>{{'DELETE_LIST_VIEW' | nxtCustomTranslate : 'Delete List View'}}</h2>\n <p>{{'ARE_YOU_SURE_YOU_WANT_TO_DELETE' | nxtCustomTranslate : 'Are you sure you want to delete'}} \"{{ viewToDelete?.filterName }}\"?</p>\n <div class=\"form-delete\">\n <button type=\"button\" (click)=\"deleteConfirmed()\">{{'DELETE' | nxtCustomTranslate : 'Delete'}}</button>\n <button type=\"button\" (click)=\"closeDeleteModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </div>\n </div>\n</div>", styles: [".list-view-filter{padding-left:6px;padding-right:6px}.filter-label{font-size:11px;color:#747577;margin-right:8px}.select-wrapper{display:flex;align-items:center;cursor:pointer}.custom-dropdown{position:relative;cursor:pointer;display:inline-block}.selected-option{padding:2px 5px;font-size:16px;font-weight:700;display:flex;gap:8px}.chevron-icon{cursor:pointer;background-color:#f5f5f5;border-radius:5px}.dropdown-options-container{position:absolute;top:100%;display:flex;flex-direction:column;border:1px solid #ccc;background:#fff;box-shadow:0 2px 8px #0000001a;z-index:1000;min-width:250px}.dropdown-options{background:#fff;list-style:none;padding:0;margin:0;white-space:nowrap;width:100%;max-height:300px;overflow-y:auto}.dropdown-options li{padding:8px;cursor:pointer}.dropdown-options li:hover{background-color:#f1f1f1b4}.dropdown-options li.selected{background-color:#ececec;font-weight:600}.list-view-item{display:flex;justify-content:space-between;padding:8px;cursor:pointer;border-bottom:1px solid #f0f0f0}.list-view-item:hover{background-color:#cce6ff35}.edit-icon,.delete-icon{cursor:pointer;color:#666;transition:color .2s}.edit-icon:hover{color:#007bff}.delete-icon:hover{color:#dc3545}.add-filter{background-color:#fff;padding:10px;border-top:1px solid #dddddd;cursor:pointer;display:flex;align-items:center;gap:8px;width:100%}.add-filter:hover{background-color:#f8f9fa}.add-icon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.modal-content{background-color:#fff;border-radius:8px;padding:24px;width:700px;max-width:95%;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #00000026}.modal-content h2{margin-top:0;margin-bottom:20px;font-size:20px;color:#333}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500}.form-group input{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.toggle-wrapper{position:relative;display:inline-block}.toggle-wrapper input[type=checkbox]{opacity:0;width:0;height:0}.toggle-button{position:relative;display:inline-block;width:50px;height:24px;background-color:#ccc;border-radius:24px;transition:.3s;cursor:pointer}.toggle-button:before{position:absolute;content:\"\";height:20px;width:20px;left:2px;bottom:2px;background-color:#fff;border-radius:50%;transition:.3s}input[type=checkbox]:checked+.toggle-button{background-color:#007bff}input[type=checkbox]:checked+.toggle-button:before{transform:translate(20px)}.toggle-wrapper.small .toggle-button{width:40px;height:20px}.toggle-wrapper.small .toggle-button:before{height:16px;width:16px}input[type=checkbox]:checked+.toggle-button.small:before{transform:translate(20px)}.section-header{padding-bottom:8px}.section-header h3{margin:0 0 4px;font-size:16px;color:#333}.section-description{font-size:12px;color:#777}.table-container{border:1px solid #e0e0e0;border-radius:4px}.table-header{display:grid;background-color:#f8f9fa;font-weight:600;font-size:12px;padding:8px 12px;border-bottom:1px solid #e0e0e0}.filter-row,.column-row{display:grid;padding:8px 12px;border-bottom:1px solid #f0f0f0;align-items:center}.filter-row,.column-row,.table-header{grid-template-columns:1fr 1fr 1fr auto;gap:10px}.table-header.column-header{grid-template-columns:1fr 1fr 1fr auto}.column-cell,.operator-cell,.value-cell,.name-cell,.bool-cell,.action-cell{padding:5px}.action-cell{display:flex;justify-content:center}.listview-custom-select{position:relative;width:100%}.listview-custom-select input{border:none;font-size:12px}.dropdown-list{position:absolute;top:100%;left:0;width:100%;max-height:200px;overflow-y:auto;background:#fff;border:1px solid #ddd;border-top:none;border-radius:0 0 4px 4px;z-index:10;box-shadow:0 4px 8px #0000001a}.dropdown-item{padding:8px 12px;cursor:pointer}.dropdown-item:hover{background-color:#f5f5f5}.add-row{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer}.add-row:hover{background-color:#f8f9fa}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.dicon-container{padding:2px;border:1px solid #ffb5b5;border-radius:5px;margin-left:3px;margin-right:3px;display:flex}.delete-icon{display:flex;justify-content:center;align-items:center}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.delete-icon:hover svg path{stroke:#ff7575!important;fill:transparent!important}.edit-icon:hover svg path{fill:#007bff!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.form-delete{display:flex;justify-content:flex-end;gap:12px}.form-actions button,.form-delete button{padding:8px 16px;border-radius:4px;font-size:14px;cursor:pointer;transition:background-color .2s}.form-actions button:first-child{background-color:#007bff;color:#fff;border:1px solid #007bff}.form-actions button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-delete button:first-child{background-color:#dc3545;color:#fff;border:1px solid #dc3545}.form-delete button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-actions button:hover,.form-delete button:hover{opacity:.9}.cursor-pointer{cursor:pointer}.flex{display:flex}.form-row{display:flex;gap:16px;align-items:flex-start}.form-group{min-width:0;margin-bottom:0!important}.error-message{color:#dc3545;font-size:12px;margin-top:4px}.listview-custom-select input[readonly]{cursor:pointer;background-color:#fff}.error-message{color:#ff2c10;font-size:.875rem;margin-bottom:.5rem}.save-button:disabled{background-color:#ccc!important;color:#666!important;cursor:not-allowed!important}.modal-header-div{display:flex;justify-content:space-between;font-size:18px;padding-bottom:10px}.close{color:#aaa;float:right;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.list-view-item{position:relative}.actions{display:none;position:absolute;right:8px;top:50%;transform:translateY(-50%)}.list-view-item:hover .actions{display:flex;gap:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i6.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i6.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i6.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
48943
48990
|
}
|
|
48944
48991
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ListViewFilterComponent, decorators: [{
|
|
48945
48992
|
type: Component,
|
|
48946
|
-
args: [{ selector: 'app-list-view-filter', standalone: true, imports: [CommonModule, FormsModule, ReactiveFormsModule, NxtCustomTranslatePipe, MatTooltipModule], providers: [NxtCustomTranslatePipe], template: "<div class=\"list-view-filter\">\n <div class=\"custom-dropdown\">\n <div class=\"filter-label\">{{'DATA_RELATED_TO' | nxtCustomTranslate : 'Data Related to'}}</div>\n <div class=\"select-wrapper\">\n <svg class=\"filter-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"24\" height=\"24\" rx=\"5\" fill=\"#F1F1F1\" />\n <path d=\"M5.51288 4.5H12.1879C12.7429 4.5 13.2004 4.9575 13.2004 5.5125V6.62249C13.2004 7.02749 12.9454 7.53 12.6979 7.785L10.5229 9.705C10.2229 9.96 10.0204 10.4625 10.0204 10.8675V13.0425C10.0204 13.3425 9.8179 13.7475 9.5629 13.905L8.85789 14.3625C8.19789 14.7675 7.29037 14.31 7.29037 13.5V10.8225C7.29037 10.47 7.08789 10.0125 6.88539 9.75751L4.96539 7.7325C4.71039 7.4775 4.5079 7.02749 4.5079 6.71999V5.5575C4.5004 4.9575 4.95788 4.5 5.51288 4.5Z\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M4.5 11.9999V14.2499C4.5 17.9999 6 19.4999 9.75 19.4999H14.25C18 19.4999 19.5 17.9999 19.5 14.2499V9.74994C19.5 7.40994 18.915 5.93993 17.5575 5.17493C17.175 4.95743 16.41 4.79243 15.7125 4.67993\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.75 12.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M11.25 15.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <div class=\"custom-dropdown\">\n <div class=\"selected-option\" style=\"cursor: pointer;\" (click)=\"toggleDropdown()\">\n <div>\n {{ selectedViewPath || selectedView | nxtCustomTranslate : selectedView}}\n </div>\n <svg style=\"cursor: pointer;\" class=\"chevron-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\" fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 list view Drop down-->\n <div *ngIf=\"isDropdownOpen\" class=\"dropdown-options-container\">\n <ul class=\"dropdown-options\">\n <li *ngFor=\"let view of listViews\" [class.selected]=\"selectedView === view.filterName\" (click)=\"selectListView(view)\" class=\"list-view-item\">\n <span class=\"view-name\">{{ view.labelPath || view.filterName | nxtCustomTranslate : view.filterName }}</span>\n <div *ngIf=\"!view.system\" class=\"actions\">\n <div class=\"edit-icon\" (click)=\"startEdit(view, $event)\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" fill=\"#000000\" width=\"16px\" height=\"16px\" viewBox=\"0 0 0.48 0.48\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0.44 0.145a0.02 0.02 0 0 0 -0.006 -0.014l-0.085 -0.085a0.02 0.02 0 0 0 -0.014 -0.006 0.02 0.02 0 0 0 -0.014 0.006l-0.057 0.057L0.046 0.321a0.02 0.02 0 0 0 -0.006 0.014V0.42a0.02 0.02 0 0 0 0.02 0.02h0.085a0.02 0.02 0 0 0 0.015 -0.006l0.217 -0.219L0.434 0.16a0.024 0.024 0 0 0 0.004 -0.007 0.02 0.02 0 0 0 0 -0.005 0.014 0.014 0 0 0 0 -0.003ZM0.137 0.4H0.08v-0.057l0.199 -0.199 0.057 0.057ZM0.363 0.173l-0.057 -0.057 0.028 -0.028 0.056 0.056Z\"/></svg>\n </div>\n <div class=\"delete-icon\" (click)=\"confirmDelete(view, $event)\" *ngIf=\"listViews.length > 1\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </li>\n </ul>\n <div class=\"add-filter\" style=\"cursor: pointer;\" (click)=\"startAdd()\">\n <div class=\"add-icon\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n <span>{{'NEW_LIST_VIEW' | nxtCustomTranslate : 'New List View'}}</span>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 Add New List View-->\n <div *ngIf=\"isModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <div class=\"modal-header-div\">\n {{ (isAdding ? 'ADD_NEW_LIST_VIEW' : 'EDIT_LIST_VIEW') | nxtCustomTranslate : (isAdding ? 'Add New List View' : 'Edit List View') }} \n <span class=\"close\" (click)=\"closeModal()\">×</span>\n </div>\n <form [formGroup]=\"editingView\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label style=\"display: flex;\">{{'NAME' | nxtCustomTranslate :'Name'}}<div style=\"color: red; padding-left: 3px;\">*</div></label>\n <input formControlName=\"filterName\" [placeholder]=\"'ENTER_LIST_VIEW_NAME' | nxtCustomTranslate : 'Enter list view name'\" required>\n <div *ngIf=\"editingView.get('filterName')?.invalid && (editingView.get('filterName')?.dirty || editingView.get('filterName')?.touched)\" class=\"error-message\">\n {{ 'NAME_IS_REQ' | nxtCustomTranslate : 'Name is required'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'ORDER' | nxtCustomTranslate : 'Order'}}</label>\n <input type=\"number\" formControlName=\"order\" [placeholder]=\" 'ENTER_DISPLAY_ORDER' | nxtCustomTranslate : 'Enter display order'\" required>\n <div *ngIf=\"editingView.get('order')?.invalid && (editingView.get('order')?.dirty || editingView.get('order')?.touched)\" class=\"error-message\">\n {{'ORDER_IS_REQ_AND_BE_A_NUM' | nxtCustomTranslate : 'Order is required and must be a number'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'DEFAULT_VIEW' | nxtCustomTranslate : 'Default View'}}</label>\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" formControlName=\"isDefault\" id=\"isDefault\">\n <label for=\"isDefault\" class=\"toggle-button\"></label>\n </div>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'FILTERS' | nxtCustomTranslate : 'Filters'}}</h3>\n <span class=\"section-description\">{{'DEFINE_CONDITIONS_FOR_FILTERED_LIST_VIEW' | nxtCustomTranslate : 'Define conditions for filtered list view'}}</span>\n </div>\n <div formArrayName=\"conditions\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"column-cell\">{{'COLUMN' | nxtCustomTranslate : 'Column'}}</div>\n <div class=\"operator-cell\">{{'OPERATOR' | nxtCustomTranslate : 'Operator'}}</div>\n <div class=\"value-cell\">{{'VALUE' | nxtCustomTranslate : 'Value'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let filter of conditions.controls; let i = index\" [formGroupName]=\"i\" class=\"filter-row\">\n <div class=\"column-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"field\" [value]=\"getLabelByFieldName(conditions.at(i).get('field').value)\" (focus)=\"onFocus('field', i)\" (blur)=\"onBlur('field', i)\" [placeholder]=\"'ENTER_OR_SELECT_COLUMN' | nxtCustomTranslate : 'Enter or select column'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnDropdownOpen[i]\">\n <div *ngFor=\"let field of getFilteredColumns(conditions.at(i).get('field').value)\" class=\"dropdown-item\" (click)=\"selectOption('field', i, field.label)\">\n {{ field.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"filter.get('field')?.invalid && (filter.get('field')?.dirty || filter.get('field')?.touched)\" class=\"error-message\">\n {{'COLUMN_IS_REQ' | nxtCustomTranslate : 'Column is required'}}.\n </div>\n </div>\n \n <div class=\"operator-cell\">\n <div class=\"listview-custom-select\">\n <input\n [value]=\"getOperatorLabel(conditions.at(i).get('operator').value)\"\n (input)=\"onOperatorInput($event.target.value, i)\"\n (focus)=\"onFocus('operator', i)\"\n (blur)=\"onBlur('operator', i)\"\n [placeholder]=\"'ENTER_OR_SELECT_OPERATOR' | nxtCustomTranslate : 'Enter or select operator'\"\n />\n \n <div class=\"dropdown-list\" *ngIf=\"isOperatorDropdownOpen[i]\">\n <div\n *ngFor=\"let operator of getFilteredOperators(operatorInput[i])\"\n class=\"dropdown-item\"\n (click)=\"selectOption('operator', i, operator.value)\"\n >\n {{ operator.label }}\n </div>\n </div>\n </div> \n <div *ngIf=\"filter.get('operator')?.invalid && (filter.get('operator')?.dirty || filter.get('operator')?.touched)\" class=\"error-message\">\n {{'OPERATOR_IS_REQ' | nxtCustomTranslate : 'Operator is required'}}.\n </div>\n </div>\n \n <div class=\"value-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"value\" (focus)=\"onFocus('value', i)\" (blur)=\"onBlur('value', i)\" [placeholder]=\"'ENTER_OR_SELECT_VALUE' | nxtCustomTranslate : 'Enter or select value'\">\n <div class=\"dropdown-list\" *ngIf=\"isValueDropdownOpen[i] && getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)?.length > 0\">\n <div *ngFor=\"let val of getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)\" class=\"dropdown-item\" (click)=\"selectOption('value', i, val)\">\n {{ val }}\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"filter.get('value')?.invalid && (filter.get('value')?.dirty || filter.get('value')?.touched)\" class=\"error-message\">\n {{'VALUE_IS_REQUIRED' | nxtCustomTranslate : 'Value is required'}}.\n </div> -->\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeFilter(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addFilter()\" [matTooltip]=\"'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'}}</span>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'COLUMNS' | nxtCustomTranslate : 'Columns'}}</h3>\n <span class=\"section-description\">{{'SELECT_FIELD_TO_DISPLAY_IN_TABLE' | nxtCustomTranslate : 'Select field to display in table'}}</span>\n </div>\n <div formArrayName=\"columns\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"name-cell\">{{'COLUMN_NAME' | nxtCustomTranslate : 'Column Name'}}</div>\n <div class=\"bool-cell\">{{'SORTABLE' | nxtCustomTranslate : 'Sortable'}}</div>\n <div class=\"bool-cell\">{{'FILTERABLE' | nxtCustomTranslate :'Filterable'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let field of columns.controls; let i = index\" [formGroupName]=\"i\" class=\"column-row\">\n <div class=\"name-cell\">\n <div class=\"listview-custom-select\">\n <input \n formControlName=\"name\" \n (focus)=\"onFocus('columnName', i)\" \n (blur)=\"onBlur('columnName', i)\" \n (input)=\"onManualInput($event.target.value, i)\"\n [placeholder]=\"'ENTER_OR_SELECT_COLUMN_NAME' | nxtCustomTranslate : 'Enter or select column name'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnNameDropdownOpen[i]\">\n <div *ngFor=\"let colName of getColumnColumns(columns.at(i).get('name').value)\" class=\"dropdown-item\" (click)=\"selectOption('columnName', i, colName.label); isColumnNameDropdownOpen[i] = false\">\n {{ colName.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"field.get('name')?.invalid && (field.get('name')?.dirty || field.get('name')?.touched)\" class=\"error-message\">\n {{'COLUMN_NAME_IS_REQ' | nxtCustomTranslate : 'Column name is required'}}.\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'sortable-' + i\" formControlName=\"sortable\">\n <label [for]=\"'sortable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'filterable-' + i\" formControlName=\"filterable\">\n <label [for]=\"'filterable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeColumn(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addColumn()\" [matTooltip]=\"'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'}}</span>\n </div>\n </div>\n <div *ngIf=\"conditions.length === 0 && columns.length === 0\" class=\"error-message\">\n {{'AT_LEAST_ONE_FILTER_OR_ONE_COLUMN_IS_REQ' | nxtCustomTranslate : ' At least one filter or one column is required'}}.\n </div> \n <div class=\"form-actions\">\n <button type=\"button\" class=\"save-button\" (click)=\"save()\" [disabled]=\"!editingView.valid || (conditions.length === 0 && columns.length === 0)\">{{'SAVE' | nxtCustomTranslate : 'Save'}}</button>\n <button type=\"button\" (click)=\"closeModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </form>\n </div>\n </div>\n <!-- SKS3MAY25 Delete List View-->\n <div *ngIf=\"isDeleteModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <h2>{{'DELETE_LIST_VIEW' | nxtCustomTranslate : 'Delete List View'}}</h2>\n <p>{{'ARE_YOU_SURE_YOU_WANT_TO_DELETE' | nxtCustomTranslate : 'Are you sure you want to delete'}} \"{{ viewToDelete?.filterName }}\"?</p>\n <div class=\"form-delete\">\n <button type=\"button\" (click)=\"deleteConfirmed()\">{{'DELETE' | nxtCustomTranslate : 'Delete'}}</button>\n <button type=\"button\" (click)=\"closeDeleteModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </div>\n </div>\n</div>", styles: [".list-view-filter{padding-left:10px;padding-right:10px}.filter-label{font-size:11px;color:#747577;margin-right:8px}.select-wrapper{display:flex;align-items:center;cursor:pointer}.custom-dropdown{position:relative;cursor:pointer;display:inline-block}.selected-option{padding:2px 5px;font-size:16px;font-weight:700;display:flex;gap:8px}.chevron-icon{cursor:pointer;background-color:#f5f5f5;border-radius:5px}.dropdown-options-container{position:absolute;top:100%;display:flex;flex-direction:column;border:1px solid #ccc;background:#fff;box-shadow:0 2px 8px #0000001a;z-index:1000;min-width:250px}.dropdown-options{background:#fff;list-style:none;padding:0;margin:0;white-space:nowrap;width:100%;max-height:300px;overflow-y:auto}.dropdown-options li{padding:8px;cursor:pointer}.dropdown-options li:hover{background-color:#f1f1f1b4}.dropdown-options li.selected{background-color:#ececec;font-weight:600}.list-view-item{display:flex;justify-content:space-between;padding:8px;cursor:pointer;border-bottom:1px solid #f0f0f0}.list-view-item:hover{background-color:#cce6ff35}.edit-icon,.delete-icon{cursor:pointer;color:#666;transition:color .2s}.edit-icon:hover{color:#007bff}.delete-icon:hover{color:#dc3545}.add-filter{background-color:#fff;padding:10px;border-top:1px solid #dddddd;cursor:pointer;display:flex;align-items:center;gap:8px;width:100%}.add-filter:hover{background-color:#f8f9fa}.add-icon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.modal-content{background-color:#fff;border-radius:8px;padding:24px;width:700px;max-width:95%;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #00000026}.modal-content h2{margin-top:0;margin-bottom:20px;font-size:20px;color:#333}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500}.form-group input{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.toggle-wrapper{position:relative;display:inline-block}.toggle-wrapper input[type=checkbox]{opacity:0;width:0;height:0}.toggle-button{position:relative;display:inline-block;width:50px;height:24px;background-color:#ccc;border-radius:24px;transition:.3s;cursor:pointer}.toggle-button:before{position:absolute;content:\"\";height:20px;width:20px;left:2px;bottom:2px;background-color:#fff;border-radius:50%;transition:.3s}input[type=checkbox]:checked+.toggle-button{background-color:#007bff}input[type=checkbox]:checked+.toggle-button:before{transform:translate(20px)}.toggle-wrapper.small .toggle-button{width:40px;height:20px}.toggle-wrapper.small .toggle-button:before{height:16px;width:16px}input[type=checkbox]:checked+.toggle-button.small:before{transform:translate(20px)}.section-header{padding-bottom:8px}.section-header h3{margin:0 0 4px;font-size:16px;color:#333}.section-description{font-size:12px;color:#777}.table-container{border:1px solid #e0e0e0;border-radius:4px}.table-header{display:grid;background-color:#f8f9fa;font-weight:600;font-size:12px;padding:8px 12px;border-bottom:1px solid #e0e0e0}.filter-row,.column-row{display:grid;padding:8px 12px;border-bottom:1px solid #f0f0f0;align-items:center}.filter-row,.column-row,.table-header{grid-template-columns:1fr 1fr 1fr auto;gap:10px}.table-header.column-header{grid-template-columns:1fr 1fr 1fr auto}.column-cell,.operator-cell,.value-cell,.name-cell,.bool-cell,.action-cell{padding:5px}.action-cell{display:flex;justify-content:center}.listview-custom-select{position:relative;width:100%}.listview-custom-select input{border:none;font-size:12px}.dropdown-list{position:absolute;top:100%;left:0;width:100%;max-height:200px;overflow-y:auto;background:#fff;border:1px solid #ddd;border-top:none;border-radius:0 0 4px 4px;z-index:10;box-shadow:0 4px 8px #0000001a}.dropdown-item{padding:8px 12px;cursor:pointer}.dropdown-item:hover{background-color:#f5f5f5}.add-row{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer}.add-row:hover{background-color:#f8f9fa}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.dicon-container{padding:2px;border:1px solid #ffb5b5;border-radius:5px;margin-left:3px;margin-right:3px;display:flex}.delete-icon{display:flex;justify-content:center;align-items:center}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.delete-icon:hover svg path{stroke:#ff7575!important;fill:transparent!important}.edit-icon:hover svg path{fill:#007bff!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.form-delete{display:flex;justify-content:flex-end;gap:12px}.form-actions button,.form-delete button{padding:8px 16px;border-radius:4px;font-size:14px;cursor:pointer;transition:background-color .2s}.form-actions button:first-child{background-color:#007bff;color:#fff;border:1px solid #007bff}.form-actions button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-delete button:first-child{background-color:#dc3545;color:#fff;border:1px solid #dc3545}.form-delete button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-actions button:hover,.form-delete button:hover{opacity:.9}.cursor-pointer{cursor:pointer}.flex{display:flex}.form-row{display:flex;gap:16px;align-items:flex-start}.form-group{min-width:0;margin-bottom:0!important}.error-message{color:#dc3545;font-size:12px;margin-top:4px}.listview-custom-select input[readonly]{cursor:pointer;background-color:#fff}.error-message{color:#ff2c10;font-size:.875rem;margin-bottom:.5rem}.save-button:disabled{background-color:#ccc!important;color:#666!important;cursor:not-allowed!important}.modal-header-div{display:flex;justify-content:space-between;font-size:18px;padding-bottom:10px}.close{color:#aaa;float:right;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.list-view-item{position:relative}.actions{display:none;position:absolute;right:8px;top:50%;transform:translateY(-50%)}.list-view-item:hover .actions{display:flex;gap:5px}\n"] }]
|
|
48947
|
-
}], ctorParameters: () => [{ type: i6.FormBuilder }, { type: NxtCustomTranslatePipe }], propDecorators: { listViews: [{
|
|
48993
|
+
args: [{ selector: 'app-list-view-filter', standalone: true, imports: [CommonModule, FormsModule, ReactiveFormsModule, NxtCustomTranslatePipe, MatTooltipModule], providers: [NxtCustomTranslatePipe], template: "<div class=\"list-view-filter\">\n <div class=\"custom-dropdown\">\n <div class=\"filter-label\">{{'DATA_RELATED_TO' | nxtCustomTranslate : 'Data Related to'}}</div>\n <div class=\"select-wrapper\">\n <svg class=\"filter-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"24\" height=\"24\" rx=\"5\" fill=\"#F1F1F1\" />\n <path d=\"M5.51288 4.5H12.1879C12.7429 4.5 13.2004 4.9575 13.2004 5.5125V6.62249C13.2004 7.02749 12.9454 7.53 12.6979 7.785L10.5229 9.705C10.2229 9.96 10.0204 10.4625 10.0204 10.8675V13.0425C10.0204 13.3425 9.8179 13.7475 9.5629 13.905L8.85789 14.3625C8.19789 14.7675 7.29037 14.31 7.29037 13.5V10.8225C7.29037 10.47 7.08789 10.0125 6.88539 9.75751L4.96539 7.7325C4.71039 7.4775 4.5079 7.02749 4.5079 6.71999V5.5575C4.5004 4.9575 4.95788 4.5 5.51288 4.5Z\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M4.5 11.9999V14.2499C4.5 17.9999 6 19.4999 9.75 19.4999H14.25C18 19.4999 19.5 17.9999 19.5 14.2499V9.74994C19.5 7.40994 18.915 5.93993 17.5575 5.17493C17.175 4.95743 16.41 4.79243 15.7125 4.67993\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.75 12.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M11.25 15.75H16.5\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <div class=\"custom-dropdown\">\n <div class=\"selected-option\" style=\"cursor: pointer;\" (click)=\"toggleDropdown()\">\n <div>\n {{ selectedViewPath || selectedView | nxtCustomTranslate : selectedView}}\n </div>\n <svg style=\"cursor: pointer;\" class=\"chevron-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\" fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\" stroke-miterlimit=\"10\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 list view Drop down-->\n <div *ngIf=\"isDropdownOpen\" class=\"dropdown-options-container\">\n <ul class=\"dropdown-options\">\n <li *ngFor=\"let view of listViews\" [class.selected]=\"selectedView === view.filterName\" (click)=\"selectListView(view)\" class=\"list-view-item\">\n <span class=\"view-name\">{{ view.labelPath || view.filterName | nxtCustomTranslate : view.filterName }}</span>\n <div *ngIf=\"!view.system\" class=\"actions\">\n <div class=\"edit-icon\" (click)=\"startEdit(view, $event)\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" fill=\"#000000\" width=\"16px\" height=\"16px\" viewBox=\"0 0 0.48 0.48\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0.44 0.145a0.02 0.02 0 0 0 -0.006 -0.014l-0.085 -0.085a0.02 0.02 0 0 0 -0.014 -0.006 0.02 0.02 0 0 0 -0.014 0.006l-0.057 0.057L0.046 0.321a0.02 0.02 0 0 0 -0.006 0.014V0.42a0.02 0.02 0 0 0 0.02 0.02h0.085a0.02 0.02 0 0 0 0.015 -0.006l0.217 -0.219L0.434 0.16a0.024 0.024 0 0 0 0.004 -0.007 0.02 0.02 0 0 0 0 -0.005 0.014 0.014 0 0 0 0 -0.003ZM0.137 0.4H0.08v-0.057l0.199 -0.199 0.057 0.057ZM0.363 0.173l-0.057 -0.057 0.028 -0.028 0.056 0.056Z\"/></svg>\n </div>\n <div class=\"delete-icon\" (click)=\"confirmDelete(view, $event)\" *ngIf=\"listViews.length > 1\" style=\"cursor: pointer;\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#000000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </li>\n </ul>\n <div class=\"add-filter\" style=\"cursor: pointer;\" (click)=\"startAdd()\">\n <div class=\"add-icon\">\n <svg style=\"cursor: pointer;\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n <span>{{'NEW_LIST_VIEW' | nxtCustomTranslate : 'New List View'}}</span>\n </div>\n </div>\n </div>\n <!-- SKS3MAY25 Add New List View-->\n <div *ngIf=\"isModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <div class=\"modal-header-div\">\n {{ (isAdding ? 'ADD_NEW_LIST_VIEW' : 'EDIT_LIST_VIEW') | nxtCustomTranslate : (isAdding ? 'Add New List View' : 'Edit List View') }} \n <span class=\"close\" (click)=\"closeModal()\">×</span>\n </div>\n <form [formGroup]=\"editingView\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label style=\"display: flex;\">{{'NAME' | nxtCustomTranslate :'Name'}}<div style=\"color: red; padding-left: 3px;\">*</div></label>\n <input formControlName=\"filterName\" [placeholder]=\"'ENTER_LIST_VIEW_NAME' | nxtCustomTranslate : 'Enter list view name'\" required>\n <div *ngIf=\"editingView.get('filterName')?.invalid && (editingView.get('filterName')?.dirty || editingView.get('filterName')?.touched)\" class=\"error-message\">\n {{ 'NAME_IS_REQ' | nxtCustomTranslate : 'Name is required'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'ORDER' | nxtCustomTranslate : 'Order'}}</label>\n <input type=\"number\" formControlName=\"order\" [placeholder]=\" 'ENTER_DISPLAY_ORDER' | nxtCustomTranslate : 'Enter display order'\" required>\n <div *ngIf=\"editingView.get('order')?.invalid && (editingView.get('order')?.dirty || editingView.get('order')?.touched)\" class=\"error-message\">\n {{'ORDER_IS_REQ_AND_BE_A_NUM' | nxtCustomTranslate : 'Order is required and must be a number'}}.\n </div>\n </div>\n <div class=\"form-group\">\n <label>{{'DEFAULT_VIEW' | nxtCustomTranslate : 'Default View'}}</label>\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" formControlName=\"isDefault\" id=\"isDefault\">\n <label for=\"isDefault\" class=\"toggle-button\"></label>\n </div>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'FILTERS' | nxtCustomTranslate : 'Filters'}}</h3>\n <span class=\"section-description\">{{'DEFINE_CONDITIONS_FOR_FILTERED_LIST_VIEW' | nxtCustomTranslate : 'Define conditions for filtered list view'}}</span>\n </div>\n <div formArrayName=\"conditions\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"column-cell\">{{'COLUMN' | nxtCustomTranslate : 'Column'}}</div>\n <div class=\"operator-cell\">{{'OPERATOR' | nxtCustomTranslate : 'Operator'}}</div>\n <div class=\"value-cell\">{{'VALUE' | nxtCustomTranslate : 'Value'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let filter of conditions.controls; let i = index\" [formGroupName]=\"i\" class=\"filter-row\">\n <div class=\"column-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"field\" [value]=\"getLabelByFieldName(conditions.at(i).get('field').value)\" (focus)=\"onFocus('field', i)\" (blur)=\"onBlur('field', i)\" [placeholder]=\"'ENTER_OR_SELECT_COLUMN' | nxtCustomTranslate : 'Enter or select column'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnDropdownOpen[i]\">\n <div *ngFor=\"let field of getFilteredColumns(conditions.at(i).get('field').value)\" class=\"dropdown-item\" (click)=\"selectOption('field', i, field.label)\">\n {{ field.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"filter.get('field')?.invalid && (filter.get('field')?.dirty || filter.get('field')?.touched)\" class=\"error-message\">\n {{'COLUMN_IS_REQ' | nxtCustomTranslate : 'Column is required'}}.\n </div>\n </div>\n \n <div class=\"operator-cell\">\n <div class=\"listview-custom-select\">\n <input\n [value]=\"getOperatorLabel(conditions.at(i).get('operator').value)\"\n (input)=\"onOperatorInput($event.target.value, i)\"\n (focus)=\"onFocus('operator', i)\"\n (blur)=\"onBlur('operator', i)\"\n [placeholder]=\"'ENTER_OR_SELECT_OPERATOR' | nxtCustomTranslate : 'Enter or select operator'\"\n />\n \n <div class=\"dropdown-list\" *ngIf=\"isOperatorDropdownOpen[i]\">\n <div\n *ngFor=\"let operator of getFilteredOperators(operatorInput[i])\"\n class=\"dropdown-item\"\n (click)=\"selectOption('operator', i, operator.value)\"\n >\n {{ operator.label }}\n </div>\n </div>\n </div> \n <div *ngIf=\"filter.get('operator')?.invalid && (filter.get('operator')?.dirty || filter.get('operator')?.touched)\" class=\"error-message\">\n {{'OPERATOR_IS_REQ' | nxtCustomTranslate : 'Operator is required'}}.\n </div>\n </div>\n \n <div class=\"value-cell\">\n <div class=\"listview-custom-select\">\n <input formControlName=\"value\" (focus)=\"onFocus('value', i)\" (blur)=\"onBlur('value', i)\" [placeholder]=\"'ENTER_OR_SELECT_VALUE' | nxtCustomTranslate : 'Enter or select value'\">\n <div class=\"dropdown-list\" *ngIf=\"isValueDropdownOpen[i] && getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)?.length > 0\">\n <div *ngFor=\"let val of getPossibleValues(conditions.at(i).get('field').value, conditions.at(i).get('value').value)\" class=\"dropdown-item\" (click)=\"selectOption('value', i, val)\">\n {{ val }}\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"filter.get('value')?.invalid && (filter.get('value')?.dirty || filter.get('value')?.touched)\" class=\"error-message\">\n {{'VALUE_IS_REQUIRED' | nxtCustomTranslate : 'Value is required'}}.\n </div> -->\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeFilter(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addFilter()\" [matTooltip]=\"'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_FILTER' | nxtCustomTranslate : 'Add Filter'}}</span>\n </div>\n </div>\n\n <div class=\"section-header\">\n <h3>{{'COLUMNS' | nxtCustomTranslate : 'Columns'}}</h3>\n <span class=\"section-description\">{{'SELECT_FIELD_TO_DISPLAY_IN_TABLE' | nxtCustomTranslate : 'Select field to display in table'}}</span>\n </div>\n <div formArrayName=\"columns\" class=\"table-container\">\n <div class=\"table-header\">\n <div class=\"name-cell\">{{'COLUMN_NAME' | nxtCustomTranslate : 'Column Name'}}</div>\n <div class=\"bool-cell\">{{'SORTABLE' | nxtCustomTranslate : 'Sortable'}}</div>\n <div class=\"bool-cell\">{{'FILTERABLE' | nxtCustomTranslate :'Filterable'}}</div>\n <div class=\"action-cell\">{{'ACTION' | nxtCustomTranslate : 'Action'}}</div>\n </div>\n \n <div *ngFor=\"let field of columns.controls; let i = index\" [formGroupName]=\"i\" class=\"column-row\">\n <div class=\"name-cell\">\n <div class=\"listview-custom-select\">\n <input \n formControlName=\"name\" \n (focus)=\"onFocus('columnName', i)\" \n (blur)=\"onBlur('columnName', i)\" \n (input)=\"onManualInput($event.target.value, i)\"\n [placeholder]=\"'ENTER_OR_SELECT_COLUMN_NAME' | nxtCustomTranslate : 'Enter or select column name'\">\n <div class=\"dropdown-list\" *ngIf=\"isColumnNameDropdownOpen[i]\">\n <div *ngFor=\"let colName of getColumnColumns(columns.at(i).get('name').value)\" class=\"dropdown-item\" (click)=\"selectOption('columnName', i, colName.label); isColumnNameDropdownOpen[i] = false\">\n {{ colName.label }}\n </div>\n </div>\n </div>\n <div *ngIf=\"field.get('name')?.invalid && (field.get('name')?.dirty || field.get('name')?.touched)\" class=\"error-message\">\n {{'COLUMN_NAME_IS_REQ' | nxtCustomTranslate : 'Column name is required'}}.\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'sortable-' + i\" formControlName=\"sortable\">\n <label [for]=\"'sortable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"bool-cell\">\n <div class=\"toggle-wrapper small\">\n <input type=\"checkbox\" [id]=\"'filterable-' + i\" formControlName=\"filterable\">\n <label [for]=\"'filterable-' + i\" class=\"toggle-button\"></label>\n </div>\n </div>\n \n <div class=\"action-cell\">\n <div class=\"dicon-container\" [matTooltip]=\"'REMOVE' | nxtCustomTranslate : 'Remove'\">\n <div class=\"delete-icon\" (click)=\"removeColumn(i)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"add-row\">\n <div class=\"flex addIconBor cursor-pointer\" (click)=\"addColumn()\" [matTooltip]=\"'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'\">\n <div class=\"addIcon\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.33325V12.6666\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M3.33301 8H12.6663\" stroke=\"#007bff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n <span>{{'ADD_COLUMN' | nxtCustomTranslate : 'Add Column'}}</span>\n </div>\n </div>\n <div *ngIf=\"conditions.length === 0 && columns.length === 0\" class=\"error-message\">\n {{'AT_LEAST_ONE_FILTER_OR_ONE_COLUMN_IS_REQ' | nxtCustomTranslate : ' At least one filter or one column is required'}}.\n </div> \n <div class=\"form-actions\">\n <button type=\"button\" class=\"save-button\" (click)=\"save()\" [disabled]=\"!editingView.valid || (conditions.length === 0 && columns.length === 0)\">{{'SAVE' | nxtCustomTranslate : 'Save'}}</button>\n <button type=\"button\" (click)=\"closeModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </form>\n </div>\n </div>\n <!-- SKS3MAY25 Delete List View-->\n <div *ngIf=\"isDeleteModalOpen\" class=\"modal\">\n <div class=\"modal-content\">\n <h2>{{'DELETE_LIST_VIEW' | nxtCustomTranslate : 'Delete List View'}}</h2>\n <p>{{'ARE_YOU_SURE_YOU_WANT_TO_DELETE' | nxtCustomTranslate : 'Are you sure you want to delete'}} \"{{ viewToDelete?.filterName }}\"?</p>\n <div class=\"form-delete\">\n <button type=\"button\" (click)=\"deleteConfirmed()\">{{'DELETE' | nxtCustomTranslate : 'Delete'}}</button>\n <button type=\"button\" (click)=\"closeDeleteModal()\">{{'CANCEL' | nxtCustomTranslate : 'Cancel'}}</button>\n </div>\n </div>\n </div>\n</div>", styles: [".list-view-filter{padding-left:6px;padding-right:6px}.filter-label{font-size:11px;color:#747577;margin-right:8px}.select-wrapper{display:flex;align-items:center;cursor:pointer}.custom-dropdown{position:relative;cursor:pointer;display:inline-block}.selected-option{padding:2px 5px;font-size:16px;font-weight:700;display:flex;gap:8px}.chevron-icon{cursor:pointer;background-color:#f5f5f5;border-radius:5px}.dropdown-options-container{position:absolute;top:100%;display:flex;flex-direction:column;border:1px solid #ccc;background:#fff;box-shadow:0 2px 8px #0000001a;z-index:1000;min-width:250px}.dropdown-options{background:#fff;list-style:none;padding:0;margin:0;white-space:nowrap;width:100%;max-height:300px;overflow-y:auto}.dropdown-options li{padding:8px;cursor:pointer}.dropdown-options li:hover{background-color:#f1f1f1b4}.dropdown-options li.selected{background-color:#ececec;font-weight:600}.list-view-item{display:flex;justify-content:space-between;padding:8px;cursor:pointer;border-bottom:1px solid #f0f0f0}.list-view-item:hover{background-color:#cce6ff35}.edit-icon,.delete-icon{cursor:pointer;color:#666;transition:color .2s}.edit-icon:hover{color:#007bff}.delete-icon:hover{color:#dc3545}.add-filter{background-color:#fff;padding:10px;border-top:1px solid #dddddd;cursor:pointer;display:flex;align-items:center;gap:8px;width:100%}.add-filter:hover{background-color:#f8f9fa}.add-icon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.modal-content{background-color:#fff;border-radius:8px;padding:24px;width:700px;max-width:95%;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #00000026}.modal-content h2{margin-top:0;margin-bottom:20px;font-size:20px;color:#333}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500}.form-group input{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.toggle-wrapper{position:relative;display:inline-block}.toggle-wrapper input[type=checkbox]{opacity:0;width:0;height:0}.toggle-button{position:relative;display:inline-block;width:50px;height:24px;background-color:#ccc;border-radius:24px;transition:.3s;cursor:pointer}.toggle-button:before{position:absolute;content:\"\";height:20px;width:20px;left:2px;bottom:2px;background-color:#fff;border-radius:50%;transition:.3s}input[type=checkbox]:checked+.toggle-button{background-color:#007bff}input[type=checkbox]:checked+.toggle-button:before{transform:translate(20px)}.toggle-wrapper.small .toggle-button{width:40px;height:20px}.toggle-wrapper.small .toggle-button:before{height:16px;width:16px}input[type=checkbox]:checked+.toggle-button.small:before{transform:translate(20px)}.section-header{padding-bottom:8px}.section-header h3{margin:0 0 4px;font-size:16px;color:#333}.section-description{font-size:12px;color:#777}.table-container{border:1px solid #e0e0e0;border-radius:4px}.table-header{display:grid;background-color:#f8f9fa;font-weight:600;font-size:12px;padding:8px 12px;border-bottom:1px solid #e0e0e0}.filter-row,.column-row{display:grid;padding:8px 12px;border-bottom:1px solid #f0f0f0;align-items:center}.filter-row,.column-row,.table-header{grid-template-columns:1fr 1fr 1fr auto;gap:10px}.table-header.column-header{grid-template-columns:1fr 1fr 1fr auto}.column-cell,.operator-cell,.value-cell,.name-cell,.bool-cell,.action-cell{padding:5px}.action-cell{display:flex;justify-content:center}.listview-custom-select{position:relative;width:100%}.listview-custom-select input{border:none;font-size:12px}.dropdown-list{position:absolute;top:100%;left:0;width:100%;max-height:200px;overflow-y:auto;background:#fff;border:1px solid #ddd;border-top:none;border-radius:0 0 4px 4px;z-index:10;box-shadow:0 4px 8px #0000001a}.dropdown-item{padding:8px 12px;cursor:pointer}.dropdown-item:hover{background-color:#f5f5f5}.add-row{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer}.add-row:hover{background-color:#f8f9fa}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.dicon-container{padding:2px;border:1px solid #ffb5b5;border-radius:5px;margin-left:3px;margin-right:3px;display:flex}.delete-icon{display:flex;justify-content:center;align-items:center}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.delete-icon:hover svg path{stroke:#ff7575!important;fill:transparent!important}.edit-icon:hover svg path{fill:#007bff!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.form-delete{display:flex;justify-content:flex-end;gap:12px}.form-actions button,.form-delete button{padding:8px 16px;border-radius:4px;font-size:14px;cursor:pointer;transition:background-color .2s}.form-actions button:first-child{background-color:#007bff;color:#fff;border:1px solid #007bff}.form-actions button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-delete button:first-child{background-color:#dc3545;color:#fff;border:1px solid #dc3545}.form-delete button:nth-child(2){background-color:#f8f9fa;border:1px solid #ddd;color:#333}.form-actions button:hover,.form-delete button:hover{opacity:.9}.cursor-pointer{cursor:pointer}.flex{display:flex}.form-row{display:flex;gap:16px;align-items:flex-start}.form-group{min-width:0;margin-bottom:0!important}.error-message{color:#dc3545;font-size:12px;margin-top:4px}.listview-custom-select input[readonly]{cursor:pointer;background-color:#fff}.error-message{color:#ff2c10;font-size:.875rem;margin-bottom:.5rem}.save-button:disabled{background-color:#ccc!important;color:#666!important;cursor:not-allowed!important}.modal-header-div{display:flex;justify-content:space-between;font-size:18px;padding-bottom:10px}.close{color:#aaa;float:right;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.list-view-item{position:relative}.actions{display:none;position:absolute;right:8px;top:50%;transform:translateY(-50%)}.list-view-item:hover .actions{display:flex;gap:5px}\n"] }]
|
|
48994
|
+
}], ctorParameters: () => [{ type: i6.FormBuilder }, { type: NxtCustomTranslatePipe }, { type: DataService }], propDecorators: { listViews: [{
|
|
48995
|
+
type: Input
|
|
48996
|
+
}], tableData: [{
|
|
48948
48997
|
type: Input
|
|
48949
48998
|
}], tableFilterArray: [{
|
|
48950
48999
|
type: Input
|
|
@@ -49796,19 +49845,16 @@ class NxtFileUploadComponent {
|
|
|
49796
49845
|
selectedFileData = new EventEmitter();
|
|
49797
49846
|
deletedFileData = new EventEmitter();
|
|
49798
49847
|
allFiles;
|
|
49799
|
-
limitFileUploading;
|
|
49800
49848
|
mode = 'edit'; // SKS11JUN25 New mode input
|
|
49801
49849
|
question;
|
|
49802
|
-
error;
|
|
49803
49850
|
from;
|
|
49804
49851
|
//RS 09JAN2025
|
|
49805
49852
|
allowedFileTypes = [];
|
|
49806
49853
|
maxFileSize = 0; // in bytes(Binary)
|
|
49807
|
-
maxFiles =
|
|
49854
|
+
maxFiles = 5; // default limit
|
|
49808
49855
|
validationErrors = [];
|
|
49809
49856
|
selectedFileNameArray = [];
|
|
49810
49857
|
copyOfInputAllFiles;
|
|
49811
|
-
copyOfFileUploadingLimit;
|
|
49812
49858
|
fileUrl;
|
|
49813
49859
|
isImage = false;
|
|
49814
49860
|
fileName = '';
|
|
@@ -49834,9 +49880,6 @@ class NxtFileUploadComponent {
|
|
|
49834
49880
|
if (simpleChanges.allFiles) { //SKS5NOV25
|
|
49835
49881
|
this.copyOfInputAllFiles = simpleChanges.allFiles.currentValue || [];
|
|
49836
49882
|
}
|
|
49837
|
-
if (simpleChanges.limitFileUploading) {
|
|
49838
|
-
this.copyOfFileUploadingLimit = simpleChanges.limitFileUploading?.currentValue;
|
|
49839
|
-
}
|
|
49840
49883
|
}
|
|
49841
49884
|
//RS 09JAN2025 Initializes file upload settings (allowed types, max size, and max files) by parsing metadata from fieldsMeta
|
|
49842
49885
|
initializeFileConfigs() {
|
|
@@ -50052,27 +50095,23 @@ class NxtFileUploadComponent {
|
|
|
50052
50095
|
this.mode = 'view'; // SKS13JUN25 Switch back to view mode
|
|
50053
50096
|
}
|
|
50054
50097
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NxtFileUploadComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: SharedService }, { token: DataService }, { token: i3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
50055
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: NxtFileUploadComponent, isStandalone: true, selector: "nxt-file-upload", inputs: { allFiles: "allFiles", limitFileUploading: "limitFileUploading", mode: "mode", question: "question", error: "error", from: "from" }, outputs: { selectedFileData: "selectedFileData", deletedFileData: "deletedFileData" }, usesOnChanges: true, ngImport: i0, template: "<!-- SKS11JUN25 file-upload.component.html -->\n<div class=\"flex hover-wrapper\" style=\"align-items: center;\">\n <div class=\"flex file-inner-div\" [style.padding]=\"from === 'nxtTable' ? '0px' : ''\">\n <svg *ngIf=\"from !== 'nxtTable'\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <rect width=\"24\" height=\"24\" fill=\"url(#pattern0_616_35125)\" />\n <defs>\n <pattern id=\"pattern0_616_35125\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n <use xlink:href=\"#image0_616_35125\" transform=\"scale(0.00195312)\" />\n </pattern>\n <image id=\"image0_616_35125\" width=\"512\" height=\"512\" preserveAspectRatio=\"none\"\n xlink:href=\"data:image/png;base64,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\" />\n </defs>\n </svg>\n @if(copyOfInputAllFiles && copyOfInputAllFiles.length > 0){\n <span (click)=\"openPopup()\" style=\"text-decoration: underline; cursor: pointer;\">\n {{ '+' + copyOfInputAllFiles.length + (' FILES_ATTACHED' | nxtCustomTranslate : ' Files Attached') }}\n </span>\n }\n @else if(mode === 'edit') {\n <div> {{ 'ADD_FILES' | nxtCustomTranslate : 'Add files' }} </div>\n }\n @else {\n <div *ngIf=\"from !== 'nxtTable'\">{{ 'NO_FILES_ATTACHED' | nxtCustomTranslate : 'No files attached' }}</div>\n }\n <button *ngIf=\"mode === 'edit' && !question?.isReadOnly\" \n (click)=\"fileInput.click()\" \n class=\"add-btn-icon\"\n type=\"button\">\n <span class=\"plus-icon\">+</span>\n </button>\n\n <input #fileInput type=\"file\" name=\"fileUpload\" multiple=\"multiple\" [accept]=\"allowedFileTypes.join(',')\"\n style=\"display:none;\" (change)=\"uploadMultipleFiles($event)\" />\n </div>\n <!-- SKS13JUN25 edit icon -->\n <svg *ngIf=\"mode !== 'edit' && !viewEdit && !question?.isReadOnly && from !== 'nxtTable' \" class=\"edit-icon\" (click)=\"viewEditClick(question)\"\n width=\"13\" height=\"14\" viewBox=\"0 0 13 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M1.99987 9.0017L4.39602 11.3979C4.50371 11.5055 4.66525 11.5055 4.77294 11.3979L10.7499 5.39401C10.8576 5.28631 10.8576 5.12477 10.7499 5.01708L8.38064 2.64785C8.27294 2.54016 8.11141 2.54016 8.00371 2.64785L1.99987 8.6517C1.89217 8.75939 1.89217 8.92093 1.99987 9.0017ZM9.1614 1.54401C9.05371 1.6517 9.05371 1.81324 9.1614 1.92093L11.5306 4.29016C11.6383 4.39785 11.7999 4.39785 11.9076 4.29016L12.5806 3.61708C13.0114 3.21324 13.0114 2.56708 12.5806 2.13631L11.3153 0.870928C10.8845 0.440159 10.2114 0.440159 9.78063 0.870928L9.1614 1.54401ZM0.00755862 12.9863C-0.0462875 13.2555 0.19602 13.4979 0.465251 13.444L3.39987 12.744C3.50756 12.7171 3.58833 12.6632 3.64217 12.6094L3.69602 12.5555C3.74987 12.5017 3.77679 12.3132 3.6691 12.2055L1.24602 9.78247C1.13833 9.67478 0.949866 9.7017 0.89602 9.75554L0.842174 9.80939C0.761405 9.89016 0.734482 9.97093 0.707559 10.0517L0.00755862 12.9863Z\"\n fill=\"#B0ADAB\" />\n </svg>\n <!-- SKS13JUN25 save and cancel icons -->\n <div *ngIf=\"question?.subText?.singleFieldDisable !== undefined && viewEdit ? !question?.subText?.singleFieldDisable : viewEdit\"\n style=\"padding-right: 5px;\">\n <svg (click)=\"saveChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg> \n </div>\n <div *ngIf=\"viewEdit\">\n <svg (click)=\"discardChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n</div>\n\n<div *ngIf=\"from !== 'nxtTable'\" class=\"col-lg-6\" style=\"padding:0;margin-top: 10px;\">\n <!-- Error messages section -->\n <div class=\"file-constraints\" *ngIf=\"validationErrors.length > 0\">\n <small class=\"text-danger\">\n <div *ngFor=\"let error of validationErrors\">{{ error }}</div>\n </small>\n </div>\n</div>\n\n<div *ngIf=\"error\" class=\"error-msg\" style=\"margin-top: 10px;\">{{question?.errorMessage}}</div>\n\n<!-- SKS11JUN25 File Selection Popup Modal -->\n<div class=\"file-popup-overlay\" *ngIf=\"showPopup\" (click)=\"closePopup()\">\n <div class=\"file-popup-modal\" (click)=\"$event.stopPropagation()\">\n <!-- Header -->\n <div class=\"file-popup-header\">\n <div class=\"popup-title\">{{ question?.questionText ? ((question?.id+'.questionText') | nxtCustomTranslate : question?.questionText): ''}}</div>\n <button class=\"close-btn\" (click)=\"closePopup()\">\n <span class=\"close-icon\">\u00D7</span>\n </button>\n </div>\n\n <!-- SKS11JUN25 Content -->\n <div class=\"file-popup-content\">\n <!-- SKS11JUN25 Left Panel - File List -->\n <div class=\"file-list-panel\">\n <div class=\"file-item\" *ngFor=\"let file of copyOfInputAllFiles; let i = index\"\n [class.selected]=\"currentFile === file\" (click)=\"viewFile(file)\">\n <div class=\"file-icon\">\n <img style=\"width: 28px;height: 28px;\" [src]=\"getDocIcon(file?.name)\">\n </div>\n <div class=\"file-details\">\n <div class=\"file-name\">{{ file.name }}</div>\n </div>\n <div *ngIf=\"!question?.isReadOnly\" class=\"file-actions\">\n <button class=\"action-btn\" (click)=\"$event.stopPropagation(); deleteFile(i)\" title=\"{{ 'DELETE' | nxtCustomTranslate : 'Delete' }}\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"3,6 5,6 21,6\"></polyline>\n <path d=\"m19,6v14a2,2 0 0,1 -2,2H7a2,2 0 0,1 -2,-2V6m3,0V4a2,2 0 0,1 2,-2h4a2,2 0 0,1 2,2v2\"></path>\n </svg>\n </button>\n </div>\n </div>\n\n <!-- Empty state -->\n <div class=\"empty-state\" *ngIf=\"!copyOfInputAllFiles || copyOfInputAllFiles.length === 0\">\n <div class=\"empty-icon\">\uD83D\uDCC4</div>\n <p>{{ 'NO_FILES_SELECTED' | nxtCustomTranslate : 'No files selected' }}</p>\n </div>\n <!-- Add Button -->\n <button *ngIf=\"from !== 'nxtTable'\" class=\"add-btn\" (click)=\"fileInput.click()\" title=\"{{ 'ADD_FILE' | nxtCustomTranslate : 'Add file' }}\">\n {{ 'ADD_MORE_FILES' | nxtCustomTranslate : '+ Add More Files' }}\n </button>\n </div>\n\n <!-- SKS11JUN25 Right Panel - Preview -->\n <div class=\"file-preview-panel\">\n @if(currentFile){\n <div class=\"preview-content\">\n @if(isImage && fileUrl){\n <img [src]=\"fileUrl\" class=\"preview-image\" alt=\"File Preview\" />\n }\n @else if(fileUrl){\n <iframe [src]=\"fileUrl\" width=\"100%\" height=\"500px\"></iframe>\n }\n @else if(isLoading){\n <div class=\"loading-indicator\">\n <p>{{ 'LOADING_PREVIEW' | nxtCustomTranslate : 'Loading preview...' }}</p>\n <div class=\"spinner\"></div>\n </div>\n }\n @else {\n <div>{{ 'UNABLE_TO_LOAD_PREVIEW' | nxtCustomTranslate : 'Unable to load the file preview.' }}</div>\n }\n </div>\n }\n @else{\n <div class=\"no-preview\">\n <p>{{ 'SELECT_FILE_TO_PREVIEW' | nxtCustomTranslate : 'Select a file to preview' }}</p>\n </div>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".document-cnt{padding:10px;border:1px solid #ccc;border-radius:5px;background-color:#f9f9f9;margin-bottom:10px;cursor:pointer;transition:background-color .3s ease;position:relative}.document-cnt:hover{background-color:#e9ecef}.document_image img{width:30px;height:30px}.document_name{font-size:14px;font-weight:700;color:#333;line-height:30px}.label{margin-bottom:0}.document_delete img,.preview-icon img{width:20px;height:20px;cursor:pointer;transition:transform .3s ease}.document_delete img{filter:brightness(0) saturate(100%) invert(20%) sepia(97%) saturate(7481%) hue-rotate(357deg) brightness(98%) contrast(119%)}.document_delete img:hover,.preview-icon img:hover{transform:scale(1.1)}.document_delete,.preview-icon{position:absolute;top:50%;transform:translateY(-50%)}.document_delete{right:10px}.preview-icon{right:40px}@media (min-width: 992px){.document-cnt{margin-left:10px}}.form-control[disabled]{border-radius:5px}.btn-primary{background-color:#03a9f4!important;border:1px solid #03a9f4!important;color:#fff!important}.btn.btn-primary{border-radius:2px;padding:6px 14px;font-size:14px}.Invalid{border:1px solid red!important}.close-button{background:none;border:none;font-size:1.5em;cursor:pointer}.img-fluid{max-width:100%;height:auto;flex:1}iframe{border:none}.file-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.file-popup-modal{background:#fff;border-radius:12px;width:90%;max-width:1000px;height:80%;max-height:600px;display:flex;flex-direction:column;box-shadow:0 20px 40px #0000001a;overflow:hidden}.file-popup-header{display:flex;justify-content:space-between;align-items:center;padding:8px;border-bottom:1px solid #e5e7eb;background-color:#fafafa}.popup-title{font-size:16px;font-weight:600;color:#111827;margin:0}.close-btn{background:none;border:none;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s}.close-btn:hover{background-color:#f3f4f6}.close-icon{font-size:24px;color:#6b7280;line-height:1}.file-popup-content{display:flex;flex:1;overflow:hidden}.file-list-panel{width:300px;border-right:1px solid #e5e7eb;background-color:#fff;overflow-y:auto;padding:16px 16px 60px;position:relative}.file-item{display:flex;align-items:center;padding:12px 16px;border-radius:8px;cursor:pointer;transition:background-color .2s;margin-bottom:8px;border:1px solid #dfe0e2;background-color:#fff}.file-item:hover{background-color:#f8fafc;border-color:#e2e8f0}.file-item.selected{background-color:#dbeafe;border-color:#3b82f6}.file-icon{margin-right:12px;flex-shrink:0}.file-details{flex:1;min-width:0}.file-name{font-size:14px;font-weight:500;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.file-actions{margin-left:8px}.action-btn{background:none;border:none;padding:4px;border-radius:4px;cursor:pointer;color:#6b7280;transition:all .2s}.action-btn:hover{background-color:#fef2f2;color:#dc2626}.file-preview-panel{flex:1;background-color:#f9fafb;display:flex;align-items:center;justify-content:center;padding:32px}.preview-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.preview-image{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 4px 6px #0000001a}.no-preview{text-align:center;color:#6b7280}.empty-state{text-align:center;padding:32px 16px;color:#6b7280}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.empty-state p{margin:0;font-size:14px}@media (max-width: 768px){.file-list-panel{padding-bottom:70px;width:100%}.add-btn{bottom:12px;left:12px;right:12px}.file-popup-modal{width:95%;height:85%}.file-popup-content{flex-direction:column}.file-preview-panel{flex:1;min-height:200px}}.edit-icon{display:none;cursor:pointer}.hover-wrapper:hover .edit-icon{display:block}.file-inner-div{width:100%;padding:10px 10px 10px 5px;border-radius:5px;border:none;font-size:12px;align-items:center;gap:5px}.loading-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#555}.spinner{margin-top:10px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.add-btn{position:absolute;bottom:16px;left:16px;right:16px;background-color:#007bff;color:#fff;border:none;padding:12px 16px;font-size:14px;border-radius:6px;cursor:pointer;box-shadow:0 2px 6px #0003;transition:background-color .2s;z-index:10}.add-btn:hover{background-color:#0056b3}.add-btn-icon{width:25px;height:25px;border-radius:50%;border:none;background:#007bff;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;position:relative;overflow:hidden}.add-btn-icon:focus{outline:none!important}.add-btn-icon:hover{transform:scale(1.1);border:none}.add-btn-icon:active{transform:scale(.95)}.plus-icon{font-size:15px;font-weight:700;line-height:1;transition:transform .2s ease}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
50098
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: NxtFileUploadComponent, isStandalone: true, selector: "nxt-file-upload", inputs: { allFiles: "allFiles", mode: "mode", question: "question", from: "from" }, outputs: { selectedFileData: "selectedFileData", deletedFileData: "deletedFileData" }, usesOnChanges: true, ngImport: i0, template: "<!-- SKS11JUN25 file-upload.component.html -->\n<div class=\"flex hover-wrapper\" style=\"align-items: center;\">\n <div class=\"flex file-inner-div\" [style.padding]=\"from === 'nxtTable' ? '0px' : ''\">\n <svg *ngIf=\"from !== 'nxtTable'\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <rect width=\"24\" height=\"24\" fill=\"url(#pattern0_616_35125)\" />\n <defs>\n <pattern id=\"pattern0_616_35125\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n <use xlink:href=\"#image0_616_35125\" transform=\"scale(0.00195312)\" />\n </pattern>\n <image id=\"image0_616_35125\" width=\"512\" height=\"512\" preserveAspectRatio=\"none\"\n xlink:href=\"data:image/png;base64,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\" />\n </defs>\n </svg>\n @if(copyOfInputAllFiles && copyOfInputAllFiles.length > 0){\n <span (click)=\"openPopup()\" style=\"text-decoration: underline; cursor: pointer;\">\n {{ '+' + copyOfInputAllFiles.length + (' FILES_ATTACHED' | nxtCustomTranslate : ' Files Attached') }}\n </span>\n }\n @else if(mode === 'edit') {\n <div> {{ 'ADD_FILES' | nxtCustomTranslate : 'Add files' }} </div>\n }\n @else {\n <div *ngIf=\"from !== 'nxtTable'\">{{ 'NO_FILES_ATTACHED' | nxtCustomTranslate : 'No files attached' }}</div>\n }\n <button *ngIf=\"mode === 'edit' && !question?.isReadOnly\" \n (click)=\"fileInput.click()\" \n class=\"add-btn-icon\"\n type=\"button\">\n <span class=\"plus-icon\">+</span>\n </button>\n\n <input #fileInput type=\"file\" name=\"fileUpload\" multiple=\"multiple\" [accept]=\"allowedFileTypes.join(',')\"\n style=\"display:none;\" (change)=\"uploadMultipleFiles($event)\" />\n </div>\n <!-- SKS13JUN25 edit icon -->\n <svg *ngIf=\"mode !== 'edit' && !viewEdit && !question?.isReadOnly && from !== 'nxtTable' \" class=\"edit-icon\" (click)=\"viewEditClick(question)\"\n width=\"13\" height=\"14\" viewBox=\"0 0 13 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M1.99987 9.0017L4.39602 11.3979C4.50371 11.5055 4.66525 11.5055 4.77294 11.3979L10.7499 5.39401C10.8576 5.28631 10.8576 5.12477 10.7499 5.01708L8.38064 2.64785C8.27294 2.54016 8.11141 2.54016 8.00371 2.64785L1.99987 8.6517C1.89217 8.75939 1.89217 8.92093 1.99987 9.0017ZM9.1614 1.54401C9.05371 1.6517 9.05371 1.81324 9.1614 1.92093L11.5306 4.29016C11.6383 4.39785 11.7999 4.39785 11.9076 4.29016L12.5806 3.61708C13.0114 3.21324 13.0114 2.56708 12.5806 2.13631L11.3153 0.870928C10.8845 0.440159 10.2114 0.440159 9.78063 0.870928L9.1614 1.54401ZM0.00755862 12.9863C-0.0462875 13.2555 0.19602 13.4979 0.465251 13.444L3.39987 12.744C3.50756 12.7171 3.58833 12.6632 3.64217 12.6094L3.69602 12.5555C3.74987 12.5017 3.77679 12.3132 3.6691 12.2055L1.24602 9.78247C1.13833 9.67478 0.949866 9.7017 0.89602 9.75554L0.842174 9.80939C0.761405 9.89016 0.734482 9.97093 0.707559 10.0517L0.00755862 12.9863Z\"\n fill=\"#B0ADAB\" />\n </svg>\n <!-- SKS13JUN25 save and cancel icons -->\n <div *ngIf=\"question?.subText?.singleFieldDisable !== undefined && viewEdit ? !question?.subText?.singleFieldDisable : viewEdit\"\n style=\"padding-right: 5px;\">\n <svg (click)=\"saveChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg> \n </div>\n <div *ngIf=\"viewEdit\">\n <svg (click)=\"discardChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n</div>\n\n<div *ngIf=\"from !== 'nxtTable'\" class=\"col-lg-6\" style=\"padding:0;margin-top: 10px;\">\n <!-- Error messages section -->\n <div class=\"file-constraints\" *ngIf=\"validationErrors.length > 0\">\n <small class=\"text-danger\">\n <div *ngFor=\"let error of validationErrors\">{{ error }}</div>\n </small>\n </div>\n</div>\n\n<!-- <div *ngIf=\"error\" class=\"error-msg\" style=\"margin-top: 10px;\">{{question?.errorMessage}}</div> -->\n\n<!-- SKS11JUN25 File Selection Popup Modal -->\n<div class=\"file-popup-overlay\" *ngIf=\"showPopup\" (click)=\"closePopup()\">\n <div class=\"file-popup-modal\" (click)=\"$event.stopPropagation()\">\n <!-- Header -->\n <div class=\"file-popup-header\">\n <div class=\"popup-title\">{{ question?.questionText ? ((question?.id+'.questionText') | nxtCustomTranslate : question?.questionText): ''}}</div>\n <button class=\"close-btn\" (click)=\"closePopup()\">\n <span class=\"close-icon\">\u00D7</span>\n </button>\n </div>\n\n <!-- SKS11JUN25 Content -->\n <div class=\"file-popup-content\">\n <!-- SKS11JUN25 Left Panel - File List -->\n <div class=\"file-list-panel\">\n <div class=\"file-item\" *ngFor=\"let file of copyOfInputAllFiles; let i = index\"\n [class.selected]=\"currentFile === file\" (click)=\"viewFile(file)\">\n <div class=\"file-icon\">\n <img style=\"width: 28px;height: 28px;\" [src]=\"getDocIcon(file?.name)\">\n </div>\n <div class=\"file-details\">\n <div class=\"file-name\">{{ file.name }}</div>\n </div>\n <div *ngIf=\"!question?.isReadOnly\" class=\"file-actions\">\n <button class=\"action-btn\" (click)=\"$event.stopPropagation(); deleteFile(i)\" title=\"{{ 'DELETE' | nxtCustomTranslate : 'Delete' }}\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"3,6 5,6 21,6\"></polyline>\n <path d=\"m19,6v14a2,2 0 0,1 -2,2H7a2,2 0 0,1 -2,-2V6m3,0V4a2,2 0 0,1 2,-2h4a2,2 0 0,1 2,2v2\"></path>\n </svg>\n </button>\n </div>\n </div>\n\n <!-- Empty state -->\n <div class=\"empty-state\" *ngIf=\"!copyOfInputAllFiles || copyOfInputAllFiles.length === 0\">\n <div class=\"empty-icon\">\uD83D\uDCC4</div>\n <p>{{ 'NO_FILES_SELECTED' | nxtCustomTranslate : 'No files selected' }}</p>\n </div>\n <!-- Add Button -->\n <button *ngIf=\"from !== 'nxtTable'\" class=\"add-btn\" (click)=\"fileInput.click()\" title=\"{{ 'ADD_FILE' | nxtCustomTranslate : 'Add file' }}\">\n {{ 'ADD_MORE_FILES' | nxtCustomTranslate : '+ Add More Files' }}\n </button>\n </div>\n\n <!-- SKS11JUN25 Right Panel - Preview -->\n <div class=\"file-preview-panel\">\n @if(currentFile){\n <div class=\"preview-content\">\n @if(isImage && fileUrl){\n <img [src]=\"fileUrl\" class=\"preview-image\" alt=\"File Preview\" />\n }\n @else if(fileUrl){\n <iframe [src]=\"fileUrl\" width=\"100%\" height=\"500px\"></iframe>\n }\n @else if(isLoading){\n <div class=\"loading-indicator\">\n <p>{{ 'LOADING_PREVIEW' | nxtCustomTranslate : 'Loading preview...' }}</p>\n <div class=\"spinner\"></div>\n </div>\n }\n @else {\n <div>{{ 'UNABLE_TO_LOAD_PREVIEW' | nxtCustomTranslate : 'Unable to load the file preview.' }}</div>\n }\n </div>\n }\n @else{\n <div class=\"no-preview\">\n <p>{{ 'SELECT_FILE_TO_PREVIEW' | nxtCustomTranslate : 'Select a file to preview' }}</p>\n </div>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".document-cnt{padding:10px;border:1px solid #ccc;border-radius:5px;background-color:#f9f9f9;margin-bottom:10px;cursor:pointer;transition:background-color .3s ease;position:relative}.document-cnt:hover{background-color:#e9ecef}.document_image img{width:30px;height:30px}.document_name{font-size:14px;font-weight:700;color:#333;line-height:30px}.label{margin-bottom:0}.document_delete img,.preview-icon img{width:20px;height:20px;cursor:pointer;transition:transform .3s ease}.document_delete img{filter:brightness(0) saturate(100%) invert(20%) sepia(97%) saturate(7481%) hue-rotate(357deg) brightness(98%) contrast(119%)}.document_delete img:hover,.preview-icon img:hover{transform:scale(1.1)}.document_delete,.preview-icon{position:absolute;top:50%;transform:translateY(-50%)}.document_delete{right:10px}.preview-icon{right:40px}@media (min-width: 992px){.document-cnt{margin-left:10px}}.form-control[disabled]{border-radius:5px}.btn-primary{background-color:#03a9f4!important;border:1px solid #03a9f4!important;color:#fff!important}.btn.btn-primary{border-radius:2px;padding:6px 14px;font-size:14px}.Invalid{border:1px solid red!important}.close-button{background:none;border:none;font-size:1.5em;cursor:pointer}.img-fluid{max-width:100%;height:auto;flex:1}iframe{border:none}.file-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.file-popup-modal{background:#fff;border-radius:12px;width:90%;max-width:1000px;height:80%;max-height:600px;display:flex;flex-direction:column;box-shadow:0 20px 40px #0000001a;overflow:hidden}.file-popup-header{display:flex;justify-content:space-between;align-items:center;padding:8px;border-bottom:1px solid #e5e7eb;background-color:#fafafa}.popup-title{font-size:16px;font-weight:600;color:#111827;margin:0}.close-btn{background:none;border:none;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s}.close-btn:hover{background-color:#f3f4f6}.close-icon{font-size:24px;color:#6b7280;line-height:1}.file-popup-content{display:flex;flex:1;overflow:hidden}.file-list-panel{width:300px;border-right:1px solid #e5e7eb;background-color:#fff;overflow-y:auto;padding:16px 16px 60px;position:relative}.file-item{display:flex;align-items:center;padding:12px 16px;border-radius:8px;cursor:pointer;transition:background-color .2s;margin-bottom:8px;border:1px solid #dfe0e2;background-color:#fff}.file-item:hover{background-color:#f8fafc;border-color:#e2e8f0}.file-item.selected{background-color:#dbeafe;border-color:#3b82f6}.file-icon{margin-right:12px;flex-shrink:0}.file-details{flex:1;min-width:0}.file-name{font-size:14px;font-weight:500;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.file-actions{margin-left:8px}.action-btn{background:none;border:none;padding:4px;border-radius:4px;cursor:pointer;color:#6b7280;transition:all .2s}.action-btn:hover{background-color:#fef2f2;color:#dc2626}.file-preview-panel{flex:1;background-color:#f9fafb;display:flex;align-items:center;justify-content:center;padding:32px}.preview-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.preview-image{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 4px 6px #0000001a}.no-preview{text-align:center;color:#6b7280}.empty-state{text-align:center;padding:32px 16px;color:#6b7280}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.empty-state p{margin:0;font-size:14px}@media (max-width: 768px){.file-list-panel{padding-bottom:70px;width:100%}.add-btn{bottom:12px;left:12px;right:12px}.file-popup-modal{width:95%;height:85%}.file-popup-content{flex-direction:column}.file-preview-panel{flex:1;min-height:200px}}.edit-icon{display:none;cursor:pointer}.hover-wrapper:hover .edit-icon{display:block}.file-inner-div{width:100%;padding:10px 10px 10px 5px;border-radius:5px;border:none;font-size:12px;align-items:center;gap:5px}.loading-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#555}.spinner{margin-top:10px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.add-btn{position:absolute;bottom:16px;left:16px;right:16px;background-color:#007bff;color:#fff;border:none;padding:12px 16px;font-size:14px;border-radius:6px;cursor:pointer;box-shadow:0 2px 6px #0003;transition:background-color .2s;z-index:10}.add-btn:hover{background-color:#0056b3}.add-btn-icon{width:25px;height:25px;border-radius:50%;border:none;background:#007bff;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;position:relative;overflow:hidden}.add-btn-icon:focus{outline:none!important}.add-btn-icon:hover{transform:scale(1.1);border:none}.add-btn-icon:active{transform:scale(.95)}.plus-icon{font-size:15px;font-weight:700;line-height:1;transition:transform .2s ease}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
50056
50099
|
}
|
|
50057
50100
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NxtFileUploadComponent, decorators: [{
|
|
50058
50101
|
type: Component,
|
|
50059
50102
|
args: [{ selector: 'nxt-file-upload', standalone: true, imports: [
|
|
50060
50103
|
CommonModule, NxtCustomTranslatePipe
|
|
50061
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- SKS11JUN25 file-upload.component.html -->\n<div class=\"flex hover-wrapper\" style=\"align-items: center;\">\n <div class=\"flex file-inner-div\" [style.padding]=\"from === 'nxtTable' ? '0px' : ''\">\n <svg *ngIf=\"from !== 'nxtTable'\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <rect width=\"24\" height=\"24\" fill=\"url(#pattern0_616_35125)\" />\n <defs>\n <pattern id=\"pattern0_616_35125\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n <use xlink:href=\"#image0_616_35125\" transform=\"scale(0.00195312)\" />\n </pattern>\n <image id=\"image0_616_35125\" width=\"512\" height=\"512\" preserveAspectRatio=\"none\"\n xlink:href=\"data:image/png;base64,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\" />\n </defs>\n </svg>\n @if(copyOfInputAllFiles && copyOfInputAllFiles.length > 0){\n <span (click)=\"openPopup()\" style=\"text-decoration: underline; cursor: pointer;\">\n {{ '+' + copyOfInputAllFiles.length + (' FILES_ATTACHED' | nxtCustomTranslate : ' Files Attached') }}\n </span>\n }\n @else if(mode === 'edit') {\n <div> {{ 'ADD_FILES' | nxtCustomTranslate : 'Add files' }} </div>\n }\n @else {\n <div *ngIf=\"from !== 'nxtTable'\">{{ 'NO_FILES_ATTACHED' | nxtCustomTranslate : 'No files attached' }}</div>\n }\n <button *ngIf=\"mode === 'edit' && !question?.isReadOnly\" \n (click)=\"fileInput.click()\" \n class=\"add-btn-icon\"\n type=\"button\">\n <span class=\"plus-icon\">+</span>\n </button>\n\n <input #fileInput type=\"file\" name=\"fileUpload\" multiple=\"multiple\" [accept]=\"allowedFileTypes.join(',')\"\n style=\"display:none;\" (change)=\"uploadMultipleFiles($event)\" />\n </div>\n <!-- SKS13JUN25 edit icon -->\n <svg *ngIf=\"mode !== 'edit' && !viewEdit && !question?.isReadOnly && from !== 'nxtTable' \" class=\"edit-icon\" (click)=\"viewEditClick(question)\"\n width=\"13\" height=\"14\" viewBox=\"0 0 13 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M1.99987 9.0017L4.39602 11.3979C4.50371 11.5055 4.66525 11.5055 4.77294 11.3979L10.7499 5.39401C10.8576 5.28631 10.8576 5.12477 10.7499 5.01708L8.38064 2.64785C8.27294 2.54016 8.11141 2.54016 8.00371 2.64785L1.99987 8.6517C1.89217 8.75939 1.89217 8.92093 1.99987 9.0017ZM9.1614 1.54401C9.05371 1.6517 9.05371 1.81324 9.1614 1.92093L11.5306 4.29016C11.6383 4.39785 11.7999 4.39785 11.9076 4.29016L12.5806 3.61708C13.0114 3.21324 13.0114 2.56708 12.5806 2.13631L11.3153 0.870928C10.8845 0.440159 10.2114 0.440159 9.78063 0.870928L9.1614 1.54401ZM0.00755862 12.9863C-0.0462875 13.2555 0.19602 13.4979 0.465251 13.444L3.39987 12.744C3.50756 12.7171 3.58833 12.6632 3.64217 12.6094L3.69602 12.5555C3.74987 12.5017 3.77679 12.3132 3.6691 12.2055L1.24602 9.78247C1.13833 9.67478 0.949866 9.7017 0.89602 9.75554L0.842174 9.80939C0.761405 9.89016 0.734482 9.97093 0.707559 10.0517L0.00755862 12.9863Z\"\n fill=\"#B0ADAB\" />\n </svg>\n <!-- SKS13JUN25 save and cancel icons -->\n <div *ngIf=\"question?.subText?.singleFieldDisable !== undefined && viewEdit ? !question?.subText?.singleFieldDisable : viewEdit\"\n style=\"padding-right: 5px;\">\n <svg (click)=\"saveChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg> \n </div>\n <div *ngIf=\"viewEdit\">\n <svg (click)=\"discardChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n</div>\n\n<div *ngIf=\"from !== 'nxtTable'\" class=\"col-lg-6\" style=\"padding:0;margin-top: 10px;\">\n <!-- Error messages section -->\n <div class=\"file-constraints\" *ngIf=\"validationErrors.length > 0\">\n <small class=\"text-danger\">\n <div *ngFor=\"let error of validationErrors\">{{ error }}</div>\n </small>\n </div>\n</div>\n\n<div *ngIf=\"error\" class=\"error-msg\" style=\"margin-top: 10px;\">{{question?.errorMessage}}</div>\n\n<!-- SKS11JUN25 File Selection Popup Modal -->\n<div class=\"file-popup-overlay\" *ngIf=\"showPopup\" (click)=\"closePopup()\">\n <div class=\"file-popup-modal\" (click)=\"$event.stopPropagation()\">\n <!-- Header -->\n <div class=\"file-popup-header\">\n <div class=\"popup-title\">{{ question?.questionText ? ((question?.id+'.questionText') | nxtCustomTranslate : question?.questionText): ''}}</div>\n <button class=\"close-btn\" (click)=\"closePopup()\">\n <span class=\"close-icon\">\u00D7</span>\n </button>\n </div>\n\n <!-- SKS11JUN25 Content -->\n <div class=\"file-popup-content\">\n <!-- SKS11JUN25 Left Panel - File List -->\n <div class=\"file-list-panel\">\n <div class=\"file-item\" *ngFor=\"let file of copyOfInputAllFiles; let i = index\"\n [class.selected]=\"currentFile === file\" (click)=\"viewFile(file)\">\n <div class=\"file-icon\">\n <img style=\"width: 28px;height: 28px;\" [src]=\"getDocIcon(file?.name)\">\n </div>\n <div class=\"file-details\">\n <div class=\"file-name\">{{ file.name }}</div>\n </div>\n <div *ngIf=\"!question?.isReadOnly\" class=\"file-actions\">\n <button class=\"action-btn\" (click)=\"$event.stopPropagation(); deleteFile(i)\" title=\"{{ 'DELETE' | nxtCustomTranslate : 'Delete' }}\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"3,6 5,6 21,6\"></polyline>\n <path d=\"m19,6v14a2,2 0 0,1 -2,2H7a2,2 0 0,1 -2,-2V6m3,0V4a2,2 0 0,1 2,-2h4a2,2 0 0,1 2,2v2\"></path>\n </svg>\n </button>\n </div>\n </div>\n\n <!-- Empty state -->\n <div class=\"empty-state\" *ngIf=\"!copyOfInputAllFiles || copyOfInputAllFiles.length === 0\">\n <div class=\"empty-icon\">\uD83D\uDCC4</div>\n <p>{{ 'NO_FILES_SELECTED' | nxtCustomTranslate : 'No files selected' }}</p>\n </div>\n <!-- Add Button -->\n <button *ngIf=\"from !== 'nxtTable'\" class=\"add-btn\" (click)=\"fileInput.click()\" title=\"{{ 'ADD_FILE' | nxtCustomTranslate : 'Add file' }}\">\n {{ 'ADD_MORE_FILES' | nxtCustomTranslate : '+ Add More Files' }}\n </button>\n </div>\n\n <!-- SKS11JUN25 Right Panel - Preview -->\n <div class=\"file-preview-panel\">\n @if(currentFile){\n <div class=\"preview-content\">\n @if(isImage && fileUrl){\n <img [src]=\"fileUrl\" class=\"preview-image\" alt=\"File Preview\" />\n }\n @else if(fileUrl){\n <iframe [src]=\"fileUrl\" width=\"100%\" height=\"500px\"></iframe>\n }\n @else if(isLoading){\n <div class=\"loading-indicator\">\n <p>{{ 'LOADING_PREVIEW' | nxtCustomTranslate : 'Loading preview...' }}</p>\n <div class=\"spinner\"></div>\n </div>\n }\n @else {\n <div>{{ 'UNABLE_TO_LOAD_PREVIEW' | nxtCustomTranslate : 'Unable to load the file preview.' }}</div>\n }\n </div>\n }\n @else{\n <div class=\"no-preview\">\n <p>{{ 'SELECT_FILE_TO_PREVIEW' | nxtCustomTranslate : 'Select a file to preview' }}</p>\n </div>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".document-cnt{padding:10px;border:1px solid #ccc;border-radius:5px;background-color:#f9f9f9;margin-bottom:10px;cursor:pointer;transition:background-color .3s ease;position:relative}.document-cnt:hover{background-color:#e9ecef}.document_image img{width:30px;height:30px}.document_name{font-size:14px;font-weight:700;color:#333;line-height:30px}.label{margin-bottom:0}.document_delete img,.preview-icon img{width:20px;height:20px;cursor:pointer;transition:transform .3s ease}.document_delete img{filter:brightness(0) saturate(100%) invert(20%) sepia(97%) saturate(7481%) hue-rotate(357deg) brightness(98%) contrast(119%)}.document_delete img:hover,.preview-icon img:hover{transform:scale(1.1)}.document_delete,.preview-icon{position:absolute;top:50%;transform:translateY(-50%)}.document_delete{right:10px}.preview-icon{right:40px}@media (min-width: 992px){.document-cnt{margin-left:10px}}.form-control[disabled]{border-radius:5px}.btn-primary{background-color:#03a9f4!important;border:1px solid #03a9f4!important;color:#fff!important}.btn.btn-primary{border-radius:2px;padding:6px 14px;font-size:14px}.Invalid{border:1px solid red!important}.close-button{background:none;border:none;font-size:1.5em;cursor:pointer}.img-fluid{max-width:100%;height:auto;flex:1}iframe{border:none}.file-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.file-popup-modal{background:#fff;border-radius:12px;width:90%;max-width:1000px;height:80%;max-height:600px;display:flex;flex-direction:column;box-shadow:0 20px 40px #0000001a;overflow:hidden}.file-popup-header{display:flex;justify-content:space-between;align-items:center;padding:8px;border-bottom:1px solid #e5e7eb;background-color:#fafafa}.popup-title{font-size:16px;font-weight:600;color:#111827;margin:0}.close-btn{background:none;border:none;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s}.close-btn:hover{background-color:#f3f4f6}.close-icon{font-size:24px;color:#6b7280;line-height:1}.file-popup-content{display:flex;flex:1;overflow:hidden}.file-list-panel{width:300px;border-right:1px solid #e5e7eb;background-color:#fff;overflow-y:auto;padding:16px 16px 60px;position:relative}.file-item{display:flex;align-items:center;padding:12px 16px;border-radius:8px;cursor:pointer;transition:background-color .2s;margin-bottom:8px;border:1px solid #dfe0e2;background-color:#fff}.file-item:hover{background-color:#f8fafc;border-color:#e2e8f0}.file-item.selected{background-color:#dbeafe;border-color:#3b82f6}.file-icon{margin-right:12px;flex-shrink:0}.file-details{flex:1;min-width:0}.file-name{font-size:14px;font-weight:500;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.file-actions{margin-left:8px}.action-btn{background:none;border:none;padding:4px;border-radius:4px;cursor:pointer;color:#6b7280;transition:all .2s}.action-btn:hover{background-color:#fef2f2;color:#dc2626}.file-preview-panel{flex:1;background-color:#f9fafb;display:flex;align-items:center;justify-content:center;padding:32px}.preview-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.preview-image{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 4px 6px #0000001a}.no-preview{text-align:center;color:#6b7280}.empty-state{text-align:center;padding:32px 16px;color:#6b7280}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.empty-state p{margin:0;font-size:14px}@media (max-width: 768px){.file-list-panel{padding-bottom:70px;width:100%}.add-btn{bottom:12px;left:12px;right:12px}.file-popup-modal{width:95%;height:85%}.file-popup-content{flex-direction:column}.file-preview-panel{flex:1;min-height:200px}}.edit-icon{display:none;cursor:pointer}.hover-wrapper:hover .edit-icon{display:block}.file-inner-div{width:100%;padding:10px 10px 10px 5px;border-radius:5px;border:none;font-size:12px;align-items:center;gap:5px}.loading-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#555}.spinner{margin-top:10px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.add-btn{position:absolute;bottom:16px;left:16px;right:16px;background-color:#007bff;color:#fff;border:none;padding:12px 16px;font-size:14px;border-radius:6px;cursor:pointer;box-shadow:0 2px 6px #0003;transition:background-color .2s;z-index:10}.add-btn:hover{background-color:#0056b3}.add-btn-icon{width:25px;height:25px;border-radius:50%;border:none;background:#007bff;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;position:relative;overflow:hidden}.add-btn-icon:focus{outline:none!important}.add-btn-icon:hover{transform:scale(1.1);border:none}.add-btn-icon:active{transform:scale(.95)}.plus-icon{font-size:15px;font-weight:700;line-height:1;transition:transform .2s ease}\n"] }]
|
|
50104
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- SKS11JUN25 file-upload.component.html -->\n<div class=\"flex hover-wrapper\" style=\"align-items: center;\">\n <div class=\"flex file-inner-div\" [style.padding]=\"from === 'nxtTable' ? '0px' : ''\">\n <svg *ngIf=\"from !== 'nxtTable'\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <rect width=\"24\" height=\"24\" fill=\"url(#pattern0_616_35125)\" />\n <defs>\n <pattern id=\"pattern0_616_35125\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n <use xlink:href=\"#image0_616_35125\" transform=\"scale(0.00195312)\" />\n </pattern>\n <image id=\"image0_616_35125\" width=\"512\" height=\"512\" preserveAspectRatio=\"none\"\n xlink:href=\"data:image/png;base64,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\" />\n </defs>\n </svg>\n @if(copyOfInputAllFiles && copyOfInputAllFiles.length > 0){\n <span (click)=\"openPopup()\" style=\"text-decoration: underline; cursor: pointer;\">\n {{ '+' + copyOfInputAllFiles.length + (' FILES_ATTACHED' | nxtCustomTranslate : ' Files Attached') }}\n </span>\n }\n @else if(mode === 'edit') {\n <div> {{ 'ADD_FILES' | nxtCustomTranslate : 'Add files' }} </div>\n }\n @else {\n <div *ngIf=\"from !== 'nxtTable'\">{{ 'NO_FILES_ATTACHED' | nxtCustomTranslate : 'No files attached' }}</div>\n }\n <button *ngIf=\"mode === 'edit' && !question?.isReadOnly\" \n (click)=\"fileInput.click()\" \n class=\"add-btn-icon\"\n type=\"button\">\n <span class=\"plus-icon\">+</span>\n </button>\n\n <input #fileInput type=\"file\" name=\"fileUpload\" multiple=\"multiple\" [accept]=\"allowedFileTypes.join(',')\"\n style=\"display:none;\" (change)=\"uploadMultipleFiles($event)\" />\n </div>\n <!-- SKS13JUN25 edit icon -->\n <svg *ngIf=\"mode !== 'edit' && !viewEdit && !question?.isReadOnly && from !== 'nxtTable' \" class=\"edit-icon\" (click)=\"viewEditClick(question)\"\n width=\"13\" height=\"14\" viewBox=\"0 0 13 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M1.99987 9.0017L4.39602 11.3979C4.50371 11.5055 4.66525 11.5055 4.77294 11.3979L10.7499 5.39401C10.8576 5.28631 10.8576 5.12477 10.7499 5.01708L8.38064 2.64785C8.27294 2.54016 8.11141 2.54016 8.00371 2.64785L1.99987 8.6517C1.89217 8.75939 1.89217 8.92093 1.99987 9.0017ZM9.1614 1.54401C9.05371 1.6517 9.05371 1.81324 9.1614 1.92093L11.5306 4.29016C11.6383 4.39785 11.7999 4.39785 11.9076 4.29016L12.5806 3.61708C13.0114 3.21324 13.0114 2.56708 12.5806 2.13631L11.3153 0.870928C10.8845 0.440159 10.2114 0.440159 9.78063 0.870928L9.1614 1.54401ZM0.00755862 12.9863C-0.0462875 13.2555 0.19602 13.4979 0.465251 13.444L3.39987 12.744C3.50756 12.7171 3.58833 12.6632 3.64217 12.6094L3.69602 12.5555C3.74987 12.5017 3.77679 12.3132 3.6691 12.2055L1.24602 9.78247C1.13833 9.67478 0.949866 9.7017 0.89602 9.75554L0.842174 9.80939C0.761405 9.89016 0.734482 9.97093 0.707559 10.0517L0.00755862 12.9863Z\"\n fill=\"#B0ADAB\" />\n </svg>\n <!-- SKS13JUN25 save and cancel icons -->\n <div *ngIf=\"question?.subText?.singleFieldDisable !== undefined && viewEdit ? !question?.subText?.singleFieldDisable : viewEdit\"\n style=\"padding-right: 5px;\">\n <svg (click)=\"saveChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg> \n </div>\n <div *ngIf=\"viewEdit\">\n <svg (click)=\"discardChanges()\" width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n</div>\n\n<div *ngIf=\"from !== 'nxtTable'\" class=\"col-lg-6\" style=\"padding:0;margin-top: 10px;\">\n <!-- Error messages section -->\n <div class=\"file-constraints\" *ngIf=\"validationErrors.length > 0\">\n <small class=\"text-danger\">\n <div *ngFor=\"let error of validationErrors\">{{ error }}</div>\n </small>\n </div>\n</div>\n\n<!-- <div *ngIf=\"error\" class=\"error-msg\" style=\"margin-top: 10px;\">{{question?.errorMessage}}</div> -->\n\n<!-- SKS11JUN25 File Selection Popup Modal -->\n<div class=\"file-popup-overlay\" *ngIf=\"showPopup\" (click)=\"closePopup()\">\n <div class=\"file-popup-modal\" (click)=\"$event.stopPropagation()\">\n <!-- Header -->\n <div class=\"file-popup-header\">\n <div class=\"popup-title\">{{ question?.questionText ? ((question?.id+'.questionText') | nxtCustomTranslate : question?.questionText): ''}}</div>\n <button class=\"close-btn\" (click)=\"closePopup()\">\n <span class=\"close-icon\">\u00D7</span>\n </button>\n </div>\n\n <!-- SKS11JUN25 Content -->\n <div class=\"file-popup-content\">\n <!-- SKS11JUN25 Left Panel - File List -->\n <div class=\"file-list-panel\">\n <div class=\"file-item\" *ngFor=\"let file of copyOfInputAllFiles; let i = index\"\n [class.selected]=\"currentFile === file\" (click)=\"viewFile(file)\">\n <div class=\"file-icon\">\n <img style=\"width: 28px;height: 28px;\" [src]=\"getDocIcon(file?.name)\">\n </div>\n <div class=\"file-details\">\n <div class=\"file-name\">{{ file.name }}</div>\n </div>\n <div *ngIf=\"!question?.isReadOnly\" class=\"file-actions\">\n <button class=\"action-btn\" (click)=\"$event.stopPropagation(); deleteFile(i)\" title=\"{{ 'DELETE' | nxtCustomTranslate : 'Delete' }}\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"3,6 5,6 21,6\"></polyline>\n <path d=\"m19,6v14a2,2 0 0,1 -2,2H7a2,2 0 0,1 -2,-2V6m3,0V4a2,2 0 0,1 2,-2h4a2,2 0 0,1 2,2v2\"></path>\n </svg>\n </button>\n </div>\n </div>\n\n <!-- Empty state -->\n <div class=\"empty-state\" *ngIf=\"!copyOfInputAllFiles || copyOfInputAllFiles.length === 0\">\n <div class=\"empty-icon\">\uD83D\uDCC4</div>\n <p>{{ 'NO_FILES_SELECTED' | nxtCustomTranslate : 'No files selected' }}</p>\n </div>\n <!-- Add Button -->\n <button *ngIf=\"from !== 'nxtTable'\" class=\"add-btn\" (click)=\"fileInput.click()\" title=\"{{ 'ADD_FILE' | nxtCustomTranslate : 'Add file' }}\">\n {{ 'ADD_MORE_FILES' | nxtCustomTranslate : '+ Add More Files' }}\n </button>\n </div>\n\n <!-- SKS11JUN25 Right Panel - Preview -->\n <div class=\"file-preview-panel\">\n @if(currentFile){\n <div class=\"preview-content\">\n @if(isImage && fileUrl){\n <img [src]=\"fileUrl\" class=\"preview-image\" alt=\"File Preview\" />\n }\n @else if(fileUrl){\n <iframe [src]=\"fileUrl\" width=\"100%\" height=\"500px\"></iframe>\n }\n @else if(isLoading){\n <div class=\"loading-indicator\">\n <p>{{ 'LOADING_PREVIEW' | nxtCustomTranslate : 'Loading preview...' }}</p>\n <div class=\"spinner\"></div>\n </div>\n }\n @else {\n <div>{{ 'UNABLE_TO_LOAD_PREVIEW' | nxtCustomTranslate : 'Unable to load the file preview.' }}</div>\n }\n </div>\n }\n @else{\n <div class=\"no-preview\">\n <p>{{ 'SELECT_FILE_TO_PREVIEW' | nxtCustomTranslate : 'Select a file to preview' }}</p>\n </div>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".document-cnt{padding:10px;border:1px solid #ccc;border-radius:5px;background-color:#f9f9f9;margin-bottom:10px;cursor:pointer;transition:background-color .3s ease;position:relative}.document-cnt:hover{background-color:#e9ecef}.document_image img{width:30px;height:30px}.document_name{font-size:14px;font-weight:700;color:#333;line-height:30px}.label{margin-bottom:0}.document_delete img,.preview-icon img{width:20px;height:20px;cursor:pointer;transition:transform .3s ease}.document_delete img{filter:brightness(0) saturate(100%) invert(20%) sepia(97%) saturate(7481%) hue-rotate(357deg) brightness(98%) contrast(119%)}.document_delete img:hover,.preview-icon img:hover{transform:scale(1.1)}.document_delete,.preview-icon{position:absolute;top:50%;transform:translateY(-50%)}.document_delete{right:10px}.preview-icon{right:40px}@media (min-width: 992px){.document-cnt{margin-left:10px}}.form-control[disabled]{border-radius:5px}.btn-primary{background-color:#03a9f4!important;border:1px solid #03a9f4!important;color:#fff!important}.btn.btn-primary{border-radius:2px;padding:6px 14px;font-size:14px}.Invalid{border:1px solid red!important}.close-button{background:none;border:none;font-size:1.5em;cursor:pointer}.img-fluid{max-width:100%;height:auto;flex:1}iframe{border:none}.file-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}.file-popup-modal{background:#fff;border-radius:12px;width:90%;max-width:1000px;height:80%;max-height:600px;display:flex;flex-direction:column;box-shadow:0 20px 40px #0000001a;overflow:hidden}.file-popup-header{display:flex;justify-content:space-between;align-items:center;padding:8px;border-bottom:1px solid #e5e7eb;background-color:#fafafa}.popup-title{font-size:16px;font-weight:600;color:#111827;margin:0}.close-btn{background:none;border:none;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s}.close-btn:hover{background-color:#f3f4f6}.close-icon{font-size:24px;color:#6b7280;line-height:1}.file-popup-content{display:flex;flex:1;overflow:hidden}.file-list-panel{width:300px;border-right:1px solid #e5e7eb;background-color:#fff;overflow-y:auto;padding:16px 16px 60px;position:relative}.file-item{display:flex;align-items:center;padding:12px 16px;border-radius:8px;cursor:pointer;transition:background-color .2s;margin-bottom:8px;border:1px solid #dfe0e2;background-color:#fff}.file-item:hover{background-color:#f8fafc;border-color:#e2e8f0}.file-item.selected{background-color:#dbeafe;border-color:#3b82f6}.file-icon{margin-right:12px;flex-shrink:0}.file-details{flex:1;min-width:0}.file-name{font-size:14px;font-weight:500;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.file-actions{margin-left:8px}.action-btn{background:none;border:none;padding:4px;border-radius:4px;cursor:pointer;color:#6b7280;transition:all .2s}.action-btn:hover{background-color:#fef2f2;color:#dc2626}.file-preview-panel{flex:1;background-color:#f9fafb;display:flex;align-items:center;justify-content:center;padding:32px}.preview-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.preview-image{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 4px 6px #0000001a}.no-preview{text-align:center;color:#6b7280}.empty-state{text-align:center;padding:32px 16px;color:#6b7280}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.empty-state p{margin:0;font-size:14px}@media (max-width: 768px){.file-list-panel{padding-bottom:70px;width:100%}.add-btn{bottom:12px;left:12px;right:12px}.file-popup-modal{width:95%;height:85%}.file-popup-content{flex-direction:column}.file-preview-panel{flex:1;min-height:200px}}.edit-icon{display:none;cursor:pointer}.hover-wrapper:hover .edit-icon{display:block}.file-inner-div{width:100%;padding:10px 10px 10px 5px;border-radius:5px;border:none;font-size:12px;align-items:center;gap:5px}.loading-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#555}.spinner{margin-top:10px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.add-btn{position:absolute;bottom:16px;left:16px;right:16px;background-color:#007bff;color:#fff;border:none;padding:12px 16px;font-size:14px;border-radius:6px;cursor:pointer;box-shadow:0 2px 6px #0003;transition:background-color .2s;z-index:10}.add-btn:hover{background-color:#0056b3}.add-btn-icon{width:25px;height:25px;border-radius:50%;border:none;background:#007bff;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;position:relative;overflow:hidden}.add-btn-icon:focus{outline:none!important}.add-btn-icon:hover{transform:scale(1.1);border:none}.add-btn-icon:active{transform:scale(.95)}.plus-icon{font-size:15px;font-weight:700;line-height:1;transition:transform .2s ease}\n"] }]
|
|
50062
50105
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: SharedService }, { type: DataService }, { type: i3.DomSanitizer }], propDecorators: { selectedFileData: [{
|
|
50063
50106
|
type: Output
|
|
50064
50107
|
}], deletedFileData: [{
|
|
50065
50108
|
type: Output
|
|
50066
50109
|
}], allFiles: [{
|
|
50067
50110
|
type: Input
|
|
50068
|
-
}], limitFileUploading: [{
|
|
50069
|
-
type: Input
|
|
50070
50111
|
}], mode: [{
|
|
50071
50112
|
type: Input
|
|
50072
50113
|
}], question: [{
|
|
50073
50114
|
type: Input
|
|
50074
|
-
}], error: [{
|
|
50075
|
-
type: Input
|
|
50076
50115
|
}], from: [{
|
|
50077
50116
|
type: Input
|
|
50078
50117
|
}] } });
|
|
@@ -51891,7 +51930,7 @@ class NxtDatatable {
|
|
|
51891
51930
|
this.cdRef.markForCheck();
|
|
51892
51931
|
}
|
|
51893
51932
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NxtDatatable, deps: [{ token: CountryService }, { token: StorageService }, { token: i0.ChangeDetectorRef }, { token: TranslationService }, { token: i0.Renderer2 }, { token: DataService }, { token: ChangeService }], target: i0.ɵɵFactoryTarget.Component });
|
|
51894
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: NxtDatatable, isStandalone: true, selector: "nxt-datatable", inputs: { data: "data", tableFilterData: "tableFilterData", columns: "columns", withCheckBox: "withCheckBox", searchBar: "searchBar", tableSaveButton: "tableSaveButton", stickyColumn: "stickyColumn", tableWidth: "tableWidth", actionColumHeader: "actionColumHeader", actionButton: "actionButton", title: "title", isButtons: "isButtons", buttonArray: "buttonArray", tableId: "tableId", isEditRow: "isEditRow", isDeleteRow: "isDeleteRow", addInlineRecord: "addInlineRecord", searchConfigs: "searchConfigs", direction: "direction", pagination: "pagination", actionButtonArray: "actionButtonArray", multipleFilter: "multipleFilter", isPagination: "isPagination", isListViews: "isListViews", id: "id", isNosIndicator: "isNosIndicator", isEditable: "isEditable", from: "from", question: "question", rowTextSize: "rowTextSize", rowTextColor: "rowTextColor", apiMeta: "apiMeta", summaryRows: "summaryRows", summaryColumns: "summaryColumns", isLoading: "isLoading", tableConfig: "tableConfig", tableParams: "tableParams", listViews: "listViews", mode: "mode", languageCode: "languageCode", selectedColumn: "selectedColumn", allIcons: "allIcons", isButtonLoading: "isButtonLoading", isPreview: "isPreview" }, outputs: { tableRowClick: "tableRowClick", onEditData: "onEditData", saveButtonData: "saveButtonData", onDeleteData: "onDeleteData", buttonEmit: "buttonEmit", hyperLinkEmit: "hyperLinkEmit", sideNavEmit: "sideNavEmit", actionButtonEmit: "actionButtonEmit", columnSelected: "columnSelected", removeColumn: "removeColumn", valueChange: "valueChange", selectedValues: "selectedValues", fileEmit: "fileEmit", NxtTableFilterEmit: "NxtTableFilterEmit", hadleDropDownDependent: "hadleDropDownDependent", NxtTableParamsEmit: "NxtTableParamsEmit" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableContainer", first: true, predicate: ["tableContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-layout\" [id]=\"tableId\" [ngStyle]=\"{'padding-top': '1px', 'width': tableWidth}\" [attr.dir]=\"direction\" [dir]=\"direction\">\n <div>\n <div *ngIf=\"title\" class=\"d-flex justify-content-center table-title align-text-center\">\n {{title}}\n </div>\n <div *ngIf=\"isNosIndicator || searchBar || isButtons\" class=\"flex justify-content-between\"\n [style.padding-bottom]=\" id && (isListViews !== false && isListViews !== 'false') && from !== 'formBuilder' ? '0px' : '5px' \">\n <div class=\"flex\">\n <!-- SKS26APR25 List View Filter -->\n <app-list-view-filter *ngIf=\"id && isListViews !== false && isListViews !== 'false' && from != 'formBuilder'\" [listViews]=\"listViews\"\n [selectedView]=\"selectedView\" [displayedColumns]='columns' [tableFilterArray]=\"tableFilterArray\"\n (listViewEmit)=\"listViewEmit($event)\">\n </app-list-view-filter>\n <div *ngIf=\"(!id || isListViews === false || isListViews === 'false' || from === 'formBuilder' || from === 'questionBook') && isNosIndicator\" class=\"noOfRec\"\n style=\"display: flex; align-items: flex-end;\">\n <p style=\"font-weight: 500; margin-right: 5px; margin-bottom: 0px;\">\n {{ 'NOS' | nxtCustomTranslate : 'Nos'}} </p>\n <div style=\"color: rgb(43, 87, 249);\">{{totalRecords || totalCount}}</div>\n </div>\n </div>\n\n <div class=\"flex\" style=\"align-items: center;\">\n <div *ngIf=\"searchBar\" class=\"search\">\n <div class=\"flex search-bar\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\" stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <input type=\"text\" placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\" style=\"font-size: 13px;\"\n (keyup)=\"searchConfigs ? emptySearch($event.target.value) : applyFilter($event.target.value)\"\n [value]=\"searchBoxValue || ''\" #input>\n <svg *ngIf=\"searchConfigs && searchBar\" class=\"configSearch\" (click)=\"onSearch(input.value)\"\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 5H20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14 8H17\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21 11.5C21 16.75 16.75 21 11.5 21C6.25 21 2 16.75 2 11.5C2 6.25 6.25 2 11.5 2\"\n stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M22 22L20 20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"flex\" *ngIf=\"isButtons\" style=\"padding-left: 7px;\">\n <div class=\"flex\" *ngFor=\"let button of buttonArray\">\n <nxt-button class=\"data-table-fsbtn\"\n (buttonClickEmit)=\"(button.type === 'group' || button.type === 'dropdown') ? commonButtonClick($event) : commonButtonClick(button)\"\n [buttonType]=\"button.class\"\n [buttonValue]=\"button.labelPath || button.label || button.name | nxtCustomTranslate : button.label || button.name \"\n [buttonConfig]=\"button.buttonConfig\" [type]=\"button.type\" class=\"ms-2 me-2\"\n [btnIconLeftSrc]=\"button.btnIconLeftSrc\" [isImageSvg]=\"button.isImageSvg\">\n </nxt-button>\n </div>\n </div>\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"question && from === 'questionBook' && mode === 'view'\" (click)=\"editModeChange()\" class=\"eicon-container edit-icon-hide\"\n matTooltip=\"{{ 'EDIT_TABLE' | nxtCustomTranslate : 'Edit Table' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"discardChanges()\"\n matTooltip=\"{{ 'DISCARD' | nxtCustomTranslate : 'Discard' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"saveTable()\"\n matTooltip=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"table-margin\">\n <div class=\"table-container\"\n [ngClass]=\"{ 'resizing': isResizing }\"\n [ngStyle]=\"{ maxHeight: isPagination ? '450px' : 'auto', minHeight: dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook' ? '0px' : searchFilter ? '233px' : '100px' }\"\n #tableContainer (scroll)=\"onScroll(tableContainer)\">\n <ng-container>\n <div class=\"custom-table\" [ngStyle]=\"{ minHeight: searchFilter ? '233px' : '' }\">\n <!--SKS15FEB25 Table Header -->\n <div class=\"table-header\" [ngClass]=\"{ 'shadow': isScrolled }\">\n <div class=\"table-row\">\n <!--SKS15FEB25 Checkbox Column -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-cell sticky-column head-color\" [style.width]=\"'50px'\">\n <input type=\"checkbox\" (click)=\"$event.stopPropagation()\" (change)=\"masterToggle()\"\n [checked]=\"selection?.hasValue()\"\n [indeterminate]=\"selection?.hasValue() && !isAllSelected()\"\n class=\"custom-checkbox\">\n </div>\n\n <!--SKS15FEB25 Data Columns -->\n <ng-container *ngFor=\"let column of currentColumns; let i = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-cell tableHeader head-color\"\n [class.sticky-column]=\"i === (stickyCondition - 1)\"\n [class.active-column]=\"activeColumn === column.uniqueIdentifier\"\n [class.selected-column]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(column.uniqueIdentifier); column.sort ? sortData(column.fieldName) : ''\"\n (mouseenter)=\"hoveredColumn = column.fieldName\" (mouseleave)=\"hoveredColumn = null\"\n [style.backgroundColor]=\"column?.style?.fillColor || 'transparent'\"\n [style.color]=\"column?.style?.color\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <div class=\"columnDiv\">\n <div class=\"column-header\" [style.width]=\"column.width || '50px'\">\n <!-- Add close button for selected column -->\n <div *ngIf=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier && !isPreview\"\n class=\"close-column-btn\"\n (click)=\"$event.stopPropagation(); removeCol(column.uniqueIdentifier)\">\n \u2715\n </div>\n <div class=\"ellipsis\" style=\"flex: 1;\" [title]=\"column.label\">\n @if(column.labelPath){\n {{ column.labelPath | nxtCustomTranslate : column.label }}\n }\n @else if(from !== 'formBuilder' || from !== 'questionBook') {\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n } \n @else if(column.uniqueIdentifier) {\n @if( ((column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label) !== column.uniqueIdentifier+'.label'){\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n }\n }\n @else {\n {{ column.label }}\n }\n </div>\n <div>\n <svg *ngIf=\"column.filter\"\n (click)=\"$event.stopPropagation(); filter(column.fieldName)\"\n style=\"padding-right: 2px;\" width=\"12\" height=\"11\"\n viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M10.75 1.25H0.75L4.75 5.71722V8.80556L6.75 9.75V5.71722L10.75 1.25Z\"\n stroke=\"#242533\" stroke-width=\"1.2\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <!--SKS15FEB25 Red dot for active filter -->\n <circle\n *ngIf=\"filterDataArray && filterDataArray[column.fieldName]?.length > 0\"\n cx=\"9\" cy=\"2\" r=\"2.5\" fill=\"red\"></circle>\n </svg>\n <div *ngIf=\"column.sort\"\n class=\"sort-indicators\">\n <span *ngIf=\"currentSortColumn === column.fieldName\" class=\"sort-direction\">\n {{ currentSortDirection === 'asc' ? '\u2191' : currentSortDirection\n === 'desc' ? '\u2193' : '' }}\n </span>\n <span\n *ngIf=\"hoveredColumn === column.fieldName && currentSortColumn !== column.fieldName\"\n class=\"sort-direction\">\n \u2191\n </span>\n </div>\n <div *ngIf=\"searchFilter && column.fieldName === selectedFilter\"\n class=\"search-component position-absolute\"\n (click)=\"$event.stopPropagation();\">\n <div class=\"card\">\n <div class=\"content\">\n <div class=\"flex\">\n <div class=\"fsearch\" [class.resized]=\"isResized\">\n <div class=\"fsearch-bar\">\n <svg class=\"searchSvg\" width=\"18\" height=\"20\"\n viewBox=\"0 0 24 22\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n <input class=\"width-100\" type=\"text\"\n placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\"\n [(ngModel)]=\"searchText\"\n class=\"searchinput\">\n </div>\n </div>\n <svg *ngIf=\"isResized\" (click)=\"closefilter()\"\n class=\"close-icon\" width=\"24\" height=\"24\"\n viewBox=\"0 0 24 24\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9.16998 14.83L14.83 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14.83 14.83L9.16998 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <div class=\"filter-content\" [style]=\"'overflow-y: auto'\">\n <div *ngFor=\"let data of filterArray | searchFilter : searchText\">\n <div class=\"mt-3 mb-3 checkboxdiv\"\n style=\"gap: 5px;\">\n <input type=\"checkbox\"\n [checked]=\"isSelected(data)\" [value]=\"data\"\n [id]=\"data\" (change)=\"checkedData(data)\">\n <div class=\"ms-2 label-data\">{{data}}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Enhanced resize handle -->\n <div class=\"resize-handle\" \n [attr.resize-data-column-id]=\"column.uniqueIdentifier\"\n (mousedown)=\"onResizeStart($event)\"\n title=\"Drag to resize column\">\n </div>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Column -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\"\n class=\"table-cell head-color actionCol sticky-column\"\n [style.width]=\"'150px'\"\n style=\"padding: 12px !important;\">\n <div style=\"display: flex; align-items: center; justify-content: center;\">\n {{ actionColumHeader | nxtCustomTranslate : 'Action'}}\n </div>\n </div>\n </div>\n </div>\n\n <!--SKS15FEB25 Table Body -->\n <div class=\"table-body\" *ngIf=\"!isLoading\">\n <div *ngFor=\"let element of dataSource.data; let i = index; trackBy: trackByRow\" class=\"table-row\"\n (click)=\"tableClick(element)\">\n <!--SKS15FEB25 Checkbox Cell -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-col-cell sticky-column body-color\">\n <input type=\"checkbox\" class=\"custom-checkbox\" (click)=\"$event.stopPropagation()\"\n (change)=\"separateRowSelect(selection?.toggle(element), element)\"\n [checked]=\"selection?.isSelected(element)\"\n [disabled]=\"(element.isPayProcessed === true)\">\n </div>\n\n <!--SKS15FEB25 Data Cells -->\n <ng-container *ngFor=\"let column of currentColumns; let last = last; let c = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-col-cell body-color ellipsis\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n [style.width]=\"(column.width || '50px')\"\n [style.overflow]=\"element?.editRow ? 'unset' : ''\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <ng-container *ngIf=\"element?.editRow && mode === 'edit'; else viewMode\">\n <!-- edit mode content -->\n <div [ngSwitch]=\"column.type\">\n <!-- SKS22JUL25 calendar -->\n <div *ngSwitchCase=\"'calendar'\">\n <!-- <app-custom-calendar [question]=\"column | questionByRow:element:i\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model> -->\n </div>\n <!-- SKS22JUL25 Image -->\n <div *ngSwitchCase=\"'image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <!-- <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageEdit(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageDelete(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div> -->\n <img *ngIf=\"column.question?.isReadOnly\" [src]=\"column.question?.imageData\" />\n <!-- <div *ngIf=\"!column.question?.isReadOnly\" class=\"logo-container\">\n Logo preview area\n <div class=\"logo-preview\" *ngIf=\"column.question?.input\">\n <img [src]=\"column.question?.imageData\" />\n </div>\n\n Upload button\n <div *ngIf=\"!column.question?.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(column.question, $event)\" style=\"display: none;\" />\n </div>\n </div> -->\n </div>\n <!-- SKS22JUL25 icon-selector -->\n <nxt-icon-selector *ngSwitchCase=\"'icon'\" [allIcons]=\"allIcons\" [required]=\"column.question?.isOptional\" [mode]=\"mode\" [question]=\"column | questionByRow:element:i\" [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column?.question?.id+'.questionText') | nxtCustomTranslate : column?.question?.questionText) : ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\" [labelWeight]=\"column.question?.fontWeight\" [showLabel]=\"column.question?.style?.showLabel\" (iconSelected)=\"updateEdit(i,$event,element,column.fieldName)\">\n </nxt-icon-selector>\n <!-- SKS22JUL25 line -->\n <hr *ngSwitchCase=\"'line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS22JUL25 data table -->\n <nxt-datatable *ngSwitchCase=\"'table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"column | questionByRow:element:i\" from=\"formBuilder\"\n (valueChange)=\"updateEdit(i,$event.data,element,column.fieldName)\" [apiMeta]=\"column.question?.subText\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [tableConfig]=\"column.question?.tableConfig\" tableId=\"\" direction=\"ltr\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- SKS22JUL25 list -->\n <nxt-search-box *ngSwitchCase=\"'list'\" [question]=\"column | questionByRow:element:i\" [readOnly]=\"column.question?.isReadOnly\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [placeHolderText]=\"column.question?.question || ''\" [value]=\"element | getValue: column.fieldName\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view': element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (searchValueChange)=\"updateEdit(i,$event.value,element,column.fieldName,column.type)\">\n </nxt-search-box>\n <!-- SKS22JUL25 Dropdown -->\n <app-custom-dropdown *ngSwitchCase=\"'dropdown'\" [options]=\"column.question?.options\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [selectedValue]=\"element | getValue: column.fieldName\"\n placeholder=\"\"\n [errorMessage]=\"column.question?.errorMessage\" [error]=\"column.question?.error\" [referenceField]=\"column.question?.referenceField\"\n [readOnly]=\"column.question?.isReadOnly\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-dropdown>\n <!-- SKS22JUL25 custom-radio component -->\n <app-custom-radio *ngSwitchCase=\"'radio'\" [options]=\"column.question?.options\" [question]=\"column | questionByRow:element:i\" [apiMeta]=\"column.question?.subText\" [id]=\"column.question?.id\"\n [selectedValue]=\"element | getValue: column.fieldName \" [errorMessage]=\"column.question?.errorMessage\"\n [referenceField]=\"column.question?.referenceField\" [readOnly]=\"column.question?.isReadOnly\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-radio>\n <!-- SKS22JUL25 Attachment / Files -->\n <nxt-file-upload *ngSwitchCase=\"'file'\" [limitFileUploading]=\"5\" [error]=\"column.question?.error\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"column.question?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n <!-- SKS22JUL25 Button -->\n <nxt-button *ngSwitchCase=\"'button'\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"column.question?.question\"\n (buttonClickEmit)=\"updateEdit(i,$event,element,column.fieldName)\"\n >\n </nxt-button>\n <!-- SKS22JUL25 book type -->\n <div *ngSwitchCase=\"'book'\">\n <!-- <lib-questionbook *ngIf=\"column.type === 'book'\" [qbItem]=\"column.question?.qbItem\"\n [questions]=\"readQuestions(column.question?.qbReference, column.question?.qbReferenceQuestions)\"\n (handleDropDown)=\"getDropDown($event)\">\n </lib-questionbook> -->\n </div>\n <!-- SKS10AUG25 object type element -->\n <div *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </div>\n <!-- SKS22JUL25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngSwitchDefault \n [type]=\"column.type === 'boolean' ? 'checkbox' : column.type === 'richtextarea' ? 'richtext' : column.type === undefined ? 'text' : column.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"element | getValue: column.fieldName \"\n [question]=\"column | questionByRow:element:i\"\n [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column.question?.id+'.questionText') | nxtCustomTranslate : column.question?.questionText): ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\"\n [inputValueSize]=\"column.question?.fontSize\"\n [labelWeight]=\"column.question?.fontWeight\"\n [inputWeight]=\"column.question?.fontWeight\"\n [showLabel]=\"column.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"column.question?.question\"\n [required]=\"column.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"column.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"column.question?.iconLeftSrc\" \n [minDate]=\"column.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-input>\n </div>\n </ng-container>\n \n <ng-template #viewMode>\n <!-- SKS10AUG25 view mode content -->\n <ng-container [ngSwitch]=\"column.type\">\n <ng-container *ngSwitchCase=\"'file'\">\n @defer (on viewport) {\n <nxt-file-upload [limitFileUploading]=\"5\" [error]=\"column.question?.error\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"(column | questionByRow:element:i)?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n } @placeholder {\n <span class=\"skeleton-cell file-cell\"></span>\n }\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" style=\"cursor: pointer;\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </ng-container>\n <ng-container *ngSwitchCase=\"'boolean'\">\n <span *ngIf=\"(element | getValue: column.fieldName) === true || (element | getValue: column.fieldName) === 'true'\">\u2714</span>\n <span *ngIf=\"(element | getValue: column.fieldName) !== true && (element | getValue: column.fieldName) !== 'true'\">\u2718</span> \n </ng-container>\n <ng-container *ngSwitchCase=\"'list'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName: 'list': column }}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'date'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{(element | getValue: column.fieldName) | NxtDate : column.type : languageCode : column.calendarType}}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'currency'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{currencyOption?.symbol}}{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n </ng-container>\n </ng-template>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Buttons -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\" class=\"table-col-cell actionCol\">\n <div class=\"actionButton\" style=\"display: flex; align-items: center; justify-content: center;\">\n\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"isEditRow\" class=\"eicon-container\" (click)=\"onEdit(element)\"\n matTooltip=\"{{ 'EDIT_RECORD' | nxtCustomTranslate : 'Edit Record' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\" edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n\n\n <!--SKS15FEB25 Delete Button -->\n <div *ngIf=\"isDeleteRow\" class=\"dicon-container\"\n [matTooltip]=\"'DELETE_RECORD' | nxtCustomTranslate : 'Delete Record'\" (click)=\"deleteRecord(element,i)\"\n style=\"padding: 2px; border: 1px solid #ffb5b5; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"delete-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #feeeed;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <!--SKS15FEB25 Render inline buttons up to Size -->\n <div *ngFor=\"let button of actionButtonArray?.buttonArray; let i = index\">\n <div *ngIf=\"i < actionButtonArray?.size\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div *ngIf=\"isConditionMet(element, button.conditions)\"\n [matTooltip]=\"button.tooltipPath || button.tooltip | nxtCustomTranslate : button.tooltip \"\n (click)=\"actionButtonClicked(button,element)\"\n (mouseenter)=\"$event.target.style.border = '1px solid ' + button.hoverBorderColor\"\n (mouseleave)=\"$event.target.style.border = '1px solid ' + button.borderColor\"\n style=\"padding: 2px; border-radius: {{button.borderRadius}}px; border: 1px solid {{button.borderColor}}; cursor: pointer;\">\n <div (mouseenter)=\"$event.target.style.backgroundColor = button.hoverBackgroundColor\"\n (mouseleave)=\"$event.target.style.backgroundColor = button.backgroundColor\"\n style=\"padding: {{button.padding}}px {{button.padding + 2}}px; border-radius: {{button.borderRadius}}px; background-color: {{button.backgroundColor}}; cursor: pointer\">\n <img *ngIf=\"button.iconSrc\" #imgElement [src]=\"button.iconSrc\" style=\"cursor: pointer\"\n (mouseenter)=\"imgElement.src = button.hoverIconSrc || button.iconSrc\"\n (mouseleave)=\"imgElement.src = button.iconSrc\">\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"dropdownActionButton && dropdownActionButton.length > 0\"\n class=\"dropdown\">\n <div class=\"clickable-img\" (click)=\"toggleDropdown(i)\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div style=\"background-color: #f5f5f5; padding: 2px 2px; border-radius: 5px;\">\n <svg style=\"background-color: #f5f5f5; border-radius: 5px; border: 1px solid #6c757d;\"\n width=\"16\" height=\"16\" viewBox=\"0 0 40 40\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\"\n fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\"\n stroke-miterlimit=\"10\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\"\n stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"dropdown-menu\"\n [style.right]=\"((actionButtonArray?.size ?? 0) - (actionButtonArray?.buttonArray?.size ?? 0) + (isEditRow ? 1 : 0) + (isDeleteRow ? 1 : 0) + (dropdownActionButton?.length > 0 ? 1 : 0)) * 100 + '%'\"\n *ngIf=\"currentOpenIndex === i\">\n <div *ngFor=\"let btn of dropdownActionButton\">\n <button *ngIf=\"isConditionMet(element, btn.conditions)\"\n [attr.data-id]=\"element.id\" style=\"display: flex;\" type=\"button\"\n class=\"btn btn-icon {{btn.buttonType}} tooltip-container\"\n [matTooltip]=\"btn.tooltipPath || btn.tooltip | nxtCustomTranslate : btn.tooltip\"\n [disabled]=\"btn.buttonDisable\"\n (click)=\"actionButtonClicked(btn,element)\">\n <img *ngIf=\"btn.iconSrc\" [src]=\"btn.iconSrc\">\n <div class=\"fc-btn-text\" style=\"padding-left: 10px;\">\n {{btn.name}}</div>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- SKS20MAR25 Summary Rows -->\n <ng-container\n *ngIf=\"summaryRowsOrginal && summaryRowsOrginal.length > 0 && dataSource.data && dataSource?.data?.length > 0 && !isLoading\">\n <ng-container *ngIf=\"!isFullTableSummaryRow && isSummaryColumn\">\n <div *ngFor=\"let row of summaryRowsOrginal\" class=\"table-row summary-row\">\n <!-- Label in the first column -->\n <div *ngIf=\"withCheckBox\" class=\"non-summary-table-cell\"></div>\n <!-- Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryStartColumn; let last = last\"\n class=\"non-summary-table-cell\" [class.last-cell]=\"last\">\n </div> <!-- Value or input in the last column -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(row.uniqueIdentifier)\">{{ (row.id+'.label') | nxtCustomTranslate : row?.label }}\n </div>\n <!-- SKS12SEP25 summary column input box -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\">\n <ng-container>\n <nxt-input\n [type]=\"row.type === 'boolean' ? 'checkbox' : row.type === 'richtextarea' ? 'richtext' : row.type === undefined ? 'text' : row.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? !row.question?.isReadOnly ? 'edit' : 'view' : (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"summaryValues[row.fieldName]\"\n [question]=\"row\"\n [labelFont]=\"row.question?.font\"\n [label]=\"row.question?.questionText ? ((row.question?.id+'.questionText') | nxtCustomTranslate : row.question?.questionText): ''\"\n [labelColor]=\"row.question?.color\"\n [labelSize]=\"row.question?.fontSize\"\n [inputValueSize]=\"row.question?.fontSize\"\n [labelWeight]=\"row.question?.fontWeight\"\n [inputWeight]=\"row.question?.fontWeight\"\n [showLabel]=\"row.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"row.question?.question\"\n [required]=\"row.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"row.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"row.question?.iconLeftSrc\" \n [minDate]=\"row.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\" summaryValues[row.fieldName] = $event.value.valueObj ; onSummaryInputChange()\"\n >\n </nxt-input>\n </ng-container>\n </div>\n <!-- SKS20MAR25 Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryEndColumn; let last = last\"\n class=\"non-summary-table-cell\">\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"non-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n <!-- SKS13JUN25 full table summary row -->\n <ng-container *ngIf=\"isFullTableSummaryRow\">\n <div *ngFor=\"let row of summaryRowsOrginal; let i = index; trackBy: trackBySummary\" class=\"table-row summary-row\">\n <!-- SKS13JUN25 Checkbox column (if enabled) -->\n <div *ngIf=\"withCheckBox\" class=\"horizontal-summary-table-cell\">\n {{ row.labelPath || row.label | nxtCustomTranslate : row.label }}\n </div>\n\n <!-- SKS13JUN25 summary cell -->\n <div *ngFor=\"let col of currentColumns; let last = last; let i = index; trackBy: trackByColumn \"\n class=\"horizontal-summary-table-cell\" style=\"text-align: left;\">\n @if (row?.columns?.includes(col.fieldName)) {\n {{ summaryValues[col.fieldName] | number }}\n }\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"horizontal-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n </ng-container>\n <!--SKS28MAR25 In the Loading section -->\n <div class=\"table-body\" *ngIf=\"isLoading\">\n <!-- Repeat for 5 skeleton rows -->\n <div *ngFor=\"let _ of [1,2,3,4,5]; trackBy: trackByIndex\" class=\"table-row\">\n <!-- Checkbox Column -->\n <div *ngIf=\"withCheckBox\" class=\"skeleton-cell sticky-column\"></div>\n\n <!-- Data Columns -->\n <div *ngFor=\"let col of currentColumns; let i = index; trackBy: trackByColumn\" class=\"skeleton-cell \"></div>\n\n <!-- Action Column -->\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\" class=\"skeleton-cell actionCol\">\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from === 'formBuilder'\" class=\"form-builder-table-box\">\n Add / drags fields from elements sections\n </div> -->\n </div>\n </ng-container>\n </div>\n <!--SKS15FEB25 No Data Row -->\n <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook'\"\n class=\"no-data\">\n {{'NO_RECORDS_OR_DATA_FOUND' | nxtCustomTranslate : 'No records/data found.'}}\n </div>\n <!--SKS15FEB25 Pagination -->\n <div [class.shadow-hidden]=\"isShadowHidden\">\n <!-- table input save button changes -->\n <div *ngIf=\"mode === 'edit'\" class=\"d-flex inlineAdd justify-content-end\">\n <div class=\"flex addIconBor cursor-pointer\" *ngIf=\"addInlineRecord \"\n (click)=\"addTableRecord(inlineElement)\"\n matTooltip=\"{{ 'ADD_RECORD'| nxtCustomTranslate : 'Add Record'}}\">\n <div class=\"addIcon\">\n <svg class=\"nav-icon\" xmlns=\"http://www.w3.org/2000/svg\" height=\"24\"\n viewBox=\"0 -960 960 960\" width=\"24\">\n <path\n d=\"M440-280h80v-160h160v-80H520v-160h-80v160H280v80h160v160Zm40 200q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\" />\n </svg>\n </div>\n </div>\n <!--SKS15FEB25 removed button disable logic, added another condition for button showing-->\n <!--SKS15FEB25 SR06JAN2025 button disable logic for not select any employee-->\n <nxt-button *ngIf=\"(tableSaveButton || isEditRow || addInlineRecord) && from != 'formBuilder' && from != 'questionBook'\"\n buttonType=\"btn btn-primary\"\n (buttonClickEmit)=\"saveButton()\"\n buttonValue=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"></nxt-button>\n </div>\n <nxt-pagination *ngIf=\"isPagination\" [pageSizeOptions]=\"pageSizeOptions\"\n [collectionSize]=\"pagination ? totalRecords || totalCount : filterTableNos\"\n [pageSize]=\"pageSize\" [currentPage]=\"pageIndex\" [firstLastButtons]=\"true\"\n (event)=\"pageParams($event)\">\n </nxt-pagination>\n </div>\n </div>\n </div>\n</div>\n\n<!--SKS15FEB25 alert on deleting record -->\n<div *ngIf=\"deleteModal\" class=\"modal modal-backdrop show d-block\" id=\"deleteRecord\" tabindex=\"-1\"\n aria-labelledby=\"deleteRecordLabel\" [attr.aria-hidden]=\"!deleteModal\">\n <div class=\"modal-dialog\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <b class=\"modal-title fs-5\" id=\"deleteRecordLabel\">{{ 'DELETE_RECORD'| nxtCustomTranslate : 'Delete Record'}}</b>\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"\n (click)=\"deleteModal = false\"></button>\n </div>\n <div class=\"modal-body\">\n {{ 'ARE_YOU_SURE_YOU_WANT_TO_DELETE_THE_REC'| nxtCustomTranslate : 'Are you sure you want to delete the record'}} ?\n </div>\n <div class=\"modal-footer\">\n <nxt-button\n (buttonClickEmit)=\"deleteModal = false\" \n [buttonValue]=\"'NO'| nxtCustomTranslate : 'No'\"\n [btnBgColor]=\"'#ffffff'\"\n [btnTextColor]=\"'#0773ff'\"\n [btnBorder]=\"'1'\"\n [btnBorderColor]=\"'#dee2e6'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n <nxt-button\n (buttonClickEmit)=\"deleteRecordData()\" \n [isLoading]=\"isButtonLoading\"\n [buttonValue]=\"'YES'| nxtCustomTranslate : 'Yes'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n </div>\n </div>\n </div>\n</div>", styles: [".custom-table{display:table;width:100%;border-collapse:collapse;table-layout:fixed;direction:var(--direction);background:var(--body-bg)}.table-header{display:table-header-group;position:sticky;top:0;z-index:100;box-shadow:none;transition:box-shadow .3s ease-in-out;background:var(--header-bg)}.shadow{box-shadow:0 4px 5px #0001!important}.table-body{display:table-row-group}.table-row{display:table-row;min-height:40px}.table-cell,.table-col-cell{position:relative;min-width:50px;max-width:100%;padding:10px 12px;border-bottom:solid 1px var(--border-color);box-sizing:border-box;overflow:visible;white-space:nowrap;text-overflow:ellipsis;display:table-cell}.table-container.resizing{-webkit-user-select:none;user-select:none;pointer-events:none}.table-container.resizing .resize-handle{pointer-events:auto}.sticky-column{position:sticky;background:inherit;z-index:5}.sticky-column .resize-handle{z-index:15}.actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;right:0;background:var(--header-bg)}.actionCol{min-width:100px!important;width:100px!important;max-width:100px!important}.actionCol .resize-handle{display:none}.table-container{width:100%;overflow-x:auto;overflow-y:auto;border-top:1px solid #e0e0e0;scrollbar-width:none}.table-container::-webkit-scrollbar{display:none}.column-header{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0}.column-header img{cursor:pointer}.shadow-hidden{position:relative}.shadow-hidden:before{content:\"\";position:absolute;z-index:11;top:-10px;left:0;width:100%;height:10px;background:linear-gradient(to top,var(--scroll-shadow),transparent)}.resize-handle{position:absolute;right:0;top:13px;width:1px;height:20px;cursor:col-resize;background:#b1b1b1;border:3px transparent;z-index:9;transition:background-color .2s ease}.resize-handle:hover{background:#ccc;opacity:.7}.resize-handle:active{background:#ccc;opacity:.9}.columnDiv{position:relative;display:flex;align-items:center;width:100%;max-width:100%;height:100%}.search{display:flex;justify-content:space-between;border:1px solid rgba(67,69,85,.3);border-radius:7px;align-self:center;padding:3px}.search-bar{width:100%;margin:3px;justify-content:center;align-items:center}.configSearch{height:22px;padding:3px;margin:10p;background-color:#247dff;border-radius:4px}input::placeholder{color:#abafb1}.sort-indicators{display:inline-block;width:10px;padding-left:5px}.sort-direction{font-size:12px;color:var(--text-color);opacity:.7}.tableHeader{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .3s}.tableHeader:hover{background-color:var(--hover-bg)}.search-component{top:163%;background-color:#fff;box-shadow:0 2px 10px #0000001a}[dir=rtl] .search-component{left:0}.rtl .ellipsis,[dir=rtl] .ellipsis{direction:rtl;text-align:right!important}input{border:none}.card{background:#fff;box-shadow:0 2px #0a0a0a1f;border-radius:8px;border-color:#e9e9e9}.fsearch{width:100%;justify-content:space-between;font-weight:400;font-size:13px;display:flex;background:#f0f5ff;border-radius:6px;align-self:center}.content{margin:6px;width:150px}.fsearch-bar{display:flex;flex-direction:row;width:100%;margin:5px;transition:width .3s ease}.search.resized{width:calc(100% - 40px)}.filter-content{width:100%;max-height:150px;padding-left:5px}.label-data{font-weight:200;font-size:12px;color:#434555d9}input[type=checkbox]{height:16px;width:16px;border-radius:5px;margin-left:2px}input[type=checkbox]:after{width:4px;height:7px;left:5px;top:3px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:checked{--r: 43deg}.checkbox-cont{display:flex;align-items:center}.searchinput{border:none;background-color:#f0f5ff;width:85%;font-size:12px;color:#275efe;font-weight:600}.searchSvg{margin-right:3px}.close-icon{margin-left:4px;width:36px;height:32px;cursor:pointer;padding-top:9px;padding-bottom:9px;background-color:#ffefee;color:red;border-radius:4px;transition:background-color .3s ease,color .3s ease}.close-icon:hover{background-color:red;color:#fff}.checkboxdiv{display:flex;align-items:center}.checkboxdiv input{flex-shrink:0}input:focus,input:active,select:focus,select:active,textarea:focus,textarea:active,button:focus,button:active{outline:none!important}@supports (-webkit-appearance: none) or (-moz-appearance: none){input[type=checkbox]{--active: #275EFE;--active-inner: #fff;--focus: 2px rgba(39, 94, 254, .3);--border: #BBC1E1;--border-hover: #275EFE;--background: #fff;--disabled: #F6F8FF;--disabled-inner: #E1E6F9;-webkit-appearance:none;-moz-appearance:none;height:21px;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--bc, var(--border));background:var(--b, var(--background))!important;transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after{content:\"\";display:block;left:0;top:0;position:absolute;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}input[type=checkbox]:checked{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=checkbox]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=checkbox]:focus{box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.switch){width:21px}input[type=checkbox]:not(.switch):after{opacity:var(--o, 0)}input[type=checkbox]:not(.switch):checked{--o: 1}input[type=checkbox]+label{font-size:14px;line-height:21px;display:inline-block;vertical-align:top;cursor:pointer;margin-left:4px}input[type=checkbox]:not(.switch){border-radius:7px}input[type=checkbox]:not(.switch):after{width:5px;height:9px;border:2px solid var(--active-inner);border-top:0;border-left:0;left:7px;top:4px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:not(.switch):checked{--r: 43deg}input[type=checkbox].switch{width:38px;border-radius:11px}input[type=checkbox].switch:after{left:2px;top:2px;border-radius:50%;width:15px;height:15px;background:var(--ab, var(--border));transform:translate(var(--x, 0))}input[type=checkbox].switch:checked{--ab: var(--active-inner);--x: 17px}input[type=checkbox].switch:disabled:not(:checked):after{opacity:.6}input[type=checkbox]:indeterminate{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:indeterminate:after{content:\"\";display:block;left:8px;top:5px;rotate:69deg;position:absolute;width:2px;height:9px;background:var(--active-inner);opacity:6;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}}:host{--primary-color: #275EFE;--secondary-color: #6C757D;--text-color: #434555;--border-color: #e0e0e0;--hover-bg: #f9f9f9;--header-bg: #ffffff;--body-bg: #ffffff;--danger-color: #FF2C10;--scroll-shadow: rgba(0, 0, 0, .08);--box-shadow: 0 2px 10px rgba(0, 0, 0, .1)}:host(.dark-theme){--primary-color: #6c8dfa;--text-color: #ffffff;--header-bg: #2c2c2c;--body-bg: #1e1e1e;--border-color: #404040;--hover-bg: #373737}.hyper-link:hover{color:#00f!important;text-decoration:underline;cursor:pointer}.on-edit:hover .edit-icon{visibility:visible}.view-mode-text{border-radius:5px;color:#2c3137;font-weight:400;font-size:13px;transition:all .2s}.input-box{border:solid}.inlineAdd{align-items:center;gap:10px;padding-top:10px}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}::ng-deep .modal-backdrop{background-color:#000000b3!important}::ng-deep .modal-backdrop.show{opacity:1!important}.eicon-container:hover .edit-icon svg path{fill:#2163ff!important}.eicon-container:hover .edit-icon{background-color:#c9d2ff!important;cursor:pointer}.eicon-container:hover{border:1px solid #2163ff!important}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.clickable-img{position:relative;cursor:pointer;padding:2px;border:1px solid #dddddd;border-radius:5px}.clickable-img:hover{border:1px solid rgb(31,105,255);border-radius:5px}.clickable-img:hover div svg{background-color:#ecf3ff!important}.clickable-img:hover div{background-color:#ecf3ff!important}.dropdown-menu{left:unset!important;right:300%;top:12.5px;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 4px 8px #0000001a}.dropdown .dropdown-menu{display:block}.dropdown-menu .btn{display:block;padding:10px;width:100%;text-align:left;background:transparent;border:none;cursor:pointer}[dir=rtl] .search{margin-left:7px}[dir=rtl] .noOfRec{gap:4px}[dir=rtl] .sticky-column{position:sticky;right:0;z-index:11;background:var(--header-bg)}[dir=rtl] .actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;left:0;background:var(--header-bg)}[dir=rtl] .sort-indicators{padding-right:5px}[dir=rtl] .resize-handle{left:0!important;right:unset!important}::ng-deep [dir=rtl] nxt-pagination .dropdown-arrow{left:5px;right:unset!important}::ng-deep [dir=rtl] nxt-button .dropdown-menu{right:unset!important;left:0!important}[dir=rtl] .dropdown-menu{left:300%!important;right:unset!important}[dir=rtl] .fc-btn-text{padding-right:10px}.selected-cell{border-left:2px solid #2196F3!important;border-right:2px solid #2196F3!important;position:relative;z-index:1}.selected-column{position:relative;border:2px solid #2196F3!important;border-bottom:none!important;border-radius:4px}.close-column-btn{position:absolute;top:3px;right:5px;width:12px;height:12px;border:solid black .5px;color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;cursor:pointer;z-index:2}.close-column-btn:hover{background:#f32121!important;border:solid #f32121 .5px!important;color:#fff!important}.table-row:last-child .selected-cell{border-bottom:2px solid #2196F3!important}.hover-content{position:absolute;z-index:1;background:#fff;border:1px solid #ccc;box-shadow:0 2px 5px #00000026;padding:10px;min-width:200px;border-radius:5px;top:70%;left:0;cursor:pointer}.expense-file{text-decoration:none;transition:text-decoration .2s ease-in-out;cursor:pointer}.expense-file:hover{text-decoration:underline;color:#0056b3;cursor:pointer}.popover-container .hover-content{display:none;position:absolute;cursor:pointer}.popover-container:hover .hover-content{display:block;cursor:pointer}.summary-row{font-weight:700}.non-summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px white!important}.summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px var(--border-color)!important;border-top:solid 1.5px var(--border-color)!important}.horizontal-summary-table-cell{display:table-cell;box-sizing:border-box;overflow:visible;white-space:nowrap;padding:12px;text-overflow:ellipsis;position:relative;color:var(--text-color);border:solid 1px white!important;border-top:solid 1px var(--border-color)!important;border-bottom:1px solid var(--border-color)!important}.last-cell{border-right:1px solid var(--border-color)!important}.table-last-cell{border-bottom:1px solid var(--border-color)!important}.skeleton-loader{display:table;width:100%;border-collapse:collapse}.skeleton-row{display:table-row;border-bottom:1px solid var(--border-color)}.skeleton-cell{display:table-cell;padding:12px;height:35px;background:#fff;position:relative}.skeleton-cell:before{content:\"\";position:absolute;inset:3px;background:linear-gradient(90deg,#f5f5f5 25%,#eaeaea,#f5f5f5 75%);background-size:200% 100%;animation:pulse 1.5s infinite linear;border-radius:4px}.skeleton-cell.sticky-column{position:sticky;left:0;z-index:11;background:#f5f5f5}.skeleton-cell.actionCol.sticky-column{position:sticky;right:0;left:auto;background:#f5f5f5}@keyframes pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-cell.file-cell{width:inherit!important;position:absolute!important;top:1px!important;height:30px!important;transition:all .2s!important}.form-builder-table-box{height:108px;display:flex;justify-content:center;align-items:center;border:1px dashed #a8a1a1}.no-data{display:flex;align-items:anchor-center;height:60px;justify-content:center}.custom-line{width:100%;border:1px solid #a8a1a1}.hyperlink-input{color:inherit;text-decoration:none;cursor:default}.hyperlink-input:hover{color:#00f!important;text-decoration:underline!important;cursor:pointer}.edit-icon-hide{display:none;cursor:pointer}.table-layout:hover .edit-icon-hide{display:block}.modal-footer{padding:0!important}\n"], dependencies: [{ kind: "component", type: NxtDatatable, selector: "nxt-datatable", inputs: ["data", "tableFilterData", "columns", "withCheckBox", "searchBar", "tableSaveButton", "stickyColumn", "tableWidth", "actionColumHeader", "actionButton", "title", "isButtons", "buttonArray", "tableId", "isEditRow", "isDeleteRow", "addInlineRecord", "searchConfigs", "direction", "pagination", "actionButtonArray", "multipleFilter", "isPagination", "isListViews", "id", "isNosIndicator", "isEditable", "from", "question", "rowTextSize", "rowTextColor", "apiMeta", "summaryRows", "summaryColumns", "isLoading", "tableConfig", "tableParams", "listViews", "mode", "languageCode", "selectedColumn", "allIcons", "isButtonLoading", "isPreview"], outputs: ["tableRowClick", "onEditData", "saveButtonData", "onDeleteData", "buttonEmit", "hyperLinkEmit", "sideNavEmit", "actionButtonEmit", "columnSelected", "removeColumn", "valueChange", "selectedValues", "fileEmit", "NxtTableFilterEmit", "hadleDropDownDependent", "NxtTableParamsEmit"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i5.DecimalPipe, name: "number" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NxtButtonComponent, selector: "nxt-button", inputs: ["buttonValue", "buttonType", "type", "buttonDisable", "btnBgColor", "btnBorder", "btnBorderRadius", "btnBorderColor", "btnTextColor", "btnHeight", "btnWidth", "btnIconLeftSrc", "btnIconRightSrc", "btnHoverBgColor", "btnHoverTextColor", "btnId", "dataDismiss", "modalToTrigger", "isImageSvg", "tabIndex", "buttonConfig", "mode", "languageCode", "isLoading"], outputs: ["buttonClickEmit"] }, { kind: "component", type: NxtPagination, selector: "nxt-pagination", inputs: ["pageSizeOptions", "collectionSize", "pageSize", "currentPage", "maxSize", "firstLastButtons", "nextPreviousButtons", "small"], outputs: ["event"] }, { kind: "pipe", type: NxtSearchFilterPipe, name: "searchFilter" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i9.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: NxtGetValuePipe, name: "getValue" }, { kind: "component", type: IconSelectorComponent, selector: "nxt-icon-selector", inputs: ["allIcons", "themeColor", "height", "tooltipPosition", "selectedIcon", "cdnIconURL", "label", "labelFont", "labelWeight", "inputWeight", "labelSize", "labelColor", "showLabel", "required", "mode", "question", "options"], outputs: ["iconSelected"] }, { kind: "component", type: NxtSearchBox, selector: "nxt-search-box", inputs: ["placeHolderText", "question", "apiMeta", "id", "readOnly", "mode", "from", "value"], outputs: ["searchValueChange"] }, { kind: "component", type: CustomDropdownComponent, selector: "app-custom-dropdown", inputs: ["options", "placeholder", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "error", "fromShengel", "question", "referenceField", "token", "mode", "from"], outputs: ["valueChange"] }, { kind: "component", type: CustomRadioComponent, selector: "app-custom-radio", inputs: ["options", "question", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "fromShengel", "referenceField", "token", "label", "mode"], outputs: ["valueChange"] }, { kind: "component", type: NxtFileUploadComponent, selector: "nxt-file-upload", inputs: ["allFiles", "limitFileUploading", "mode", "question", "error", "from"], outputs: ["selectedFileData", "deletedFileData"] }, { kind: "component", type: NxtInput, selector: "nxt-input", inputs: ["label", "labelFont", "labelWeight", "inputWeight", "labelSize", "inputValueSize", "labelColor", "showLabel", "svgHeight", "svgWidth", "type", "inputIconRightSrc", "inputIconLeftSrc", "required", "minLength", "pattern", "errorMessages", "maxLength", "placeholder", "inputBgColor", "inputBorder", "placeholderColor", "placeholderFont", "placeholderWeight", "placeholderSize", "inputTextColor", "inputHeight", "inputWidth", "inputId", "inputBorderSize", "inputConfig", "confPassVal", "confPass", "mode", "value", "question", "showSuggestion", "ariaOwns", "ariaHasPopup", "isLoading", "options", "minDate", "maxDate", "rows", "from", "selectedOption", "apiMeta", "direction", "currency", "helpText", "apiKey", "size"], outputs: ["valueChange", "inputValue", "onBlur", "onFocus", "toggleEmit", "removeValueEmit"] }, { kind: "component", type: ListViewFilterComponent, selector: "app-list-view-filter", inputs: ["listViews", "tableFilterArray", "selectedView", "displayedColumns", "availableOperators"], outputs: ["listViewEmit"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }, { kind: "pipe", type: QuestionByRowPipe, name: "questionByRow" }, { kind: "pipe", type: NxtDatePipe, name: "NxtDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [NxtFileUploadComponent,
|
|
51933
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: NxtDatatable, isStandalone: true, selector: "nxt-datatable", inputs: { data: "data", tableFilterData: "tableFilterData", columns: "columns", withCheckBox: "withCheckBox", searchBar: "searchBar", tableSaveButton: "tableSaveButton", stickyColumn: "stickyColumn", tableWidth: "tableWidth", actionColumHeader: "actionColumHeader", actionButton: "actionButton", title: "title", isButtons: "isButtons", buttonArray: "buttonArray", tableId: "tableId", isEditRow: "isEditRow", isDeleteRow: "isDeleteRow", addInlineRecord: "addInlineRecord", searchConfigs: "searchConfigs", direction: "direction", pagination: "pagination", actionButtonArray: "actionButtonArray", multipleFilter: "multipleFilter", isPagination: "isPagination", isListViews: "isListViews", id: "id", isNosIndicator: "isNosIndicator", isEditable: "isEditable", from: "from", question: "question", rowTextSize: "rowTextSize", rowTextColor: "rowTextColor", apiMeta: "apiMeta", summaryRows: "summaryRows", summaryColumns: "summaryColumns", isLoading: "isLoading", tableConfig: "tableConfig", tableParams: "tableParams", listViews: "listViews", mode: "mode", languageCode: "languageCode", selectedColumn: "selectedColumn", allIcons: "allIcons", isButtonLoading: "isButtonLoading", isPreview: "isPreview" }, outputs: { tableRowClick: "tableRowClick", onEditData: "onEditData", saveButtonData: "saveButtonData", onDeleteData: "onDeleteData", buttonEmit: "buttonEmit", hyperLinkEmit: "hyperLinkEmit", sideNavEmit: "sideNavEmit", actionButtonEmit: "actionButtonEmit", columnSelected: "columnSelected", removeColumn: "removeColumn", valueChange: "valueChange", selectedValues: "selectedValues", fileEmit: "fileEmit", NxtTableFilterEmit: "NxtTableFilterEmit", hadleDropDownDependent: "hadleDropDownDependent", NxtTableParamsEmit: "NxtTableParamsEmit" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableContainer", first: true, predicate: ["tableContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-layout\" [id]=\"tableId\" [ngStyle]=\"{'padding-top': '1px', 'width': tableWidth}\" [attr.dir]=\"direction\" [dir]=\"direction\">\n <div>\n <div *ngIf=\"title\" class=\"d-flex justify-content-center table-title align-text-center\">\n {{title}}\n </div>\n <div *ngIf=\"isNosIndicator || searchBar || isButtons\" class=\"flex justify-content-between\" style=\"padding-right: 6px;\" \n [style.padding-bottom]=\" id && (isListViews !== false && isListViews !== 'false') && from !== 'formBuilder' ? '0px' : '5px' \">\n <div class=\"flex\">\n <!-- SKS26APR25 List View Filter -->\n <app-list-view-filter *ngIf=\"id && isListViews !== false && isListViews !== 'false' && from != 'formBuilder'\" [listViews]=\"listViews\"\n [selectedView]=\"selectedView\" [displayedColumns]='columns' [tableFilterArray]=\"tableFilterArray\" [tableData]=\"tableFilterData\"\n (listViewEmit)=\"listViewEmit($event)\">\n </app-list-view-filter>\n <div *ngIf=\"(!id || isListViews === false || isListViews === 'false' || from === 'formBuilder' || from === 'questionBook') && isNosIndicator\" class=\"noOfRec\"\n style=\"display: flex; align-items: flex-end;\">\n <p style=\"font-weight: 500; margin-right: 5px; margin-bottom: 0px;\">\n {{ 'NOS' | nxtCustomTranslate : 'Nos'}} </p>\n <div style=\"color: rgb(43, 87, 249);\">{{totalRecords || totalCount}}</div>\n </div>\n </div>\n\n <div class=\"flex\" style=\"align-items: center;\">\n <div *ngIf=\"searchBar\" class=\"search\">\n <div class=\"flex search-bar\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\" stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <input type=\"text\" placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\" style=\"font-size: 13px;\"\n (keyup)=\"searchConfigs ? emptySearch($event.target.value) : applyFilter($event.target.value)\"\n [value]=\"searchBoxValue || ''\" #input>\n <svg *ngIf=\"searchConfigs && searchBar\" class=\"configSearch\" (click)=\"onSearch(input.value)\"\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 5H20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14 8H17\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21 11.5C21 16.75 16.75 21 11.5 21C6.25 21 2 16.75 2 11.5C2 6.25 6.25 2 11.5 2\"\n stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M22 22L20 20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"flex\" *ngIf=\"isButtons\" style=\"padding-left: 7px;\">\n <div class=\"flex\" *ngFor=\"let button of buttonArray\">\n <nxt-button class=\"data-table-fsbtn\"\n (buttonClickEmit)=\"(button.type === 'group' || button.type === 'dropdown') ? commonButtonClick($event) : commonButtonClick(button)\"\n [buttonType]=\"button.class\"\n [buttonValue]=\"button.labelPath || button.label || button.name | nxtCustomTranslate : button.label || button.name \"\n [buttonConfig]=\"button.buttonConfig\" [type]=\"button.type\" class=\"ms-2 me-2\"\n [btnIconLeftSrc]=\"button.btnIconLeftSrc\" [isImageSvg]=\"button.isImageSvg\">\n </nxt-button>\n </div>\n </div>\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"question && from === 'questionBook' && mode === 'view'\" (click)=\"editModeChange()\" class=\"eicon-container edit-icon-hide\"\n matTooltip=\"{{ 'EDIT_TABLE' | nxtCustomTranslate : 'Edit Table' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"discardChanges()\"\n matTooltip=\"{{ 'DISCARD' | nxtCustomTranslate : 'Discard' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"saveTable()\"\n matTooltip=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"table-margin\">\n <div class=\"table-container\"\n [ngClass]=\"{ 'resizing': isResizing }\"\n [ngStyle]=\"{ maxHeight: isPagination ? '450px' : 'auto', minHeight: dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook' ? '0px' : searchFilter ? '233px' : '100px' }\"\n #tableContainer (scroll)=\"onScroll(tableContainer)\">\n <ng-container>\n <div class=\"custom-table\" [ngStyle]=\"{ minHeight: searchFilter ? '233px' : '' }\">\n <!--SKS15FEB25 Table Header -->\n <div class=\"table-header\" [ngClass]=\"{ 'shadow': isScrolled }\">\n <div class=\"table-row\">\n <!--SKS15FEB25 Checkbox Column -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-cell sticky-column head-color\" [style.width]=\"'50px'\">\n <input type=\"checkbox\" (click)=\"$event.stopPropagation()\" (change)=\"masterToggle()\"\n [checked]=\"selection?.hasValue()\"\n [indeterminate]=\"selection?.hasValue() && !isAllSelected()\"\n class=\"custom-checkbox\">\n </div>\n\n <!--SKS15FEB25 Data Columns -->\n <ng-container *ngFor=\"let column of currentColumns; let i = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-cell tableHeader head-color\"\n [class.sticky-column]=\"i === (stickyCondition - 1)\"\n [class.active-column]=\"activeColumn === column.uniqueIdentifier\"\n [class.selected-column]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(column.uniqueIdentifier); column.sort ? sortData(column.fieldName) : ''\"\n (mouseenter)=\"hoveredColumn = column.fieldName\" (mouseleave)=\"hoveredColumn = null\"\n [style.backgroundColor]=\"column?.style?.fillColor || 'transparent'\"\n [style.color]=\"column?.style?.color\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <div class=\"columnDiv\">\n <div class=\"column-header\" [style.width]=\"column.width || '50px'\">\n <!-- Add close button for selected column -->\n <div *ngIf=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier && !isPreview\"\n class=\"close-column-btn\"\n (click)=\"$event.stopPropagation(); removeCol(column.uniqueIdentifier)\">\n \u2715\n </div>\n <div class=\"ellipsis\" style=\"flex: 1;\" [title]=\"column.label\">\n @if(column.labelPath){\n {{ column.labelPath | nxtCustomTranslate : column.label }}\n }\n @else if(from !== 'formBuilder' || from !== 'questionBook') {\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n } \n @else if(column.uniqueIdentifier) {\n @if( ((column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label) !== column.uniqueIdentifier+'.label'){\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n }\n }\n @else {\n {{ column.label }}\n }\n </div>\n <div>\n <svg *ngIf=\"column.filter\"\n (click)=\"$event.stopPropagation(); filter(column.fieldName)\"\n style=\"padding-right: 2px;\" width=\"12\" height=\"11\"\n viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M10.75 1.25H0.75L4.75 5.71722V8.80556L6.75 9.75V5.71722L10.75 1.25Z\"\n stroke=\"#242533\" stroke-width=\"1.2\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <!--SKS15FEB25 Red dot for active filter -->\n <circle\n *ngIf=\"filterDataArray && filterDataArray[column.fieldName]?.length > 0\"\n cx=\"9\" cy=\"2\" r=\"2.5\" fill=\"red\"></circle>\n </svg>\n <div *ngIf=\"column.sort\"\n class=\"sort-indicators\">\n <span *ngIf=\"currentSortColumn === column.fieldName\" class=\"sort-direction\">\n {{ currentSortDirection === 'asc' ? '\u2191' : currentSortDirection\n === 'desc' ? '\u2193' : '' }}\n </span>\n <span\n *ngIf=\"hoveredColumn === column.fieldName && currentSortColumn !== column.fieldName\"\n class=\"sort-direction\">\n \u2191\n </span>\n </div>\n <div *ngIf=\"searchFilter && column.fieldName === selectedFilter\"\n class=\"search-component position-absolute\"\n (click)=\"$event.stopPropagation();\">\n <div class=\"card\">\n <div class=\"content\">\n <div class=\"flex\">\n <div class=\"fsearch\" [class.resized]=\"isResized\">\n <div class=\"fsearch-bar\">\n <svg class=\"searchSvg\" width=\"18\" height=\"20\"\n viewBox=\"0 0 24 22\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n <input class=\"width-100\" type=\"text\"\n placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\"\n [(ngModel)]=\"searchText\"\n class=\"searchinput\">\n </div>\n </div>\n <svg *ngIf=\"isResized\" (click)=\"closefilter()\"\n class=\"close-icon\" width=\"24\" height=\"24\"\n viewBox=\"0 0 24 24\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9.16998 14.83L14.83 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14.83 14.83L9.16998 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <div class=\"filter-content\" [style]=\"'overflow-y: auto'\">\n <div *ngFor=\"let data of filterArray | searchFilter : searchText\">\n <div class=\"mt-3 mb-3 checkboxdiv\"\n style=\"gap: 5px;\">\n <input type=\"checkbox\"\n [checked]=\"isSelected(data)\" [value]=\"data\"\n [id]=\"data\" (change)=\"checkedData(data)\">\n <div class=\"ms-2 label-data\">{{data}}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Enhanced resize handle -->\n <div class=\"resize-handle\" \n [attr.resize-data-column-id]=\"column.uniqueIdentifier\"\n (mousedown)=\"onResizeStart($event)\"\n title=\"Drag to resize column\">\n </div>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Column -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\"\n class=\"table-cell head-color actionCol sticky-column\"\n [style.width]=\"'150px'\"\n style=\"padding: 12px !important;\">\n <div style=\"display: flex; align-items: center; justify-content: center;\">\n {{ actionColumHeader | nxtCustomTranslate : 'Action'}}\n </div>\n </div>\n </div>\n </div>\n\n <!--SKS15FEB25 Table Body -->\n <div class=\"table-body\" *ngIf=\"!isLoading\">\n <div *ngFor=\"let element of dataSource.data; let i = index; trackBy: trackByRow\" class=\"table-row\"\n (click)=\"tableClick(element)\">\n <!--SKS15FEB25 Checkbox Cell -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-col-cell sticky-column body-color\">\n <input type=\"checkbox\" class=\"custom-checkbox\" (click)=\"$event.stopPropagation()\"\n (change)=\"separateRowSelect(selection?.toggle(element), element)\"\n [checked]=\"selection?.isSelected(element)\"\n [disabled]=\"(element.isPayProcessed === true)\">\n </div>\n\n <!--SKS15FEB25 Data Cells -->\n <ng-container *ngFor=\"let column of currentColumns; let last = last; let c = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-col-cell body-color ellipsis\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n [style.width]=\"(column.width || '50px')\"\n [style.overflow]=\"element?.editRow ? 'unset' : ''\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <ng-container *ngIf=\"element?.editRow && mode === 'edit'; else viewMode\">\n <!-- edit mode content -->\n <div [ngSwitch]=\"column.type\">\n <!-- SKS22JUL25 calendar -->\n <div *ngSwitchCase=\"'calendar'\">\n <!-- <app-custom-calendar [question]=\"column | questionByRow:element:i\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model> -->\n </div>\n <!-- SKS22JUL25 Image -->\n <div *ngSwitchCase=\"'image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <!-- <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageEdit(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageDelete(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div> -->\n <img *ngIf=\"column.question?.isReadOnly\" [src]=\"column.question?.imageData\" />\n <!-- <div *ngIf=\"!column.question?.isReadOnly\" class=\"logo-container\">\n Logo preview area\n <div class=\"logo-preview\" *ngIf=\"column.question?.input\">\n <img [src]=\"column.question?.imageData\" />\n </div>\n\n Upload button\n <div *ngIf=\"!column.question?.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(column.question, $event)\" style=\"display: none;\" />\n </div>\n </div> -->\n </div>\n <!-- SKS22JUL25 icon-selector -->\n <nxt-icon-selector *ngSwitchCase=\"'icon'\" [allIcons]=\"allIcons\" [required]=\"column.question?.isOptional\" [mode]=\"mode\" [question]=\"column | questionByRow:element:i\" [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column?.question?.id+'.questionText') | nxtCustomTranslate : column?.question?.questionText) : ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\" [labelWeight]=\"column.question?.fontWeight\" [showLabel]=\"column.question?.style?.showLabel\" (iconSelected)=\"updateEdit(i,$event,element,column.fieldName)\">\n </nxt-icon-selector>\n <!-- SKS22JUL25 line -->\n <hr *ngSwitchCase=\"'line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS22JUL25 data table -->\n <nxt-datatable *ngSwitchCase=\"'table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"column | questionByRow:element:i\" from=\"formBuilder\"\n (valueChange)=\"updateEdit(i,$event.data,element,column.fieldName)\" [apiMeta]=\"column.question?.subText\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [tableConfig]=\"column.question?.tableConfig\" tableId=\"\" direction=\"ltr\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- SKS22JUL25 list -->\n <nxt-search-box *ngSwitchCase=\"'list'\" [question]=\"column | questionByRow:element:i\" [readOnly]=\"column.question?.isReadOnly\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [placeHolderText]=\"column.question?.question || ''\" [value]=\"element | getValue: column.fieldName\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view': element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (searchValueChange)=\"updateEdit(i,$event.value,element,column.fieldName,column.type)\">\n </nxt-search-box>\n <!-- SKS22JUL25 Dropdown -->\n <app-custom-dropdown *ngSwitchCase=\"'dropdown'\" [options]=\"column.question?.options\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [selectedValue]=\"element | getValue: column.fieldName\"\n placeholder=\"\"\n [errorMessage]=\"column.question?.errorMessage\" [referenceField]=\"column.question?.referenceField\"\n [readOnly]=\"column.question?.isReadOnly\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-dropdown>\n <!-- SKS22JUL25 custom-radio component -->\n <app-custom-radio *ngSwitchCase=\"'radio'\" [options]=\"column.question?.options\" [question]=\"column | questionByRow:element:i\" [apiMeta]=\"column.question?.subText\" [id]=\"column.question?.id\"\n [selectedValue]=\"element | getValue: column.fieldName \" [errorMessage]=\"column.question?.errorMessage\"\n [referenceField]=\"column.question?.referenceField\" [readOnly]=\"column.question?.isReadOnly\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-radio>\n <!-- SKS22JUL25 Attachment / Files -->\n <nxt-file-upload *ngSwitchCase=\"'file'\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"column.question?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n <!-- SKS22JUL25 Button -->\n <nxt-button *ngSwitchCase=\"'button'\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"column.question?.question\"\n (buttonClickEmit)=\"updateEdit(i,$event,element,column.fieldName)\"\n >\n </nxt-button>\n <!-- SKS22JUL25 book type -->\n <div *ngSwitchCase=\"'book'\">\n <!-- <lib-questionbook *ngIf=\"column.type === 'book'\" [qbItem]=\"column.question?.qbItem\"\n [questions]=\"readQuestions(column.question?.qbReference, column.question?.qbReferenceQuestions)\"\n (handleDropDown)=\"getDropDown($event)\">\n </lib-questionbook> -->\n </div>\n <!-- SKS10AUG25 object type element -->\n <div *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </div>\n <!-- SKS22JUL25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngSwitchDefault \n [type]=\"column.type === 'boolean' ? 'checkbox' : column.type === 'richtextarea' ? 'richtext' : column.type === undefined ? 'text' : column.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"element | getValue: column.fieldName \"\n [question]=\"column | questionByRow:element:i\"\n [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column.question?.id+'.questionText') | nxtCustomTranslate : column.question?.questionText): ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\"\n [inputValueSize]=\"column.question?.fontSize\"\n [labelWeight]=\"column.question?.fontWeight\"\n [inputWeight]=\"column.question?.fontWeight\"\n [showLabel]=\"column.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"column.question?.question\"\n [required]=\"column.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"column.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"column.question?.iconLeftSrc\" \n [minDate]=\"column.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-input>\n </div>\n </ng-container>\n \n <ng-template #viewMode>\n <!-- SKS10AUG25 view mode content -->\n <ng-container [ngSwitch]=\"column.type\">\n <ng-container *ngSwitchCase=\"'file'\">\n @defer (on viewport) {\n <nxt-file-upload [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"(column | questionByRow:element:i)?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n } @placeholder {\n <span class=\"skeleton-cell file-cell\"></span>\n }\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" style=\"cursor: pointer;\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </ng-container>\n <ng-container *ngSwitchCase=\"'boolean'\">\n <span *ngIf=\"(element | getValue: column.fieldName) === true || (element | getValue: column.fieldName) === 'true'\">\u2714</span>\n <span *ngIf=\"(element | getValue: column.fieldName) !== true && (element | getValue: column.fieldName) !== 'true'\">\u2718</span> \n </ng-container>\n <ng-container *ngSwitchCase=\"'list'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName: 'list': column }}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'date'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{(element | getValue: column.fieldName) | NxtDate : column.type : languageCode : column.calendarType}}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'currency'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{currencyOption?.symbol}}{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n </ng-container>\n </ng-template>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Buttons -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\" class=\"table-col-cell actionCol\">\n <div class=\"actionButton\" style=\"display: flex; align-items: center; justify-content: center;\">\n\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"isEditRow\" class=\"eicon-container\" (click)=\"onEdit(element)\"\n matTooltip=\"{{ 'EDIT_RECORD' | nxtCustomTranslate : 'Edit Record' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\" edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n\n\n <!--SKS15FEB25 Delete Button -->\n <div *ngIf=\"isDeleteRow\" class=\"dicon-container\"\n [matTooltip]=\"'DELETE_RECORD' | nxtCustomTranslate : 'Delete Record'\" (click)=\"deleteRecord(element,i)\"\n style=\"padding: 2px; border: 1px solid #ffb5b5; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"delete-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #feeeed;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <!--SKS15FEB25 Render inline buttons up to Size -->\n <div *ngFor=\"let button of actionButtonArray?.buttonArray; let i = index\">\n <div *ngIf=\"i < actionButtonArray?.size\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div *ngIf=\"isConditionMet(element, button.conditions)\"\n [matTooltip]=\"button.tooltipPath || button.tooltip | nxtCustomTranslate : button.tooltip \"\n (click)=\"actionButtonClicked(button,element)\"\n (mouseenter)=\"$event.target.style.border = '1px solid ' + button.hoverBorderColor\"\n (mouseleave)=\"$event.target.style.border = '1px solid ' + button.borderColor\"\n style=\"padding: 2px; border-radius: {{button.borderRadius}}px; border: 1px solid {{button.borderColor}}; cursor: pointer;\">\n <div (mouseenter)=\"$event.target.style.backgroundColor = button.hoverBackgroundColor\"\n (mouseleave)=\"$event.target.style.backgroundColor = button.backgroundColor\"\n style=\"padding: {{button.padding}}px {{button.padding + 2}}px; border-radius: {{button.borderRadius}}px; background-color: {{button.backgroundColor}}; cursor: pointer\">\n <img *ngIf=\"button.iconSrc\" #imgElement [src]=\"button.iconSrc\" style=\"cursor: pointer\"\n (mouseenter)=\"imgElement.src = button.hoverIconSrc || button.iconSrc\"\n (mouseleave)=\"imgElement.src = button.iconSrc\">\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"dropdownActionButton && dropdownActionButton.length > 0\"\n class=\"dropdown\">\n <div class=\"clickable-img\" (click)=\"toggleDropdown(i)\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div style=\"background-color: #f5f5f5; padding: 2px 2px; border-radius: 5px;\">\n <svg style=\"background-color: #f5f5f5; border-radius: 5px; border: 1px solid #6c757d;\"\n width=\"16\" height=\"16\" viewBox=\"0 0 40 40\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\"\n fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\"\n stroke-miterlimit=\"10\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\"\n stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"dropdown-menu\"\n [style.right]=\"((actionButtonArray?.size ?? 0) - (actionButtonArray?.buttonArray?.size ?? 0) + (isEditRow ? 1 : 0) + (isDeleteRow ? 1 : 0) + (dropdownActionButton?.length > 0 ? 1 : 0)) * 100 + '%'\"\n *ngIf=\"currentOpenIndex === i\">\n <div *ngFor=\"let btn of dropdownActionButton\">\n <button *ngIf=\"isConditionMet(element, btn.conditions)\"\n [attr.data-id]=\"element.id\" style=\"display: flex;\" type=\"button\"\n class=\"btn btn-icon {{btn.buttonType}} tooltip-container\"\n [matTooltip]=\"btn.tooltipPath || btn.tooltip | nxtCustomTranslate : btn.tooltip\"\n [disabled]=\"btn.buttonDisable\"\n (click)=\"actionButtonClicked(btn,element)\">\n <img *ngIf=\"btn.iconSrc\" [src]=\"btn.iconSrc\">\n <div class=\"fc-btn-text\" style=\"padding-left: 10px;\">\n {{btn.name}}</div>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- SKS20MAR25 Summary Rows -->\n <ng-container\n *ngIf=\"summaryRowsOrginal && summaryRowsOrginal.length > 0 && dataSource.data && dataSource?.data?.length > 0 && !isLoading\">\n <ng-container *ngIf=\"!isFullTableSummaryRow && isSummaryColumn\">\n <div *ngFor=\"let row of summaryRowsOrginal\" class=\"table-row summary-row\">\n <!-- Label in the first column -->\n <div *ngIf=\"withCheckBox\" class=\"non-summary-table-cell\"></div>\n <!-- Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryStartColumn; let last = last\"\n class=\"non-summary-table-cell\" [class.last-cell]=\"last\">\n </div> <!-- Value or input in the last column -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(row.uniqueIdentifier)\">{{ (row.id+'.label') | nxtCustomTranslate : row?.label }}\n </div>\n <!-- SKS12SEP25 summary column input box -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\">\n <ng-container>\n <nxt-input\n [type]=\"row.type === 'boolean' ? 'checkbox' : row.type === 'richtextarea' ? 'richtext' : row.type === undefined ? 'text' : row.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? !row.question?.isReadOnly ? 'edit' : 'view' : (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"summaryValues[row.fieldName]\"\n [question]=\"row\"\n [labelFont]=\"row.question?.font\"\n [label]=\"row.question?.questionText ? ((row.question?.id+'.questionText') | nxtCustomTranslate : row.question?.questionText): ''\"\n [labelColor]=\"row.question?.color\"\n [labelSize]=\"row.question?.fontSize\"\n [inputValueSize]=\"row.question?.fontSize\"\n [labelWeight]=\"row.question?.fontWeight\"\n [inputWeight]=\"row.question?.fontWeight\"\n [showLabel]=\"row.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"row.question?.question\"\n [required]=\"row.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"row.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"row.question?.iconLeftSrc\" \n [minDate]=\"row.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\" summaryValues[row.fieldName] = $event.value.valueObj ; onSummaryInputChange()\"\n >\n </nxt-input>\n </ng-container>\n </div>\n <!-- SKS20MAR25 Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryEndColumn; let last = last\"\n class=\"non-summary-table-cell\">\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"non-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n <!-- SKS13JUN25 full table summary row -->\n <ng-container *ngIf=\"isFullTableSummaryRow\">\n <div *ngFor=\"let row of summaryRowsOrginal; let i = index; trackBy: trackBySummary\" class=\"table-row summary-row\">\n <!-- SKS13JUN25 Checkbox column (if enabled) -->\n <div *ngIf=\"withCheckBox\" class=\"horizontal-summary-table-cell\">\n {{ row.labelPath || row.label | nxtCustomTranslate : row.label }}\n </div>\n\n <!-- SKS13JUN25 summary cell -->\n <div *ngFor=\"let col of currentColumns; let last = last; let i = index; trackBy: trackByColumn \"\n class=\"horizontal-summary-table-cell\" style=\"text-align: left;\">\n @if (row?.columns?.includes(col.fieldName)) {\n {{ summaryValues[col.fieldName] | number }}\n }\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"horizontal-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n </ng-container>\n <!--SKS28MAR25 In the Loading section -->\n <div class=\"table-body\" *ngIf=\"isLoading\">\n <!-- Repeat for 5 skeleton rows -->\n <div *ngFor=\"let _ of [1,2,3,4,5]; trackBy: trackByIndex\" class=\"table-row\">\n <!-- Checkbox Column -->\n <div *ngIf=\"withCheckBox\" class=\"skeleton-cell sticky-column\"></div>\n\n <!-- Data Columns -->\n <div *ngFor=\"let col of currentColumns; let i = index; trackBy: trackByColumn\" class=\"skeleton-cell \"></div>\n\n <!-- Action Column -->\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\" class=\"skeleton-cell actionCol\">\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from === 'formBuilder'\" class=\"form-builder-table-box\">\n Add / drags fields from elements sections\n </div> -->\n </div>\n </ng-container>\n </div>\n <!--SKS15FEB25 No Data Row -->\n <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook'\"\n class=\"no-data\">\n {{'NO_RECORDS_OR_DATA_FOUND' | nxtCustomTranslate : 'No records/data found.'}}\n </div>\n <!--SKS15FEB25 Pagination -->\n <div [class.shadow-hidden]=\"isShadowHidden\">\n <!-- table input save button changes -->\n <div *ngIf=\"mode === 'edit'\" class=\"d-flex inlineAdd justify-content-end\">\n <div class=\"flex addIconBor cursor-pointer\" *ngIf=\"addInlineRecord \"\n (click)=\"addTableRecord(inlineElement)\"\n matTooltip=\"{{ 'ADD_RECORD'| nxtCustomTranslate : 'Add Record'}}\">\n <div class=\"addIcon\">\n <svg class=\"nav-icon\" xmlns=\"http://www.w3.org/2000/svg\" height=\"24\"\n viewBox=\"0 -960 960 960\" width=\"24\">\n <path\n d=\"M440-280h80v-160h160v-80H520v-160h-80v160H280v80h160v160Zm40 200q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\" />\n </svg>\n </div>\n </div>\n <!--SKS15FEB25 removed button disable logic, added another condition for button showing-->\n <!--SKS15FEB25 SR06JAN2025 button disable logic for not select any employee-->\n <nxt-button *ngIf=\"(tableSaveButton || isEditRow || addInlineRecord) && from != 'formBuilder' && from != 'questionBook'\"\n buttonType=\"btn btn-primary\"\n (buttonClickEmit)=\"saveButton()\"\n buttonValue=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"></nxt-button>\n </div>\n <nxt-pagination *ngIf=\"isPagination\" [pageSizeOptions]=\"pageSizeOptions\"\n [collectionSize]=\"pagination ? totalRecords || totalCount : filterTableNos\"\n [pageSize]=\"pageSize\" [currentPage]=\"pageIndex\" [firstLastButtons]=\"true\"\n (event)=\"pageParams($event)\">\n </nxt-pagination>\n </div>\n </div>\n </div>\n</div>\n\n<!--SKS15FEB25 alert on deleting record -->\n<div *ngIf=\"deleteModal\" class=\"modal modal-backdrop show d-block\" id=\"deleteRecord\" tabindex=\"-1\"\n aria-labelledby=\"deleteRecordLabel\" [attr.aria-hidden]=\"!deleteModal\">\n <div class=\"modal-dialog\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <b class=\"modal-title fs-5\" id=\"deleteRecordLabel\">{{ 'DELETE_RECORD'| nxtCustomTranslate : 'Delete Record'}}</b>\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"\n (click)=\"deleteModal = false\"></button>\n </div>\n <div class=\"modal-body\">\n {{ 'ARE_YOU_SURE_YOU_WANT_TO_DELETE_THE_REC'| nxtCustomTranslate : 'Are you sure you want to delete the record'}} ?\n </div>\n <div class=\"modal-footer\">\n <nxt-button\n (buttonClickEmit)=\"deleteModal = false\" \n [buttonValue]=\"'NO'| nxtCustomTranslate : 'No'\"\n [btnBgColor]=\"'#ffffff'\"\n [btnTextColor]=\"'#0773ff'\"\n [btnBorder]=\"'1'\"\n [btnBorderColor]=\"'#dee2e6'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n <nxt-button\n (buttonClickEmit)=\"deleteRecordData()\" \n [isLoading]=\"isButtonLoading\"\n [buttonValue]=\"'YES'| nxtCustomTranslate : 'Yes'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n </div>\n </div>\n </div>\n</div>", styles: [".custom-table{display:table;width:100%;border-collapse:collapse;table-layout:fixed;direction:var(--direction);background:var(--body-bg)}.table-header{display:table-header-group;position:sticky;top:0;z-index:100;box-shadow:none;transition:box-shadow .3s ease-in-out;background:var(--header-bg)}.shadow{box-shadow:0 4px 5px #0001!important}.table-body{display:table-row-group}.table-row{display:table-row;min-height:40px}.table-cell,.table-col-cell{position:relative;min-width:50px;max-width:100%;padding:10px 12px;border-bottom:solid 1px var(--border-color);box-sizing:border-box;overflow:visible;white-space:nowrap;text-overflow:ellipsis;display:table-cell}.table-container.resizing{-webkit-user-select:none;user-select:none;pointer-events:none}.table-container.resizing .resize-handle{pointer-events:auto}.sticky-column{position:sticky;background:inherit;z-index:5}.sticky-column .resize-handle{z-index:15}.actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;right:0;background:var(--header-bg)}.actionCol{min-width:100px!important;width:100px!important;max-width:100px!important}.actionCol .resize-handle{display:none}.table-container{width:100%;overflow-x:auto;overflow-y:auto;border-top:1px solid #e0e0e0;scrollbar-width:none}.table-container::-webkit-scrollbar{display:none}.column-header{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0}.column-header img{cursor:pointer}.shadow-hidden{position:relative}.shadow-hidden:before{content:\"\";position:absolute;z-index:11;top:-10px;left:0;width:100%;height:10px;background:linear-gradient(to top,var(--scroll-shadow),transparent)}.resize-handle{position:absolute;right:0;top:13px;width:1px;height:20px;cursor:col-resize;background:#b1b1b1;border:3px transparent;z-index:9;transition:background-color .2s ease}.resize-handle:hover{background:#ccc;opacity:.7}.resize-handle:active{background:#ccc;opacity:.9}.columnDiv{position:relative;display:flex;align-items:center;width:100%;max-width:100%;height:100%}.search{display:flex;justify-content:space-between;border:1px solid rgba(67,69,85,.3);border-radius:7px;align-self:center;padding:3px}.search-bar{width:100%;margin:3px;justify-content:center;align-items:center}.configSearch{height:22px;padding:3px;margin:10p;background-color:#247dff;border-radius:4px}input::placeholder{color:#abafb1}.sort-indicators{display:inline-block;width:10px;padding-left:5px}.sort-direction{font-size:12px;color:var(--text-color);opacity:.7}.tableHeader{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .3s}.tableHeader:hover{background-color:var(--hover-bg)}.search-component{top:163%;background-color:#fff;box-shadow:0 2px 10px #0000001a}[dir=rtl] .search-component{left:0}.rtl .ellipsis,[dir=rtl] .ellipsis{direction:rtl;text-align:right!important}input{border:none}.card{background:#fff;box-shadow:0 2px #0a0a0a1f;border-radius:8px;border-color:#e9e9e9}.fsearch{width:100%;justify-content:space-between;font-weight:400;font-size:13px;display:flex;background:#f0f5ff;border-radius:6px;align-self:center}.content{margin:6px;width:150px}.fsearch-bar{display:flex;flex-direction:row;width:100%;margin:5px;transition:width .3s ease}.search.resized{width:calc(100% - 40px)}.filter-content{width:100%;max-height:150px;padding-left:5px}.label-data{font-weight:200;font-size:12px;color:#434555d9}input[type=checkbox]{height:16px;width:16px;border-radius:5px;margin-left:2px}input[type=checkbox]:after{width:4px;height:7px;left:5px;top:3px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:checked{--r: 43deg}.checkbox-cont{display:flex;align-items:center}.searchinput{border:none;background-color:#f0f5ff;width:85%;font-size:12px;color:#275efe;font-weight:600}.searchSvg{margin-right:3px}.close-icon{margin-left:4px;width:36px;height:32px;cursor:pointer;padding-top:9px;padding-bottom:9px;background-color:#ffefee;color:red;border-radius:4px;transition:background-color .3s ease,color .3s ease}.close-icon:hover{background-color:red;color:#fff}.checkboxdiv{display:flex;align-items:center}.checkboxdiv input{flex-shrink:0}input:focus,input:active,select:focus,select:active,textarea:focus,textarea:active,button:focus,button:active{outline:none!important}@supports (-webkit-appearance: none) or (-moz-appearance: none){input[type=checkbox]{--active: #275EFE;--active-inner: #fff;--focus: 2px rgba(39, 94, 254, .3);--border: #BBC1E1;--border-hover: #275EFE;--background: #fff;--disabled: #F6F8FF;--disabled-inner: #E1E6F9;-webkit-appearance:none;-moz-appearance:none;height:21px;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--bc, var(--border));background:var(--b, var(--background))!important;transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after{content:\"\";display:block;left:0;top:0;position:absolute;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}input[type=checkbox]:checked{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=checkbox]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=checkbox]:focus{box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.switch){width:21px}input[type=checkbox]:not(.switch):after{opacity:var(--o, 0)}input[type=checkbox]:not(.switch):checked{--o: 1}input[type=checkbox]+label{font-size:14px;line-height:21px;display:inline-block;vertical-align:top;cursor:pointer;margin-left:4px}input[type=checkbox]:not(.switch){border-radius:7px}input[type=checkbox]:not(.switch):after{width:5px;height:9px;border:2px solid var(--active-inner);border-top:0;border-left:0;left:7px;top:4px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:not(.switch):checked{--r: 43deg}input[type=checkbox].switch{width:38px;border-radius:11px}input[type=checkbox].switch:after{left:2px;top:2px;border-radius:50%;width:15px;height:15px;background:var(--ab, var(--border));transform:translate(var(--x, 0))}input[type=checkbox].switch:checked{--ab: var(--active-inner);--x: 17px}input[type=checkbox].switch:disabled:not(:checked):after{opacity:.6}input[type=checkbox]:indeterminate{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:indeterminate:after{content:\"\";display:block;left:8px;top:5px;rotate:69deg;position:absolute;width:2px;height:9px;background:var(--active-inner);opacity:6;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}}:host{--primary-color: #275EFE;--secondary-color: #6C757D;--text-color: #434555;--border-color: #e0e0e0;--hover-bg: #f9f9f9;--header-bg: #ffffff;--body-bg: #ffffff;--danger-color: #FF2C10;--scroll-shadow: rgba(0, 0, 0, .08);--box-shadow: 0 2px 10px rgba(0, 0, 0, .1)}:host(.dark-theme){--primary-color: #6c8dfa;--text-color: #ffffff;--header-bg: #2c2c2c;--body-bg: #1e1e1e;--border-color: #404040;--hover-bg: #373737}.hyper-link:hover{color:#00f!important;text-decoration:underline;cursor:pointer}.on-edit:hover .edit-icon{visibility:visible}.view-mode-text{border-radius:5px;color:#2c3137;font-weight:400;font-size:13px;transition:all .2s}.input-box{border:solid}.inlineAdd{align-items:center;gap:10px;padding-top:10px}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}::ng-deep .modal-backdrop{background-color:#000000b3!important}::ng-deep .modal-backdrop.show{opacity:1!important}.eicon-container:hover .edit-icon svg path{fill:#2163ff!important}.eicon-container:hover .edit-icon{background-color:#c9d2ff!important;cursor:pointer}.eicon-container:hover{border:1px solid #2163ff!important}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.clickable-img{position:relative;cursor:pointer;padding:2px;border:1px solid #dddddd;border-radius:5px}.clickable-img:hover{border:1px solid rgb(31,105,255);border-radius:5px}.clickable-img:hover div svg{background-color:#ecf3ff!important}.clickable-img:hover div{background-color:#ecf3ff!important}.dropdown-menu{left:unset!important;right:300%;top:12.5px;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 4px 8px #0000001a}.dropdown .dropdown-menu{display:block}.dropdown-menu .btn{display:block;padding:10px;width:100%;text-align:left;background:transparent;border:none;cursor:pointer}[dir=rtl] .search{margin-left:7px}[dir=rtl] .noOfRec{gap:4px}[dir=rtl] .sticky-column{position:sticky;right:0;z-index:11;background:var(--header-bg)}[dir=rtl] .actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;left:0;background:var(--header-bg)}[dir=rtl] .sort-indicators{padding-right:5px}[dir=rtl] .resize-handle{left:0!important;right:unset!important}::ng-deep [dir=rtl] nxt-pagination .dropdown-arrow{left:5px;right:unset!important}::ng-deep [dir=rtl] nxt-button .dropdown-menu{right:unset!important;left:0!important}[dir=rtl] .dropdown-menu{left:300%!important;right:unset!important}[dir=rtl] .fc-btn-text{padding-right:10px}.selected-cell{border-left:2px solid #2196F3!important;border-right:2px solid #2196F3!important;position:relative;z-index:1}.selected-column{position:relative;border:2px solid #2196F3!important;border-bottom:none!important;border-radius:4px}.close-column-btn{position:absolute;top:3px;right:5px;width:12px;height:12px;border:solid black .5px;color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;cursor:pointer;z-index:2}.close-column-btn:hover{background:#f32121!important;border:solid #f32121 .5px!important;color:#fff!important}.table-row:last-child .selected-cell{border-bottom:2px solid #2196F3!important}.hover-content{position:absolute;z-index:1;background:#fff;border:1px solid #ccc;box-shadow:0 2px 5px #00000026;padding:10px;min-width:200px;border-radius:5px;top:70%;left:0;cursor:pointer}.expense-file{text-decoration:none;transition:text-decoration .2s ease-in-out;cursor:pointer}.expense-file:hover{text-decoration:underline;color:#0056b3;cursor:pointer}.popover-container .hover-content{display:none;position:absolute;cursor:pointer}.popover-container:hover .hover-content{display:block;cursor:pointer}.summary-row{font-weight:700}.non-summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px white!important}.summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px var(--border-color)!important;border-top:solid 1.5px var(--border-color)!important}.horizontal-summary-table-cell{display:table-cell;box-sizing:border-box;overflow:visible;white-space:nowrap;padding:12px;text-overflow:ellipsis;position:relative;color:var(--text-color);border:solid 1px white!important;border-top:solid 1px var(--border-color)!important;border-bottom:1px solid var(--border-color)!important}.last-cell{border-right:1px solid var(--border-color)!important}.table-last-cell{border-bottom:1px solid var(--border-color)!important}.skeleton-loader{display:table;width:100%;border-collapse:collapse}.skeleton-row{display:table-row;border-bottom:1px solid var(--border-color)}.skeleton-cell{display:table-cell;padding:12px;height:35px;background:#fff;position:relative}.skeleton-cell:before{content:\"\";position:absolute;inset:3px;background:linear-gradient(90deg,#f5f5f5 25%,#eaeaea,#f5f5f5 75%);background-size:200% 100%;animation:pulse 1.5s infinite linear;border-radius:4px}.skeleton-cell.sticky-column{position:sticky;left:0;z-index:11;background:#f5f5f5}.skeleton-cell.actionCol.sticky-column{position:sticky;right:0;left:auto;background:#f5f5f5}@keyframes pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-cell.file-cell{width:inherit!important;position:absolute!important;top:1px!important;height:30px!important;transition:all .2s!important}.form-builder-table-box{height:108px;display:flex;justify-content:center;align-items:center;border:1px dashed #a8a1a1}.no-data{display:flex;align-items:anchor-center;height:60px;justify-content:center}.custom-line{width:100%;border:1px solid #a8a1a1}.hyperlink-input{color:inherit;text-decoration:none;cursor:default}.hyperlink-input:hover{color:#00f!important;text-decoration:underline!important;cursor:pointer}.edit-icon-hide{display:none;cursor:pointer}.table-layout:hover .edit-icon-hide{display:block}.modal-footer{padding:0!important}\n"], dependencies: [{ kind: "component", type: NxtDatatable, selector: "nxt-datatable", inputs: ["data", "tableFilterData", "columns", "withCheckBox", "searchBar", "tableSaveButton", "stickyColumn", "tableWidth", "actionColumHeader", "actionButton", "title", "isButtons", "buttonArray", "tableId", "isEditRow", "isDeleteRow", "addInlineRecord", "searchConfigs", "direction", "pagination", "actionButtonArray", "multipleFilter", "isPagination", "isListViews", "id", "isNosIndicator", "isEditable", "from", "question", "rowTextSize", "rowTextColor", "apiMeta", "summaryRows", "summaryColumns", "isLoading", "tableConfig", "tableParams", "listViews", "mode", "languageCode", "selectedColumn", "allIcons", "isButtonLoading", "isPreview"], outputs: ["tableRowClick", "onEditData", "saveButtonData", "onDeleteData", "buttonEmit", "hyperLinkEmit", "sideNavEmit", "actionButtonEmit", "columnSelected", "removeColumn", "valueChange", "selectedValues", "fileEmit", "NxtTableFilterEmit", "hadleDropDownDependent", "NxtTableParamsEmit"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i5.DecimalPipe, name: "number" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NxtButtonComponent, selector: "nxt-button", inputs: ["buttonValue", "buttonType", "type", "buttonDisable", "btnBgColor", "btnBorder", "btnBorderRadius", "btnBorderColor", "btnTextColor", "btnHeight", "btnWidth", "btnIconLeftSrc", "btnIconRightSrc", "btnHoverBgColor", "btnHoverTextColor", "btnId", "dataDismiss", "modalToTrigger", "isImageSvg", "tabIndex", "buttonConfig", "mode", "languageCode", "isLoading"], outputs: ["buttonClickEmit"] }, { kind: "component", type: NxtPagination, selector: "nxt-pagination", inputs: ["pageSizeOptions", "collectionSize", "pageSize", "currentPage", "maxSize", "firstLastButtons", "nextPreviousButtons", "small"], outputs: ["event"] }, { kind: "pipe", type: NxtSearchFilterPipe, name: "searchFilter" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i9.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: NxtGetValuePipe, name: "getValue" }, { kind: "component", type: IconSelectorComponent, selector: "nxt-icon-selector", inputs: ["allIcons", "themeColor", "height", "tooltipPosition", "selectedIcon", "cdnIconURL", "label", "labelFont", "labelWeight", "inputWeight", "labelSize", "labelColor", "showLabel", "required", "mode", "question", "options"], outputs: ["iconSelected"] }, { kind: "component", type: NxtSearchBox, selector: "nxt-search-box", inputs: ["placeHolderText", "question", "apiMeta", "id", "readOnly", "mode", "from", "value"], outputs: ["searchValueChange"] }, { kind: "component", type: CustomDropdownComponent, selector: "app-custom-dropdown", inputs: ["options", "placeholder", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "error", "fromShengel", "question", "referenceField", "token", "mode", "from"], outputs: ["valueChange"] }, { kind: "component", type: CustomRadioComponent, selector: "app-custom-radio", inputs: ["options", "question", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "fromShengel", "referenceField", "token", "label", "mode"], outputs: ["valueChange"] }, { kind: "component", type: NxtFileUploadComponent, selector: "nxt-file-upload", inputs: ["allFiles", "mode", "question", "from"], outputs: ["selectedFileData", "deletedFileData"] }, { kind: "component", type: NxtInput, selector: "nxt-input", inputs: ["label", "labelFont", "labelWeight", "inputWeight", "labelSize", "inputValueSize", "labelColor", "showLabel", "svgHeight", "svgWidth", "type", "inputIconRightSrc", "inputIconLeftSrc", "required", "minLength", "pattern", "errorMessages", "maxLength", "placeholder", "inputBgColor", "inputBorder", "placeholderColor", "placeholderFont", "placeholderWeight", "placeholderSize", "inputTextColor", "inputHeight", "inputWidth", "inputId", "inputBorderSize", "inputConfig", "confPassVal", "confPass", "mode", "value", "question", "showSuggestion", "ariaOwns", "ariaHasPopup", "isLoading", "options", "minDate", "maxDate", "rows", "from", "selectedOption", "apiMeta", "direction", "currency", "helpText", "apiKey", "size"], outputs: ["valueChange", "inputValue", "onBlur", "onFocus", "toggleEmit", "removeValueEmit"] }, { kind: "component", type: ListViewFilterComponent, selector: "app-list-view-filter", inputs: ["listViews", "tableData", "tableFilterArray", "selectedView", "displayedColumns", "availableOperators"], outputs: ["listViewEmit"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }, { kind: "pipe", type: QuestionByRowPipe, name: "questionByRow" }, { kind: "pipe", type: NxtDatePipe, name: "NxtDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [NxtFileUploadComponent,
|
|
51895
51934
|
QuestionByRowPipe]] });
|
|
51896
51935
|
}
|
|
51897
51936
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NxtDatatable, decorators: [{
|
|
@@ -51917,7 +51956,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
51917
51956
|
QuestionByRowPipe,
|
|
51918
51957
|
NxtDatePipe
|
|
51919
51958
|
// RowResizerDirective
|
|
51920
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"table-layout\" [id]=\"tableId\" [ngStyle]=\"{'padding-top': '1px', 'width': tableWidth}\" [attr.dir]=\"direction\" [dir]=\"direction\">\n <div>\n <div *ngIf=\"title\" class=\"d-flex justify-content-center table-title align-text-center\">\n {{title}}\n </div>\n <div *ngIf=\"isNosIndicator || searchBar || isButtons\" class=\"flex justify-content-between\"\n [style.padding-bottom]=\" id && (isListViews !== false && isListViews !== 'false') && from !== 'formBuilder' ? '0px' : '5px' \">\n <div class=\"flex\">\n <!-- SKS26APR25 List View Filter -->\n <app-list-view-filter *ngIf=\"id && isListViews !== false && isListViews !== 'false' && from != 'formBuilder'\" [listViews]=\"listViews\"\n [selectedView]=\"selectedView\" [displayedColumns]='columns' [tableFilterArray]=\"tableFilterArray\"\n (listViewEmit)=\"listViewEmit($event)\">\n </app-list-view-filter>\n <div *ngIf=\"(!id || isListViews === false || isListViews === 'false' || from === 'formBuilder' || from === 'questionBook') && isNosIndicator\" class=\"noOfRec\"\n style=\"display: flex; align-items: flex-end;\">\n <p style=\"font-weight: 500; margin-right: 5px; margin-bottom: 0px;\">\n {{ 'NOS' | nxtCustomTranslate : 'Nos'}} </p>\n <div style=\"color: rgb(43, 87, 249);\">{{totalRecords || totalCount}}</div>\n </div>\n </div>\n\n <div class=\"flex\" style=\"align-items: center;\">\n <div *ngIf=\"searchBar\" class=\"search\">\n <div class=\"flex search-bar\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\" stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <input type=\"text\" placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\" style=\"font-size: 13px;\"\n (keyup)=\"searchConfigs ? emptySearch($event.target.value) : applyFilter($event.target.value)\"\n [value]=\"searchBoxValue || ''\" #input>\n <svg *ngIf=\"searchConfigs && searchBar\" class=\"configSearch\" (click)=\"onSearch(input.value)\"\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 5H20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14 8H17\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21 11.5C21 16.75 16.75 21 11.5 21C6.25 21 2 16.75 2 11.5C2 6.25 6.25 2 11.5 2\"\n stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M22 22L20 20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"flex\" *ngIf=\"isButtons\" style=\"padding-left: 7px;\">\n <div class=\"flex\" *ngFor=\"let button of buttonArray\">\n <nxt-button class=\"data-table-fsbtn\"\n (buttonClickEmit)=\"(button.type === 'group' || button.type === 'dropdown') ? commonButtonClick($event) : commonButtonClick(button)\"\n [buttonType]=\"button.class\"\n [buttonValue]=\"button.labelPath || button.label || button.name | nxtCustomTranslate : button.label || button.name \"\n [buttonConfig]=\"button.buttonConfig\" [type]=\"button.type\" class=\"ms-2 me-2\"\n [btnIconLeftSrc]=\"button.btnIconLeftSrc\" [isImageSvg]=\"button.isImageSvg\">\n </nxt-button>\n </div>\n </div>\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"question && from === 'questionBook' && mode === 'view'\" (click)=\"editModeChange()\" class=\"eicon-container edit-icon-hide\"\n matTooltip=\"{{ 'EDIT_TABLE' | nxtCustomTranslate : 'Edit Table' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"discardChanges()\"\n matTooltip=\"{{ 'DISCARD' | nxtCustomTranslate : 'Discard' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"saveTable()\"\n matTooltip=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"table-margin\">\n <div class=\"table-container\"\n [ngClass]=\"{ 'resizing': isResizing }\"\n [ngStyle]=\"{ maxHeight: isPagination ? '450px' : 'auto', minHeight: dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook' ? '0px' : searchFilter ? '233px' : '100px' }\"\n #tableContainer (scroll)=\"onScroll(tableContainer)\">\n <ng-container>\n <div class=\"custom-table\" [ngStyle]=\"{ minHeight: searchFilter ? '233px' : '' }\">\n <!--SKS15FEB25 Table Header -->\n <div class=\"table-header\" [ngClass]=\"{ 'shadow': isScrolled }\">\n <div class=\"table-row\">\n <!--SKS15FEB25 Checkbox Column -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-cell sticky-column head-color\" [style.width]=\"'50px'\">\n <input type=\"checkbox\" (click)=\"$event.stopPropagation()\" (change)=\"masterToggle()\"\n [checked]=\"selection?.hasValue()\"\n [indeterminate]=\"selection?.hasValue() && !isAllSelected()\"\n class=\"custom-checkbox\">\n </div>\n\n <!--SKS15FEB25 Data Columns -->\n <ng-container *ngFor=\"let column of currentColumns; let i = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-cell tableHeader head-color\"\n [class.sticky-column]=\"i === (stickyCondition - 1)\"\n [class.active-column]=\"activeColumn === column.uniqueIdentifier\"\n [class.selected-column]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(column.uniqueIdentifier); column.sort ? sortData(column.fieldName) : ''\"\n (mouseenter)=\"hoveredColumn = column.fieldName\" (mouseleave)=\"hoveredColumn = null\"\n [style.backgroundColor]=\"column?.style?.fillColor || 'transparent'\"\n [style.color]=\"column?.style?.color\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <div class=\"columnDiv\">\n <div class=\"column-header\" [style.width]=\"column.width || '50px'\">\n <!-- Add close button for selected column -->\n <div *ngIf=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier && !isPreview\"\n class=\"close-column-btn\"\n (click)=\"$event.stopPropagation(); removeCol(column.uniqueIdentifier)\">\n \u2715\n </div>\n <div class=\"ellipsis\" style=\"flex: 1;\" [title]=\"column.label\">\n @if(column.labelPath){\n {{ column.labelPath | nxtCustomTranslate : column.label }}\n }\n @else if(from !== 'formBuilder' || from !== 'questionBook') {\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n } \n @else if(column.uniqueIdentifier) {\n @if( ((column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label) !== column.uniqueIdentifier+'.label'){\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n }\n }\n @else {\n {{ column.label }}\n }\n </div>\n <div>\n <svg *ngIf=\"column.filter\"\n (click)=\"$event.stopPropagation(); filter(column.fieldName)\"\n style=\"padding-right: 2px;\" width=\"12\" height=\"11\"\n viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M10.75 1.25H0.75L4.75 5.71722V8.80556L6.75 9.75V5.71722L10.75 1.25Z\"\n stroke=\"#242533\" stroke-width=\"1.2\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <!--SKS15FEB25 Red dot for active filter -->\n <circle\n *ngIf=\"filterDataArray && filterDataArray[column.fieldName]?.length > 0\"\n cx=\"9\" cy=\"2\" r=\"2.5\" fill=\"red\"></circle>\n </svg>\n <div *ngIf=\"column.sort\"\n class=\"sort-indicators\">\n <span *ngIf=\"currentSortColumn === column.fieldName\" class=\"sort-direction\">\n {{ currentSortDirection === 'asc' ? '\u2191' : currentSortDirection\n === 'desc' ? '\u2193' : '' }}\n </span>\n <span\n *ngIf=\"hoveredColumn === column.fieldName && currentSortColumn !== column.fieldName\"\n class=\"sort-direction\">\n \u2191\n </span>\n </div>\n <div *ngIf=\"searchFilter && column.fieldName === selectedFilter\"\n class=\"search-component position-absolute\"\n (click)=\"$event.stopPropagation();\">\n <div class=\"card\">\n <div class=\"content\">\n <div class=\"flex\">\n <div class=\"fsearch\" [class.resized]=\"isResized\">\n <div class=\"fsearch-bar\">\n <svg class=\"searchSvg\" width=\"18\" height=\"20\"\n viewBox=\"0 0 24 22\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n <input class=\"width-100\" type=\"text\"\n placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\"\n [(ngModel)]=\"searchText\"\n class=\"searchinput\">\n </div>\n </div>\n <svg *ngIf=\"isResized\" (click)=\"closefilter()\"\n class=\"close-icon\" width=\"24\" height=\"24\"\n viewBox=\"0 0 24 24\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9.16998 14.83L14.83 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14.83 14.83L9.16998 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <div class=\"filter-content\" [style]=\"'overflow-y: auto'\">\n <div *ngFor=\"let data of filterArray | searchFilter : searchText\">\n <div class=\"mt-3 mb-3 checkboxdiv\"\n style=\"gap: 5px;\">\n <input type=\"checkbox\"\n [checked]=\"isSelected(data)\" [value]=\"data\"\n [id]=\"data\" (change)=\"checkedData(data)\">\n <div class=\"ms-2 label-data\">{{data}}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Enhanced resize handle -->\n <div class=\"resize-handle\" \n [attr.resize-data-column-id]=\"column.uniqueIdentifier\"\n (mousedown)=\"onResizeStart($event)\"\n title=\"Drag to resize column\">\n </div>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Column -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\"\n class=\"table-cell head-color actionCol sticky-column\"\n [style.width]=\"'150px'\"\n style=\"padding: 12px !important;\">\n <div style=\"display: flex; align-items: center; justify-content: center;\">\n {{ actionColumHeader | nxtCustomTranslate : 'Action'}}\n </div>\n </div>\n </div>\n </div>\n\n <!--SKS15FEB25 Table Body -->\n <div class=\"table-body\" *ngIf=\"!isLoading\">\n <div *ngFor=\"let element of dataSource.data; let i = index; trackBy: trackByRow\" class=\"table-row\"\n (click)=\"tableClick(element)\">\n <!--SKS15FEB25 Checkbox Cell -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-col-cell sticky-column body-color\">\n <input type=\"checkbox\" class=\"custom-checkbox\" (click)=\"$event.stopPropagation()\"\n (change)=\"separateRowSelect(selection?.toggle(element), element)\"\n [checked]=\"selection?.isSelected(element)\"\n [disabled]=\"(element.isPayProcessed === true)\">\n </div>\n\n <!--SKS15FEB25 Data Cells -->\n <ng-container *ngFor=\"let column of currentColumns; let last = last; let c = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-col-cell body-color ellipsis\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n [style.width]=\"(column.width || '50px')\"\n [style.overflow]=\"element?.editRow ? 'unset' : ''\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <ng-container *ngIf=\"element?.editRow && mode === 'edit'; else viewMode\">\n <!-- edit mode content -->\n <div [ngSwitch]=\"column.type\">\n <!-- SKS22JUL25 calendar -->\n <div *ngSwitchCase=\"'calendar'\">\n <!-- <app-custom-calendar [question]=\"column | questionByRow:element:i\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model> -->\n </div>\n <!-- SKS22JUL25 Image -->\n <div *ngSwitchCase=\"'image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <!-- <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageEdit(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageDelete(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div> -->\n <img *ngIf=\"column.question?.isReadOnly\" [src]=\"column.question?.imageData\" />\n <!-- <div *ngIf=\"!column.question?.isReadOnly\" class=\"logo-container\">\n Logo preview area\n <div class=\"logo-preview\" *ngIf=\"column.question?.input\">\n <img [src]=\"column.question?.imageData\" />\n </div>\n\n Upload button\n <div *ngIf=\"!column.question?.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(column.question, $event)\" style=\"display: none;\" />\n </div>\n </div> -->\n </div>\n <!-- SKS22JUL25 icon-selector -->\n <nxt-icon-selector *ngSwitchCase=\"'icon'\" [allIcons]=\"allIcons\" [required]=\"column.question?.isOptional\" [mode]=\"mode\" [question]=\"column | questionByRow:element:i\" [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column?.question?.id+'.questionText') | nxtCustomTranslate : column?.question?.questionText) : ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\" [labelWeight]=\"column.question?.fontWeight\" [showLabel]=\"column.question?.style?.showLabel\" (iconSelected)=\"updateEdit(i,$event,element,column.fieldName)\">\n </nxt-icon-selector>\n <!-- SKS22JUL25 line -->\n <hr *ngSwitchCase=\"'line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS22JUL25 data table -->\n <nxt-datatable *ngSwitchCase=\"'table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"column | questionByRow:element:i\" from=\"formBuilder\"\n (valueChange)=\"updateEdit(i,$event.data,element,column.fieldName)\" [apiMeta]=\"column.question?.subText\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [tableConfig]=\"column.question?.tableConfig\" tableId=\"\" direction=\"ltr\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- SKS22JUL25 list -->\n <nxt-search-box *ngSwitchCase=\"'list'\" [question]=\"column | questionByRow:element:i\" [readOnly]=\"column.question?.isReadOnly\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [placeHolderText]=\"column.question?.question || ''\" [value]=\"element | getValue: column.fieldName\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view': element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (searchValueChange)=\"updateEdit(i,$event.value,element,column.fieldName,column.type)\">\n </nxt-search-box>\n <!-- SKS22JUL25 Dropdown -->\n <app-custom-dropdown *ngSwitchCase=\"'dropdown'\" [options]=\"column.question?.options\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [selectedValue]=\"element | getValue: column.fieldName\"\n placeholder=\"\"\n [errorMessage]=\"column.question?.errorMessage\" [error]=\"column.question?.error\" [referenceField]=\"column.question?.referenceField\"\n [readOnly]=\"column.question?.isReadOnly\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-dropdown>\n <!-- SKS22JUL25 custom-radio component -->\n <app-custom-radio *ngSwitchCase=\"'radio'\" [options]=\"column.question?.options\" [question]=\"column | questionByRow:element:i\" [apiMeta]=\"column.question?.subText\" [id]=\"column.question?.id\"\n [selectedValue]=\"element | getValue: column.fieldName \" [errorMessage]=\"column.question?.errorMessage\"\n [referenceField]=\"column.question?.referenceField\" [readOnly]=\"column.question?.isReadOnly\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-radio>\n <!-- SKS22JUL25 Attachment / Files -->\n <nxt-file-upload *ngSwitchCase=\"'file'\" [limitFileUploading]=\"5\" [error]=\"column.question?.error\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"column.question?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n <!-- SKS22JUL25 Button -->\n <nxt-button *ngSwitchCase=\"'button'\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"column.question?.question\"\n (buttonClickEmit)=\"updateEdit(i,$event,element,column.fieldName)\"\n >\n </nxt-button>\n <!-- SKS22JUL25 book type -->\n <div *ngSwitchCase=\"'book'\">\n <!-- <lib-questionbook *ngIf=\"column.type === 'book'\" [qbItem]=\"column.question?.qbItem\"\n [questions]=\"readQuestions(column.question?.qbReference, column.question?.qbReferenceQuestions)\"\n (handleDropDown)=\"getDropDown($event)\">\n </lib-questionbook> -->\n </div>\n <!-- SKS10AUG25 object type element -->\n <div *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </div>\n <!-- SKS22JUL25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngSwitchDefault \n [type]=\"column.type === 'boolean' ? 'checkbox' : column.type === 'richtextarea' ? 'richtext' : column.type === undefined ? 'text' : column.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"element | getValue: column.fieldName \"\n [question]=\"column | questionByRow:element:i\"\n [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column.question?.id+'.questionText') | nxtCustomTranslate : column.question?.questionText): ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\"\n [inputValueSize]=\"column.question?.fontSize\"\n [labelWeight]=\"column.question?.fontWeight\"\n [inputWeight]=\"column.question?.fontWeight\"\n [showLabel]=\"column.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"column.question?.question\"\n [required]=\"column.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"column.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"column.question?.iconLeftSrc\" \n [minDate]=\"column.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-input>\n </div>\n </ng-container>\n \n <ng-template #viewMode>\n <!-- SKS10AUG25 view mode content -->\n <ng-container [ngSwitch]=\"column.type\">\n <ng-container *ngSwitchCase=\"'file'\">\n @defer (on viewport) {\n <nxt-file-upload [limitFileUploading]=\"5\" [error]=\"column.question?.error\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"(column | questionByRow:element:i)?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n } @placeholder {\n <span class=\"skeleton-cell file-cell\"></span>\n }\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" style=\"cursor: pointer;\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </ng-container>\n <ng-container *ngSwitchCase=\"'boolean'\">\n <span *ngIf=\"(element | getValue: column.fieldName) === true || (element | getValue: column.fieldName) === 'true'\">\u2714</span>\n <span *ngIf=\"(element | getValue: column.fieldName) !== true && (element | getValue: column.fieldName) !== 'true'\">\u2718</span> \n </ng-container>\n <ng-container *ngSwitchCase=\"'list'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName: 'list': column }}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'date'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{(element | getValue: column.fieldName) | NxtDate : column.type : languageCode : column.calendarType}}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'currency'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{currencyOption?.symbol}}{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n </ng-container>\n </ng-template>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Buttons -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\" class=\"table-col-cell actionCol\">\n <div class=\"actionButton\" style=\"display: flex; align-items: center; justify-content: center;\">\n\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"isEditRow\" class=\"eicon-container\" (click)=\"onEdit(element)\"\n matTooltip=\"{{ 'EDIT_RECORD' | nxtCustomTranslate : 'Edit Record' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\" edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n\n\n <!--SKS15FEB25 Delete Button -->\n <div *ngIf=\"isDeleteRow\" class=\"dicon-container\"\n [matTooltip]=\"'DELETE_RECORD' | nxtCustomTranslate : 'Delete Record'\" (click)=\"deleteRecord(element,i)\"\n style=\"padding: 2px; border: 1px solid #ffb5b5; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"delete-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #feeeed;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <!--SKS15FEB25 Render inline buttons up to Size -->\n <div *ngFor=\"let button of actionButtonArray?.buttonArray; let i = index\">\n <div *ngIf=\"i < actionButtonArray?.size\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div *ngIf=\"isConditionMet(element, button.conditions)\"\n [matTooltip]=\"button.tooltipPath || button.tooltip | nxtCustomTranslate : button.tooltip \"\n (click)=\"actionButtonClicked(button,element)\"\n (mouseenter)=\"$event.target.style.border = '1px solid ' + button.hoverBorderColor\"\n (mouseleave)=\"$event.target.style.border = '1px solid ' + button.borderColor\"\n style=\"padding: 2px; border-radius: {{button.borderRadius}}px; border: 1px solid {{button.borderColor}}; cursor: pointer;\">\n <div (mouseenter)=\"$event.target.style.backgroundColor = button.hoverBackgroundColor\"\n (mouseleave)=\"$event.target.style.backgroundColor = button.backgroundColor\"\n style=\"padding: {{button.padding}}px {{button.padding + 2}}px; border-radius: {{button.borderRadius}}px; background-color: {{button.backgroundColor}}; cursor: pointer\">\n <img *ngIf=\"button.iconSrc\" #imgElement [src]=\"button.iconSrc\" style=\"cursor: pointer\"\n (mouseenter)=\"imgElement.src = button.hoverIconSrc || button.iconSrc\"\n (mouseleave)=\"imgElement.src = button.iconSrc\">\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"dropdownActionButton && dropdownActionButton.length > 0\"\n class=\"dropdown\">\n <div class=\"clickable-img\" (click)=\"toggleDropdown(i)\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div style=\"background-color: #f5f5f5; padding: 2px 2px; border-radius: 5px;\">\n <svg style=\"background-color: #f5f5f5; border-radius: 5px; border: 1px solid #6c757d;\"\n width=\"16\" height=\"16\" viewBox=\"0 0 40 40\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\"\n fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\"\n stroke-miterlimit=\"10\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\"\n stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"dropdown-menu\"\n [style.right]=\"((actionButtonArray?.size ?? 0) - (actionButtonArray?.buttonArray?.size ?? 0) + (isEditRow ? 1 : 0) + (isDeleteRow ? 1 : 0) + (dropdownActionButton?.length > 0 ? 1 : 0)) * 100 + '%'\"\n *ngIf=\"currentOpenIndex === i\">\n <div *ngFor=\"let btn of dropdownActionButton\">\n <button *ngIf=\"isConditionMet(element, btn.conditions)\"\n [attr.data-id]=\"element.id\" style=\"display: flex;\" type=\"button\"\n class=\"btn btn-icon {{btn.buttonType}} tooltip-container\"\n [matTooltip]=\"btn.tooltipPath || btn.tooltip | nxtCustomTranslate : btn.tooltip\"\n [disabled]=\"btn.buttonDisable\"\n (click)=\"actionButtonClicked(btn,element)\">\n <img *ngIf=\"btn.iconSrc\" [src]=\"btn.iconSrc\">\n <div class=\"fc-btn-text\" style=\"padding-left: 10px;\">\n {{btn.name}}</div>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- SKS20MAR25 Summary Rows -->\n <ng-container\n *ngIf=\"summaryRowsOrginal && summaryRowsOrginal.length > 0 && dataSource.data && dataSource?.data?.length > 0 && !isLoading\">\n <ng-container *ngIf=\"!isFullTableSummaryRow && isSummaryColumn\">\n <div *ngFor=\"let row of summaryRowsOrginal\" class=\"table-row summary-row\">\n <!-- Label in the first column -->\n <div *ngIf=\"withCheckBox\" class=\"non-summary-table-cell\"></div>\n <!-- Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryStartColumn; let last = last\"\n class=\"non-summary-table-cell\" [class.last-cell]=\"last\">\n </div> <!-- Value or input in the last column -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(row.uniqueIdentifier)\">{{ (row.id+'.label') | nxtCustomTranslate : row?.label }}\n </div>\n <!-- SKS12SEP25 summary column input box -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\">\n <ng-container>\n <nxt-input\n [type]=\"row.type === 'boolean' ? 'checkbox' : row.type === 'richtextarea' ? 'richtext' : row.type === undefined ? 'text' : row.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? !row.question?.isReadOnly ? 'edit' : 'view' : (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"summaryValues[row.fieldName]\"\n [question]=\"row\"\n [labelFont]=\"row.question?.font\"\n [label]=\"row.question?.questionText ? ((row.question?.id+'.questionText') | nxtCustomTranslate : row.question?.questionText): ''\"\n [labelColor]=\"row.question?.color\"\n [labelSize]=\"row.question?.fontSize\"\n [inputValueSize]=\"row.question?.fontSize\"\n [labelWeight]=\"row.question?.fontWeight\"\n [inputWeight]=\"row.question?.fontWeight\"\n [showLabel]=\"row.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"row.question?.question\"\n [required]=\"row.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"row.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"row.question?.iconLeftSrc\" \n [minDate]=\"row.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\" summaryValues[row.fieldName] = $event.value.valueObj ; onSummaryInputChange()\"\n >\n </nxt-input>\n </ng-container>\n </div>\n <!-- SKS20MAR25 Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryEndColumn; let last = last\"\n class=\"non-summary-table-cell\">\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"non-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n <!-- SKS13JUN25 full table summary row -->\n <ng-container *ngIf=\"isFullTableSummaryRow\">\n <div *ngFor=\"let row of summaryRowsOrginal; let i = index; trackBy: trackBySummary\" class=\"table-row summary-row\">\n <!-- SKS13JUN25 Checkbox column (if enabled) -->\n <div *ngIf=\"withCheckBox\" class=\"horizontal-summary-table-cell\">\n {{ row.labelPath || row.label | nxtCustomTranslate : row.label }}\n </div>\n\n <!-- SKS13JUN25 summary cell -->\n <div *ngFor=\"let col of currentColumns; let last = last; let i = index; trackBy: trackByColumn \"\n class=\"horizontal-summary-table-cell\" style=\"text-align: left;\">\n @if (row?.columns?.includes(col.fieldName)) {\n {{ summaryValues[col.fieldName] | number }}\n }\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"horizontal-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n </ng-container>\n <!--SKS28MAR25 In the Loading section -->\n <div class=\"table-body\" *ngIf=\"isLoading\">\n <!-- Repeat for 5 skeleton rows -->\n <div *ngFor=\"let _ of [1,2,3,4,5]; trackBy: trackByIndex\" class=\"table-row\">\n <!-- Checkbox Column -->\n <div *ngIf=\"withCheckBox\" class=\"skeleton-cell sticky-column\"></div>\n\n <!-- Data Columns -->\n <div *ngFor=\"let col of currentColumns; let i = index; trackBy: trackByColumn\" class=\"skeleton-cell \"></div>\n\n <!-- Action Column -->\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\" class=\"skeleton-cell actionCol\">\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from === 'formBuilder'\" class=\"form-builder-table-box\">\n Add / drags fields from elements sections\n </div> -->\n </div>\n </ng-container>\n </div>\n <!--SKS15FEB25 No Data Row -->\n <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook'\"\n class=\"no-data\">\n {{'NO_RECORDS_OR_DATA_FOUND' | nxtCustomTranslate : 'No records/data found.'}}\n </div>\n <!--SKS15FEB25 Pagination -->\n <div [class.shadow-hidden]=\"isShadowHidden\">\n <!-- table input save button changes -->\n <div *ngIf=\"mode === 'edit'\" class=\"d-flex inlineAdd justify-content-end\">\n <div class=\"flex addIconBor cursor-pointer\" *ngIf=\"addInlineRecord \"\n (click)=\"addTableRecord(inlineElement)\"\n matTooltip=\"{{ 'ADD_RECORD'| nxtCustomTranslate : 'Add Record'}}\">\n <div class=\"addIcon\">\n <svg class=\"nav-icon\" xmlns=\"http://www.w3.org/2000/svg\" height=\"24\"\n viewBox=\"0 -960 960 960\" width=\"24\">\n <path\n d=\"M440-280h80v-160h160v-80H520v-160h-80v160H280v80h160v160Zm40 200q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\" />\n </svg>\n </div>\n </div>\n <!--SKS15FEB25 removed button disable logic, added another condition for button showing-->\n <!--SKS15FEB25 SR06JAN2025 button disable logic for not select any employee-->\n <nxt-button *ngIf=\"(tableSaveButton || isEditRow || addInlineRecord) && from != 'formBuilder' && from != 'questionBook'\"\n buttonType=\"btn btn-primary\"\n (buttonClickEmit)=\"saveButton()\"\n buttonValue=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"></nxt-button>\n </div>\n <nxt-pagination *ngIf=\"isPagination\" [pageSizeOptions]=\"pageSizeOptions\"\n [collectionSize]=\"pagination ? totalRecords || totalCount : filterTableNos\"\n [pageSize]=\"pageSize\" [currentPage]=\"pageIndex\" [firstLastButtons]=\"true\"\n (event)=\"pageParams($event)\">\n </nxt-pagination>\n </div>\n </div>\n </div>\n</div>\n\n<!--SKS15FEB25 alert on deleting record -->\n<div *ngIf=\"deleteModal\" class=\"modal modal-backdrop show d-block\" id=\"deleteRecord\" tabindex=\"-1\"\n aria-labelledby=\"deleteRecordLabel\" [attr.aria-hidden]=\"!deleteModal\">\n <div class=\"modal-dialog\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <b class=\"modal-title fs-5\" id=\"deleteRecordLabel\">{{ 'DELETE_RECORD'| nxtCustomTranslate : 'Delete Record'}}</b>\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"\n (click)=\"deleteModal = false\"></button>\n </div>\n <div class=\"modal-body\">\n {{ 'ARE_YOU_SURE_YOU_WANT_TO_DELETE_THE_REC'| nxtCustomTranslate : 'Are you sure you want to delete the record'}} ?\n </div>\n <div class=\"modal-footer\">\n <nxt-button\n (buttonClickEmit)=\"deleteModal = false\" \n [buttonValue]=\"'NO'| nxtCustomTranslate : 'No'\"\n [btnBgColor]=\"'#ffffff'\"\n [btnTextColor]=\"'#0773ff'\"\n [btnBorder]=\"'1'\"\n [btnBorderColor]=\"'#dee2e6'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n <nxt-button\n (buttonClickEmit)=\"deleteRecordData()\" \n [isLoading]=\"isButtonLoading\"\n [buttonValue]=\"'YES'| nxtCustomTranslate : 'Yes'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n </div>\n </div>\n </div>\n</div>", styles: [".custom-table{display:table;width:100%;border-collapse:collapse;table-layout:fixed;direction:var(--direction);background:var(--body-bg)}.table-header{display:table-header-group;position:sticky;top:0;z-index:100;box-shadow:none;transition:box-shadow .3s ease-in-out;background:var(--header-bg)}.shadow{box-shadow:0 4px 5px #0001!important}.table-body{display:table-row-group}.table-row{display:table-row;min-height:40px}.table-cell,.table-col-cell{position:relative;min-width:50px;max-width:100%;padding:10px 12px;border-bottom:solid 1px var(--border-color);box-sizing:border-box;overflow:visible;white-space:nowrap;text-overflow:ellipsis;display:table-cell}.table-container.resizing{-webkit-user-select:none;user-select:none;pointer-events:none}.table-container.resizing .resize-handle{pointer-events:auto}.sticky-column{position:sticky;background:inherit;z-index:5}.sticky-column .resize-handle{z-index:15}.actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;right:0;background:var(--header-bg)}.actionCol{min-width:100px!important;width:100px!important;max-width:100px!important}.actionCol .resize-handle{display:none}.table-container{width:100%;overflow-x:auto;overflow-y:auto;border-top:1px solid #e0e0e0;scrollbar-width:none}.table-container::-webkit-scrollbar{display:none}.column-header{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0}.column-header img{cursor:pointer}.shadow-hidden{position:relative}.shadow-hidden:before{content:\"\";position:absolute;z-index:11;top:-10px;left:0;width:100%;height:10px;background:linear-gradient(to top,var(--scroll-shadow),transparent)}.resize-handle{position:absolute;right:0;top:13px;width:1px;height:20px;cursor:col-resize;background:#b1b1b1;border:3px transparent;z-index:9;transition:background-color .2s ease}.resize-handle:hover{background:#ccc;opacity:.7}.resize-handle:active{background:#ccc;opacity:.9}.columnDiv{position:relative;display:flex;align-items:center;width:100%;max-width:100%;height:100%}.search{display:flex;justify-content:space-between;border:1px solid rgba(67,69,85,.3);border-radius:7px;align-self:center;padding:3px}.search-bar{width:100%;margin:3px;justify-content:center;align-items:center}.configSearch{height:22px;padding:3px;margin:10p;background-color:#247dff;border-radius:4px}input::placeholder{color:#abafb1}.sort-indicators{display:inline-block;width:10px;padding-left:5px}.sort-direction{font-size:12px;color:var(--text-color);opacity:.7}.tableHeader{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .3s}.tableHeader:hover{background-color:var(--hover-bg)}.search-component{top:163%;background-color:#fff;box-shadow:0 2px 10px #0000001a}[dir=rtl] .search-component{left:0}.rtl .ellipsis,[dir=rtl] .ellipsis{direction:rtl;text-align:right!important}input{border:none}.card{background:#fff;box-shadow:0 2px #0a0a0a1f;border-radius:8px;border-color:#e9e9e9}.fsearch{width:100%;justify-content:space-between;font-weight:400;font-size:13px;display:flex;background:#f0f5ff;border-radius:6px;align-self:center}.content{margin:6px;width:150px}.fsearch-bar{display:flex;flex-direction:row;width:100%;margin:5px;transition:width .3s ease}.search.resized{width:calc(100% - 40px)}.filter-content{width:100%;max-height:150px;padding-left:5px}.label-data{font-weight:200;font-size:12px;color:#434555d9}input[type=checkbox]{height:16px;width:16px;border-radius:5px;margin-left:2px}input[type=checkbox]:after{width:4px;height:7px;left:5px;top:3px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:checked{--r: 43deg}.checkbox-cont{display:flex;align-items:center}.searchinput{border:none;background-color:#f0f5ff;width:85%;font-size:12px;color:#275efe;font-weight:600}.searchSvg{margin-right:3px}.close-icon{margin-left:4px;width:36px;height:32px;cursor:pointer;padding-top:9px;padding-bottom:9px;background-color:#ffefee;color:red;border-radius:4px;transition:background-color .3s ease,color .3s ease}.close-icon:hover{background-color:red;color:#fff}.checkboxdiv{display:flex;align-items:center}.checkboxdiv input{flex-shrink:0}input:focus,input:active,select:focus,select:active,textarea:focus,textarea:active,button:focus,button:active{outline:none!important}@supports (-webkit-appearance: none) or (-moz-appearance: none){input[type=checkbox]{--active: #275EFE;--active-inner: #fff;--focus: 2px rgba(39, 94, 254, .3);--border: #BBC1E1;--border-hover: #275EFE;--background: #fff;--disabled: #F6F8FF;--disabled-inner: #E1E6F9;-webkit-appearance:none;-moz-appearance:none;height:21px;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--bc, var(--border));background:var(--b, var(--background))!important;transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after{content:\"\";display:block;left:0;top:0;position:absolute;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}input[type=checkbox]:checked{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=checkbox]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=checkbox]:focus{box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.switch){width:21px}input[type=checkbox]:not(.switch):after{opacity:var(--o, 0)}input[type=checkbox]:not(.switch):checked{--o: 1}input[type=checkbox]+label{font-size:14px;line-height:21px;display:inline-block;vertical-align:top;cursor:pointer;margin-left:4px}input[type=checkbox]:not(.switch){border-radius:7px}input[type=checkbox]:not(.switch):after{width:5px;height:9px;border:2px solid var(--active-inner);border-top:0;border-left:0;left:7px;top:4px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:not(.switch):checked{--r: 43deg}input[type=checkbox].switch{width:38px;border-radius:11px}input[type=checkbox].switch:after{left:2px;top:2px;border-radius:50%;width:15px;height:15px;background:var(--ab, var(--border));transform:translate(var(--x, 0))}input[type=checkbox].switch:checked{--ab: var(--active-inner);--x: 17px}input[type=checkbox].switch:disabled:not(:checked):after{opacity:.6}input[type=checkbox]:indeterminate{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:indeterminate:after{content:\"\";display:block;left:8px;top:5px;rotate:69deg;position:absolute;width:2px;height:9px;background:var(--active-inner);opacity:6;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}}:host{--primary-color: #275EFE;--secondary-color: #6C757D;--text-color: #434555;--border-color: #e0e0e0;--hover-bg: #f9f9f9;--header-bg: #ffffff;--body-bg: #ffffff;--danger-color: #FF2C10;--scroll-shadow: rgba(0, 0, 0, .08);--box-shadow: 0 2px 10px rgba(0, 0, 0, .1)}:host(.dark-theme){--primary-color: #6c8dfa;--text-color: #ffffff;--header-bg: #2c2c2c;--body-bg: #1e1e1e;--border-color: #404040;--hover-bg: #373737}.hyper-link:hover{color:#00f!important;text-decoration:underline;cursor:pointer}.on-edit:hover .edit-icon{visibility:visible}.view-mode-text{border-radius:5px;color:#2c3137;font-weight:400;font-size:13px;transition:all .2s}.input-box{border:solid}.inlineAdd{align-items:center;gap:10px;padding-top:10px}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}::ng-deep .modal-backdrop{background-color:#000000b3!important}::ng-deep .modal-backdrop.show{opacity:1!important}.eicon-container:hover .edit-icon svg path{fill:#2163ff!important}.eicon-container:hover .edit-icon{background-color:#c9d2ff!important;cursor:pointer}.eicon-container:hover{border:1px solid #2163ff!important}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.clickable-img{position:relative;cursor:pointer;padding:2px;border:1px solid #dddddd;border-radius:5px}.clickable-img:hover{border:1px solid rgb(31,105,255);border-radius:5px}.clickable-img:hover div svg{background-color:#ecf3ff!important}.clickable-img:hover div{background-color:#ecf3ff!important}.dropdown-menu{left:unset!important;right:300%;top:12.5px;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 4px 8px #0000001a}.dropdown .dropdown-menu{display:block}.dropdown-menu .btn{display:block;padding:10px;width:100%;text-align:left;background:transparent;border:none;cursor:pointer}[dir=rtl] .search{margin-left:7px}[dir=rtl] .noOfRec{gap:4px}[dir=rtl] .sticky-column{position:sticky;right:0;z-index:11;background:var(--header-bg)}[dir=rtl] .actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;left:0;background:var(--header-bg)}[dir=rtl] .sort-indicators{padding-right:5px}[dir=rtl] .resize-handle{left:0!important;right:unset!important}::ng-deep [dir=rtl] nxt-pagination .dropdown-arrow{left:5px;right:unset!important}::ng-deep [dir=rtl] nxt-button .dropdown-menu{right:unset!important;left:0!important}[dir=rtl] .dropdown-menu{left:300%!important;right:unset!important}[dir=rtl] .fc-btn-text{padding-right:10px}.selected-cell{border-left:2px solid #2196F3!important;border-right:2px solid #2196F3!important;position:relative;z-index:1}.selected-column{position:relative;border:2px solid #2196F3!important;border-bottom:none!important;border-radius:4px}.close-column-btn{position:absolute;top:3px;right:5px;width:12px;height:12px;border:solid black .5px;color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;cursor:pointer;z-index:2}.close-column-btn:hover{background:#f32121!important;border:solid #f32121 .5px!important;color:#fff!important}.table-row:last-child .selected-cell{border-bottom:2px solid #2196F3!important}.hover-content{position:absolute;z-index:1;background:#fff;border:1px solid #ccc;box-shadow:0 2px 5px #00000026;padding:10px;min-width:200px;border-radius:5px;top:70%;left:0;cursor:pointer}.expense-file{text-decoration:none;transition:text-decoration .2s ease-in-out;cursor:pointer}.expense-file:hover{text-decoration:underline;color:#0056b3;cursor:pointer}.popover-container .hover-content{display:none;position:absolute;cursor:pointer}.popover-container:hover .hover-content{display:block;cursor:pointer}.summary-row{font-weight:700}.non-summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px white!important}.summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px var(--border-color)!important;border-top:solid 1.5px var(--border-color)!important}.horizontal-summary-table-cell{display:table-cell;box-sizing:border-box;overflow:visible;white-space:nowrap;padding:12px;text-overflow:ellipsis;position:relative;color:var(--text-color);border:solid 1px white!important;border-top:solid 1px var(--border-color)!important;border-bottom:1px solid var(--border-color)!important}.last-cell{border-right:1px solid var(--border-color)!important}.table-last-cell{border-bottom:1px solid var(--border-color)!important}.skeleton-loader{display:table;width:100%;border-collapse:collapse}.skeleton-row{display:table-row;border-bottom:1px solid var(--border-color)}.skeleton-cell{display:table-cell;padding:12px;height:35px;background:#fff;position:relative}.skeleton-cell:before{content:\"\";position:absolute;inset:3px;background:linear-gradient(90deg,#f5f5f5 25%,#eaeaea,#f5f5f5 75%);background-size:200% 100%;animation:pulse 1.5s infinite linear;border-radius:4px}.skeleton-cell.sticky-column{position:sticky;left:0;z-index:11;background:#f5f5f5}.skeleton-cell.actionCol.sticky-column{position:sticky;right:0;left:auto;background:#f5f5f5}@keyframes pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-cell.file-cell{width:inherit!important;position:absolute!important;top:1px!important;height:30px!important;transition:all .2s!important}.form-builder-table-box{height:108px;display:flex;justify-content:center;align-items:center;border:1px dashed #a8a1a1}.no-data{display:flex;align-items:anchor-center;height:60px;justify-content:center}.custom-line{width:100%;border:1px solid #a8a1a1}.hyperlink-input{color:inherit;text-decoration:none;cursor:default}.hyperlink-input:hover{color:#00f!important;text-decoration:underline!important;cursor:pointer}.edit-icon-hide{display:none;cursor:pointer}.table-layout:hover .edit-icon-hide{display:block}.modal-footer{padding:0!important}\n"] }]
|
|
51959
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"table-layout\" [id]=\"tableId\" [ngStyle]=\"{'padding-top': '1px', 'width': tableWidth}\" [attr.dir]=\"direction\" [dir]=\"direction\">\n <div>\n <div *ngIf=\"title\" class=\"d-flex justify-content-center table-title align-text-center\">\n {{title}}\n </div>\n <div *ngIf=\"isNosIndicator || searchBar || isButtons\" class=\"flex justify-content-between\" style=\"padding-right: 6px;\" \n [style.padding-bottom]=\" id && (isListViews !== false && isListViews !== 'false') && from !== 'formBuilder' ? '0px' : '5px' \">\n <div class=\"flex\">\n <!-- SKS26APR25 List View Filter -->\n <app-list-view-filter *ngIf=\"id && isListViews !== false && isListViews !== 'false' && from != 'formBuilder'\" [listViews]=\"listViews\"\n [selectedView]=\"selectedView\" [displayedColumns]='columns' [tableFilterArray]=\"tableFilterArray\" [tableData]=\"tableFilterData\"\n (listViewEmit)=\"listViewEmit($event)\">\n </app-list-view-filter>\n <div *ngIf=\"(!id || isListViews === false || isListViews === 'false' || from === 'formBuilder' || from === 'questionBook') && isNosIndicator\" class=\"noOfRec\"\n style=\"display: flex; align-items: flex-end;\">\n <p style=\"font-weight: 500; margin-right: 5px; margin-bottom: 0px;\">\n {{ 'NOS' | nxtCustomTranslate : 'Nos'}} </p>\n <div style=\"color: rgb(43, 87, 249);\">{{totalRecords || totalCount}}</div>\n </div>\n </div>\n\n <div class=\"flex\" style=\"align-items: center;\">\n <div *ngIf=\"searchBar\" class=\"search\">\n <div class=\"flex search-bar\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\" stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n </svg>\n <input type=\"text\" placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\" style=\"font-size: 13px;\"\n (keyup)=\"searchConfigs ? emptySearch($event.target.value) : applyFilter($event.target.value)\"\n [value]=\"searchBoxValue || ''\" #input>\n <svg *ngIf=\"searchConfigs && searchBar\" class=\"configSearch\" (click)=\"onSearch(input.value)\"\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14 5H20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14 8H17\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21 11.5C21 16.75 16.75 21 11.5 21C6.25 21 2 16.75 2 11.5C2 6.25 6.25 2 11.5 2\"\n stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M22 22L20 20\" stroke=\"#ffffff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"flex\" *ngIf=\"isButtons\" style=\"padding-left: 7px;\">\n <div class=\"flex\" *ngFor=\"let button of buttonArray\">\n <nxt-button class=\"data-table-fsbtn\"\n (buttonClickEmit)=\"(button.type === 'group' || button.type === 'dropdown') ? commonButtonClick($event) : commonButtonClick(button)\"\n [buttonType]=\"button.class\"\n [buttonValue]=\"button.labelPath || button.label || button.name | nxtCustomTranslate : button.label || button.name \"\n [buttonConfig]=\"button.buttonConfig\" [type]=\"button.type\" class=\"ms-2 me-2\"\n [btnIconLeftSrc]=\"button.btnIconLeftSrc\" [isImageSvg]=\"button.isImageSvg\">\n </nxt-button>\n </div>\n </div>\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"question && from === 'questionBook' && mode === 'view'\" (click)=\"editModeChange()\" class=\"eicon-container edit-icon-hide\"\n matTooltip=\"{{ 'EDIT_TABLE' | nxtCustomTranslate : 'Edit Table' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"discardChanges()\"\n matTooltip=\"{{ 'DISCARD' | nxtCustomTranslate : 'Discard' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.05555 4.00883L5.94 5.12438L4.82445 4.00883C4.57861 3.76299 4.18191 3.76299 3.93607 4.00883C3.69023 4.25467 3.69023 4.65137 3.93607 4.89721L5.05162 6.01276L3.93607 7.12831C3.69023 7.37415 3.69023 7.77085 3.93607 8.01669C4.18191 8.26253 4.57861 8.26253 4.82445 8.01669L5.94 6.90114L7.05555 8.01669C7.30139 8.26253 7.69809 8.26253 7.94393 8.01669C8.18977 7.77085 8.18977 7.37415 7.94393 7.12831L6.82838 6.01276L7.94393 4.89721C8.18977 4.65137 8.18977 4.25467 7.94393 4.00883C7.69809 3.77285 7.30021 3.77285 7.05555 4.00883ZM5.94 0.0820312C2.70017 0.0820312 0.0808594 2.70134 0.0808594 5.94118C0.0808594 9.18101 2.70017 11.8003 5.94 11.8003C9.17983 11.8003 11.7991 9.18101 11.7991 5.94118C11.7991 2.70134 9.17983 0.0820312 5.94 0.0820312ZM5.94 10.6367C3.35426 10.6367 1.24422 8.52667 1.24422 5.94118C1.24422 3.35553 3.35426 1.24549 5.94 1.24549C8.52558 1.24549 10.6356 3.35553 10.6356 5.94118C10.6356 8.52667 8.52558 10.6367 5.94 10.6367Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n <div *ngIf=\"question && from !== 'formBuilder' && mode === 'edit' && viewEdit\" class=\"eicon-container\" (click)=\"saveTable()\"\n matTooltip=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.9502 0.5C8.96006 0.500106 11.4004 2.94031 11.4004 5.9502C11.4003 8.95999 8.95999 11.4003 5.9502 11.4004C2.94031 11.4004 0.500106 8.96006 0.5 5.9502C0.5 2.94024 2.94024 0.5 5.9502 0.5Z\"\n stroke=\"#B0ADAB\" />\n <path\n d=\"M8.88111 3.84583C8.83269 3.7972 8.77513 3.7586 8.71176 3.73227C8.64838 3.70594 8.58043 3.69238 8.5118 3.69238C8.44317 3.69238 8.37521 3.70594 8.31184 3.73227C8.24846 3.7586 8.19091 3.7972 8.14249 3.84583L4.8269 7.16347L3.35253 5.6891C3.30403 5.6406 3.24646 5.60213 3.18309 5.57588C3.11972 5.54964 3.05181 5.53613 2.98322 5.53613C2.91463 5.53613 2.84672 5.54964 2.78335 5.57588C2.71999 5.60213 2.66241 5.6406 2.61391 5.6891C2.56541 5.7376 2.52694 5.79518 2.50069 5.85854C2.47445 5.92191 2.46094 5.98982 2.46094 6.05841C2.46094 6.127 2.47445 6.19491 2.50069 6.25828C2.52694 6.32165 2.56541 6.37922 2.61391 6.42772L4.45677 8.27058C4.50519 8.31922 4.56274 8.35781 4.62612 8.38414C4.6895 8.41047 4.75745 8.42403 4.82608 8.42403C4.89471 8.42403 4.96266 8.41047 5.02604 8.38414C5.08942 8.35781 5.14697 8.31922 5.19539 8.27058L8.88111 4.58445C8.92974 4.53603 8.96834 4.47848 8.99467 4.4151C9.021 4.35173 9.03456 4.28377 9.03456 4.21514C9.03456 4.14651 9.021 4.07856 8.99467 4.01518C8.96834 3.9518 8.92974 3.89425 8.88111 3.84583Z\"\n fill=\"#B0ADAB\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"table-margin\">\n <div class=\"table-container\"\n [ngClass]=\"{ 'resizing': isResizing }\"\n [ngStyle]=\"{ maxHeight: isPagination ? '450px' : 'auto', minHeight: dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook' ? '0px' : searchFilter ? '233px' : '100px' }\"\n #tableContainer (scroll)=\"onScroll(tableContainer)\">\n <ng-container>\n <div class=\"custom-table\" [ngStyle]=\"{ minHeight: searchFilter ? '233px' : '' }\">\n <!--SKS15FEB25 Table Header -->\n <div class=\"table-header\" [ngClass]=\"{ 'shadow': isScrolled }\">\n <div class=\"table-row\">\n <!--SKS15FEB25 Checkbox Column -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-cell sticky-column head-color\" [style.width]=\"'50px'\">\n <input type=\"checkbox\" (click)=\"$event.stopPropagation()\" (change)=\"masterToggle()\"\n [checked]=\"selection?.hasValue()\"\n [indeterminate]=\"selection?.hasValue() && !isAllSelected()\"\n class=\"custom-checkbox\">\n </div>\n\n <!--SKS15FEB25 Data Columns -->\n <ng-container *ngFor=\"let column of currentColumns; let i = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-cell tableHeader head-color\"\n [class.sticky-column]=\"i === (stickyCondition - 1)\"\n [class.active-column]=\"activeColumn === column.uniqueIdentifier\"\n [class.selected-column]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(column.uniqueIdentifier); column.sort ? sortData(column.fieldName) : ''\"\n (mouseenter)=\"hoveredColumn = column.fieldName\" (mouseleave)=\"hoveredColumn = null\"\n [style.backgroundColor]=\"column?.style?.fillColor || 'transparent'\"\n [style.color]=\"column?.style?.color\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <div class=\"columnDiv\">\n <div class=\"column-header\" [style.width]=\"column.width || '50px'\">\n <!-- Add close button for selected column -->\n <div *ngIf=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier && !isPreview\"\n class=\"close-column-btn\"\n (click)=\"$event.stopPropagation(); removeCol(column.uniqueIdentifier)\">\n \u2715\n </div>\n <div class=\"ellipsis\" style=\"flex: 1;\" [title]=\"column.label\">\n @if(column.labelPath){\n {{ column.labelPath | nxtCustomTranslate : column.label }}\n }\n @else if(from !== 'formBuilder' || from !== 'questionBook') {\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n } \n @else if(column.uniqueIdentifier) {\n @if( ((column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label) !== column.uniqueIdentifier+'.label'){\n {{ (column.uniqueIdentifier+'.label') | nxtCustomTranslate : column.label }}\n }\n }\n @else {\n {{ column.label }}\n }\n </div>\n <div>\n <svg *ngIf=\"column.filter\"\n (click)=\"$event.stopPropagation(); filter(column.fieldName)\"\n style=\"padding-right: 2px;\" width=\"12\" height=\"11\"\n viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M10.75 1.25H0.75L4.75 5.71722V8.80556L6.75 9.75V5.71722L10.75 1.25Z\"\n stroke=\"#242533\" stroke-width=\"1.2\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <!--SKS15FEB25 Red dot for active filter -->\n <circle\n *ngIf=\"filterDataArray && filterDataArray[column.fieldName]?.length > 0\"\n cx=\"9\" cy=\"2\" r=\"2.5\" fill=\"red\"></circle>\n </svg>\n <div *ngIf=\"column.sort\"\n class=\"sort-indicators\">\n <span *ngIf=\"currentSortColumn === column.fieldName\" class=\"sort-direction\">\n {{ currentSortDirection === 'asc' ? '\u2191' : currentSortDirection\n === 'desc' ? '\u2193' : '' }}\n </span>\n <span\n *ngIf=\"hoveredColumn === column.fieldName && currentSortColumn !== column.fieldName\"\n class=\"sort-direction\">\n \u2191\n </span>\n </div>\n <div *ngIf=\"searchFilter && column.fieldName === selectedFilter\"\n class=\"search-component position-absolute\"\n (click)=\"$event.stopPropagation();\">\n <div class=\"card\">\n <div class=\"content\">\n <div class=\"flex\">\n <div class=\"fsearch\" [class.resized]=\"isResized\">\n <div class=\"fsearch-bar\">\n <svg class=\"searchSvg\" width=\"18\" height=\"20\"\n viewBox=\"0 0 24 22\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.6413 19.25C16.6322 19.25 20.6781 15.3511 20.6781 10.5417C20.6781 5.73218 16.6322 1.83333 11.6413 1.83333C6.6504 1.83333 2.60449 5.73218 2.60449 10.5417C2.60449 15.3511 6.6504 19.25 11.6413 19.25Z\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M21.6295 20.1667L19.7271 18.3333\"\n stroke=\"#787486\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n <input class=\"width-100\" type=\"text\"\n placeholder=\"{{ 'SEARCH' | nxtCustomTranslate : 'Search' }}\"\n [(ngModel)]=\"searchText\"\n class=\"searchinput\">\n </div>\n </div>\n <svg *ngIf=\"isResized\" (click)=\"closefilter()\"\n class=\"close-icon\" width=\"24\" height=\"24\"\n viewBox=\"0 0 24 24\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9.16998 14.83L14.83 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M14.83 14.83L9.16998 9.17001\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z\"\n stroke=\"currentColor\" stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <div class=\"filter-content\" [style]=\"'overflow-y: auto'\">\n <div *ngFor=\"let data of filterArray | searchFilter : searchText\">\n <div class=\"mt-3 mb-3 checkboxdiv\"\n style=\"gap: 5px;\">\n <input type=\"checkbox\"\n [checked]=\"isSelected(data)\" [value]=\"data\"\n [id]=\"data\" (change)=\"checkedData(data)\">\n <div class=\"ms-2 label-data\">{{data}}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Enhanced resize handle -->\n <div class=\"resize-handle\" \n [attr.resize-data-column-id]=\"column.uniqueIdentifier\"\n (mousedown)=\"onResizeStart($event)\"\n title=\"Drag to resize column\">\n </div>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Column -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\"\n class=\"table-cell head-color actionCol sticky-column\"\n [style.width]=\"'150px'\"\n style=\"padding: 12px !important;\">\n <div style=\"display: flex; align-items: center; justify-content: center;\">\n {{ actionColumHeader | nxtCustomTranslate : 'Action'}}\n </div>\n </div>\n </div>\n </div>\n\n <!--SKS15FEB25 Table Body -->\n <div class=\"table-body\" *ngIf=\"!isLoading\">\n <div *ngFor=\"let element of dataSource.data; let i = index; trackBy: trackByRow\" class=\"table-row\"\n (click)=\"tableClick(element)\">\n <!--SKS15FEB25 Checkbox Cell -->\n <div *ngIf=\"withCheckBox && mode === 'edit'\" class=\"table-col-cell sticky-column body-color\">\n <input type=\"checkbox\" class=\"custom-checkbox\" (click)=\"$event.stopPropagation()\"\n (change)=\"separateRowSelect(selection?.toggle(element), element)\"\n [checked]=\"selection?.isSelected(element)\"\n [disabled]=\"(element.isPayProcessed === true)\">\n </div>\n\n <!--SKS15FEB25 Data Cells -->\n <ng-container *ngFor=\"let column of currentColumns; let last = last; let c = index; trackBy: trackByColumn\">\n <div *ngIf=\"column.summaryRow !== true && column.isHide !== true\"\n class=\"table-col-cell body-color ellipsis\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === column.uniqueIdentifier\"\n [style.width]=\"(column.width || '50px')\"\n [style.overflow]=\"element?.editRow ? 'unset' : ''\"\n [attr.data-column-id]=\"column.uniqueIdentifier\">\n <ng-container *ngIf=\"element?.editRow && mode === 'edit'; else viewMode\">\n <!-- edit mode content -->\n <div [ngSwitch]=\"column.type\">\n <!-- SKS22JUL25 calendar -->\n <div *ngSwitchCase=\"'calendar'\">\n <!-- <app-custom-calendar [question]=\"column | questionByRow:element:i\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model> -->\n </div>\n <!-- SKS22JUL25 Image -->\n <div *ngSwitchCase=\"'image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <!-- <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageEdit(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!column.question?.isReadOnly\" (click)=\"onImageDelete(column.question)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div> -->\n <img *ngIf=\"column.question?.isReadOnly\" [src]=\"column.question?.imageData\" />\n <!-- <div *ngIf=\"!column.question?.isReadOnly\" class=\"logo-container\">\n Logo preview area\n <div class=\"logo-preview\" *ngIf=\"column.question?.input\">\n <img [src]=\"column.question?.imageData\" />\n </div>\n\n Upload button\n <div *ngIf=\"!column.question?.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(column.question, $event)\" style=\"display: none;\" />\n </div>\n </div> -->\n </div>\n <!-- SKS22JUL25 icon-selector -->\n <nxt-icon-selector *ngSwitchCase=\"'icon'\" [allIcons]=\"allIcons\" [required]=\"column.question?.isOptional\" [mode]=\"mode\" [question]=\"column | questionByRow:element:i\" [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column?.question?.id+'.questionText') | nxtCustomTranslate : column?.question?.questionText) : ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\" [labelWeight]=\"column.question?.fontWeight\" [showLabel]=\"column.question?.style?.showLabel\" (iconSelected)=\"updateEdit(i,$event,element,column.fieldName)\">\n </nxt-icon-selector>\n <!-- SKS22JUL25 line -->\n <hr *ngSwitchCase=\"'line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS22JUL25 data table -->\n <nxt-datatable *ngSwitchCase=\"'table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"column | questionByRow:element:i\" from=\"formBuilder\"\n (valueChange)=\"updateEdit(i,$event.data,element,column.fieldName)\" [apiMeta]=\"column.question?.subText\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [tableConfig]=\"column.question?.tableConfig\" tableId=\"\" direction=\"ltr\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- SKS22JUL25 list -->\n <nxt-search-box *ngSwitchCase=\"'list'\" [question]=\"column | questionByRow:element:i\" [readOnly]=\"column.question?.isReadOnly\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [placeHolderText]=\"column.question?.question || ''\" [value]=\"element | getValue: column.fieldName\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view': element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (searchValueChange)=\"updateEdit(i,$event.value,element,column.fieldName,column.type)\">\n </nxt-search-box>\n <!-- SKS22JUL25 Dropdown -->\n <app-custom-dropdown *ngSwitchCase=\"'dropdown'\" [options]=\"column.question?.options\" [apiMeta]=\"column.question?.subText\"\n [id]=\"column.question?.id\" [selectedValue]=\"element | getValue: column.fieldName\"\n placeholder=\"\"\n [errorMessage]=\"column.question?.errorMessage\" [referenceField]=\"column.question?.referenceField\"\n [readOnly]=\"column.question?.isReadOnly\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-dropdown>\n <!-- SKS22JUL25 custom-radio component -->\n <app-custom-radio *ngSwitchCase=\"'radio'\" [options]=\"column.question?.options\" [question]=\"column | questionByRow:element:i\" [apiMeta]=\"column.question?.subText\" [id]=\"column.question?.id\"\n [selectedValue]=\"element | getValue: column.fieldName \" [errorMessage]=\"column.question?.errorMessage\"\n [referenceField]=\"column.question?.referenceField\" [readOnly]=\"column.question?.isReadOnly\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n (valueChange)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\">\n </app-custom-radio>\n <!-- SKS22JUL25 Attachment / Files -->\n <nxt-file-upload *ngSwitchCase=\"'file'\" [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"column.question?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n <!-- SKS22JUL25 Button -->\n <nxt-button *ngSwitchCase=\"'button'\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"column.question?.question\"\n (buttonClickEmit)=\"updateEdit(i,$event,element,column.fieldName)\"\n >\n </nxt-button>\n <!-- SKS22JUL25 book type -->\n <div *ngSwitchCase=\"'book'\">\n <!-- <lib-questionbook *ngIf=\"column.type === 'book'\" [qbItem]=\"column.question?.qbItem\"\n [questions]=\"readQuestions(column.question?.qbReference, column.question?.qbReferenceQuestions)\"\n (handleDropDown)=\"getDropDown($event)\">\n </lib-questionbook> -->\n </div>\n <!-- SKS10AUG25 object type element -->\n <div *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </div>\n <!-- SKS22JUL25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngSwitchDefault \n [type]=\"column.type === 'boolean' ? 'checkbox' : column.type === 'richtextarea' ? 'richtext' : column.type === undefined ? 'text' : column.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"element | getValue: column.fieldName \"\n [question]=\"column | questionByRow:element:i\"\n [labelFont]=\"column.question?.font\"\n [label]=\"column.question?.questionText ? ((column.question?.id+'.questionText') | nxtCustomTranslate : column.question?.questionText): ''\"\n [labelColor]=\"column.question?.color\"\n [labelSize]=\"column.question?.fontSize\"\n [inputValueSize]=\"column.question?.fontSize\"\n [labelWeight]=\"column.question?.fontWeight\"\n [inputWeight]=\"column.question?.fontWeight\"\n [showLabel]=\"column.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"column.question?.question\"\n [required]=\"column.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"column.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"column.question?.iconLeftSrc\" \n [minDate]=\"column.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-input>\n </div>\n </ng-container>\n \n <ng-template #viewMode>\n <!-- SKS10AUG25 view mode content -->\n <ng-container [ngSwitch]=\"column.type\">\n <ng-container *ngSwitchCase=\"'file'\">\n @defer (on viewport) {\n <nxt-file-upload [question]=\"column | questionByRow:element:i\"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? element?.editRow && !column.question?.isReadOnly ? 'edit' : 'view' : element?.editRow && (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [allFiles]=\"(column | questionByRow:element:i)?.input\" (selectedFileData)=\"updateEdit(i,$event.value.valueObj,element,column.fieldName)\"\n >\n </nxt-file-upload>\n } @placeholder {\n <span class=\"skeleton-cell file-cell\"></span>\n }\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <svg class=\"ms-2\" style=\"cursor: pointer;\" (click)=\"onSideNavInfoClick(element, column)\"\n width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M6.00033 11.8334C2.77866 11.8334 0.166992 9.22171 0.166992 6.00008C0.166992 2.77842 2.77866 0.166748 6.00033 0.166748C9.22196 0.166748 11.8337 2.77842 11.8337 6.00008C11.8337 9.22171 9.22196 11.8334 6.00033 11.8334ZM5.41699 5.41675V8.91675H6.58366V5.41675H5.41699ZM5.41699 3.08341V4.25008H6.58366V3.08341H5.41699Z\"\n fill=\"#434555\" fill-opacity=\"0.5\" />\n </svg>\n </ng-container>\n <ng-container *ngSwitchCase=\"'boolean'\">\n <span *ngIf=\"(element | getValue: column.fieldName) === true || (element | getValue: column.fieldName) === 'true'\">\u2714</span>\n <span *ngIf=\"(element | getValue: column.fieldName) !== true && (element | getValue: column.fieldName) !== 'true'\">\u2718</span> \n </ng-container>\n <ng-container *ngSwitchCase=\"'list'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName: 'list': column }}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'date'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{(element | getValue: column.fieldName) | NxtDate : column.type : languageCode : column.calendarType}}</a></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'currency'\">\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{currencyOption?.symbol}}{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ellipsis view-mode-text\"> <a [ngClass]=\"{'hyperlink-input': column.hyperLink}\" (click)=\"column.hyperLink ? onClickHyperlink(column.fieldName,element, column.hyperLink) : ''\">{{element | getValue: column.fieldName}}</a></div>\n </ng-container>\n </ng-container>\n </ng-template>\n </div>\n </ng-container>\n\n <!--SKS15FEB25 Action Buttons -->\n <div *ngIf=\"(actionButton || isDeleteRow || isEditRow) && mode === 'edit'\" class=\"table-col-cell actionCol\">\n <div class=\"actionButton\" style=\"display: flex; align-items: center; justify-content: center;\">\n\n <!--SKS15FEB25 Edit Button -->\n <div *ngIf=\"isEditRow\" class=\"eicon-container\" (click)=\"onEdit(element)\"\n matTooltip=\"{{ 'EDIT_RECORD' | nxtCustomTranslate : 'Edit Record' }}\"\n style=\"padding: 2px; border: 1px solid #dcdcdc; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\" edit-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #f5f5f5;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n </div>\n </div>\n\n\n <!--SKS15FEB25 Delete Button -->\n <div *ngIf=\"isDeleteRow\" class=\"dicon-container\"\n [matTooltip]=\"'DELETE_RECORD' | nxtCustomTranslate : 'Delete Record'\" (click)=\"deleteRecord(element,i)\"\n style=\"padding: 2px; border: 1px solid #ffb5b5; border-radius: 5px; margin-left: 3px; margin-right: 3px;\">\n <div class=\"delete-icon\"\n style=\"padding: 2px 2px; border-radius: 5px; background-color: #feeeed;\">\n <svg width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\"\n stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <!--SKS15FEB25 Render inline buttons up to Size -->\n <div *ngFor=\"let button of actionButtonArray?.buttonArray; let i = index\">\n <div *ngIf=\"i < actionButtonArray?.size\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div *ngIf=\"isConditionMet(element, button.conditions)\"\n [matTooltip]=\"button.tooltipPath || button.tooltip | nxtCustomTranslate : button.tooltip \"\n (click)=\"actionButtonClicked(button,element)\"\n (mouseenter)=\"$event.target.style.border = '1px solid ' + button.hoverBorderColor\"\n (mouseleave)=\"$event.target.style.border = '1px solid ' + button.borderColor\"\n style=\"padding: 2px; border-radius: {{button.borderRadius}}px; border: 1px solid {{button.borderColor}}; cursor: pointer;\">\n <div (mouseenter)=\"$event.target.style.backgroundColor = button.hoverBackgroundColor\"\n (mouseleave)=\"$event.target.style.backgroundColor = button.backgroundColor\"\n style=\"padding: {{button.padding}}px {{button.padding + 2}}px; border-radius: {{button.borderRadius}}px; background-color: {{button.backgroundColor}}; cursor: pointer\">\n <img *ngIf=\"button.iconSrc\" #imgElement [src]=\"button.iconSrc\" style=\"cursor: pointer\"\n (mouseenter)=\"imgElement.src = button.hoverIconSrc || button.iconSrc\"\n (mouseleave)=\"imgElement.src = button.iconSrc\">\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"dropdownActionButton && dropdownActionButton.length > 0\"\n class=\"dropdown\">\n <div class=\"clickable-img\" (click)=\"toggleDropdown(i)\"\n style=\" margin-left: 3px; margin-right: 3px;\">\n <div style=\"background-color: #f5f5f5; padding: 2px 2px; border-radius: 5px;\">\n <svg style=\"background-color: #f5f5f5; border-radius: 5px; border: 1px solid #6c757d;\"\n width=\"16\" height=\"16\" viewBox=\"0 0 40 40\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.9999 25.6667C23.6818 25.6667 26.6666 22.6819 26.6666 19C26.6666 15.3181 23.6818 12.3334 19.9999 12.3334C16.318 12.3334 13.3333 15.3181 13.3333 19C13.3333 22.6819 16.318 25.6667 19.9999 25.6667Z\"\n fill=\"#292D32\" stroke=\"#292D32\" stroke-width=\"1.5\"\n stroke-miterlimit=\"10\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M17.6467 18.16L20.0001 20.5067L22.3534 18.16\"\n stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n </div>\n\n <div class=\"dropdown-menu\"\n [style.right]=\"((actionButtonArray?.size ?? 0) - (actionButtonArray?.buttonArray?.size ?? 0) + (isEditRow ? 1 : 0) + (isDeleteRow ? 1 : 0) + (dropdownActionButton?.length > 0 ? 1 : 0)) * 100 + '%'\"\n *ngIf=\"currentOpenIndex === i\">\n <div *ngFor=\"let btn of dropdownActionButton\">\n <button *ngIf=\"isConditionMet(element, btn.conditions)\"\n [attr.data-id]=\"element.id\" style=\"display: flex;\" type=\"button\"\n class=\"btn btn-icon {{btn.buttonType}} tooltip-container\"\n [matTooltip]=\"btn.tooltipPath || btn.tooltip | nxtCustomTranslate : btn.tooltip\"\n [disabled]=\"btn.buttonDisable\"\n (click)=\"actionButtonClicked(btn,element)\">\n <img *ngIf=\"btn.iconSrc\" [src]=\"btn.iconSrc\">\n <div class=\"fc-btn-text\" style=\"padding-left: 10px;\">\n {{btn.name}}</div>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- SKS20MAR25 Summary Rows -->\n <ng-container\n *ngIf=\"summaryRowsOrginal && summaryRowsOrginal.length > 0 && dataSource.data && dataSource?.data?.length > 0 && !isLoading\">\n <ng-container *ngIf=\"!isFullTableSummaryRow && isSummaryColumn\">\n <div *ngFor=\"let row of summaryRowsOrginal\" class=\"table-row summary-row\">\n <!-- Label in the first column -->\n <div *ngIf=\"withCheckBox\" class=\"non-summary-table-cell\"></div>\n <!-- Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryStartColumn; let last = last\"\n class=\"non-summary-table-cell\" [class.last-cell]=\"last\">\n </div> <!-- Value or input in the last column -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\"\n (click)=\"$event.stopPropagation(); onColumnClick(row.uniqueIdentifier)\">{{ (row.id+'.label') | nxtCustomTranslate : row?.label }}\n </div>\n <!-- SKS12SEP25 summary column input box -->\n <div class=\"summary-table-cell\"\n [class.selected-cell]=\"mode === 'edit' && isEditable && selectedColumn === row.uniqueIdentifier\">\n <ng-container>\n <nxt-input\n [type]=\"row.type === 'boolean' ? 'checkbox' : row.type === 'richtextarea' ? 'richtext' : row.type === undefined ? 'text' : row.type \"\n [mode]=\"(from === 'formBuilder' || from === 'questionBook') ? !row.question?.isReadOnly ? 'edit' : 'view' : (isEditRow || addInlineRecord) ? 'edit' : 'view'\" [from]=\"'nxtTable'\"\n [value]=\"summaryValues[row.fieldName]\"\n [question]=\"row\"\n [labelFont]=\"row.question?.font\"\n [label]=\"row.question?.questionText ? ((row.question?.id+'.questionText') | nxtCustomTranslate : row.question?.questionText): ''\"\n [labelColor]=\"row.question?.color\"\n [labelSize]=\"row.question?.fontSize\"\n [inputValueSize]=\"row.question?.fontSize\"\n [labelWeight]=\"row.question?.fontWeight\"\n [inputWeight]=\"row.question?.fontWeight\"\n [showLabel]=\"row.question?.style?.showLabel\"\n inputBorder=\"none\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"row.question?.question\"\n [required]=\"row.question?.isOptional\" inputBgColor=\"#FAFAFA\"\n [inputId]=\"row.question?.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"row.question?.iconLeftSrc\" \n [minDate]=\"row.question?.minDate\"\n [rows]=\"3\" [currency]=\"currencyOption?.code\"\n (inputValue)=\" summaryValues[row.fieldName] = $event.value.valueObj ; onSummaryInputChange()\"\n >\n </nxt-input>\n </ng-container>\n </div>\n <!-- SKS20MAR25 Empty cells to align with data columns -->\n <div *ngFor=\"let col of isSummaryEndColumn; let last = last\"\n class=\"non-summary-table-cell\">\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"non-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n <!-- SKS13JUN25 full table summary row -->\n <ng-container *ngIf=\"isFullTableSummaryRow\">\n <div *ngFor=\"let row of summaryRowsOrginal; let i = index; trackBy: trackBySummary\" class=\"table-row summary-row\">\n <!-- SKS13JUN25 Checkbox column (if enabled) -->\n <div *ngIf=\"withCheckBox\" class=\"horizontal-summary-table-cell\">\n {{ row.labelPath || row.label | nxtCustomTranslate : row.label }}\n </div>\n\n <!-- SKS13JUN25 summary cell -->\n <div *ngFor=\"let col of currentColumns; let last = last; let i = index; trackBy: trackByColumn \"\n class=\"horizontal-summary-table-cell\" style=\"text-align: left;\">\n @if (row?.columns?.includes(col.fieldName)) {\n {{ summaryValues[col.fieldName] | number }}\n }\n </div>\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\"\n class=\"horizontal-summary-table-cell actionCol sticky-column\">\n </div>\n </div>\n </ng-container>\n </ng-container>\n <!--SKS28MAR25 In the Loading section -->\n <div class=\"table-body\" *ngIf=\"isLoading\">\n <!-- Repeat for 5 skeleton rows -->\n <div *ngFor=\"let _ of [1,2,3,4,5]; trackBy: trackByIndex\" class=\"table-row\">\n <!-- Checkbox Column -->\n <div *ngIf=\"withCheckBox\" class=\"skeleton-cell sticky-column\"></div>\n\n <!-- Data Columns -->\n <div *ngFor=\"let col of currentColumns; let i = index; trackBy: trackByColumn\" class=\"skeleton-cell \"></div>\n\n <!-- Action Column -->\n <div *ngIf=\"actionButton || isDeleteRow || isEditRow\" class=\"skeleton-cell actionCol\">\n </div>\n </div>\n </div>\n <!-- <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from === 'formBuilder'\" class=\"form-builder-table-box\">\n Add / drags fields from elements sections\n </div> -->\n </div>\n </ng-container>\n </div>\n <!--SKS15FEB25 No Data Row -->\n <div *ngIf=\"dataSource.data && dataSource?.data?.length === 0 && !isLoading && from !== 'formBuilder' && from !== 'questionBook'\"\n class=\"no-data\">\n {{'NO_RECORDS_OR_DATA_FOUND' | nxtCustomTranslate : 'No records/data found.'}}\n </div>\n <!--SKS15FEB25 Pagination -->\n <div [class.shadow-hidden]=\"isShadowHidden\">\n <!-- table input save button changes -->\n <div *ngIf=\"mode === 'edit'\" class=\"d-flex inlineAdd justify-content-end\">\n <div class=\"flex addIconBor cursor-pointer\" *ngIf=\"addInlineRecord \"\n (click)=\"addTableRecord(inlineElement)\"\n matTooltip=\"{{ 'ADD_RECORD'| nxtCustomTranslate : 'Add Record'}}\">\n <div class=\"addIcon\">\n <svg class=\"nav-icon\" xmlns=\"http://www.w3.org/2000/svg\" height=\"24\"\n viewBox=\"0 -960 960 960\" width=\"24\">\n <path\n d=\"M440-280h80v-160h160v-80H520v-160h-80v160H280v80h160v160Zm40 200q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\" />\n </svg>\n </div>\n </div>\n <!--SKS15FEB25 removed button disable logic, added another condition for button showing-->\n <!--SKS15FEB25 SR06JAN2025 button disable logic for not select any employee-->\n <nxt-button *ngIf=\"(tableSaveButton || isEditRow || addInlineRecord) && from != 'formBuilder' && from != 'questionBook'\"\n buttonType=\"btn btn-primary\"\n (buttonClickEmit)=\"saveButton()\"\n buttonValue=\"{{ 'SAVE' | nxtCustomTranslate : 'Save' }}\"></nxt-button>\n </div>\n <nxt-pagination *ngIf=\"isPagination\" [pageSizeOptions]=\"pageSizeOptions\"\n [collectionSize]=\"pagination ? totalRecords || totalCount : filterTableNos\"\n [pageSize]=\"pageSize\" [currentPage]=\"pageIndex\" [firstLastButtons]=\"true\"\n (event)=\"pageParams($event)\">\n </nxt-pagination>\n </div>\n </div>\n </div>\n</div>\n\n<!--SKS15FEB25 alert on deleting record -->\n<div *ngIf=\"deleteModal\" class=\"modal modal-backdrop show d-block\" id=\"deleteRecord\" tabindex=\"-1\"\n aria-labelledby=\"deleteRecordLabel\" [attr.aria-hidden]=\"!deleteModal\">\n <div class=\"modal-dialog\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <b class=\"modal-title fs-5\" id=\"deleteRecordLabel\">{{ 'DELETE_RECORD'| nxtCustomTranslate : 'Delete Record'}}</b>\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"\n (click)=\"deleteModal = false\"></button>\n </div>\n <div class=\"modal-body\">\n {{ 'ARE_YOU_SURE_YOU_WANT_TO_DELETE_THE_REC'| nxtCustomTranslate : 'Are you sure you want to delete the record'}} ?\n </div>\n <div class=\"modal-footer\">\n <nxt-button\n (buttonClickEmit)=\"deleteModal = false\" \n [buttonValue]=\"'NO'| nxtCustomTranslate : 'No'\"\n [btnBgColor]=\"'#ffffff'\"\n [btnTextColor]=\"'#0773ff'\"\n [btnBorder]=\"'1'\"\n [btnBorderColor]=\"'#dee2e6'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n <nxt-button\n (buttonClickEmit)=\"deleteRecordData()\" \n [isLoading]=\"isButtonLoading\"\n [buttonValue]=\"'YES'| nxtCustomTranslate : 'Yes'\"\n [btnBorderRadius]=\"4\"\n [btnWidth]=\"70\"\n [buttonType]=\"'custom-btn'\"\n >\n </nxt-button>\n </div>\n </div>\n </div>\n</div>", styles: [".custom-table{display:table;width:100%;border-collapse:collapse;table-layout:fixed;direction:var(--direction);background:var(--body-bg)}.table-header{display:table-header-group;position:sticky;top:0;z-index:100;box-shadow:none;transition:box-shadow .3s ease-in-out;background:var(--header-bg)}.shadow{box-shadow:0 4px 5px #0001!important}.table-body{display:table-row-group}.table-row{display:table-row;min-height:40px}.table-cell,.table-col-cell{position:relative;min-width:50px;max-width:100%;padding:10px 12px;border-bottom:solid 1px var(--border-color);box-sizing:border-box;overflow:visible;white-space:nowrap;text-overflow:ellipsis;display:table-cell}.table-container.resizing{-webkit-user-select:none;user-select:none;pointer-events:none}.table-container.resizing .resize-handle{pointer-events:auto}.sticky-column{position:sticky;background:inherit;z-index:5}.sticky-column .resize-handle{z-index:15}.actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;right:0;background:var(--header-bg)}.actionCol{min-width:100px!important;width:100px!important;max-width:100px!important}.actionCol .resize-handle{display:none}.table-container{width:100%;overflow-x:auto;overflow-y:auto;border-top:1px solid #e0e0e0;scrollbar-width:none}.table-container::-webkit-scrollbar{display:none}.column-header{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0}.column-header img{cursor:pointer}.shadow-hidden{position:relative}.shadow-hidden:before{content:\"\";position:absolute;z-index:11;top:-10px;left:0;width:100%;height:10px;background:linear-gradient(to top,var(--scroll-shadow),transparent)}.resize-handle{position:absolute;right:0;top:13px;width:1px;height:20px;cursor:col-resize;background:#b1b1b1;border:3px transparent;z-index:9;transition:background-color .2s ease}.resize-handle:hover{background:#ccc;opacity:.7}.resize-handle:active{background:#ccc;opacity:.9}.columnDiv{position:relative;display:flex;align-items:center;width:100%;max-width:100%;height:100%}.search{display:flex;justify-content:space-between;border:1px solid rgba(67,69,85,.3);border-radius:7px;align-self:center;padding:3px}.search-bar{width:100%;margin:3px;justify-content:center;align-items:center}.configSearch{height:22px;padding:3px;margin:10p;background-color:#247dff;border-radius:4px}input::placeholder{color:#abafb1}.sort-indicators{display:inline-block;width:10px;padding-left:5px}.sort-direction{font-size:12px;color:var(--text-color);opacity:.7}.tableHeader{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .3s}.tableHeader:hover{background-color:var(--hover-bg)}.search-component{top:163%;background-color:#fff;box-shadow:0 2px 10px #0000001a}[dir=rtl] .search-component{left:0}.rtl .ellipsis,[dir=rtl] .ellipsis{direction:rtl;text-align:right!important}input{border:none}.card{background:#fff;box-shadow:0 2px #0a0a0a1f;border-radius:8px;border-color:#e9e9e9}.fsearch{width:100%;justify-content:space-between;font-weight:400;font-size:13px;display:flex;background:#f0f5ff;border-radius:6px;align-self:center}.content{margin:6px;width:150px}.fsearch-bar{display:flex;flex-direction:row;width:100%;margin:5px;transition:width .3s ease}.search.resized{width:calc(100% - 40px)}.filter-content{width:100%;max-height:150px;padding-left:5px}.label-data{font-weight:200;font-size:12px;color:#434555d9}input[type=checkbox]{height:16px;width:16px;border-radius:5px;margin-left:2px}input[type=checkbox]:after{width:4px;height:7px;left:5px;top:3px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:checked{--r: 43deg}.checkbox-cont{display:flex;align-items:center}.searchinput{border:none;background-color:#f0f5ff;width:85%;font-size:12px;color:#275efe;font-weight:600}.searchSvg{margin-right:3px}.close-icon{margin-left:4px;width:36px;height:32px;cursor:pointer;padding-top:9px;padding-bottom:9px;background-color:#ffefee;color:red;border-radius:4px;transition:background-color .3s ease,color .3s ease}.close-icon:hover{background-color:red;color:#fff}.checkboxdiv{display:flex;align-items:center}.checkboxdiv input{flex-shrink:0}input:focus,input:active,select:focus,select:active,textarea:focus,textarea:active,button:focus,button:active{outline:none!important}@supports (-webkit-appearance: none) or (-moz-appearance: none){input[type=checkbox]{--active: #275EFE;--active-inner: #fff;--focus: 2px rgba(39, 94, 254, .3);--border: #BBC1E1;--border-hover: #275EFE;--background: #fff;--disabled: #F6F8FF;--disabled-inner: #E1E6F9;-webkit-appearance:none;-moz-appearance:none;height:21px;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--bc, var(--border));background:var(--b, var(--background))!important;transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after{content:\"\";display:block;left:0;top:0;position:absolute;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}input[type=checkbox]:checked{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=checkbox]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=checkbox]:focus{box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.switch){width:21px}input[type=checkbox]:not(.switch):after{opacity:var(--o, 0)}input[type=checkbox]:not(.switch):checked{--o: 1}input[type=checkbox]+label{font-size:14px;line-height:21px;display:inline-block;vertical-align:top;cursor:pointer;margin-left:4px}input[type=checkbox]:not(.switch){border-radius:7px}input[type=checkbox]:not(.switch):after{width:5px;height:9px;border:2px solid var(--active-inner);border-top:0;border-left:0;left:7px;top:4px;transform:rotate(var(--r, 20deg))}input[type=checkbox]:not(.switch):checked{--r: 43deg}input[type=checkbox].switch{width:38px;border-radius:11px}input[type=checkbox].switch:after{left:2px;top:2px;border-radius:50%;width:15px;height:15px;background:var(--ab, var(--border));transform:translate(var(--x, 0))}input[type=checkbox].switch:checked{--ab: var(--active-inner);--x: 17px}input[type=checkbox].switch:disabled:not(:checked):after{opacity:.6}input[type=checkbox]:indeterminate{--b: var(--active);--bc: var(--active);--d-o: .3s;--d-t: .6s;--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}input[type=checkbox]:indeterminate:after{content:\"\";display:block;left:8px;top:5px;rotate:69deg;position:absolute;width:2px;height:9px;background:var(--active-inner);opacity:6;transition:transform var(--d-t, .3s) var(--d-t-e, ease),opacity var(--d-o, .2s)}}:host{--primary-color: #275EFE;--secondary-color: #6C757D;--text-color: #434555;--border-color: #e0e0e0;--hover-bg: #f9f9f9;--header-bg: #ffffff;--body-bg: #ffffff;--danger-color: #FF2C10;--scroll-shadow: rgba(0, 0, 0, .08);--box-shadow: 0 2px 10px rgba(0, 0, 0, .1)}:host(.dark-theme){--primary-color: #6c8dfa;--text-color: #ffffff;--header-bg: #2c2c2c;--body-bg: #1e1e1e;--border-color: #404040;--hover-bg: #373737}.hyper-link:hover{color:#00f!important;text-decoration:underline;cursor:pointer}.on-edit:hover .edit-icon{visibility:visible}.view-mode-text{border-radius:5px;color:#2c3137;font-weight:400;font-size:13px;transition:all .2s}.input-box{border:solid}.inlineAdd{align-items:center;gap:10px;padding-top:10px}.addIconBor{padding:4px;border-radius:5px;border:1px solid #6c757d;transition:background-color .3s,border-color .3s}.addIcon{padding:1px;border-radius:5px;background-color:#ddd;transition:background-color .3s}.addIconBor:hover .addIcon{background-color:#bbd3ff}::ng-deep .modal-backdrop{background-color:#000000b3!important}::ng-deep .modal-backdrop.show{opacity:1!important}.eicon-container:hover .edit-icon svg path{fill:#2163ff!important}.eicon-container:hover .edit-icon{background-color:#c9d2ff!important;cursor:pointer}.eicon-container:hover{border:1px solid #2163ff!important}.dicon-container:hover .delete-icon svg path{stroke:#fff!important;fill:transparent!important}.dicon-container:hover .delete-icon{background-color:#ff7575!important;cursor:pointer}.dicon-container:hover{border:1px solid #ff2121!important}.clickable-img{position:relative;cursor:pointer;padding:2px;border:1px solid #dddddd;border-radius:5px}.clickable-img:hover{border:1px solid rgb(31,105,255);border-radius:5px}.clickable-img:hover div svg{background-color:#ecf3ff!important}.clickable-img:hover div{background-color:#ecf3ff!important}.dropdown-menu{left:unset!important;right:300%;top:12.5px;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 4px 8px #0000001a}.dropdown .dropdown-menu{display:block}.dropdown-menu .btn{display:block;padding:10px;width:100%;text-align:left;background:transparent;border:none;cursor:pointer}[dir=rtl] .search{margin-left:7px}[dir=rtl] .noOfRec{gap:4px}[dir=rtl] .sticky-column{position:sticky;right:0;z-index:11;background:var(--header-bg)}[dir=rtl] .actionCol{position:sticky;padding:unset!important;align-items:center;z-index:11;left:0;background:var(--header-bg)}[dir=rtl] .sort-indicators{padding-right:5px}[dir=rtl] .resize-handle{left:0!important;right:unset!important}::ng-deep [dir=rtl] nxt-pagination .dropdown-arrow{left:5px;right:unset!important}::ng-deep [dir=rtl] nxt-button .dropdown-menu{right:unset!important;left:0!important}[dir=rtl] .dropdown-menu{left:300%!important;right:unset!important}[dir=rtl] .fc-btn-text{padding-right:10px}.selected-cell{border-left:2px solid #2196F3!important;border-right:2px solid #2196F3!important;position:relative;z-index:1}.selected-column{position:relative;border:2px solid #2196F3!important;border-bottom:none!important;border-radius:4px}.close-column-btn{position:absolute;top:3px;right:5px;width:12px;height:12px;border:solid black .5px;color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;cursor:pointer;z-index:2}.close-column-btn:hover{background:#f32121!important;border:solid #f32121 .5px!important;color:#fff!important}.table-row:last-child .selected-cell{border-bottom:2px solid #2196F3!important}.hover-content{position:absolute;z-index:1;background:#fff;border:1px solid #ccc;box-shadow:0 2px 5px #00000026;padding:10px;min-width:200px;border-radius:5px;top:70%;left:0;cursor:pointer}.expense-file{text-decoration:none;transition:text-decoration .2s ease-in-out;cursor:pointer}.expense-file:hover{text-decoration:underline;color:#0056b3;cursor:pointer}.popover-container .hover-content{display:none;position:absolute;cursor:pointer}.popover-container:hover .hover-content{display:block;cursor:pointer}.summary-row{font-weight:700}.non-summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px white!important}.summary-table-cell{display:table-cell;padding:12px;text-overflow:ellipsis;white-space:nowrap;position:relative;color:var(--text-color);border:solid 1px var(--border-color)!important;border-top:solid 1.5px var(--border-color)!important}.horizontal-summary-table-cell{display:table-cell;box-sizing:border-box;overflow:visible;white-space:nowrap;padding:12px;text-overflow:ellipsis;position:relative;color:var(--text-color);border:solid 1px white!important;border-top:solid 1px var(--border-color)!important;border-bottom:1px solid var(--border-color)!important}.last-cell{border-right:1px solid var(--border-color)!important}.table-last-cell{border-bottom:1px solid var(--border-color)!important}.skeleton-loader{display:table;width:100%;border-collapse:collapse}.skeleton-row{display:table-row;border-bottom:1px solid var(--border-color)}.skeleton-cell{display:table-cell;padding:12px;height:35px;background:#fff;position:relative}.skeleton-cell:before{content:\"\";position:absolute;inset:3px;background:linear-gradient(90deg,#f5f5f5 25%,#eaeaea,#f5f5f5 75%);background-size:200% 100%;animation:pulse 1.5s infinite linear;border-radius:4px}.skeleton-cell.sticky-column{position:sticky;left:0;z-index:11;background:#f5f5f5}.skeleton-cell.actionCol.sticky-column{position:sticky;right:0;left:auto;background:#f5f5f5}@keyframes pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-cell.file-cell{width:inherit!important;position:absolute!important;top:1px!important;height:30px!important;transition:all .2s!important}.form-builder-table-box{height:108px;display:flex;justify-content:center;align-items:center;border:1px dashed #a8a1a1}.no-data{display:flex;align-items:anchor-center;height:60px;justify-content:center}.custom-line{width:100%;border:1px solid #a8a1a1}.hyperlink-input{color:inherit;text-decoration:none;cursor:default}.hyperlink-input:hover{color:#00f!important;text-decoration:underline!important;cursor:pointer}.edit-icon-hide{display:none;cursor:pointer}.table-layout:hover .edit-icon-hide{display:block}.modal-footer{padding:0!important}\n"] }]
|
|
51921
51960
|
}], ctorParameters: () => [{ type: CountryService }, { type: StorageService }, { type: i0.ChangeDetectorRef }, { type: TranslationService }, { type: i0.Renderer2 }, { type: DataService }, { type: ChangeService }], propDecorators: { data: [{
|
|
51922
51961
|
type: Input
|
|
51923
51962
|
}], tableFilterData: [{
|
|
@@ -56607,13 +56646,6 @@ class QuestionbookComponent {
|
|
|
56607
56646
|
this.hideDependentElements(el.id);
|
|
56608
56647
|
});
|
|
56609
56648
|
}
|
|
56610
|
-
//AP-19MAY25 Ensure sqList is always an array by defaulting to []
|
|
56611
|
-
clearSQError(quesId) {
|
|
56612
|
-
var sqList = this.subQuestions?.filter((item) => item.id == quesId) || [];
|
|
56613
|
-
for (var sq of sqList) {
|
|
56614
|
-
sq.error = null;
|
|
56615
|
-
}
|
|
56616
|
-
}
|
|
56617
56649
|
setSubQuestions(records) {
|
|
56618
56650
|
this.subQuestions.push(records);
|
|
56619
56651
|
}
|
|
@@ -56638,20 +56670,6 @@ class QuestionbookComponent {
|
|
|
56638
56670
|
}
|
|
56639
56671
|
else if (ques.type == 'File') {
|
|
56640
56672
|
ques.input = this.selectedFileData = event?.valueObj ? event?.valueObj : null;
|
|
56641
|
-
// Handle file validation errors
|
|
56642
|
-
if (Array.isArray(event?.valueObj ? event?.valueObj : null) && event?.valueObj.length === 0) {
|
|
56643
|
-
// No files uploaded when required
|
|
56644
|
-
ques.error = ques.errorMessage ? new ErrorWrapper() : null;
|
|
56645
|
-
}
|
|
56646
|
-
else if (Array.isArray(event?.valueObj ? event?.valueObj : null) && event.length > 0) {
|
|
56647
|
-
// Files were successfully uploaded
|
|
56648
|
-
ques.error = null;
|
|
56649
|
-
}
|
|
56650
|
-
// If there were validation errors from the file upload component
|
|
56651
|
-
if (event?.validationErrors && event.validationErrors.length > 0) {
|
|
56652
|
-
ques.error = new ErrorWrapper();
|
|
56653
|
-
ques.error.message = event.validationErrors[0]; // Use the first validation error
|
|
56654
|
-
}
|
|
56655
56673
|
}
|
|
56656
56674
|
else if (ques.type == 'Date' || ques.type == 'DateTime') { // HA 24JAN24 Converting Date and DateTime to UTC
|
|
56657
56675
|
ques.input = event?.valueObj || null;
|
|
@@ -56678,13 +56696,6 @@ class QuestionbookComponent {
|
|
|
56678
56696
|
else {
|
|
56679
56697
|
ques.input = event?.valueObj;
|
|
56680
56698
|
}
|
|
56681
|
-
//RS 06JAN25
|
|
56682
|
-
// Validate error message - modified to handle rich text
|
|
56683
|
-
const hasError = ques.errorMessage && ((ques.type === 'File' && ques.input.length === 0) ||
|
|
56684
|
-
(ques.type === 'RichTextArea' && (!ques.input || ques.input.trim() === '')) ||
|
|
56685
|
-
(ques.type !== 'File' && ques.Type !== 'RichTextArea' && !ques.input));
|
|
56686
|
-
ques.error = hasError ? new ErrorWrapper() : null;
|
|
56687
|
-
ques.error = hasError ? new ErrorWrapper() : null;
|
|
56688
56699
|
// Once the right value is stored in ques.input store the ques (with input) in storageService
|
|
56689
56700
|
this.storageService.update(ques);
|
|
56690
56701
|
// VD 19Jul01 - get updated question
|
|
@@ -56906,14 +56917,14 @@ class QuestionbookComponent {
|
|
|
56906
56917
|
this.isImageEdit = false;
|
|
56907
56918
|
}
|
|
56908
56919
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: QuestionbookComponent, deps: [{ token: SalesforceService }, { token: DataService }, { token: ChangeService }, { token: StorageService }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
|
|
56909
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: QuestionbookComponent, isStandalone: true, selector: "lib-questionbook", inputs: { qbItem: "qbItem", questionItem: "questionItem", questions: "questions", errorFieldId: "errorFieldId", labelValue: "labelValue", token: "token", isEdit: "isEdit", dropDownData: "dropDownData", dataBind: "dataBind", allIcons: "allIcons", themeColor: "themeColor", cdnIconURL: "cdnIconURL", direction: "direction", languageCode: "languageCode" }, outputs: { handleDropDown: "handleDropDown", handleQuestion: "handleQuestion", singleFieldChangeEmit: "singleFieldChangeEmit", hadleDropDownDependent: "hadleDropDownDependent", handleCalendarDate: "handleCalendarDate", handleCalendarEvent: "handleCalendarEvent" }, ngImport: i0, template: "<!-- HA 18JAN24 Added class for styling -->\n<div [style]=\"bookStyle\" class=\"content-box form-group\">\n <div class=\"form-row\">\n <!-- HA 20DEC23 Directive and Question Style from salesforce -->\n <!-- RA09DEC24 Changed keys-->\n <ng-container *ngFor=\"let ques of questions;let i = index\">\n <div [ngStyle]=\"{ display: ques.isHidden ? 'none' : 'block' }\" [class]=\"'col-lg-' + ques.size + ' paddingnone'\" \n [id]=\"ques.id\" [style]=\"ques?.style?.questionStyle\" style=\"margin-top: 5px; margin-bottom: 5px;\">\n <!-- VD 09May24 is hide field change-->\n <div class=\"nxtInputContainer\">\n <!-- AP-28MAR25 Show label if enabled and not a Boolean type -->\n <div [ngClass]=\"{ down2: qbItem?.progressBar }\"\n *ngIf=\"ques.style?.showLabel ? (ques.style?.showLabel && ques.type !== 'Radio' && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'RichTextArea' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' &&ques.type !== 'Email' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label'): (ques.style?.showLabel !== false && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label' && ques.type !== 'Radio')\"\n [style]=\"ques.style?.labelStyle\">\n <div style=\"gap: 5px; display: flex; align-items: center;\" [style]=\"ques.style?.labelValueStyle\"\n [ngStyle]=\"{\n 'font-family': ques.font,\n 'color': ques.color || '#212529',\n 'font-size': ques.fontSize || '14px',\n 'font-weight': ques.fontWeight || 'normal'\n }\">{{ ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText):''}}\n <div *ngIf=\"ques.isOptional && !ques.isReadOnly \" style=\"color: red;\">*</div>\n <!-- SKS13MAR25 only show on file type -->\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips help text -->\n <div *ngIf=\"ques.questionText && ques?.helpText && ques.type === 'File'\" class=\"icon\"\n [matTooltip]=\"ques?.helpText\" matTooltipClass=\"white-tooltip\">i</div>\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips for file requirements -->\n <div class=\"icon\" *ngIf=\"ques.fieldsMeta && ques.type === 'File'\"\n [matTooltip]=\"getFileRequirements(ques.fieldsMeta)\" matTooltipClass=\"white-tooltip\"\n style=\"margin-left: 4px;\">i</div>\n </div>\n </div>\n <!-- calendar -->\n <div *ngIf=\"ques.type === 'Calendar'\">\n <app-custom-calendar [question]=\"ques\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <!-- model used in calendar component -->\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model>\n </div>\n <!-- SKS25MAR25 Image -->\n <div *ngIf=\"ques.type === 'Image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageEdit(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageDelete(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <img *ngIf=\"ques.isReadOnly\" [src]=\"ques.imageData\" />\n <div *ngIf=\"!ques.isReadOnly\" class=\"logo-container\">\n <!-- Logo preview area -->\n <div class=\"logo-preview\" *ngIf=\"ques.input\">\n <img [src]=\"ques.imageData\" />\n </div>\n\n <!-- Upload button -->\n <div *ngIf=\"!ques.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(ques, $event)\" style=\"display: none;\" />\n </div>\n </div>\n </div>\n <!-- MSM10JUL25 icon-selector -->\n <nxt-icon-selector [allIcons]=\"allIcons\" *ngIf=\"ques.type === 'Icon'\" [required]=\"ques.isOptional\" [mode]=\"isEdit !== true ? 'view' : 'edit'\" [question]=\"ques\" [labelFont]=\"ques.font\"\n [label]=\" ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\" [labelWeight]=\"ques.fontWeight\" [showLabel]=\"ques.style?.showLabel\" (iconSelected)=\"childEventCapture($event, ques);\"></nxt-icon-selector>\n\n <!-- SKS21MAR25 line -->\n <hr *ngIf=\"ques.type === 'Line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS13MAR25 data table -->\n <nxt-datatable *ngIf=\"ques.type === 'Table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"ques\" from=\"questionBook\"\n (valueChange)=\"childEventCapture($event, ques); clearSQError(ques.id)\" [apiMeta]=\"ques.subText\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\" [languageCode]=\"languageCode\"\n [tableConfig]=\"ques.tableConfig\" tableId=\"\" [direction]=\"direction\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- list -->\n <nxt-search-box *ngIf=\"ques.type === 'List'\" [question]=\"ques\" [readOnly]=\"ques.isReadOnly\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [placeHolderText]=\"ques.question || ''\" [value]=\"ques.input\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (searchValueChange)=\"childEventCapture($event.value,$event.question)\">\n </nxt-search-box>\n\n <!-- Dropdown -->\n <!-- HA 09FEB24 Added condition of sqOption to the dropdown -->\n <app-custom-dropdown *ngIf=\"ques?.type === 'Dropdown' && ques?.options\" [options]=\"ques.options\" [token]=\"token\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [selectedValue]=\"qbItem.isShengel ? ques.input : ques.selectedValue\"\n placeholder=\"---{{'SELECT' | nxtCustomTranslate : 'select'}}---\"\n [errorMessage]=\"ques.errorMessage\" [error]=\"ques.error\" [referenceField]=\"ques.referenceField\"\n [readOnly]=\"ques.isReadOnly\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question); clearSQError(ques.id)\">\n </app-custom-dropdown>\n <!-- // VD 02Aug24 custom-radio component -->\n <div *ngIf=\"ques.type === 'Radio' && ques?.options\" class=\"\">\n <app-custom-radio [options]=\"ques.options\" [question]=\"ques\" [token]=\"token\" [apiMeta]=\"ques.subText\" [id]=\"ques.id\"\n [selectedValue]=\"ques.selectedValue\" [errorMessage]=\"ques.errorMessage\"\n [referenceField]=\"ques.referenceField\" [readOnly]=\"ques.isReadOnly\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question); clearSQError(ques.id)\">\n </app-custom-radio>\n </div>\n\n <!-- Attachment / Files -->\n <nxt-file-upload *ngIf=\"ques.type === 'File'\" [limitFileUploading]=\"5\" [error]=\"ques.error\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [allFiles]=\"ques.input\" (selectedFileData)=\"childEventCapture($event.value,$event.question)\"\n (deletedFileData)=\"deleteFile($event)\"\n >\n </nxt-file-upload>\n <!-- SKS11JUN25 Button -->\n <nxt-button\n *ngIf=\"ques.type === 'Button'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"ques?.question\"\n (buttonClickEmit)=\"childEventCapture($event, ques)\"\n >\n </nxt-button>\n <!-- SKS11JUN25 book type -->\n <lib-questionbook *ngIf=\"ques.type === 'Book'\" [qbItem]=\"ques.qbItem\" [labelValue]=\"labelValue\"\n [questions]=\"ques?.qbReferenceQuestions?.bookQuestionsMap?.[ques?.qbReference]?.subQuestions\"\n (handleDropDown)=\"getDropDown($event)\"></lib-questionbook>\n <!-- SKS11JUN25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngIf=\"ques.type === 'Text' || ques.type === 'Email' || ques.type === 'Number' || ques.type === 'Label' || ques.type === 'Boolean' || ques.type === 'RichTextArea' || ques.type === 'DateTime' || ques.type === 'month' || ques.type === 'Date' || ques.type === 'Time' || ques.type === 'TextArea' || ques.type === 'Location'\"\n [type]=\"ques.type === 'Text' ? 'text' : ques.type === 'Email' ? 'email' : ques.type === 'Number' ? 'number' : ques.type === 'Label' ? 'label' : ques.type === 'Boolean' ? 'checkbox' : ques.type === 'RichTextArea' ? 'richtext' : ques.type === 'DateTime' ? 'datetime' : ques.type === 'Date' ? 'date' : ques.type === 'Time' ? 'time' : ques.type === 'TextArea' ? 'textarea' : ques.type === 'month' ? 'month' : ques.type === 'Location' ? 'location' : 'text'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [value]=\"ques.input\"\n [question]=\"ques\"\n [apiKey]=\"qbItem['apiKey']\"\n [labelFont]=\"ques.font\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\"\n [inputValueSize]=\"ques.fontSize\"\n [labelWeight]=\"ques.fontWeight\"\n [inputWeight]=\"ques.fontWeight\"\n [showLabel]=\"ques.style?.showLabel\"\n inputBorder=\"#ccc\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"ques?.question ? ((ques.id+'.question') | nxtCustomTranslate : ques?.question ): ''\"\n [required]=\"ques.isOptional\" inputBgColor=\"#ffffff\"\n [inputId]=\"ques.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"ques.iconLeftSrc\" \n [minDate]=\"ques.minDate\"\n [rows]=\"3\"\n [apiMeta]=\"ques.subText\"\n [direction]=\"direction\"\n (inputValue)=\"childEventCapture($event.value,$event.question, 'nxt-input')\"\n >\n </nxt-input>\n </div>\n </div>\n </ng-container>\n </div>\n</div>\n\n<!--SKS25MAR25 Modal Overlay -->\n<div class=\"modal-overlay\" *ngIf=\"isImageEdit\">\n <div class=\"modal-content\">\n <span class=\"close-button\" (click)=\"closeModal()\">\u00D7</span>\n\n <!-- Image Editor -->\n <div *ngIf=\"selectedImageElement?.type === 'Image'\">\n <div style=\"height: 200px;\">\n <image-cropper *ngIf=\"selectedImageElement.imageData\" [imageBase64]=\"selectedImageElement.orgImageData\"\n [disabled]=\"false\" [alignImage]=\"alignImage\" [roundCropper]=\"roundCropper\" [backgroundColor]=\"'white'\"\n imageAltText=\"Alternative image text\" [allowMoveImage]=\"false\" [hideResizeSquares]=\"false\"\n [canvasRotation]=\"canvasRotation\" [aspectRatio]=\"aspectRatio\" [containWithinAspectRatio]=\"false\"\n [maintainAspectRatio]=\"false\" [cropperStaticWidth]=\"cropperStaticWidth\"\n [cropperStaticHeight]=\"cropperStaticHeight\" [cropperMinWidth]=\"cropperMinWidth\"\n [cropperMinHeight]=\"cropperMinHeight\" [cropperMaxWidth]=\"cropperMaxWidth\"\n [cropperMaxHeight]=\"cropperMaxHeight\" [resetCropOnAspectRatioChange]='true' [(cropper)]=\"cropper\"\n [(transform)]=\"transform\" [onlyScaleDown]=\"true\" output=\"blob\" format=\"png\"\n (imageCropped)=\"imageCropped($event)\" (cropperReady)=\"cropperReady($event)\">\n </image-cropper>\n </div>\n\n <!-- Controls -->\n <div *ngIf=\"selectedImageElement.imageData\" class=\"controls\">\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateLeft()\" title=\"Rotate Left\">\u27F2</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateRight()\" title=\"Rotate Right\">\u27F3</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomOut()\" title=\"Zoom Out\">-</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomIn()\" title=\"Zoom In\">+</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveLeft()\" title=\"Move Left\">\u2190</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveRight()\" title=\"Move Right\">\u2192</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveUp()\" title=\"Move Up\">\u2191</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveDown()\" title=\"Move Down\">\u2193</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipHorizontal()\" [class.enabled]=\"transform.flipH\"\n title=\"Flip Horizontally\">\u2194</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipVertical()\" [class.enabled]=\"transform.flipV\"\n title=\"Flip Vertically\">\u2195</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"resetImage()\" title=\"Reset\">\u00D7</div>\n </div>\n </div>\n </div>\n</div>", styles: [".col-lg-6{width:100%}.myt-font7{display:flex;justify-content:flex-start;align-items:center}.icon{display:inline-block;width:15px;height:15px;border-radius:50%;background-color:#08010177;color:#fff;text-align:center;line-height:16px;font-size:11px;font-family:Arial,sans-serif;font-weight:700;margin-left:5px}@media (min-width: 1200px){.col-lg-6{width:50%!important}.col-lg-6,.col-lg-4{padding-left:5px!important;padding-right:5px!important}.form-row{display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap!important;flex-wrap:wrap!important}}.icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background-color:#f5f5f5;border:1px solid #ddd;color:#666;margin-left:4px;font-size:12px;cursor:pointer!important}::ng-deep .mat-tooltip-panel{background:#fff!important}::ng-deep .mat-tooltip{background-color:#fff!important;color:#333!important;white-space:pre-line!important;line-height:1.5!important}.mat-tooltip{padding:8px 16px!important}::ng-deep .white-tooltip{white-space:pre-line!important;line-height:1.5!important}.custom-line{width:100%;border:1px solid #d9d9d9}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.modal-content{background:#fff;padding:20px;width:500px;max-width:90%;border-radius:8px;position:relative;text-align:center}.close-button{position:absolute;top:6px;right:6px;font-size:25px;cursor:pointer;z-index:10}.controls{display:flex;gap:5px;justify-content:center;margin-top:10px}.logo-icon{cursor:pointer;padding:5px;width:35px;border-radius:5px;background:#d3d3d3}.logo-icon:hover{background:#a9a9a9}.enabled{background:#007bff;color:#fff}input[type=checkbox]{width:21px}.boolean-question{display:flex;align-items:center;gap:10px;padding-top:14px;padding-bottom:12px}.form-control[disabled]{border-radius:5px;background-color:#e9ecef!important}\n"], dependencies: [{ kind: "component", type: QuestionbookComponent, selector: "lib-questionbook", inputs: ["qbItem", "questionItem", "questions", "errorFieldId", "labelValue", "token", "isEdit", "dropDownData", "dataBind", "allIcons", "themeColor", "cdnIconURL", "direction", "languageCode"], outputs: ["handleDropDown", "handleQuestion", "singleFieldChangeEmit", "hadleDropDownDependent", "handleCalendarDate", "handleCalendarEvent"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ImageCropperComponent, selector: "image-cropper", inputs: ["imageChangedEvent", "imageURL", "imageBase64", "imageFile", "imageAltText", "options", "cropperFrameAriaLabel", "output", "format", "autoCrop", "cropper", "transform", "maintainAspectRatio", "aspectRatio", "resetCropOnAspectRatioChange", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "allowMoveImage", "checkImageType", "alignImage", "disabled", "hidden"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed", "transformChange", "cropperChange"] }, { kind: "component", type: NxtFileUploadComponent, selector: "nxt-file-upload", inputs: ["allFiles", "limitFileUploading", "mode", "question", "error", "from"], outputs: ["selectedFileData", "deletedFileData"] }, { kind: "component", type: CustomRadioComponent, selector: "app-custom-radio", inputs: ["options", "question", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "fromShengel", "referenceField", "token", "label", "mode"], outputs: ["valueChange"] }, { kind: "component", type: CustomDropdownComponent, selector: "app-custom-dropdown", inputs: ["options", "placeholder", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "error", "fromShengel", "question", "referenceField", "token", "mode", "from"], outputs: ["valueChange"] }, { kind: "component", type: NxtButtonComponent, selector: "nxt-button", inputs: ["buttonValue", "buttonType", "type", "buttonDisable", "btnBgColor", "btnBorder", "btnBorderRadius", "btnBorderColor", "btnTextColor", "btnHeight", "btnWidth", "btnIconLeftSrc", "btnIconRightSrc", "btnHoverBgColor", "btnHoverTextColor", "btnId", "dataDismiss", "modalToTrigger", "isImageSvg", "tabIndex", "buttonConfig", "mode", "languageCode", "isLoading"], outputs: ["buttonClickEmit"] }, { kind: "component", type: NxtSearchBox, selector: "nxt-search-box", inputs: ["placeHolderText", "question", "apiMeta", "id", "readOnly", "mode", "from", "value"], outputs: ["searchValueChange"] }, { kind: "component", type: NxtDatatable, selector: "nxt-datatable", inputs: ["data", "tableFilterData", "columns", "withCheckBox", "searchBar", "tableSaveButton", "stickyColumn", "tableWidth", "actionColumHeader", "actionButton", "title", "isButtons", "buttonArray", "tableId", "isEditRow", "isDeleteRow", "addInlineRecord", "searchConfigs", "direction", "pagination", "actionButtonArray", "multipleFilter", "isPagination", "isListViews", "id", "isNosIndicator", "isEditable", "from", "question", "rowTextSize", "rowTextColor", "apiMeta", "summaryRows", "summaryColumns", "isLoading", "tableConfig", "tableParams", "listViews", "mode", "languageCode", "selectedColumn", "allIcons", "isButtonLoading", "isPreview"], outputs: ["tableRowClick", "onEditData", "saveButtonData", "onDeleteData", "buttonEmit", "hyperLinkEmit", "sideNavEmit", "actionButtonEmit", "columnSelected", "removeColumn", "valueChange", "selectedValues", "fileEmit", "NxtTableFilterEmit", "hadleDropDownDependent", "NxtTableParamsEmit"] }, { kind: "component", type: CustomModelComponent, selector: "app-custom-model", inputs: ["modalTitle", "isModalOpen", "modalSize", "saveButtonValue", "modalFooter"], outputs: ["saveButtonEmit", "cancelButtonEmit"] }, { kind: "component", type: CustomCalendarComponent, selector: "app-custom-calendar", inputs: ["allEvents", "question", "nxtId"], outputs: ["eventSelected", "dateSelected", "openModal", "closeModal"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: NxtInput, selector: "nxt-input", inputs: ["label", "labelFont", "labelWeight", "inputWeight", "labelSize", "inputValueSize", "labelColor", "showLabel", "svgHeight", "svgWidth", "type", "inputIconRightSrc", "inputIconLeftSrc", "required", "minLength", "pattern", "errorMessages", "maxLength", "placeholder", "inputBgColor", "inputBorder", "placeholderColor", "placeholderFont", "placeholderWeight", "placeholderSize", "inputTextColor", "inputHeight", "inputWidth", "inputId", "inputBorderSize", "inputConfig", "confPassVal", "confPass", "mode", "value", "question", "showSuggestion", "ariaOwns", "ariaHasPopup", "isLoading", "options", "minDate", "maxDate", "rows", "from", "selectedOption", "apiMeta", "direction", "currency", "helpText", "apiKey", "size"], outputs: ["valueChange", "inputValue", "onBlur", "onFocus", "toggleEmit", "removeValueEmit"] }, { kind: "component", type: IconSelectorComponent, selector: "nxt-icon-selector", inputs: ["allIcons", "themeColor", "height", "tooltipPosition", "selectedIcon", "cdnIconURL", "label", "labelFont", "labelWeight", "inputWeight", "labelSize", "labelColor", "showLabel", "required", "mode", "question", "options"], outputs: ["iconSelected"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }] });
|
|
56920
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: QuestionbookComponent, isStandalone: true, selector: "lib-questionbook", inputs: { qbItem: "qbItem", questionItem: "questionItem", questions: "questions", errorFieldId: "errorFieldId", labelValue: "labelValue", token: "token", isEdit: "isEdit", dropDownData: "dropDownData", dataBind: "dataBind", allIcons: "allIcons", themeColor: "themeColor", cdnIconURL: "cdnIconURL", direction: "direction", languageCode: "languageCode" }, outputs: { handleDropDown: "handleDropDown", handleQuestion: "handleQuestion", singleFieldChangeEmit: "singleFieldChangeEmit", hadleDropDownDependent: "hadleDropDownDependent", handleCalendarDate: "handleCalendarDate", handleCalendarEvent: "handleCalendarEvent" }, ngImport: i0, template: "<!-- HA 18JAN24 Added class for styling -->\n<div [style]=\"bookStyle\" class=\"content-box form-group\">\n <div class=\"form-row\">\n <!-- HA 20DEC23 Directive and Question Style from salesforce -->\n <!-- RA09DEC24 Changed keys-->\n <ng-container *ngFor=\"let ques of questions;let i = index\">\n <div [ngStyle]=\"{ display: ques.isHidden ? 'none' : 'block' }\" [class]=\"'col-lg-' + ques.size + ' paddingnone'\" \n [id]=\"ques.id\" [style]=\"ques?.style?.questionStyle\" style=\"margin-top: 5px; margin-bottom: 5px;\">\n <!-- VD 09May24 is hide field change-->\n <div class=\"nxtInputContainer\">\n <!-- AP-28MAR25 Show label if enabled and not a Boolean type -->\n <div [ngClass]=\"{ down2: qbItem?.progressBar }\"\n *ngIf=\"ques.style?.showLabel ? (ques.style?.showLabel && ques.type !== 'Radio' && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'RichTextArea' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' &&ques.type !== 'Email' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label'): (ques.style?.showLabel !== false && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label' && ques.type !== 'Radio')\"\n [style]=\"ques.style?.labelStyle\">\n <div style=\"gap: 5px; display: flex; align-items: center;\" [style]=\"ques.style?.labelValueStyle\"\n [ngStyle]=\"{\n 'font-family': ques.font,\n 'color': ques.color || '#212529',\n 'font-size': ques.fontSize || '14px',\n 'font-weight': ques.fontWeight || 'normal'\n }\">{{ ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText):''}}\n <div *ngIf=\"ques.isOptional && !ques.isReadOnly \" style=\"color: red;\">*</div>\n <!-- SKS13MAR25 only show on file type -->\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips help text -->\n <div *ngIf=\"ques.questionText && ques?.helpText && ques.type === 'File'\" class=\"icon\"\n [matTooltip]=\"ques?.helpText\" matTooltipClass=\"white-tooltip\">i</div>\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips for file requirements -->\n <div class=\"icon\" *ngIf=\"ques.fieldsMeta && ques.type === 'File'\"\n [matTooltip]=\"getFileRequirements(ques.fieldsMeta)\" matTooltipClass=\"white-tooltip\"\n style=\"margin-left: 4px;\">i</div>\n </div>\n </div>\n <!-- calendar -->\n <div *ngIf=\"ques.type === 'Calendar'\">\n <app-custom-calendar [question]=\"ques\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <!-- model used in calendar component -->\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model>\n </div>\n <!-- SKS25MAR25 Image -->\n <div *ngIf=\"ques.type === 'Image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageEdit(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageDelete(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <img *ngIf=\"ques.isReadOnly\" [src]=\"ques.imageData\" />\n <div *ngIf=\"!ques.isReadOnly\" class=\"logo-container\">\n <!-- Logo preview area -->\n <div class=\"logo-preview\" *ngIf=\"ques.input\">\n <img [src]=\"ques.imageData\" />\n </div>\n\n <!-- Upload button -->\n <div *ngIf=\"!ques.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(ques, $event)\" style=\"display: none;\" />\n </div>\n </div>\n </div>\n <!-- MSM10JUL25 icon-selector -->\n <nxt-icon-selector [allIcons]=\"allIcons\" *ngIf=\"ques.type === 'Icon'\" [required]=\"ques.isOptional\" [mode]=\"isEdit !== true ? 'view' : 'edit'\" [question]=\"ques\" [labelFont]=\"ques.font\"\n [label]=\" ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\" [labelWeight]=\"ques.fontWeight\" [showLabel]=\"ques.style?.showLabel\" (iconSelected)=\"childEventCapture($event, ques);\"></nxt-icon-selector>\n\n <!-- SKS21MAR25 line -->\n <hr *ngIf=\"ques.type === 'Line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS13MAR25 data table -->\n <nxt-datatable *ngIf=\"ques.type === 'Table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"ques\" from=\"questionBook\"\n (valueChange)=\"childEventCapture($event, ques)\" [apiMeta]=\"ques.subText\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\" [languageCode]=\"languageCode\"\n [tableConfig]=\"ques.tableConfig\" tableId=\"\" [direction]=\"direction\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- list -->\n <nxt-search-box *ngIf=\"ques.type === 'List'\" [question]=\"ques\" [readOnly]=\"ques.isReadOnly\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [placeHolderText]=\"ques.question || ''\" [value]=\"ques.input\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (searchValueChange)=\"childEventCapture($event.value,$event.question)\">\n </nxt-search-box>\n\n <!-- Dropdown -->\n <!-- HA 09FEB24 Added condition of sqOption to the dropdown -->\n <app-custom-dropdown *ngIf=\"ques?.type === 'Dropdown' && ques?.options\" [options]=\"ques.options\" [token]=\"token\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [selectedValue]=\"qbItem.isShengel ? ques.input : ques.selectedValue\"\n placeholder=\"---{{'SELECT' | nxtCustomTranslate : 'select'}}---\"\n [errorMessage]=\"ques.errorMessage\" [referenceField]=\"ques.referenceField\"\n [readOnly]=\"ques.isReadOnly\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question)\">\n </app-custom-dropdown>\n <!-- // VD 02Aug24 custom-radio component -->\n <div *ngIf=\"ques.type === 'Radio' && ques?.options\" class=\"\">\n <app-custom-radio [options]=\"ques.options\" [question]=\"ques\" [token]=\"token\" [apiMeta]=\"ques.subText\" [id]=\"ques.id\"\n [selectedValue]=\"ques.selectedValue\" [errorMessage]=\"ques.errorMessage\"\n [referenceField]=\"ques.referenceField\" [readOnly]=\"ques.isReadOnly\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question)\">\n </app-custom-radio>\n </div>\n\n <!-- Attachment / Files -->\n <nxt-file-upload *ngIf=\"ques.type === 'File'\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [allFiles]=\"ques.input\" (selectedFileData)=\"childEventCapture($event.value,$event.question)\"\n (deletedFileData)=\"deleteFile($event)\"\n >\n </nxt-file-upload>\n <!-- SKS11JUN25 Button -->\n <nxt-button\n *ngIf=\"ques.type === 'Button'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"ques?.question\"\n (buttonClickEmit)=\"childEventCapture($event, ques)\"\n >\n </nxt-button>\n <!-- SKS11JUN25 book type -->\n <lib-questionbook *ngIf=\"ques.type === 'Book'\" [qbItem]=\"ques.qbItem\" [labelValue]=\"labelValue\"\n [questions]=\"ques?.qbReferenceQuestions?.bookQuestionsMap?.[ques?.qbReference]?.subQuestions\"\n (handleDropDown)=\"getDropDown($event)\"></lib-questionbook>\n <!-- SKS11JUN25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngIf=\"ques.type === 'Text' || ques.type === 'Email' || ques.type === 'Number' || ques.type === 'Label' || ques.type === 'Boolean' || ques.type === 'RichTextArea' || ques.type === 'DateTime' || ques.type === 'month' || ques.type === 'Date' || ques.type === 'Time' || ques.type === 'TextArea' || ques.type === 'Location'\"\n [type]=\"ques.type === 'Text' ? 'text' : ques.type === 'Email' ? 'email' : ques.type === 'Number' ? 'number' : ques.type === 'Label' ? 'label' : ques.type === 'Boolean' ? 'checkbox' : ques.type === 'RichTextArea' ? 'richtext' : ques.type === 'DateTime' ? 'datetime' : ques.type === 'Date' ? 'date' : ques.type === 'Time' ? 'time' : ques.type === 'TextArea' ? 'textarea' : ques.type === 'month' ? 'month' : ques.type === 'Location' ? 'location' : 'text'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [value]=\"ques.input\"\n [question]=\"ques\"\n [apiKey]=\"qbItem['apiKey']\"\n [labelFont]=\"ques.font\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\"\n [inputValueSize]=\"ques.fontSize\"\n [labelWeight]=\"ques.fontWeight\"\n [inputWeight]=\"ques.fontWeight\"\n [showLabel]=\"ques.style?.showLabel\"\n inputBorder=\"#ccc\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"ques?.question ? ((ques.id+'.question') | nxtCustomTranslate : ques?.question ): ''\"\n [required]=\"ques.isOptional\" inputBgColor=\"#ffffff\"\n [inputId]=\"ques.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"ques.iconLeftSrc\" \n [minDate]=\"ques.minDate\"\n [rows]=\"3\"\n [apiMeta]=\"ques.subText\"\n [direction]=\"direction\"\n (inputValue)=\"childEventCapture($event.value,$event.question, 'nxt-input')\"\n >\n </nxt-input>\n </div>\n </div>\n </ng-container>\n </div>\n</div>\n\n<!--SKS25MAR25 Modal Overlay -->\n<div class=\"modal-overlay\" *ngIf=\"isImageEdit\">\n <div class=\"modal-content\">\n <span class=\"close-button\" (click)=\"closeModal()\">\u00D7</span>\n\n <!-- Image Editor -->\n <div *ngIf=\"selectedImageElement?.type === 'Image'\">\n <div style=\"height: 200px;\">\n <image-cropper *ngIf=\"selectedImageElement.imageData\" [imageBase64]=\"selectedImageElement.orgImageData\"\n [disabled]=\"false\" [alignImage]=\"alignImage\" [roundCropper]=\"roundCropper\" [backgroundColor]=\"'white'\"\n imageAltText=\"Alternative image text\" [allowMoveImage]=\"false\" [hideResizeSquares]=\"false\"\n [canvasRotation]=\"canvasRotation\" [aspectRatio]=\"aspectRatio\" [containWithinAspectRatio]=\"false\"\n [maintainAspectRatio]=\"false\" [cropperStaticWidth]=\"cropperStaticWidth\"\n [cropperStaticHeight]=\"cropperStaticHeight\" [cropperMinWidth]=\"cropperMinWidth\"\n [cropperMinHeight]=\"cropperMinHeight\" [cropperMaxWidth]=\"cropperMaxWidth\"\n [cropperMaxHeight]=\"cropperMaxHeight\" [resetCropOnAspectRatioChange]='true' [(cropper)]=\"cropper\"\n [(transform)]=\"transform\" [onlyScaleDown]=\"true\" output=\"blob\" format=\"png\"\n (imageCropped)=\"imageCropped($event)\" (cropperReady)=\"cropperReady($event)\">\n </image-cropper>\n </div>\n\n <!-- Controls -->\n <div *ngIf=\"selectedImageElement.imageData\" class=\"controls\">\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateLeft()\" title=\"Rotate Left\">\u27F2</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateRight()\" title=\"Rotate Right\">\u27F3</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomOut()\" title=\"Zoom Out\">-</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomIn()\" title=\"Zoom In\">+</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveLeft()\" title=\"Move Left\">\u2190</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveRight()\" title=\"Move Right\">\u2192</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveUp()\" title=\"Move Up\">\u2191</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveDown()\" title=\"Move Down\">\u2193</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipHorizontal()\" [class.enabled]=\"transform.flipH\"\n title=\"Flip Horizontally\">\u2194</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipVertical()\" [class.enabled]=\"transform.flipV\"\n title=\"Flip Vertically\">\u2195</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"resetImage()\" title=\"Reset\">\u00D7</div>\n </div>\n </div>\n </div>\n</div>", styles: [".col-lg-6{width:100%}.myt-font7{display:flex;justify-content:flex-start;align-items:center}.icon{display:inline-block;width:15px;height:15px;border-radius:50%;background-color:#08010177;color:#fff;text-align:center;line-height:16px;font-size:11px;font-family:Arial,sans-serif;font-weight:700;margin-left:5px}@media (min-width: 1200px){.col-lg-6{width:50%!important}.col-lg-6,.col-lg-4{padding-left:5px!important;padding-right:5px!important}.form-row{display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap!important;flex-wrap:wrap!important}}.icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background-color:#f5f5f5;border:1px solid #ddd;color:#666;margin-left:4px;font-size:12px;cursor:pointer!important}::ng-deep .mat-tooltip-panel{background:#fff!important}::ng-deep .mat-tooltip{background-color:#fff!important;color:#333!important;white-space:pre-line!important;line-height:1.5!important}.mat-tooltip{padding:8px 16px!important}::ng-deep .white-tooltip{white-space:pre-line!important;line-height:1.5!important}.custom-line{width:100%;border:1px solid #d9d9d9}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.modal-content{background:#fff;padding:20px;width:500px;max-width:90%;border-radius:8px;position:relative;text-align:center}.close-button{position:absolute;top:6px;right:6px;font-size:25px;cursor:pointer;z-index:10}.controls{display:flex;gap:5px;justify-content:center;margin-top:10px}.logo-icon{cursor:pointer;padding:5px;width:35px;border-radius:5px;background:#d3d3d3}.logo-icon:hover{background:#a9a9a9}.enabled{background:#007bff;color:#fff}input[type=checkbox]{width:21px}.boolean-question{display:flex;align-items:center;gap:10px;padding-top:14px;padding-bottom:12px}.form-control[disabled]{border-radius:5px;background-color:#e9ecef!important}\n"], dependencies: [{ kind: "component", type: QuestionbookComponent, selector: "lib-questionbook", inputs: ["qbItem", "questionItem", "questions", "errorFieldId", "labelValue", "token", "isEdit", "dropDownData", "dataBind", "allIcons", "themeColor", "cdnIconURL", "direction", "languageCode"], outputs: ["handleDropDown", "handleQuestion", "singleFieldChangeEmit", "hadleDropDownDependent", "handleCalendarDate", "handleCalendarEvent"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ImageCropperComponent, selector: "image-cropper", inputs: ["imageChangedEvent", "imageURL", "imageBase64", "imageFile", "imageAltText", "options", "cropperFrameAriaLabel", "output", "format", "autoCrop", "cropper", "transform", "maintainAspectRatio", "aspectRatio", "resetCropOnAspectRatioChange", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "allowMoveImage", "checkImageType", "alignImage", "disabled", "hidden"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed", "transformChange", "cropperChange"] }, { kind: "component", type: NxtFileUploadComponent, selector: "nxt-file-upload", inputs: ["allFiles", "mode", "question", "from"], outputs: ["selectedFileData", "deletedFileData"] }, { kind: "component", type: CustomRadioComponent, selector: "app-custom-radio", inputs: ["options", "question", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "fromShengel", "referenceField", "token", "label", "mode"], outputs: ["valueChange"] }, { kind: "component", type: CustomDropdownComponent, selector: "app-custom-dropdown", inputs: ["options", "placeholder", "apiMeta", "selectedValue", "progressBar", "id", "readOnly", "errorMessage", "error", "fromShengel", "question", "referenceField", "token", "mode", "from"], outputs: ["valueChange"] }, { kind: "component", type: NxtButtonComponent, selector: "nxt-button", inputs: ["buttonValue", "buttonType", "type", "buttonDisable", "btnBgColor", "btnBorder", "btnBorderRadius", "btnBorderColor", "btnTextColor", "btnHeight", "btnWidth", "btnIconLeftSrc", "btnIconRightSrc", "btnHoverBgColor", "btnHoverTextColor", "btnId", "dataDismiss", "modalToTrigger", "isImageSvg", "tabIndex", "buttonConfig", "mode", "languageCode", "isLoading"], outputs: ["buttonClickEmit"] }, { kind: "component", type: NxtSearchBox, selector: "nxt-search-box", inputs: ["placeHolderText", "question", "apiMeta", "id", "readOnly", "mode", "from", "value"], outputs: ["searchValueChange"] }, { kind: "component", type: NxtDatatable, selector: "nxt-datatable", inputs: ["data", "tableFilterData", "columns", "withCheckBox", "searchBar", "tableSaveButton", "stickyColumn", "tableWidth", "actionColumHeader", "actionButton", "title", "isButtons", "buttonArray", "tableId", "isEditRow", "isDeleteRow", "addInlineRecord", "searchConfigs", "direction", "pagination", "actionButtonArray", "multipleFilter", "isPagination", "isListViews", "id", "isNosIndicator", "isEditable", "from", "question", "rowTextSize", "rowTextColor", "apiMeta", "summaryRows", "summaryColumns", "isLoading", "tableConfig", "tableParams", "listViews", "mode", "languageCode", "selectedColumn", "allIcons", "isButtonLoading", "isPreview"], outputs: ["tableRowClick", "onEditData", "saveButtonData", "onDeleteData", "buttonEmit", "hyperLinkEmit", "sideNavEmit", "actionButtonEmit", "columnSelected", "removeColumn", "valueChange", "selectedValues", "fileEmit", "NxtTableFilterEmit", "hadleDropDownDependent", "NxtTableParamsEmit"] }, { kind: "component", type: CustomModelComponent, selector: "app-custom-model", inputs: ["modalTitle", "isModalOpen", "modalSize", "saveButtonValue", "modalFooter"], outputs: ["saveButtonEmit", "cancelButtonEmit"] }, { kind: "component", type: CustomCalendarComponent, selector: "app-custom-calendar", inputs: ["allEvents", "question", "nxtId"], outputs: ["eventSelected", "dateSelected", "openModal", "closeModal"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: NxtInput, selector: "nxt-input", inputs: ["label", "labelFont", "labelWeight", "inputWeight", "labelSize", "inputValueSize", "labelColor", "showLabel", "svgHeight", "svgWidth", "type", "inputIconRightSrc", "inputIconLeftSrc", "required", "minLength", "pattern", "errorMessages", "maxLength", "placeholder", "inputBgColor", "inputBorder", "placeholderColor", "placeholderFont", "placeholderWeight", "placeholderSize", "inputTextColor", "inputHeight", "inputWidth", "inputId", "inputBorderSize", "inputConfig", "confPassVal", "confPass", "mode", "value", "question", "showSuggestion", "ariaOwns", "ariaHasPopup", "isLoading", "options", "minDate", "maxDate", "rows", "from", "selectedOption", "apiMeta", "direction", "currency", "helpText", "apiKey", "size"], outputs: ["valueChange", "inputValue", "onBlur", "onFocus", "toggleEmit", "removeValueEmit"] }, { kind: "component", type: IconSelectorComponent, selector: "nxt-icon-selector", inputs: ["allIcons", "themeColor", "height", "tooltipPosition", "selectedIcon", "cdnIconURL", "label", "labelFont", "labelWeight", "inputWeight", "labelSize", "labelColor", "showLabel", "required", "mode", "question", "options"], outputs: ["iconSelected"] }, { kind: "pipe", type: NxtCustomTranslatePipe, name: "nxtCustomTranslate" }] });
|
|
56910
56921
|
}
|
|
56911
56922
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: QuestionbookComponent, decorators: [{
|
|
56912
56923
|
type: Component,
|
|
56913
56924
|
args: [{ selector: 'lib-questionbook', standalone: true, imports: [
|
|
56914
56925
|
CommonModule,
|
|
56915
56926
|
FormsModule, ImageCropperComponent, NxtFileUploadComponent, CustomRadioComponent, CustomDropdownComponent, NxtButtonComponent, NxtSearchBox, NxtDatatable, CustomModelComponent, CustomCalendarComponent, MatTooltipModule, NxtInput, IconSelectorComponent, NxtCustomTranslatePipe
|
|
56916
|
-
], template: "<!-- HA 18JAN24 Added class for styling -->\n<div [style]=\"bookStyle\" class=\"content-box form-group\">\n <div class=\"form-row\">\n <!-- HA 20DEC23 Directive and Question Style from salesforce -->\n <!-- RA09DEC24 Changed keys-->\n <ng-container *ngFor=\"let ques of questions;let i = index\">\n <div [ngStyle]=\"{ display: ques.isHidden ? 'none' : 'block' }\" [class]=\"'col-lg-' + ques.size + ' paddingnone'\" \n [id]=\"ques.id\" [style]=\"ques?.style?.questionStyle\" style=\"margin-top: 5px; margin-bottom: 5px;\">\n <!-- VD 09May24 is hide field change-->\n <div class=\"nxtInputContainer\">\n <!-- AP-28MAR25 Show label if enabled and not a Boolean type -->\n <div [ngClass]=\"{ down2: qbItem?.progressBar }\"\n *ngIf=\"ques.style?.showLabel ? (ques.style?.showLabel && ques.type !== 'Radio' && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'RichTextArea' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' &&ques.type !== 'Email' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label'): (ques.style?.showLabel !== false && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label' && ques.type !== 'Radio')\"\n [style]=\"ques.style?.labelStyle\">\n <div style=\"gap: 5px; display: flex; align-items: center;\" [style]=\"ques.style?.labelValueStyle\"\n [ngStyle]=\"{\n 'font-family': ques.font,\n 'color': ques.color || '#212529',\n 'font-size': ques.fontSize || '14px',\n 'font-weight': ques.fontWeight || 'normal'\n }\">{{ ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText):''}}\n <div *ngIf=\"ques.isOptional && !ques.isReadOnly \" style=\"color: red;\">*</div>\n <!-- SKS13MAR25 only show on file type -->\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips help text -->\n <div *ngIf=\"ques.questionText && ques?.helpText && ques.type === 'File'\" class=\"icon\"\n [matTooltip]=\"ques?.helpText\" matTooltipClass=\"white-tooltip\">i</div>\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips for file requirements -->\n <div class=\"icon\" *ngIf=\"ques.fieldsMeta && ques.type === 'File'\"\n [matTooltip]=\"getFileRequirements(ques.fieldsMeta)\" matTooltipClass=\"white-tooltip\"\n style=\"margin-left: 4px;\">i</div>\n </div>\n </div>\n <!-- calendar -->\n <div *ngIf=\"ques.type === 'Calendar'\">\n <app-custom-calendar [question]=\"ques\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <!-- model used in calendar component -->\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model>\n </div>\n <!-- SKS25MAR25 Image -->\n <div *ngIf=\"ques.type === 'Image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageEdit(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageDelete(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <img *ngIf=\"ques.isReadOnly\" [src]=\"ques.imageData\" />\n <div *ngIf=\"!ques.isReadOnly\" class=\"logo-container\">\n <!-- Logo preview area -->\n <div class=\"logo-preview\" *ngIf=\"ques.input\">\n <img [src]=\"ques.imageData\" />\n </div>\n\n <!-- Upload button -->\n <div *ngIf=\"!ques.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(ques, $event)\" style=\"display: none;\" />\n </div>\n </div>\n </div>\n <!-- MSM10JUL25 icon-selector -->\n <nxt-icon-selector [allIcons]=\"allIcons\" *ngIf=\"ques.type === 'Icon'\" [required]=\"ques.isOptional\" [mode]=\"isEdit !== true ? 'view' : 'edit'\" [question]=\"ques\" [labelFont]=\"ques.font\"\n [label]=\" ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\" [labelWeight]=\"ques.fontWeight\" [showLabel]=\"ques.style?.showLabel\" (iconSelected)=\"childEventCapture($event, ques);\"></nxt-icon-selector>\n\n <!-- SKS21MAR25 line -->\n <hr *ngIf=\"ques.type === 'Line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS13MAR25 data table -->\n <nxt-datatable *ngIf=\"ques.type === 'Table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"ques\" from=\"questionBook\"\n (valueChange)=\"childEventCapture($event, ques); clearSQError(ques.id)\" [apiMeta]=\"ques.subText\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\" [languageCode]=\"languageCode\"\n [tableConfig]=\"ques.tableConfig\" tableId=\"\" [direction]=\"direction\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- list -->\n <nxt-search-box *ngIf=\"ques.type === 'List'\" [question]=\"ques\" [readOnly]=\"ques.isReadOnly\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [placeHolderText]=\"ques.question || ''\" [value]=\"ques.input\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (searchValueChange)=\"childEventCapture($event.value,$event.question)\">\n </nxt-search-box>\n\n <!-- Dropdown -->\n <!-- HA 09FEB24 Added condition of sqOption to the dropdown -->\n <app-custom-dropdown *ngIf=\"ques?.type === 'Dropdown' && ques?.options\" [options]=\"ques.options\" [token]=\"token\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [selectedValue]=\"qbItem.isShengel ? ques.input : ques.selectedValue\"\n placeholder=\"---{{'SELECT' | nxtCustomTranslate : 'select'}}---\"\n [errorMessage]=\"ques.errorMessage\" [error]=\"ques.error\" [referenceField]=\"ques.referenceField\"\n [readOnly]=\"ques.isReadOnly\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question); clearSQError(ques.id)\">\n </app-custom-dropdown>\n <!-- // VD 02Aug24 custom-radio component -->\n <div *ngIf=\"ques.type === 'Radio' && ques?.options\" class=\"\">\n <app-custom-radio [options]=\"ques.options\" [question]=\"ques\" [token]=\"token\" [apiMeta]=\"ques.subText\" [id]=\"ques.id\"\n [selectedValue]=\"ques.selectedValue\" [errorMessage]=\"ques.errorMessage\"\n [referenceField]=\"ques.referenceField\" [readOnly]=\"ques.isReadOnly\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question); clearSQError(ques.id)\">\n </app-custom-radio>\n </div>\n\n <!-- Attachment / Files -->\n <nxt-file-upload *ngIf=\"ques.type === 'File'\" [limitFileUploading]=\"5\" [error]=\"ques.error\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [allFiles]=\"ques.input\" (selectedFileData)=\"childEventCapture($event.value,$event.question)\"\n (deletedFileData)=\"deleteFile($event)\"\n >\n </nxt-file-upload>\n <!-- SKS11JUN25 Button -->\n <nxt-button\n *ngIf=\"ques.type === 'Button'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"ques?.question\"\n (buttonClickEmit)=\"childEventCapture($event, ques)\"\n >\n </nxt-button>\n <!-- SKS11JUN25 book type -->\n <lib-questionbook *ngIf=\"ques.type === 'Book'\" [qbItem]=\"ques.qbItem\" [labelValue]=\"labelValue\"\n [questions]=\"ques?.qbReferenceQuestions?.bookQuestionsMap?.[ques?.qbReference]?.subQuestions\"\n (handleDropDown)=\"getDropDown($event)\"></lib-questionbook>\n <!-- SKS11JUN25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngIf=\"ques.type === 'Text' || ques.type === 'Email' || ques.type === 'Number' || ques.type === 'Label' || ques.type === 'Boolean' || ques.type === 'RichTextArea' || ques.type === 'DateTime' || ques.type === 'month' || ques.type === 'Date' || ques.type === 'Time' || ques.type === 'TextArea' || ques.type === 'Location'\"\n [type]=\"ques.type === 'Text' ? 'text' : ques.type === 'Email' ? 'email' : ques.type === 'Number' ? 'number' : ques.type === 'Label' ? 'label' : ques.type === 'Boolean' ? 'checkbox' : ques.type === 'RichTextArea' ? 'richtext' : ques.type === 'DateTime' ? 'datetime' : ques.type === 'Date' ? 'date' : ques.type === 'Time' ? 'time' : ques.type === 'TextArea' ? 'textarea' : ques.type === 'month' ? 'month' : ques.type === 'Location' ? 'location' : 'text'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [value]=\"ques.input\"\n [question]=\"ques\"\n [apiKey]=\"qbItem['apiKey']\"\n [labelFont]=\"ques.font\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\"\n [inputValueSize]=\"ques.fontSize\"\n [labelWeight]=\"ques.fontWeight\"\n [inputWeight]=\"ques.fontWeight\"\n [showLabel]=\"ques.style?.showLabel\"\n inputBorder=\"#ccc\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"ques?.question ? ((ques.id+'.question') | nxtCustomTranslate : ques?.question ): ''\"\n [required]=\"ques.isOptional\" inputBgColor=\"#ffffff\"\n [inputId]=\"ques.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"ques.iconLeftSrc\" \n [minDate]=\"ques.minDate\"\n [rows]=\"3\"\n [apiMeta]=\"ques.subText\"\n [direction]=\"direction\"\n (inputValue)=\"childEventCapture($event.value,$event.question, 'nxt-input')\"\n >\n </nxt-input>\n </div>\n </div>\n </ng-container>\n </div>\n</div>\n\n<!--SKS25MAR25 Modal Overlay -->\n<div class=\"modal-overlay\" *ngIf=\"isImageEdit\">\n <div class=\"modal-content\">\n <span class=\"close-button\" (click)=\"closeModal()\">\u00D7</span>\n\n <!-- Image Editor -->\n <div *ngIf=\"selectedImageElement?.type === 'Image'\">\n <div style=\"height: 200px;\">\n <image-cropper *ngIf=\"selectedImageElement.imageData\" [imageBase64]=\"selectedImageElement.orgImageData\"\n [disabled]=\"false\" [alignImage]=\"alignImage\" [roundCropper]=\"roundCropper\" [backgroundColor]=\"'white'\"\n imageAltText=\"Alternative image text\" [allowMoveImage]=\"false\" [hideResizeSquares]=\"false\"\n [canvasRotation]=\"canvasRotation\" [aspectRatio]=\"aspectRatio\" [containWithinAspectRatio]=\"false\"\n [maintainAspectRatio]=\"false\" [cropperStaticWidth]=\"cropperStaticWidth\"\n [cropperStaticHeight]=\"cropperStaticHeight\" [cropperMinWidth]=\"cropperMinWidth\"\n [cropperMinHeight]=\"cropperMinHeight\" [cropperMaxWidth]=\"cropperMaxWidth\"\n [cropperMaxHeight]=\"cropperMaxHeight\" [resetCropOnAspectRatioChange]='true' [(cropper)]=\"cropper\"\n [(transform)]=\"transform\" [onlyScaleDown]=\"true\" output=\"blob\" format=\"png\"\n (imageCropped)=\"imageCropped($event)\" (cropperReady)=\"cropperReady($event)\">\n </image-cropper>\n </div>\n\n <!-- Controls -->\n <div *ngIf=\"selectedImageElement.imageData\" class=\"controls\">\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateLeft()\" title=\"Rotate Left\">\u27F2</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateRight()\" title=\"Rotate Right\">\u27F3</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomOut()\" title=\"Zoom Out\">-</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomIn()\" title=\"Zoom In\">+</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveLeft()\" title=\"Move Left\">\u2190</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveRight()\" title=\"Move Right\">\u2192</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveUp()\" title=\"Move Up\">\u2191</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveDown()\" title=\"Move Down\">\u2193</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipHorizontal()\" [class.enabled]=\"transform.flipH\"\n title=\"Flip Horizontally\">\u2194</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipVertical()\" [class.enabled]=\"transform.flipV\"\n title=\"Flip Vertically\">\u2195</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"resetImage()\" title=\"Reset\">\u00D7</div>\n </div>\n </div>\n </div>\n</div>", styles: [".col-lg-6{width:100%}.myt-font7{display:flex;justify-content:flex-start;align-items:center}.icon{display:inline-block;width:15px;height:15px;border-radius:50%;background-color:#08010177;color:#fff;text-align:center;line-height:16px;font-size:11px;font-family:Arial,sans-serif;font-weight:700;margin-left:5px}@media (min-width: 1200px){.col-lg-6{width:50%!important}.col-lg-6,.col-lg-4{padding-left:5px!important;padding-right:5px!important}.form-row{display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap!important;flex-wrap:wrap!important}}.icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background-color:#f5f5f5;border:1px solid #ddd;color:#666;margin-left:4px;font-size:12px;cursor:pointer!important}::ng-deep .mat-tooltip-panel{background:#fff!important}::ng-deep .mat-tooltip{background-color:#fff!important;color:#333!important;white-space:pre-line!important;line-height:1.5!important}.mat-tooltip{padding:8px 16px!important}::ng-deep .white-tooltip{white-space:pre-line!important;line-height:1.5!important}.custom-line{width:100%;border:1px solid #d9d9d9}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.modal-content{background:#fff;padding:20px;width:500px;max-width:90%;border-radius:8px;position:relative;text-align:center}.close-button{position:absolute;top:6px;right:6px;font-size:25px;cursor:pointer;z-index:10}.controls{display:flex;gap:5px;justify-content:center;margin-top:10px}.logo-icon{cursor:pointer;padding:5px;width:35px;border-radius:5px;background:#d3d3d3}.logo-icon:hover{background:#a9a9a9}.enabled{background:#007bff;color:#fff}input[type=checkbox]{width:21px}.boolean-question{display:flex;align-items:center;gap:10px;padding-top:14px;padding-bottom:12px}.form-control[disabled]{border-radius:5px;background-color:#e9ecef!important}\n"] }]
|
|
56927
|
+
], template: "<!-- HA 18JAN24 Added class for styling -->\n<div [style]=\"bookStyle\" class=\"content-box form-group\">\n <div class=\"form-row\">\n <!-- HA 20DEC23 Directive and Question Style from salesforce -->\n <!-- RA09DEC24 Changed keys-->\n <ng-container *ngFor=\"let ques of questions;let i = index\">\n <div [ngStyle]=\"{ display: ques.isHidden ? 'none' : 'block' }\" [class]=\"'col-lg-' + ques.size + ' paddingnone'\" \n [id]=\"ques.id\" [style]=\"ques?.style?.questionStyle\" style=\"margin-top: 5px; margin-bottom: 5px;\">\n <!-- VD 09May24 is hide field change-->\n <div class=\"nxtInputContainer\">\n <!-- AP-28MAR25 Show label if enabled and not a Boolean type -->\n <div [ngClass]=\"{ down2: qbItem?.progressBar }\"\n *ngIf=\"ques.style?.showLabel ? (ques.style?.showLabel && ques.type !== 'Radio' && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'RichTextArea' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' &&ques.type !== 'Email' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label'): (ques.style?.showLabel !== false && ques.type !== 'Boolean' && ques.type !== 'Text' && ques.type !== 'List' && ques?.type !== 'Dropdown' && ques.type !== 'DateTime' && ques.type !== 'month' && ques.type !== 'Location' && ques.type !== 'Number' && ques.type !== 'Date' && ques.type !== 'Time' && ques.type !== 'TextArea' && ques.type !== 'Label' && ques.type !== 'Radio')\"\n [style]=\"ques.style?.labelStyle\">\n <div style=\"gap: 5px; display: flex; align-items: center;\" [style]=\"ques.style?.labelValueStyle\"\n [ngStyle]=\"{\n 'font-family': ques.font,\n 'color': ques.color || '#212529',\n 'font-size': ques.fontSize || '14px',\n 'font-weight': ques.fontWeight || 'normal'\n }\">{{ ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText):''}}\n <div *ngIf=\"ques.isOptional && !ques.isReadOnly \" style=\"color: red;\">*</div>\n <!-- SKS13MAR25 only show on file type -->\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips help text -->\n <div *ngIf=\"ques.questionText && ques?.helpText && ques.type === 'File'\" class=\"icon\"\n [matTooltip]=\"ques?.helpText\" matTooltipClass=\"white-tooltip\">i</div>\n <!-- RS 17JAN2025 -->\n <!-- Displays icons with tooltips for file requirements -->\n <div class=\"icon\" *ngIf=\"ques.fieldsMeta && ques.type === 'File'\"\n [matTooltip]=\"getFileRequirements(ques.fieldsMeta)\" matTooltipClass=\"white-tooltip\"\n style=\"margin-left: 4px;\">i</div>\n </div>\n </div>\n <!-- calendar -->\n <div *ngIf=\"ques.type === 'Calendar'\">\n <app-custom-calendar [question]=\"ques\" (eventSelected)=\"getCalendarEvent($event)\"\n (dateSelected)=\"getCurrentCalendar($event)\" (openModal)=\"openCalendarModal($event)\"\n (closeModal)=\"closeCalendarModal($event)\"></app-custom-calendar>\n <!-- model used in calendar component -->\n <app-custom-model *ngIf=\"isCalendarModalOpen\" [modalTitle]=\"calendarModalTitle\"\n [isModalOpen]=\"isCalendarModalOpen\" [modalSize]=\"calendarModalSize\"\n [saveButtonValue]=\"calendarSaveButtonValue\" [modalFooter]=\"modalCalendarModalFooter\"\n (saveButtonEmit)=\"onCalendarModalSave()\" (cancelButtonEmit)=\"closeCalendarModal($event)\">\n <lib-questionbook [qbItem]=\"qbRefrenceBook\" [questions]=\"referenceQuestions\"\n (handleQuestion)=\"handleQuestionEvent($event)\"></lib-questionbook>\n </app-custom-model>\n </div>\n <!-- SKS25MAR25 Image -->\n <div *ngIf=\"ques.type === 'Image'\" (mouseenter)=\"isImageHover = true;\"\n (mouseleave)=\"isImageHover = false;\">\n <div *ngIf=\"isImageHover\" style=\"display: flex; justify-content: end;\">\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageEdit(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.1067 6.07174L9.92833 4.8934L2.16667 12.6551V13.8334H3.345L11.1067 6.07174ZM12.285 4.8934L13.4633 3.71507L12.285 2.53674L11.1067 3.71507L12.285 4.8934ZM4.035 15.5001H0.5V11.9642L11.6958 0.768403C11.8521 0.612177 12.064 0.524414 12.285 0.524414C12.506 0.524414 12.7179 0.612177 12.8742 0.768403L15.2317 3.1259C15.3879 3.28218 15.4757 3.4941 15.4757 3.71507C15.4757 3.93604 15.3879 4.14796 15.2317 4.30424L4.03583 15.5001H4.035Z\"\n fill=\"#6C757D\" />\n </svg>\n <svg *ngIf=\"!ques.isReadOnly\" (click)=\"onImageDelete(ques)\" width=\"16\" height=\"16\"\n viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M14 3.98726C11.78 3.76726 9.54667 3.65393 7.32 3.65393C6 3.65393 4.68 3.7206 3.36 3.85393L2 3.98726\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M5.6665 3.31362L5.81317 2.44028C5.91984 1.80695 5.99984 1.33362 7.1265 1.33362H8.87317C9.99984 1.33362 10.0865 1.83362 10.1865 2.44695L10.3332 3.31362\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path\n d=\"M12.5667 6.09375L12.1334 12.8071C12.06 13.8537 12 14.6671 10.14 14.6671H5.86002C4.00002 14.6671 3.94002 13.8537 3.86668 12.8071L3.43335 6.09375\"\n stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.88647 11.0004H9.10647\" stroke=\"#FF2C10\" stroke-width=\"1.5\"\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M6.3335 8.33325H9.66683\" stroke=\"#FF2C10\" stroke-width=\"1.5\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </div>\n <img *ngIf=\"ques.isReadOnly\" [src]=\"ques.imageData\" />\n <div *ngIf=\"!ques.isReadOnly\" class=\"logo-container\">\n <!-- Logo preview area -->\n <div class=\"logo-preview\" *ngIf=\"ques.input\">\n <img [src]=\"ques.imageData\" />\n </div>\n\n <!-- Upload button -->\n <div *ngIf=\"!ques.imageData\" class=\"logo-upload-placeholder\">\n <label for=\"logo-upload-{{i}}\" class=\"logo-upload-label\">\n <img src=\"../assets/icons/Image.svg\" alt=\"Upload\" />\n <span>Upload Image</span>\n </label>\n <input type=\"file\" id=\"logo-upload-{{i}}\" accept=\"image/*\"\n (change)=\"fileChangeEvent(ques, $event)\" style=\"display: none;\" />\n </div>\n </div>\n </div>\n <!-- MSM10JUL25 icon-selector -->\n <nxt-icon-selector [allIcons]=\"allIcons\" *ngIf=\"ques.type === 'Icon'\" [required]=\"ques.isOptional\" [mode]=\"isEdit !== true ? 'view' : 'edit'\" [question]=\"ques\" [labelFont]=\"ques.font\"\n [label]=\" ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\" [labelWeight]=\"ques.fontWeight\" [showLabel]=\"ques.style?.showLabel\" (iconSelected)=\"childEventCapture($event, ques);\"></nxt-icon-selector>\n\n <!-- SKS21MAR25 line -->\n <hr *ngIf=\"ques.type === 'Line'\" class=\"custom-line\" style=\"display: inline-flex\" />\n <!-- SKS13MAR25 data table -->\n <nxt-datatable *ngIf=\"ques.type === 'Table'\" isEditRow isDeleteRow actionButton isButtons [question]=\"ques\" from=\"questionBook\"\n (valueChange)=\"childEventCapture($event, ques)\" [apiMeta]=\"ques.subText\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\" [languageCode]=\"languageCode\"\n [tableConfig]=\"ques.tableConfig\" tableId=\"\" [direction]=\"direction\" tableWidth=\"auto\">\n </nxt-datatable>\n <!-- list -->\n <nxt-search-box *ngIf=\"ques.type === 'List'\" [question]=\"ques\" [readOnly]=\"ques.isReadOnly\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [placeHolderText]=\"ques.question || ''\" [value]=\"ques.input\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (searchValueChange)=\"childEventCapture($event.value,$event.question)\">\n </nxt-search-box>\n\n <!-- Dropdown -->\n <!-- HA 09FEB24 Added condition of sqOption to the dropdown -->\n <app-custom-dropdown *ngIf=\"ques?.type === 'Dropdown' && ques?.options\" [options]=\"ques.options\" [token]=\"token\" [apiMeta]=\"ques.subText\"\n [id]=\"ques.id\" [selectedValue]=\"qbItem.isShengel ? ques.input : ques.selectedValue\"\n placeholder=\"---{{'SELECT' | nxtCustomTranslate : 'select'}}---\"\n [errorMessage]=\"ques.errorMessage\" [referenceField]=\"ques.referenceField\"\n [readOnly]=\"ques.isReadOnly\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question)\">\n </app-custom-dropdown>\n <!-- // VD 02Aug24 custom-radio component -->\n <div *ngIf=\"ques.type === 'Radio' && ques?.options\" class=\"\">\n <app-custom-radio [options]=\"ques.options\" [question]=\"ques\" [token]=\"token\" [apiMeta]=\"ques.subText\" [id]=\"ques.id\"\n [selectedValue]=\"ques.selectedValue\" [errorMessage]=\"ques.errorMessage\"\n [referenceField]=\"ques.referenceField\" [readOnly]=\"ques.isReadOnly\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n (valueChange)=\"childEventCapture($event.value,$event.question)\">\n </app-custom-radio>\n </div>\n\n <!-- Attachment / Files -->\n <nxt-file-upload *ngIf=\"ques.type === 'File'\" [question]=\"ques\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [allFiles]=\"ques.input\" (selectedFileData)=\"childEventCapture($event.value,$event.question)\"\n (deletedFileData)=\"deleteFile($event)\"\n >\n </nxt-file-upload>\n <!-- SKS11JUN25 Button -->\n <nxt-button\n *ngIf=\"ques.type === 'Button'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [btnHeight]=\"'50px'\" [btnWidth]=\"'150px'\" [buttonValue]=\"ques?.question\"\n (buttonClickEmit)=\"childEventCapture($event, ques)\"\n >\n </nxt-button>\n <!-- SKS11JUN25 book type -->\n <lib-questionbook *ngIf=\"ques.type === 'Book'\" [qbItem]=\"ques.qbItem\" [labelValue]=\"labelValue\"\n [questions]=\"ques?.qbReferenceQuestions?.bookQuestionsMap?.[ques?.qbReference]?.subQuestions\"\n (handleDropDown)=\"getDropDown($event)\"></lib-questionbook>\n <!-- SKS11JUN25 Text, Email, label, number, Boolean, rich text editor, DateTime, Date, Time-->\n <nxt-input *ngIf=\"ques.type === 'Text' || ques.type === 'Email' || ques.type === 'Number' || ques.type === 'Label' || ques.type === 'Boolean' || ques.type === 'RichTextArea' || ques.type === 'DateTime' || ques.type === 'month' || ques.type === 'Date' || ques.type === 'Time' || ques.type === 'TextArea' || ques.type === 'Location'\"\n [type]=\"ques.type === 'Text' ? 'text' : ques.type === 'Email' ? 'email' : ques.type === 'Number' ? 'number' : ques.type === 'Label' ? 'label' : ques.type === 'Boolean' ? 'checkbox' : ques.type === 'RichTextArea' ? 'richtext' : ques.type === 'DateTime' ? 'datetime' : ques.type === 'Date' ? 'date' : ques.type === 'Time' ? 'time' : ques.type === 'TextArea' ? 'textarea' : ques.type === 'month' ? 'month' : ques.type === 'Location' ? 'location' : 'text'\"\n [mode]=\"isEdit !== true ? 'view' : 'edit'\"\n [value]=\"ques.input\"\n [question]=\"ques\"\n [apiKey]=\"qbItem['apiKey']\"\n [labelFont]=\"ques.font\"\n [label]=\"ques?.questionText ? ((ques.id+'.questionText') | nxtCustomTranslate : ques?.questionText): ''\"\n [labelColor]=\"ques.color\"\n [labelSize]=\"ques.fontSize\"\n [inputValueSize]=\"ques.fontSize\"\n [labelWeight]=\"ques.fontWeight\"\n [inputWeight]=\"ques.fontWeight\"\n [showLabel]=\"ques.style?.showLabel\"\n inputBorder=\"#ccc\" svgHeight=\"20px\" svgWidth=\"20px\"\n [placeholder]=\"ques?.question ? ((ques.id+'.question') | nxtCustomTranslate : ques?.question ): ''\"\n [required]=\"ques.isOptional\" inputBgColor=\"#ffffff\"\n [inputId]=\"ques.trackingId\"\n [errorMessages]=\"{ required: 'This field is required' }\"\n [inputIconLeftSrc]=\"ques.iconLeftSrc\" \n [minDate]=\"ques.minDate\"\n [rows]=\"3\"\n [apiMeta]=\"ques.subText\"\n [direction]=\"direction\"\n (inputValue)=\"childEventCapture($event.value,$event.question, 'nxt-input')\"\n >\n </nxt-input>\n </div>\n </div>\n </ng-container>\n </div>\n</div>\n\n<!--SKS25MAR25 Modal Overlay -->\n<div class=\"modal-overlay\" *ngIf=\"isImageEdit\">\n <div class=\"modal-content\">\n <span class=\"close-button\" (click)=\"closeModal()\">\u00D7</span>\n\n <!-- Image Editor -->\n <div *ngIf=\"selectedImageElement?.type === 'Image'\">\n <div style=\"height: 200px;\">\n <image-cropper *ngIf=\"selectedImageElement.imageData\" [imageBase64]=\"selectedImageElement.orgImageData\"\n [disabled]=\"false\" [alignImage]=\"alignImage\" [roundCropper]=\"roundCropper\" [backgroundColor]=\"'white'\"\n imageAltText=\"Alternative image text\" [allowMoveImage]=\"false\" [hideResizeSquares]=\"false\"\n [canvasRotation]=\"canvasRotation\" [aspectRatio]=\"aspectRatio\" [containWithinAspectRatio]=\"false\"\n [maintainAspectRatio]=\"false\" [cropperStaticWidth]=\"cropperStaticWidth\"\n [cropperStaticHeight]=\"cropperStaticHeight\" [cropperMinWidth]=\"cropperMinWidth\"\n [cropperMinHeight]=\"cropperMinHeight\" [cropperMaxWidth]=\"cropperMaxWidth\"\n [cropperMaxHeight]=\"cropperMaxHeight\" [resetCropOnAspectRatioChange]='true' [(cropper)]=\"cropper\"\n [(transform)]=\"transform\" [onlyScaleDown]=\"true\" output=\"blob\" format=\"png\"\n (imageCropped)=\"imageCropped($event)\" (cropperReady)=\"cropperReady($event)\">\n </image-cropper>\n </div>\n\n <!-- Controls -->\n <div *ngIf=\"selectedImageElement.imageData\" class=\"controls\">\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateLeft()\" title=\"Rotate Left\">\u27F2</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"rotateRight()\" title=\"Rotate Right\">\u27F3</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomOut()\" title=\"Zoom Out\">-</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"zoomIn()\" title=\"Zoom In\">+</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveLeft()\" title=\"Move Left\">\u2190</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveRight()\" title=\"Move Right\">\u2192</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveUp()\" title=\"Move Up\">\u2191</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"moveDown()\" title=\"Move Down\">\u2193</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipHorizontal()\" [class.enabled]=\"transform.flipH\"\n title=\"Flip Horizontally\">\u2194</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"flipVertical()\" [class.enabled]=\"transform.flipV\"\n title=\"Flip Vertically\">\u2195</div>\n <div class=\"cursor-pointer logo-icon\" (click)=\"resetImage()\" title=\"Reset\">\u00D7</div>\n </div>\n </div>\n </div>\n</div>", styles: [".col-lg-6{width:100%}.myt-font7{display:flex;justify-content:flex-start;align-items:center}.icon{display:inline-block;width:15px;height:15px;border-radius:50%;background-color:#08010177;color:#fff;text-align:center;line-height:16px;font-size:11px;font-family:Arial,sans-serif;font-weight:700;margin-left:5px}@media (min-width: 1200px){.col-lg-6{width:50%!important}.col-lg-6,.col-lg-4{padding-left:5px!important;padding-right:5px!important}.form-row{display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap!important;flex-wrap:wrap!important}}.icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background-color:#f5f5f5;border:1px solid #ddd;color:#666;margin-left:4px;font-size:12px;cursor:pointer!important}::ng-deep .mat-tooltip-panel{background:#fff!important}::ng-deep .mat-tooltip{background-color:#fff!important;color:#333!important;white-space:pre-line!important;line-height:1.5!important}.mat-tooltip{padding:8px 16px!important}::ng-deep .white-tooltip{white-space:pre-line!important;line-height:1.5!important}.custom-line{width:100%;border:1px solid #d9d9d9}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.modal-content{background:#fff;padding:20px;width:500px;max-width:90%;border-radius:8px;position:relative;text-align:center}.close-button{position:absolute;top:6px;right:6px;font-size:25px;cursor:pointer;z-index:10}.controls{display:flex;gap:5px;justify-content:center;margin-top:10px}.logo-icon{cursor:pointer;padding:5px;width:35px;border-radius:5px;background:#d3d3d3}.logo-icon:hover{background:#a9a9a9}.enabled{background:#007bff;color:#fff}input[type=checkbox]{width:21px}.boolean-question{display:flex;align-items:center;gap:10px;padding-top:14px;padding-bottom:12px}.form-control[disabled]{border-radius:5px;background-color:#e9ecef!important}\n"] }]
|
|
56917
56928
|
}], ctorParameters: () => [{ type: SalesforceService }, { type: DataService }, { type: ChangeService }, { type: StorageService }, { type: i0.ChangeDetectorRef }, { type: Document, decorators: [{
|
|
56918
56929
|
type: Inject,
|
|
56919
56930
|
args: [DOCUMENT]
|
|
@@ -57584,7 +57595,7 @@ const VERSION = {
|
|
|
57584
57595
|
"semver": null,
|
|
57585
57596
|
"suffix": "68a4eb8b-dirty",
|
|
57586
57597
|
"semverString": null,
|
|
57587
|
-
"version": "2.1.
|
|
57598
|
+
"version": "2.1.291"
|
|
57588
57599
|
};
|
|
57589
57600
|
/* tslint:enable */
|
|
57590
57601
|
|