cat-qw-lib 2.5.24 → 2.5.27
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/cat-qw-lib.mjs +49 -21
- package/fesm2022/cat-qw-lib.mjs.map +1 -1
- package/lib/queue/components/queue-filter-dropdown/queue-filter-dropdown.component.d.ts +0 -1
- package/lib/queue/services/queue-filter-dropdown.service.d.ts +11 -1
- package/lib/queue/state/queue.service.d.ts +1 -0
- package/lib/shared/constant/SHARED.d.ts +1 -1
- package/package.json +1 -1
package/fesm2022/cat-qw-lib.mjs
CHANGED
|
@@ -206,6 +206,7 @@ class SHARED {
|
|
|
206
206
|
static TASK_COMPLETION_PERCENT = 'taskCompletionPercent';
|
|
207
207
|
static RISK_RATING = 'riskRating';
|
|
208
208
|
static LENDING = 'lending';
|
|
209
|
+
static UNASSIGNED_UNDERWRITER_ID = 'unassigned';
|
|
209
210
|
}
|
|
210
211
|
const widgetLayoutTypeList = [
|
|
211
212
|
{ name: 'Row', value: 'row' },
|
|
@@ -496,7 +497,6 @@ const QUEUE_RECORD_TABLE_COLUMN_WIDTH_LIST = {
|
|
|
496
497
|
applicants: 'w-3',
|
|
497
498
|
finance: 'w-3',
|
|
498
499
|
valuationStatus: 'w-2',
|
|
499
|
-
assignedTo: 'w-3',
|
|
500
500
|
sla: 'w-3',
|
|
501
501
|
appId: 'w-2',
|
|
502
502
|
tasks: 'w-2'
|
|
@@ -509,7 +509,6 @@ const FIELD_DISPLAY_NAMES = {
|
|
|
509
509
|
finance: 'Finance Amount',
|
|
510
510
|
securityAddress: 'Security',
|
|
511
511
|
valuationStatus: 'Val status',
|
|
512
|
-
assignedTo: 'Assigned To',
|
|
513
512
|
sla: 'SLA',
|
|
514
513
|
pending: 'Age',
|
|
515
514
|
lending: 'Type',
|
|
@@ -524,7 +523,6 @@ const QUEUE_RECORD_TABLE_COLUMN_ORDER = [
|
|
|
524
523
|
'finance',
|
|
525
524
|
'securityAddress',
|
|
526
525
|
'pending',
|
|
527
|
-
'assignedTo',
|
|
528
526
|
'sla',
|
|
529
527
|
'valuationStatus',
|
|
530
528
|
'lending',
|
|
@@ -2397,13 +2395,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
|
|
|
2397
2395
|
type: Input
|
|
2398
2396
|
}] } });
|
|
2399
2397
|
|
|
2400
|
-
// Constant for unassigned underwriter filter value
|
|
2401
|
-
const UNASSIGNED_UNDERWRITER_ID = 'unassigned';
|
|
2402
2398
|
/**
|
|
2403
2399
|
*
|
|
2404
2400
|
*/
|
|
2405
2401
|
class QueueFilterDropdownService extends BaseService {
|
|
2406
2402
|
configService;
|
|
2403
|
+
searchSubject = new Subject();
|
|
2407
2404
|
constructor(http, configService, store, listService) {
|
|
2408
2405
|
super(http, store, configService, listService);
|
|
2409
2406
|
this.configService = configService;
|
|
@@ -2619,8 +2616,8 @@ class QueueFilterDropdownService extends BaseService {
|
|
|
2619
2616
|
}
|
|
2620
2617
|
if (filters.assignedUnderwriter && filters.assignedUnderwriter.length > 0) {
|
|
2621
2618
|
// Separate approach: Use unassigned boolean param and underwriterId for actual IDs
|
|
2622
|
-
const hasUnassigned = filters.assignedUnderwriter.includes(UNASSIGNED_UNDERWRITER_ID);
|
|
2623
|
-
const realUnderwriterIds = filters.assignedUnderwriter.filter(id => id !== UNASSIGNED_UNDERWRITER_ID);
|
|
2619
|
+
const hasUnassigned = filters.assignedUnderwriter.includes(SHARED.UNASSIGNED_UNDERWRITER_ID);
|
|
2620
|
+
const realUnderwriterIds = filters.assignedUnderwriter.filter(id => id !== SHARED.UNASSIGNED_UNDERWRITER_ID);
|
|
2624
2621
|
// Set unassigned parameter if "unassigned" is selected
|
|
2625
2622
|
if (hasUnassigned) {
|
|
2626
2623
|
filterParams['unassigned'] = 'true';
|
|
@@ -2654,6 +2651,22 @@ class QueueFilterDropdownService extends BaseService {
|
|
|
2654
2651
|
return of([]);
|
|
2655
2652
|
}));
|
|
2656
2653
|
}
|
|
2654
|
+
/**
|
|
2655
|
+
* Triggers a search for underwriters with debounce
|
|
2656
|
+
* @param {string} searchKey - The search term to filter underwriters
|
|
2657
|
+
*/
|
|
2658
|
+
searchUnderwriters(searchKey = SHARED.EMPTY) {
|
|
2659
|
+
this.searchSubject.next(searchKey);
|
|
2660
|
+
}
|
|
2661
|
+
/**
|
|
2662
|
+
* Returns an Observable that emits underwriter options with debounce and distinctUntilChanged
|
|
2663
|
+
* @returns {Observable<UnderwriterOption[]>} Observable of underwriter options array
|
|
2664
|
+
*/
|
|
2665
|
+
getUnderwritersSearchObservable() {
|
|
2666
|
+
return this.searchSubject.pipe(debounceTime$1(300), distinctUntilChanged$1(), switchMap((searchKey) => {
|
|
2667
|
+
return this.getUnderwritersList(searchKey || SHARED.EMPTY);
|
|
2668
|
+
}));
|
|
2669
|
+
}
|
|
2657
2670
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueFilterDropdownService, deps: [{ token: i1$1.HttpClient }, { token: AppConfigService }, { token: BaseStore }, { token: ListService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2658
2671
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueFilterDropdownService, providedIn: 'root' });
|
|
2659
2672
|
}
|
|
@@ -6607,6 +6620,7 @@ class QueueService extends BaseService {
|
|
|
6607
6620
|
/**
|
|
6608
6621
|
* Fetches paginated queue records using the provided apiConfig URL with search and pagination support.
|
|
6609
6622
|
* This is the unified method used for both initial data loading and search functionality.
|
|
6623
|
+
* Uses POST method with underwriterIds and unassigned in body, other params in query string.
|
|
6610
6624
|
* @param {string} apiConfig - The full API endpoint to fetch records for the selected queue
|
|
6611
6625
|
* @param {string} [searchKey] - Optional search term
|
|
6612
6626
|
* @param {number} [page] - Page number (default: 1)
|
|
@@ -6625,16 +6639,34 @@ class QueueService extends BaseService {
|
|
|
6625
6639
|
...(sortBy ? { sortBy } : {}),
|
|
6626
6640
|
...(sortOrder ? { sortOrder } : {})
|
|
6627
6641
|
};
|
|
6642
|
+
// Prepare body for POST request - underwriterIds and unassigned go in body
|
|
6643
|
+
const body = {};
|
|
6628
6644
|
// Add query parameters if they exist
|
|
6629
6645
|
if (query) {
|
|
6630
6646
|
const queryParams = new URLSearchParams(query);
|
|
6631
6647
|
queryParams.forEach((value, key) => {
|
|
6632
|
-
|
|
6648
|
+
// Extract underwriterIds and unassigned for body, keep others in params
|
|
6649
|
+
if (key === 'underwriterId') {
|
|
6650
|
+
// Convert comma-separated string to array for body
|
|
6651
|
+
const underwriterIds = value.split(',').filter(id => id.trim() !== '');
|
|
6652
|
+
if (underwriterIds.length > 0) {
|
|
6653
|
+
body.underwriterIds = underwriterIds;
|
|
6654
|
+
}
|
|
6655
|
+
}
|
|
6656
|
+
else if (key === 'unassigned') {
|
|
6657
|
+
// Convert string to boolean for body
|
|
6658
|
+
body.unassigned = value === 'true';
|
|
6659
|
+
}
|
|
6660
|
+
else {
|
|
6661
|
+
// Keep all other params in query string (including 'all' flag)
|
|
6662
|
+
params[key] = value;
|
|
6663
|
+
}
|
|
6633
6664
|
});
|
|
6634
6665
|
}
|
|
6635
6666
|
const paramsString = new URLSearchParams(params).toString();
|
|
6636
6667
|
url += (url.includes('?') ? '&' : '?') + paramsString;
|
|
6637
|
-
|
|
6668
|
+
// Use POST method with body containing underwriterIds and unassigned
|
|
6669
|
+
return this.http.post(url, body).pipe(tap$1((response) => {
|
|
6638
6670
|
if (response && response.data) {
|
|
6639
6671
|
this.queueStore.set(response.data);
|
|
6640
6672
|
}
|
|
@@ -6776,6 +6808,7 @@ class QueueRecordTableBuilderService extends TableBuilder {
|
|
|
6776
6808
|
SHARED._ID,
|
|
6777
6809
|
SHARED.COMPANY_NAME,
|
|
6778
6810
|
SHARED.APPLICATION_TYPE,
|
|
6811
|
+
SHARED.ASSIGNED_TO,
|
|
6779
6812
|
SHARED.TASK_COMPLETION_PERCENT,
|
|
6780
6813
|
SHARED.RISK_RATING,
|
|
6781
6814
|
SHARED.LENDING,
|
|
@@ -7264,7 +7297,6 @@ class QueueFilterDropdownComponent {
|
|
|
7264
7297
|
loadingUnderwriters = false;
|
|
7265
7298
|
// Cache filters for template bindings to avoid repeated object creation
|
|
7266
7299
|
filters;
|
|
7267
|
-
searchSubject = new Subject();
|
|
7268
7300
|
searchSubscription;
|
|
7269
7301
|
appliedFilters = {}; // Input to sync with container's applied filters
|
|
7270
7302
|
filterApplied = new EventEmitter();
|
|
@@ -7280,11 +7312,10 @@ class QueueFilterDropdownComponent {
|
|
|
7280
7312
|
}
|
|
7281
7313
|
}
|
|
7282
7314
|
setupSearchSubscription() {
|
|
7283
|
-
this.searchSubscription = this.
|
|
7284
|
-
|
|
7285
|
-
})).subscribe((underwriters) => {
|
|
7315
|
+
this.searchSubscription = this.filterService.getUnderwritersSearchObservable()
|
|
7316
|
+
.subscribe((underwriters) => {
|
|
7286
7317
|
// Update options for search/filter - preserve "Unassigned" option if it exists
|
|
7287
|
-
const unassignedOption = this.underwriterOptions.find(opt => opt.id === UNASSIGNED_UNDERWRITER_ID);
|
|
7318
|
+
const unassignedOption = this.underwriterOptions.find(opt => opt.id === SHARED.UNASSIGNED_UNDERWRITER_ID);
|
|
7288
7319
|
if (unassignedOption) {
|
|
7289
7320
|
this.underwriterOptions = [unassignedOption, ...underwriters];
|
|
7290
7321
|
}
|
|
@@ -7297,7 +7328,7 @@ class QueueFilterDropdownComponent {
|
|
|
7297
7328
|
onUnderwriterFilter(event) {
|
|
7298
7329
|
const searchKey = event?.filter || SHARED.EMPTY;
|
|
7299
7330
|
this.loadingUnderwriters = true;
|
|
7300
|
-
this.
|
|
7331
|
+
this.filterService.searchUnderwriters(searchKey);
|
|
7301
7332
|
}
|
|
7302
7333
|
get filterCount() {
|
|
7303
7334
|
return this.filterService.getFilterCount();
|
|
@@ -7322,7 +7353,7 @@ class QueueFilterDropdownComponent {
|
|
|
7322
7353
|
this.loadingUnderwriters = true;
|
|
7323
7354
|
this.filterService.getUnderwritersList(SHARED.EMPTY).subscribe((underwriters) => {
|
|
7324
7355
|
// Add "Unassigned" option at the beginning of the list
|
|
7325
|
-
const unassignedOption = { id: UNASSIGNED_UNDERWRITER_ID, name: 'Unassigned' };
|
|
7356
|
+
const unassignedOption = { id: SHARED.UNASSIGNED_UNDERWRITER_ID, name: 'Unassigned' };
|
|
7326
7357
|
this.underwriterOptions = [unassignedOption, ...underwriters];
|
|
7327
7358
|
this.loadingUnderwriters = false;
|
|
7328
7359
|
});
|
|
@@ -7377,8 +7408,6 @@ class QueueFilterDropdownComponent {
|
|
|
7377
7408
|
}
|
|
7378
7409
|
applyFilters() {
|
|
7379
7410
|
const filterData = this.filterService.getFilters();
|
|
7380
|
-
// Always emit filterApplied event to trigger API call, even if no filters
|
|
7381
|
-
// This ensures the list API is called every time Apply Filters is clicked
|
|
7382
7411
|
this.filterApplied.emit(filterData);
|
|
7383
7412
|
this.filtersApplied = true; // Mark that filters have been applied
|
|
7384
7413
|
this.showDropdown = false;
|
|
@@ -7446,14 +7475,13 @@ class QueueFilterDropdownComponent {
|
|
|
7446
7475
|
if (this.searchSubscription) {
|
|
7447
7476
|
this.searchSubscription.unsubscribe();
|
|
7448
7477
|
}
|
|
7449
|
-
this.searchSubject.complete();
|
|
7450
7478
|
}
|
|
7451
7479
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueFilterDropdownComponent, deps: [{ token: QueueFilterDropdownService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7452
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueFilterDropdownComponent, isStandalone: false, selector: "lib-queue-filter-dropdown", inputs: { appliedFilters: "appliedFilters" }, outputs: { filterApplied: "filterApplied", filtersCleared: "filtersCleared" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "dropdownPanel", first: true, predicate: ["dropdownPanel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"queue-filter-dropdown-wrapper\">\r\n <p-button class=\"filter-btn-wrapper\" (onClick)=\"onFilterBtnClick()\">\r\n <div class=\"flex align-items-center\">\r\n <i class=\"ri-filter-3-line mr-2 mt-1\"></i>\r\n <p class=\"filter-count mb-0 mr-2\">{{ filterCount }}</p>\r\n <p class=\"mb-0\">Filter(s) Applied</p>\r\n <i class=\"pi pi-angle-down ml-2 mt-1\"></i>\r\n </div>\r\n </p-button>\r\n\r\n <div class=\"filter-dropdown-panel\" *ngIf=\"showDropdown\" #dropdownPanel>\r\n <h3 class=\"filter-title\">Queue Filters</h3>\r\n <div class=\"grid form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n\r\n\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Risk Rating</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Low')\"\r\n (onClick)=\"setRiskRating('Low')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Low</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Medium')\"\r\n (onClick)=\"setRiskRating('Medium')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Medium</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('High')\"\r\n (onClick)=\"setRiskRating('High')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">High</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 p-0 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Application Type</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('BTL')\"\r\n (onClick)=\"setApplicationType('BTL')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">BTL</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('HPP')\"\r\n (onClick)=\"setApplicationType('HPP')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">HPP</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"grid form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Category</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('UK')\"\r\n (onClick)=\"setCategory('UK')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">UK</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Ex-Pat')\"\r\n (onClick)=\"setCategory('Ex-Pat')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Ex-Pat</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Intl')\"\r\n (onClick)=\"setCategory('Intl')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Intl</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">EPC</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.epc?.includes('A or B (Green)')\"\r\n (onClick)=\"setEpc('A or B (Green)')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">A or B (Green)</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"grid form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Purchase Type</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.purchaseType.includes('Purchase')\"\r\n (onClick)=\"setPurchaseType('Purchase')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Purchase</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\"\r\n [class.selected]=\"filters.purchaseType.includes('Refinance')\"\r\n (onClick)=\"setPurchaseType('Refinance')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Refinance</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Task Status</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\"\r\n [class.selected]=\"filters.taskStatus.includes('Not Started')\"\r\n (onClick)=\"setTaskStatus('Not Started')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Not Started</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\"\r\n [class.selected]=\"filters.taskStatus.includes('In-progress')\"\r\n (onClick)=\"setTaskStatus('In-progress')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">In-progress</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.taskStatus.includes('Completed')\"\r\n (onClick)=\"setTaskStatus('Completed')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Completed</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"grid p-0 form-grid col-12\">\r\n <div class=\"col-12 pl-3 md:col-6\"> \r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Finance Amount</p>\r\n <div class=\"filter-options two-inputs\">\r\n <div class=\"grid p-0 form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n <input type=\"number\" class=\"w-full\" placeholder=\"Min\" [ngModel]=\"filters.financeMin\"\r\n (ngModelChange)=\"setFinanceMin($event)\" min=\"0\" />\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <input type=\"number\" class=\"w-full\" placeholder=\"Max\" [ngModel]=\"filters.financeMax\"\r\n (ngModelChange)=\"setFinanceMax($event)\" min=\"0\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Pending Days</p>\r\n <div class=\"filter-options one-input\">\r\n <input type=\"number\" placeholder=\"No. of days\" [ngModel]=\"filters.pendingDays\"\r\n (ngModelChange)=\"setPendingDays($event)\" min=\"0\" />\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"grid p-0 form-grid col-12\">\r\n <div class=\"col-12 pl-4 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Vulnerable Customer</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === true\"\r\n (onClick)=\"setVulnerableCustomer(true)\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Yes</p>\r\n </div>\r\n </p-button>\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === false\"\r\n (onClick)=\"setVulnerableCustomer(false)\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">No</p>\r\n </div>\r\n </p-button>\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === null\"\r\n (onClick)=\"setVulnerableCustomer(null)\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Any</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 pl-3 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Assigned Underwriter</p>\r\n <div class=\"filter-options one-input\">\r\n <p-multiSelect [options]=\"underwriterOptions\" optionLabel=\"name\" optionValue=\"id\"\r\n placeholder=\"Select underwriter(s)\" [appendTo]=\"'body'\" [panelStyle]=\"{ zIndex: 1100 }\"\r\n [filter]=\"true\" [loading]=\"loadingUnderwriters\"\r\n [ngModel]=\"filters.assignedUnderwriter\" (ngModelChange)=\"setAssignedUnderwriter($event)\"\r\n (onFilter)=\"onUnderwriterFilter($event)\">\r\n </p-multiSelect>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"filter-actions w-full flex justify-content-between\">\r\n <p-button class=\"pl-3 clear-btn-wrapper\" (onClick)=\"clearAll()\">\r\n <div class=\"flex align-items-center btn-text-wrapper\">\r\n <p class=\"mb-0 mr-2\">Clear All</p>\r\n <i class=\"pi pi-times\"></i>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"apply-btn-wrapper\" (onClick)=\"applyFilters()\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Apply Filters</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>", styles: [".queue-filter-dropdown-wrapper{position:relative;display:inline-block}.filter-dropdown-panel{position:absolute;top:100%;left:50%;transform:translate(-50%);min-width:500%;background:#fff;border:1.5px solid #d1d5db;border-radius:16px;box-shadow:0 8px 32px #101e362e;padding:1.5rem 1.25rem 1rem;z-index:1000}.filter-title{font-weight:600;font-size:16px;margin-bottom:1.25rem}.filter-section{margin-bottom:1.2rem}.filter-label{font-size:1rem;font-weight:500;margin-bottom:.5rem}.filter-options{display:flex;gap:.7rem;flex-wrap:wrap}.filter-options input[type=number],.filter-options input[type=text],.filter-options input[type=date]{width:110px;padding:.45rem .8rem;border:1.5px solid #e0e4ea;border-radius:8px;font-size:1rem;color:#3b4256;background:#fff;transition:border .2s}.filter-options input[type=number]:focus,.filter-options input[type=text]:focus,.filter-options input[type=date]:focus{border:1.5px solid #2563eb;outline:none}.filter-options input[type=number]::-webkit-outer-spin-button,.filter-options input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.filter-options input[type=number]{-moz-appearance:textfield}.filter-actions{display:flex;justify-content:space-between;align-items:center;margin-top:1.7rem}::ng-deep .apply-btn-wrapper .p-button{border:none;padding:8px 16px;border-radius:8px;box-shadow:none}::ng-deep .clear-btn-wrapper .p-button{border:none;color:var(--primary-color);background-color:var(--surface-0);padding:0;border-radius:8px;box-shadow:none}::ng-deep .filter-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:var(--surface-0);padding:8px 16px;border-radius:8px;box-shadow:none;height:44px}::ng-deep .filter-option-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:#f7fafd;padding:4px 18px;border-radius:8px;box-shadow:none}::ng-deep .filter-option-btn-wrapper.selected .p-button{border-radius:8px!important;border:none;color:var(--primary-color);background-color:#e8f0fe;padding:4px 18px;box-shadow:none;border:1.5px solid var(--primary-color)!important}.filter-options input[type=date]{font-family:inherit;color:#3b4256}.filter-options.two-inputs input[type=number]{width:48.5%}.filter-options.one-input input[type=number]{width:100%}.filter-options.one-input ::ng-deep .p-multiselect{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.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: i3$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$4.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] });
|
|
7480
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueFilterDropdownComponent, isStandalone: false, selector: "lib-queue-filter-dropdown", inputs: { appliedFilters: "appliedFilters" }, outputs: { filterApplied: "filterApplied", filtersCleared: "filtersCleared" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "dropdownPanel", first: true, predicate: ["dropdownPanel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"queue-filter-dropdown-wrapper\">\n <p-button class=\"filter-btn-wrapper\" (onClick)=\"onFilterBtnClick()\">\n <div class=\"flex align-items-center\">\n <i class=\"ri-filter-3-line mr-2 mt-1\"></i>\n <p class=\"filter-count mb-0 mr-2\">{{ filterCount }}</p>\n <p class=\"mb-0\">Filter(s) Applied</p>\n <i class=\"pi pi-angle-down ml-2 mt-1\"></i>\n </div>\n </p-button>\n\n <div class=\"filter-dropdown-panel\" *ngIf=\"showDropdown\" #dropdownPanel>\n <h3 class=\"filter-title\">Queue Filters</h3>\n <div class=\"grid form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n\n\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Risk Rating</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Low')\"\n (onClick)=\"setRiskRating('Low')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Low</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Medium')\"\n (onClick)=\"setRiskRating('Medium')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Medium</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('High')\"\n (onClick)=\"setRiskRating('High')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">High</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 p-0 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Application Type</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('BTL')\"\n (onClick)=\"setApplicationType('BTL')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">BTL</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('HPP')\"\n (onClick)=\"setApplicationType('HPP')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">HPP</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n\n <div class=\"grid form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Category</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('UK')\"\n (onClick)=\"setCategory('UK')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">UK</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Ex-Pat')\"\n (onClick)=\"setCategory('Ex-Pat')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Ex-Pat</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Intl')\"\n (onClick)=\"setCategory('Intl')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Intl</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">EPC</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.epc?.includes('A or B (Green)')\"\n (onClick)=\"setEpc('A or B (Green)')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">A or B (Green)</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"grid form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Purchase Type</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.purchaseType.includes('Purchase')\"\n (onClick)=\"setPurchaseType('Purchase')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Purchase</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\"\n [class.selected]=\"filters.purchaseType.includes('Refinance')\"\n (onClick)=\"setPurchaseType('Refinance')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Refinance</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Task Status</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\"\n [class.selected]=\"filters.taskStatus.includes('Not Started')\"\n (onClick)=\"setTaskStatus('Not Started')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Not Started</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\"\n [class.selected]=\"filters.taskStatus.includes('In-progress')\"\n (onClick)=\"setTaskStatus('In-progress')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">In-progress</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.taskStatus.includes('Completed')\"\n (onClick)=\"setTaskStatus('Completed')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Completed</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"grid p-0 form-grid col-12\">\n <div class=\"col-12 pl-3 md:col-6\"> \n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Finance Amount</p>\n <div class=\"filter-options two-inputs\">\n <div class=\"grid p-0 form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n <input type=\"number\" class=\"w-full\" placeholder=\"Min\" [ngModel]=\"filters.financeMin\"\n (ngModelChange)=\"setFinanceMin($event)\" min=\"0\" />\n </div>\n <div class=\"col-12 md:col-6\">\n <input type=\"number\" class=\"w-full\" placeholder=\"Max\" [ngModel]=\"filters.financeMax\"\n (ngModelChange)=\"setFinanceMax($event)\" min=\"0\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Pending Days</p>\n <div class=\"filter-options one-input\">\n <input type=\"number\" placeholder=\"No. of days\" [ngModel]=\"filters.pendingDays\"\n (ngModelChange)=\"setPendingDays($event)\" min=\"0\" />\n </div>\n </div>\n </div>\n\n <div class=\"grid p-0 form-grid col-12\">\n <div class=\"col-12 pl-4 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Vulnerable Customer</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === true\"\n (onClick)=\"setVulnerableCustomer(true)\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Yes</p>\n </div>\n </p-button>\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === false\"\n (onClick)=\"setVulnerableCustomer(false)\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">No</p>\n </div>\n </p-button>\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === null\"\n (onClick)=\"setVulnerableCustomer(null)\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Any</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 pl-3 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Assigned Underwriter</p>\n <div class=\"filter-options one-input\">\n <p-multiSelect [options]=\"underwriterOptions\" optionLabel=\"name\" optionValue=\"id\"\n placeholder=\"Select underwriter(s)\" [appendTo]=\"'body'\" [panelStyle]=\"{ zIndex: 1100 }\"\n [filter]=\"true\" [loading]=\"loadingUnderwriters\"\n [ngModel]=\"filters.assignedUnderwriter\" (ngModelChange)=\"setAssignedUnderwriter($event)\"\n (onFilter)=\"onUnderwriterFilter($event)\">\n </p-multiSelect>\n </div>\n </div>\n </div>\n </div>\n <div class=\"filter-actions w-full flex justify-content-between\">\n <p-button class=\"pl-3 clear-btn-wrapper\" (onClick)=\"clearAll()\">\n <div class=\"flex align-items-center btn-text-wrapper\">\n <p class=\"mb-0 mr-2\">Clear All</p>\n <i class=\"pi pi-times\"></i>\n </div>\n </p-button>\n\n <p-button class=\"apply-btn-wrapper\" (onClick)=\"applyFilters()\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Apply Filters</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>", styles: [".queue-filter-dropdown-wrapper{position:relative;display:inline-block}.filter-dropdown-panel{position:absolute;top:100%;left:50%;transform:translate(-50%);min-width:500%;background:#fff;border:1.5px solid #d1d5db;border-radius:16px;box-shadow:0 8px 32px #101e362e;padding:1.5rem 1.25rem 1rem;z-index:1000}.filter-title{font-weight:600;font-size:16px;margin-bottom:1.25rem}.filter-section{margin-bottom:1.2rem}.filter-label{font-size:1rem;font-weight:500;margin-bottom:.5rem}.filter-options{display:flex;gap:.7rem;flex-wrap:wrap}.filter-options input[type=number],.filter-options input[type=text],.filter-options input[type=date]{width:110px;padding:.45rem .8rem;border:1.5px solid #e0e4ea;border-radius:8px;font-size:1rem;color:#3b4256;background:#fff;transition:border .2s}.filter-options input[type=number]:focus,.filter-options input[type=text]:focus,.filter-options input[type=date]:focus{border:1.5px solid #2563eb;outline:none}.filter-options input[type=number]::-webkit-outer-spin-button,.filter-options input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.filter-options input[type=number]{-moz-appearance:textfield}.filter-actions{display:flex;justify-content:space-between;align-items:center;margin-top:1.7rem}::ng-deep .apply-btn-wrapper .p-button{border:none;padding:8px 16px;border-radius:8px;box-shadow:none}::ng-deep .clear-btn-wrapper .p-button{border:none;color:var(--primary-color);background-color:var(--surface-0);padding:0;border-radius:8px;box-shadow:none}::ng-deep .filter-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:var(--surface-0);padding:8px 16px;border-radius:8px;box-shadow:none;height:44px}::ng-deep .filter-option-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:#f7fafd;padding:4px 18px;border-radius:8px;box-shadow:none}::ng-deep .filter-option-btn-wrapper.selected .p-button{border-radius:8px!important;border:none;color:var(--primary-color);background-color:#e8f0fe;padding:4px 18px;box-shadow:none;border:1.5px solid var(--primary-color)!important}.filter-options input[type=date]{font-family:inherit;color:#3b4256}.filter-options.two-inputs input[type=number]{width:48.5%}.filter-options.one-input input[type=number]{width:100%}.filter-options.one-input ::ng-deep .p-multiselect{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.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: i3$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$4.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] });
|
|
7453
7481
|
}
|
|
7454
7482
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueFilterDropdownComponent, decorators: [{
|
|
7455
7483
|
type: Component,
|
|
7456
|
-
args: [{ selector: 'lib-queue-filter-dropdown', standalone: false, template: "<div class=\"queue-filter-dropdown-wrapper\">\r\n <p-button class=\"filter-btn-wrapper\" (onClick)=\"onFilterBtnClick()\">\r\n <div class=\"flex align-items-center\">\r\n <i class=\"ri-filter-3-line mr-2 mt-1\"></i>\r\n <p class=\"filter-count mb-0 mr-2\">{{ filterCount }}</p>\r\n <p class=\"mb-0\">Filter(s) Applied</p>\r\n <i class=\"pi pi-angle-down ml-2 mt-1\"></i>\r\n </div>\r\n </p-button>\r\n\r\n <div class=\"filter-dropdown-panel\" *ngIf=\"showDropdown\" #dropdownPanel>\r\n <h3 class=\"filter-title\">Queue Filters</h3>\r\n <div class=\"grid form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n\r\n\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Risk Rating</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Low')\"\r\n (onClick)=\"setRiskRating('Low')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Low</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Medium')\"\r\n (onClick)=\"setRiskRating('Medium')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Medium</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('High')\"\r\n (onClick)=\"setRiskRating('High')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">High</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 p-0 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Application Type</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('BTL')\"\r\n (onClick)=\"setApplicationType('BTL')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">BTL</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('HPP')\"\r\n (onClick)=\"setApplicationType('HPP')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">HPP</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"grid form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Category</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('UK')\"\r\n (onClick)=\"setCategory('UK')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">UK</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Ex-Pat')\"\r\n (onClick)=\"setCategory('Ex-Pat')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Ex-Pat</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Intl')\"\r\n (onClick)=\"setCategory('Intl')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Intl</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">EPC</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.epc?.includes('A or B (Green)')\"\r\n (onClick)=\"setEpc('A or B (Green)')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">A or B (Green)</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"grid form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Purchase Type</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.purchaseType.includes('Purchase')\"\r\n (onClick)=\"setPurchaseType('Purchase')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Purchase</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\"\r\n [class.selected]=\"filters.purchaseType.includes('Refinance')\"\r\n (onClick)=\"setPurchaseType('Refinance')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Refinance</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Task Status</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\"\r\n [class.selected]=\"filters.taskStatus.includes('Not Started')\"\r\n (onClick)=\"setTaskStatus('Not Started')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Not Started</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\"\r\n [class.selected]=\"filters.taskStatus.includes('In-progress')\"\r\n (onClick)=\"setTaskStatus('In-progress')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">In-progress</p>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.taskStatus.includes('Completed')\"\r\n (onClick)=\"setTaskStatus('Completed')\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Completed</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"grid p-0 form-grid col-12\">\r\n <div class=\"col-12 pl-3 md:col-6\"> \r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Finance Amount</p>\r\n <div class=\"filter-options two-inputs\">\r\n <div class=\"grid p-0 form-grid col-12\">\r\n <div class=\"col-12 md:col-6\">\r\n <input type=\"number\" class=\"w-full\" placeholder=\"Min\" [ngModel]=\"filters.financeMin\"\r\n (ngModelChange)=\"setFinanceMin($event)\" min=\"0\" />\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <input type=\"number\" class=\"w-full\" placeholder=\"Max\" [ngModel]=\"filters.financeMax\"\r\n (ngModelChange)=\"setFinanceMax($event)\" min=\"0\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Pending Days</p>\r\n <div class=\"filter-options one-input\">\r\n <input type=\"number\" placeholder=\"No. of days\" [ngModel]=\"filters.pendingDays\"\r\n (ngModelChange)=\"setPendingDays($event)\" min=\"0\" />\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"grid p-0 form-grid col-12\">\r\n <div class=\"col-12 pl-4 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Vulnerable Customer</p>\r\n <div class=\"filter-options\">\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === true\"\r\n (onClick)=\"setVulnerableCustomer(true)\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Yes</p>\r\n </div>\r\n </p-button>\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === false\"\r\n (onClick)=\"setVulnerableCustomer(false)\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">No</p>\r\n </div>\r\n </p-button>\r\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === null\"\r\n (onClick)=\"setVulnerableCustomer(null)\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Any</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 pl-3 md:col-6\">\r\n <div class=\"filter-section\">\r\n <p class=\"filter-label m-0 mb-2\">Assigned Underwriter</p>\r\n <div class=\"filter-options one-input\">\r\n <p-multiSelect [options]=\"underwriterOptions\" optionLabel=\"name\" optionValue=\"id\"\r\n placeholder=\"Select underwriter(s)\" [appendTo]=\"'body'\" [panelStyle]=\"{ zIndex: 1100 }\"\r\n [filter]=\"true\" [loading]=\"loadingUnderwriters\"\r\n [ngModel]=\"filters.assignedUnderwriter\" (ngModelChange)=\"setAssignedUnderwriter($event)\"\r\n (onFilter)=\"onUnderwriterFilter($event)\">\r\n </p-multiSelect>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"filter-actions w-full flex justify-content-between\">\r\n <p-button class=\"pl-3 clear-btn-wrapper\" (onClick)=\"clearAll()\">\r\n <div class=\"flex align-items-center btn-text-wrapper\">\r\n <p class=\"mb-0 mr-2\">Clear All</p>\r\n <i class=\"pi pi-times\"></i>\r\n </div>\r\n </p-button>\r\n\r\n <p-button class=\"apply-btn-wrapper\" (onClick)=\"applyFilters()\">\r\n <div class=\"flex align-items-center\">\r\n <p class=\"mb-0\">Apply Filters</p>\r\n </div>\r\n </p-button>\r\n </div>\r\n </div>\r\n </div>", styles: [".queue-filter-dropdown-wrapper{position:relative;display:inline-block}.filter-dropdown-panel{position:absolute;top:100%;left:50%;transform:translate(-50%);min-width:500%;background:#fff;border:1.5px solid #d1d5db;border-radius:16px;box-shadow:0 8px 32px #101e362e;padding:1.5rem 1.25rem 1rem;z-index:1000}.filter-title{font-weight:600;font-size:16px;margin-bottom:1.25rem}.filter-section{margin-bottom:1.2rem}.filter-label{font-size:1rem;font-weight:500;margin-bottom:.5rem}.filter-options{display:flex;gap:.7rem;flex-wrap:wrap}.filter-options input[type=number],.filter-options input[type=text],.filter-options input[type=date]{width:110px;padding:.45rem .8rem;border:1.5px solid #e0e4ea;border-radius:8px;font-size:1rem;color:#3b4256;background:#fff;transition:border .2s}.filter-options input[type=number]:focus,.filter-options input[type=text]:focus,.filter-options input[type=date]:focus{border:1.5px solid #2563eb;outline:none}.filter-options input[type=number]::-webkit-outer-spin-button,.filter-options input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.filter-options input[type=number]{-moz-appearance:textfield}.filter-actions{display:flex;justify-content:space-between;align-items:center;margin-top:1.7rem}::ng-deep .apply-btn-wrapper .p-button{border:none;padding:8px 16px;border-radius:8px;box-shadow:none}::ng-deep .clear-btn-wrapper .p-button{border:none;color:var(--primary-color);background-color:var(--surface-0);padding:0;border-radius:8px;box-shadow:none}::ng-deep .filter-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:var(--surface-0);padding:8px 16px;border-radius:8px;box-shadow:none;height:44px}::ng-deep .filter-option-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:#f7fafd;padding:4px 18px;border-radius:8px;box-shadow:none}::ng-deep .filter-option-btn-wrapper.selected .p-button{border-radius:8px!important;border:none;color:var(--primary-color);background-color:#e8f0fe;padding:4px 18px;box-shadow:none;border:1.5px solid var(--primary-color)!important}.filter-options input[type=date]{font-family:inherit;color:#3b4256}.filter-options.two-inputs input[type=number]{width:48.5%}.filter-options.one-input input[type=number]{width:100%}.filter-options.one-input ::ng-deep .p-multiselect{width:100%}\n"] }]
|
|
7484
|
+
args: [{ selector: 'lib-queue-filter-dropdown', standalone: false, template: "<div class=\"queue-filter-dropdown-wrapper\">\n <p-button class=\"filter-btn-wrapper\" (onClick)=\"onFilterBtnClick()\">\n <div class=\"flex align-items-center\">\n <i class=\"ri-filter-3-line mr-2 mt-1\"></i>\n <p class=\"filter-count mb-0 mr-2\">{{ filterCount }}</p>\n <p class=\"mb-0\">Filter(s) Applied</p>\n <i class=\"pi pi-angle-down ml-2 mt-1\"></i>\n </div>\n </p-button>\n\n <div class=\"filter-dropdown-panel\" *ngIf=\"showDropdown\" #dropdownPanel>\n <h3 class=\"filter-title\">Queue Filters</h3>\n <div class=\"grid form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n\n\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Risk Rating</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Low')\"\n (onClick)=\"setRiskRating('Low')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Low</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('Medium')\"\n (onClick)=\"setRiskRating('Medium')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Medium</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.riskRating.includes('High')\"\n (onClick)=\"setRiskRating('High')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">High</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 p-0 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Application Type</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('BTL')\"\n (onClick)=\"setApplicationType('BTL')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">BTL</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.applicationType.includes('HPP')\"\n (onClick)=\"setApplicationType('HPP')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">HPP</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n\n <div class=\"grid form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Category</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('UK')\"\n (onClick)=\"setCategory('UK')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">UK</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Ex-Pat')\"\n (onClick)=\"setCategory('Ex-Pat')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Ex-Pat</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.category.includes('Intl')\"\n (onClick)=\"setCategory('Intl')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Intl</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">EPC</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.epc?.includes('A or B (Green)')\"\n (onClick)=\"setEpc('A or B (Green)')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">A or B (Green)</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"grid form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Purchase Type</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.purchaseType.includes('Purchase')\"\n (onClick)=\"setPurchaseType('Purchase')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Purchase</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\"\n [class.selected]=\"filters.purchaseType.includes('Refinance')\"\n (onClick)=\"setPurchaseType('Refinance')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Refinance</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Task Status</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\"\n [class.selected]=\"filters.taskStatus.includes('Not Started')\"\n (onClick)=\"setTaskStatus('Not Started')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Not Started</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\"\n [class.selected]=\"filters.taskStatus.includes('In-progress')\"\n (onClick)=\"setTaskStatus('In-progress')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">In-progress</p>\n </div>\n </p-button>\n\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.taskStatus.includes('Completed')\"\n (onClick)=\"setTaskStatus('Completed')\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Completed</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"grid p-0 form-grid col-12\">\n <div class=\"col-12 pl-3 md:col-6\"> \n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Finance Amount</p>\n <div class=\"filter-options two-inputs\">\n <div class=\"grid p-0 form-grid col-12\">\n <div class=\"col-12 md:col-6\">\n <input type=\"number\" class=\"w-full\" placeholder=\"Min\" [ngModel]=\"filters.financeMin\"\n (ngModelChange)=\"setFinanceMin($event)\" min=\"0\" />\n </div>\n <div class=\"col-12 md:col-6\">\n <input type=\"number\" class=\"w-full\" placeholder=\"Max\" [ngModel]=\"filters.financeMax\"\n (ngModelChange)=\"setFinanceMax($event)\" min=\"0\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Pending Days</p>\n <div class=\"filter-options one-input\">\n <input type=\"number\" placeholder=\"No. of days\" [ngModel]=\"filters.pendingDays\"\n (ngModelChange)=\"setPendingDays($event)\" min=\"0\" />\n </div>\n </div>\n </div>\n\n <div class=\"grid p-0 form-grid col-12\">\n <div class=\"col-12 pl-4 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Vulnerable Customer</p>\n <div class=\"filter-options\">\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === true\"\n (onClick)=\"setVulnerableCustomer(true)\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Yes</p>\n </div>\n </p-button>\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === false\"\n (onClick)=\"setVulnerableCustomer(false)\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">No</p>\n </div>\n </p-button>\n <p-button class=\"filter-option-btn-wrapper\" [class.selected]=\"filters.vulnerableCustomer === null\"\n (onClick)=\"setVulnerableCustomer(null)\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Any</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>\n <div class=\"col-12 pl-3 md:col-6\">\n <div class=\"filter-section\">\n <p class=\"filter-label m-0 mb-2\">Assigned Underwriter</p>\n <div class=\"filter-options one-input\">\n <p-multiSelect [options]=\"underwriterOptions\" optionLabel=\"name\" optionValue=\"id\"\n placeholder=\"Select underwriter(s)\" [appendTo]=\"'body'\" [panelStyle]=\"{ zIndex: 1100 }\"\n [filter]=\"true\" [loading]=\"loadingUnderwriters\"\n [ngModel]=\"filters.assignedUnderwriter\" (ngModelChange)=\"setAssignedUnderwriter($event)\"\n (onFilter)=\"onUnderwriterFilter($event)\">\n </p-multiSelect>\n </div>\n </div>\n </div>\n </div>\n <div class=\"filter-actions w-full flex justify-content-between\">\n <p-button class=\"pl-3 clear-btn-wrapper\" (onClick)=\"clearAll()\">\n <div class=\"flex align-items-center btn-text-wrapper\">\n <p class=\"mb-0 mr-2\">Clear All</p>\n <i class=\"pi pi-times\"></i>\n </div>\n </p-button>\n\n <p-button class=\"apply-btn-wrapper\" (onClick)=\"applyFilters()\">\n <div class=\"flex align-items-center\">\n <p class=\"mb-0\">Apply Filters</p>\n </div>\n </p-button>\n </div>\n </div>\n </div>", styles: [".queue-filter-dropdown-wrapper{position:relative;display:inline-block}.filter-dropdown-panel{position:absolute;top:100%;left:50%;transform:translate(-50%);min-width:500%;background:#fff;border:1.5px solid #d1d5db;border-radius:16px;box-shadow:0 8px 32px #101e362e;padding:1.5rem 1.25rem 1rem;z-index:1000}.filter-title{font-weight:600;font-size:16px;margin-bottom:1.25rem}.filter-section{margin-bottom:1.2rem}.filter-label{font-size:1rem;font-weight:500;margin-bottom:.5rem}.filter-options{display:flex;gap:.7rem;flex-wrap:wrap}.filter-options input[type=number],.filter-options input[type=text],.filter-options input[type=date]{width:110px;padding:.45rem .8rem;border:1.5px solid #e0e4ea;border-radius:8px;font-size:1rem;color:#3b4256;background:#fff;transition:border .2s}.filter-options input[type=number]:focus,.filter-options input[type=text]:focus,.filter-options input[type=date]:focus{border:1.5px solid #2563eb;outline:none}.filter-options input[type=number]::-webkit-outer-spin-button,.filter-options input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.filter-options input[type=number]{-moz-appearance:textfield}.filter-actions{display:flex;justify-content:space-between;align-items:center;margin-top:1.7rem}::ng-deep .apply-btn-wrapper .p-button{border:none;padding:8px 16px;border-radius:8px;box-shadow:none}::ng-deep .clear-btn-wrapper .p-button{border:none;color:var(--primary-color);background-color:var(--surface-0);padding:0;border-radius:8px;box-shadow:none}::ng-deep .filter-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:var(--surface-0);padding:8px 16px;border-radius:8px;box-shadow:none;height:44px}::ng-deep .filter-option-btn-wrapper .p-button{border:1px solid #e0e4ea!important;border-radius:8px!important;border:none;color:var(--text-color);background-color:#f7fafd;padding:4px 18px;border-radius:8px;box-shadow:none}::ng-deep .filter-option-btn-wrapper.selected .p-button{border-radius:8px!important;border:none;color:var(--primary-color);background-color:#e8f0fe;padding:4px 18px;box-shadow:none;border:1.5px solid var(--primary-color)!important}.filter-options input[type=date]{font-family:inherit;color:#3b4256}.filter-options.two-inputs input[type=number]{width:48.5%}.filter-options.one-input input[type=number]{width:100%}.filter-options.one-input ::ng-deep .p-multiselect{width:100%}\n"] }]
|
|
7457
7485
|
}], ctorParameters: () => [{ type: QueueFilterDropdownService }], propDecorators: { dropdownPanel: [{
|
|
7458
7486
|
type: ViewChild,
|
|
7459
7487
|
args: ['dropdownPanel', { static: false }]
|