@flusys/ng-shared 5.5.0 → 6.0.0-beta.2
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/flusys-ng-shared.mjs +475 -724
- package/fesm2022/flusys-ng-shared.mjs.map +1 -1
- package/package.json +3 -5
- package/types/flusys-ng-shared.d.ts +121 -153
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, PLATFORM_ID, Injectable, DOCUMENT, REQUEST, signal, computed, ElementRef, input, effect, Directive, TemplateRef, ViewContainerRef, output, Pipe, Injector, isDevMode, NgModule, resource, model, runInInjectionContext, untracked, forwardRef, contentChildren, Component,
|
|
2
|
+
import { inject, PLATFORM_ID, Injectable, DOCUMENT, REQUEST, signal, computed, ElementRef, input, effect, Directive, TemplateRef, ViewContainerRef, output, Pipe, Injector, isDevMode, NgModule, resource, model, runInInjectionContext, untracked, forwardRef, contentChildren, Component, InjectionToken, DestroyRef, ViewEncapsulation, ApplicationRef, viewChild, afterNextRender } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { isPlatformServer, DOCUMENT as DOCUMENT$1, isPlatformBrowser, CommonModule, NgOptimizedImage, NgComponentOutlet, DatePipe } from '@angular/common';
|
|
5
5
|
import { HttpClient, HttpContextToken, HttpHeaders, HttpParams } from '@angular/common/http';
|
|
@@ -8,63 +8,9 @@ import { of, catchError as catchError$1, throwError, firstValueFrom, map as map$
|
|
|
8
8
|
import { map, tap, catchError } from 'rxjs/operators';
|
|
9
9
|
import * as i2 from '@angular/forms';
|
|
10
10
|
import { NgControl, FormsModule, ReactiveFormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
11
|
-
import
|
|
11
|
+
import * as i3 from '@flusys/ng-ui';
|
|
12
|
+
import { MessageService, UiModule, ConfirmationService, UiIconComponent } from '@flusys/ng-ui';
|
|
12
13
|
import { RouterOutlet, RouterLink, RouterLinkActive, Router } from '@angular/router';
|
|
13
|
-
import { AutoCompleteModule } from 'primeng/autocomplete';
|
|
14
|
-
import { AvatarModule } from 'primeng/avatar';
|
|
15
|
-
import * as i3 from 'primeng/button';
|
|
16
|
-
import { ButtonModule } from 'primeng/button';
|
|
17
|
-
import * as i4 from 'primeng/card';
|
|
18
|
-
import { CardModule } from 'primeng/card';
|
|
19
|
-
import * as i5$1 from 'primeng/checkbox';
|
|
20
|
-
import { CheckboxModule } from 'primeng/checkbox';
|
|
21
|
-
import { ConfirmDialogModule } from 'primeng/confirmdialog';
|
|
22
|
-
import * as i6$1 from 'primeng/datepicker';
|
|
23
|
-
import { DatePickerModule } from 'primeng/datepicker';
|
|
24
|
-
import * as i4$1 from 'primeng/dialog';
|
|
25
|
-
import { DialogModule } from 'primeng/dialog';
|
|
26
|
-
import { DividerModule } from 'primeng/divider';
|
|
27
|
-
import { FileUploadModule } from 'primeng/fileupload';
|
|
28
|
-
import * as i5 from 'primeng/iconfield';
|
|
29
|
-
import { IconFieldModule } from 'primeng/iconfield';
|
|
30
|
-
import * as i6 from 'primeng/inputicon';
|
|
31
|
-
import { InputIconModule } from 'primeng/inputicon';
|
|
32
|
-
import * as i9$1 from 'primeng/inputnumber';
|
|
33
|
-
import { InputNumberModule } from 'primeng/inputnumber';
|
|
34
|
-
import * as i10$1 from 'primeng/inputpassword';
|
|
35
|
-
import { InputPasswordModule } from 'primeng/inputpassword';
|
|
36
|
-
import { InputTagsModule } from 'primeng/inputtags';
|
|
37
|
-
import * as i7 from 'primeng/inputtext';
|
|
38
|
-
import { InputTextModule } from 'primeng/inputtext';
|
|
39
|
-
import { ListboxModule } from 'primeng/listbox';
|
|
40
|
-
import { PaginatorModule } from 'primeng/paginator';
|
|
41
|
-
import { PanelModule } from 'primeng/panel';
|
|
42
|
-
import { PopoverModule } from 'primeng/popover';
|
|
43
|
-
import * as i2$1 from 'primeng/progressbar';
|
|
44
|
-
import { ProgressBarModule } from 'primeng/progressbar';
|
|
45
|
-
import { RadioButtonModule } from 'primeng/radiobutton';
|
|
46
|
-
import { RippleModule } from 'primeng/ripple';
|
|
47
|
-
import * as i12 from 'primeng/select';
|
|
48
|
-
import { SelectModule } from 'primeng/select';
|
|
49
|
-
import { SelectButtonModule } from 'primeng/selectbutton';
|
|
50
|
-
import { SkeletonModule } from 'primeng/skeleton';
|
|
51
|
-
import { SplitButtonModule } from 'primeng/splitbutton';
|
|
52
|
-
import { StepsModule } from 'primeng/steps';
|
|
53
|
-
import * as i8 from 'primeng/table';
|
|
54
|
-
import { TableModule } from 'primeng/table';
|
|
55
|
-
import { TabsModule } from 'primeng/tabs';
|
|
56
|
-
import * as i9 from 'primeng/tag';
|
|
57
|
-
import { TagModule } from 'primeng/tag';
|
|
58
|
-
import * as i13 from 'primeng/textarea';
|
|
59
|
-
import { TextareaModule } from 'primeng/textarea';
|
|
60
|
-
import { ToastModule } from 'primeng/toast';
|
|
61
|
-
import { ToggleButtonModule } from 'primeng/togglebutton';
|
|
62
|
-
import * as i14 from 'primeng/toggleswitch';
|
|
63
|
-
import { ToggleSwitchModule } from 'primeng/toggleswitch';
|
|
64
|
-
import * as i10 from 'primeng/tooltip';
|
|
65
|
-
import { TooltipModule } from 'primeng/tooltip';
|
|
66
|
-
import { TreeTableModule } from 'primeng/treetable';
|
|
67
|
-
import { ProgressSpinnerModule } from 'primeng/progressspinner';
|
|
68
14
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
69
15
|
|
|
70
16
|
const SHARED_MESSAGES = {
|
|
@@ -231,99 +177,6 @@ const SHARED_MESSAGES = {
|
|
|
231
177
|
'shared.view.details': 'View Details',
|
|
232
178
|
'shared.yes': 'Yes',
|
|
233
179
|
'shared.validation': 'Validation',
|
|
234
|
-
// cross-package shared keys (primeng.* — PrimeNG i18n provider)
|
|
235
|
-
'primeng.accept': 'Yes',
|
|
236
|
-
'primeng.add.rule': 'Add Rule',
|
|
237
|
-
'primeng.apply': 'Apply',
|
|
238
|
-
'primeng.aria.cancel.edit': 'Cancel Edit',
|
|
239
|
-
'primeng.aria.close': 'Close',
|
|
240
|
-
'primeng.aria.collapse.row': 'Row Collapsed',
|
|
241
|
-
'primeng.aria.edit.row': 'Edit Row',
|
|
242
|
-
'primeng.aria.expand.row': 'Row Expanded',
|
|
243
|
-
'primeng.aria.false.label': 'False',
|
|
244
|
-
'primeng.aria.filter.constraint': 'Filter Constraint',
|
|
245
|
-
'primeng.aria.filter.operator': 'Filter Operator',
|
|
246
|
-
'primeng.aria.first.page.label': 'First Page',
|
|
247
|
-
'primeng.aria.grid.view': 'Grid View',
|
|
248
|
-
'primeng.aria.hide.filter.menu': 'Hide Filter Menu',
|
|
249
|
-
'primeng.aria.jump.to.page.dropdown.label': 'Jump to Page Dropdown',
|
|
250
|
-
'primeng.aria.jump.to.page.input.label': 'Jump to Page Input',
|
|
251
|
-
'primeng.aria.last.page.label': 'Last Page',
|
|
252
|
-
'primeng.aria.list.view': 'List View',
|
|
253
|
-
'primeng.aria.move.all.to.source': 'Move All to Source',
|
|
254
|
-
'primeng.aria.move.all.to.target': 'Move All to Target',
|
|
255
|
-
'primeng.aria.move.bottom': 'Move Bottom',
|
|
256
|
-
'primeng.aria.move.down': 'Move Down',
|
|
257
|
-
'primeng.aria.move.to.source': 'Move to Source',
|
|
258
|
-
'primeng.aria.move.to.target': 'Move to Target',
|
|
259
|
-
'primeng.aria.move.top': 'Move Top',
|
|
260
|
-
'primeng.aria.move.up': 'Move Up',
|
|
261
|
-
'primeng.aria.navigation': 'Navigation',
|
|
262
|
-
'primeng.aria.next': 'Next',
|
|
263
|
-
'primeng.aria.next.page.label': 'Next Page',
|
|
264
|
-
'primeng.aria.null.label': 'Not Selected',
|
|
265
|
-
'primeng.aria.page.label': 'Page {page}',
|
|
266
|
-
'primeng.aria.prev.page.label': 'Previous Page',
|
|
267
|
-
'primeng.aria.previous': 'Previous',
|
|
268
|
-
'primeng.aria.rotate.left': 'Rotate Left',
|
|
269
|
-
'primeng.aria.rotate.right': 'Rotate Right',
|
|
270
|
-
'primeng.aria.rows.per.page.label': 'Rows per page',
|
|
271
|
-
'primeng.aria.save.edit': 'Save Edit',
|
|
272
|
-
'primeng.aria.scroll.top': 'Scroll Top',
|
|
273
|
-
'primeng.aria.select.all': 'All items selected',
|
|
274
|
-
'primeng.aria.select.row': 'Row Selected',
|
|
275
|
-
'primeng.aria.show.filter.menu': 'Show Filter Menu',
|
|
276
|
-
'primeng.aria.slide': 'Slide',
|
|
277
|
-
'primeng.aria.slide.number': '{slideNumber}',
|
|
278
|
-
'primeng.aria.star': '1 star',
|
|
279
|
-
'primeng.aria.stars': '{star} stars',
|
|
280
|
-
'primeng.aria.true.label': 'True',
|
|
281
|
-
'primeng.aria.unselect.all': 'All items unselected',
|
|
282
|
-
'primeng.aria.unselect.row': 'Row Unselected',
|
|
283
|
-
'primeng.aria.zoom.image': 'Zoom Image',
|
|
284
|
-
'primeng.aria.zoom.in': 'Zoom In',
|
|
285
|
-
'primeng.aria.zoom.out': 'Zoom Out',
|
|
286
|
-
'primeng.cancel': 'Cancel',
|
|
287
|
-
'primeng.choose': 'Choose',
|
|
288
|
-
'primeng.choose.date': 'Choose Date',
|
|
289
|
-
'primeng.clear': 'Clear',
|
|
290
|
-
'primeng.contains': 'Contains',
|
|
291
|
-
'primeng.date.after': 'Date is after',
|
|
292
|
-
'primeng.date.before': 'Date is before',
|
|
293
|
-
'primeng.date.is': 'Date is',
|
|
294
|
-
'primeng.date.is.not': 'Date is not',
|
|
295
|
-
'primeng.empty.filter.message': 'No results found',
|
|
296
|
-
'primeng.empty.message': 'No results found',
|
|
297
|
-
'primeng.empty.search.message': 'No results found',
|
|
298
|
-
'primeng.empty.selection.message': 'No selected item',
|
|
299
|
-
'primeng.ends.with': 'Ends with',
|
|
300
|
-
'primeng.equals': 'Equals',
|
|
301
|
-
'primeng.first.day.of.week': '0',
|
|
302
|
-
'primeng.gt': 'Greater than',
|
|
303
|
-
'primeng.gte': 'Greater than or equal to',
|
|
304
|
-
'primeng.lt': 'Less than',
|
|
305
|
-
'primeng.lte': 'Less than or equal to',
|
|
306
|
-
'primeng.match.all': 'Match All',
|
|
307
|
-
'primeng.match.any': 'Match Any',
|
|
308
|
-
'primeng.no.filter': 'No Filter',
|
|
309
|
-
'primeng.not.contains': 'Not contains',
|
|
310
|
-
'primeng.not.equals': 'Not equals',
|
|
311
|
-
'primeng.pending': 'Pending',
|
|
312
|
-
'primeng.reject': 'No',
|
|
313
|
-
'primeng.remove.rule': 'Remove Rule',
|
|
314
|
-
'primeng.selection.message': '{0} items selected',
|
|
315
|
-
'primeng.starts.with': 'Starts with',
|
|
316
|
-
'primeng.today': 'Today',
|
|
317
|
-
'primeng.upload': 'Upload',
|
|
318
|
-
'primeng.week.header': 'Wk',
|
|
319
|
-
'primeng.choose.year': 'Choose Year',
|
|
320
|
-
'primeng.choose.month': 'Choose Month',
|
|
321
|
-
'primeng.date.format': 'mm/dd/yy',
|
|
322
|
-
'primeng.weak': 'Weak',
|
|
323
|
-
'primeng.medium': 'Medium',
|
|
324
|
-
'primeng.strong': 'Strong',
|
|
325
|
-
'primeng.password.prompt': 'Enter a password',
|
|
326
|
-
'primeng.country.placeholder': 'Choose a country',
|
|
327
180
|
};
|
|
328
181
|
|
|
329
182
|
// ==================== AUTH MODULE ====================
|
|
@@ -521,18 +374,18 @@ function isFileTypeAllowed(file, allowedTypes) {
|
|
|
521
374
|
}
|
|
522
375
|
function getFileIconClass(contentType) {
|
|
523
376
|
if (contentType.startsWith('image/'))
|
|
524
|
-
return '
|
|
377
|
+
return 'image';
|
|
525
378
|
if (contentType.startsWith('video/'))
|
|
526
|
-
return '
|
|
379
|
+
return 'video';
|
|
527
380
|
if (contentType.startsWith('audio/'))
|
|
528
|
-
return '
|
|
381
|
+
return 'volume-up';
|
|
529
382
|
if (contentType.includes('pdf'))
|
|
530
|
-
return '
|
|
383
|
+
return 'file-pdf';
|
|
531
384
|
if (contentType.includes('word') || contentType.includes('document'))
|
|
532
|
-
return '
|
|
385
|
+
return 'file-word';
|
|
533
386
|
if (contentType.includes('excel') || contentType.includes('spreadsheet'))
|
|
534
|
-
return '
|
|
535
|
-
return '
|
|
387
|
+
return 'file-excel';
|
|
388
|
+
return 'file';
|
|
536
389
|
}
|
|
537
390
|
function formatFileSize(sizeInKb) {
|
|
538
391
|
const kb = typeof sizeInKb === 'string' ? parseFloat(sizeInKb) : sizeInKb;
|
|
@@ -546,9 +399,8 @@ function formatFileSize(sizeInKb) {
|
|
|
546
399
|
|
|
547
400
|
var IconTypeEnum;
|
|
548
401
|
(function (IconTypeEnum) {
|
|
549
|
-
IconTypeEnum[IconTypeEnum["
|
|
402
|
+
IconTypeEnum[IconTypeEnum["ICON_NAME"] = 1] = "ICON_NAME";
|
|
550
403
|
IconTypeEnum[IconTypeEnum["IMAGE_FILE_LINK"] = 2] = "IMAGE_FILE_LINK";
|
|
551
|
-
IconTypeEnum[IconTypeEnum["DIRECT_TAG_SVG"] = 3] = "DIRECT_TAG_SVG";
|
|
552
404
|
})(IconTypeEnum || (IconTypeEnum = {}));
|
|
553
405
|
|
|
554
406
|
class PlatformService {
|
|
@@ -556,10 +408,10 @@ class PlatformService {
|
|
|
556
408
|
get isServer() {
|
|
557
409
|
return isPlatformServer(this.platformId);
|
|
558
410
|
}
|
|
559
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
560
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.
|
|
411
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PlatformService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
412
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PlatformService, providedIn: 'root' });
|
|
561
413
|
}
|
|
562
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
414
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PlatformService, decorators: [{
|
|
563
415
|
type: Injectable,
|
|
564
416
|
args: [{ providedIn: 'root' }]
|
|
565
417
|
}] });
|
|
@@ -571,10 +423,10 @@ class CookieService {
|
|
|
571
423
|
get() {
|
|
572
424
|
return !this.platformService.isServer ? this.doc.cookie : this.request?.headers.get('cookie') ?? "";
|
|
573
425
|
}
|
|
574
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
575
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.
|
|
426
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: CookieService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
427
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: CookieService, providedIn: 'root' });
|
|
576
428
|
}
|
|
577
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
429
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: CookieService, decorators: [{
|
|
578
430
|
type: Injectable,
|
|
579
431
|
args: [{
|
|
580
432
|
providedIn: 'root',
|
|
@@ -626,10 +478,10 @@ class FileUrlService {
|
|
|
626
478
|
.map((id) => cache.get(id))
|
|
627
479
|
.filter((f) => f !== undefined);
|
|
628
480
|
}
|
|
629
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
630
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.
|
|
481
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileUrlService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
482
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileUrlService, providedIn: 'root' });
|
|
631
483
|
}
|
|
632
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
484
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileUrlService, decorators: [{
|
|
633
485
|
type: Injectable,
|
|
634
486
|
args: [{ providedIn: 'root' }]
|
|
635
487
|
}] });
|
|
@@ -726,10 +578,10 @@ class PermissionValidatorService {
|
|
|
726
578
|
isPermissionsLoaded() {
|
|
727
579
|
return this._isLoaded();
|
|
728
580
|
}
|
|
729
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
730
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.
|
|
581
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PermissionValidatorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
582
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PermissionValidatorService, providedIn: 'root' });
|
|
731
583
|
}
|
|
732
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
584
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PermissionValidatorService, decorators: [{
|
|
733
585
|
type: Injectable,
|
|
734
586
|
args: [{ providedIn: 'root' }]
|
|
735
587
|
}] });
|
|
@@ -767,10 +619,10 @@ class TranslateService {
|
|
|
767
619
|
return value !== undefined ? String(value) : match;
|
|
768
620
|
});
|
|
769
621
|
}
|
|
770
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
771
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.
|
|
622
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TranslateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
623
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TranslateService, providedIn: 'root' });
|
|
772
624
|
}
|
|
773
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
625
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TranslateService, decorators: [{
|
|
774
626
|
type: Injectable,
|
|
775
627
|
args: [{ providedIn: 'root' }]
|
|
776
628
|
}] });
|
|
@@ -805,10 +657,10 @@ class FaviconService {
|
|
|
805
657
|
link.href = `data:image/svg+xml,${encodeURIComponent(resolved)}`;
|
|
806
658
|
}
|
|
807
659
|
}
|
|
808
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
809
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.
|
|
660
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FaviconService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
661
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FaviconService, providedIn: 'root' });
|
|
810
662
|
}
|
|
811
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
663
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FaviconService, decorators: [{
|
|
812
664
|
type: Injectable,
|
|
813
665
|
args: [{ providedIn: 'root' }]
|
|
814
666
|
}] });
|
|
@@ -843,23 +695,23 @@ class EditModeElementChangerDirective {
|
|
|
843
695
|
inputElement.classList.remove('edit-mode-element-css');
|
|
844
696
|
}
|
|
845
697
|
}
|
|
846
|
-
if (inputElement.tagName === '
|
|
847
|
-
const
|
|
848
|
-
const label = inputElement.querySelector('
|
|
698
|
+
if (inputElement.tagName === 'F-SELECT') {
|
|
699
|
+
const trigger = inputElement.querySelector('[data-select-trigger]');
|
|
700
|
+
const label = inputElement.querySelector('[data-select-label]');
|
|
849
701
|
if (!editMode) {
|
|
850
702
|
inputElement.classList.add('edit-mode-element-css', 'overflow-hidden');
|
|
851
|
-
if (
|
|
852
|
-
|
|
703
|
+
if (trigger)
|
|
704
|
+
trigger.style.display = 'none';
|
|
853
705
|
label?.classList.add('edit-mode-element-css');
|
|
854
706
|
}
|
|
855
707
|
else {
|
|
856
708
|
inputElement.classList.remove('edit-mode-element-css', 'overflow-hidden');
|
|
857
|
-
if (
|
|
858
|
-
|
|
709
|
+
if (trigger)
|
|
710
|
+
trigger.style.display = '';
|
|
859
711
|
label?.classList.remove('edit-mode-element-css');
|
|
860
712
|
}
|
|
861
713
|
}
|
|
862
|
-
if (inputElement.tagName === '
|
|
714
|
+
if (inputElement.tagName === 'F-DATEPICKER') {
|
|
863
715
|
const firstChild = inputElement.firstElementChild;
|
|
864
716
|
if (!editMode) {
|
|
865
717
|
firstChild?.children[0]?.classList.add('edit-mode-element-css', 'cursor-auto');
|
|
@@ -871,10 +723,10 @@ class EditModeElementChangerDirective {
|
|
|
871
723
|
}
|
|
872
724
|
}
|
|
873
725
|
}
|
|
874
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
875
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
726
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: EditModeElementChangerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
727
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: EditModeElementChangerDirective, isStandalone: true, selector: "[appEditModeElementChanger]", inputs: { isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
|
|
876
728
|
}
|
|
877
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
729
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: EditModeElementChangerDirective, decorators: [{
|
|
878
730
|
type: Directive,
|
|
879
731
|
args: [{
|
|
880
732
|
selector: '[appEditModeElementChanger]',
|
|
@@ -993,10 +845,10 @@ class HasPermissionDirective {
|
|
|
993
845
|
this.viewCreated = false;
|
|
994
846
|
}
|
|
995
847
|
}
|
|
996
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
997
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
848
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: HasPermissionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
849
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: HasPermissionDirective, isStandalone: true, selector: "[hasPermission]", inputs: { hasPermission: { classPropertyName: "hasPermission", publicName: "hasPermission", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
998
850
|
}
|
|
999
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
851
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: HasPermissionDirective, decorators: [{
|
|
1000
852
|
type: Directive,
|
|
1001
853
|
args: [{
|
|
1002
854
|
selector: '[hasPermission]',
|
|
@@ -1020,10 +872,10 @@ class IsEmptyImageDirective {
|
|
|
1020
872
|
onError() {
|
|
1021
873
|
this.hasError.set(true);
|
|
1022
874
|
}
|
|
1023
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
1024
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
875
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: IsEmptyImageDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
876
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: IsEmptyImageDirective, isStandalone: true, selector: "img", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "error": "onError()" }, properties: { "src": "imageSrc()" } }, ngImport: i0 });
|
|
1025
877
|
}
|
|
1026
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
878
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: IsEmptyImageDirective, decorators: [{
|
|
1027
879
|
type: Directive,
|
|
1028
880
|
args: [{
|
|
1029
881
|
selector: 'img',
|
|
@@ -1063,10 +915,10 @@ class PreventDefaultDirective {
|
|
|
1063
915
|
event.preventDefault();
|
|
1064
916
|
this.action.emit(event);
|
|
1065
917
|
}
|
|
1066
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
1067
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
918
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PreventDefaultDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
919
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: PreventDefaultDirective, isStandalone: true, selector: "[appPreventDefault]", inputs: { eventType: { classPropertyName: "eventType", publicName: "eventType", isSignal: true, isRequired: false, transformFunction: null }, preventKey: { classPropertyName: "preventKey", publicName: "preventKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { action: "action" }, host: { listeners: { "click": "onClick($event)", "keydown": "onKeydown($event)", "keyup": "onKeyup($event)" } }, ngImport: i0 });
|
|
1068
920
|
}
|
|
1069
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
921
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: PreventDefaultDirective, decorators: [{
|
|
1070
922
|
type: Directive,
|
|
1071
923
|
args: [{
|
|
1072
924
|
selector: '[appPreventDefault]',
|
|
@@ -1086,10 +938,10 @@ class TranslatePipe {
|
|
|
1086
938
|
const result = this.translateAdapter.translate(key, params ?? undefined);
|
|
1087
939
|
return fallback !== undefined && result === key ? fallback : result;
|
|
1088
940
|
}
|
|
1089
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
1090
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.
|
|
941
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TranslatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
942
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.6", ngImport: i0, type: TranslatePipe, isStandalone: true, name: "translate", pure: false });
|
|
1091
943
|
}
|
|
1092
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
944
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TranslatePipe, decorators: [{
|
|
1093
945
|
type: Pipe,
|
|
1094
946
|
args: [{
|
|
1095
947
|
name: 'translate',
|
|
@@ -1315,8 +1167,8 @@ function resolveTranslationModule(config) {
|
|
|
1315
1167
|
}
|
|
1316
1168
|
|
|
1317
1169
|
class AngularModule {
|
|
1318
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
1319
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.
|
|
1170
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: AngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1171
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.6", ngImport: i0, type: AngularModule, imports: [CommonModule,
|
|
1320
1172
|
FormsModule,
|
|
1321
1173
|
ReactiveFormsModule,
|
|
1322
1174
|
RouterOutlet,
|
|
@@ -1335,13 +1187,13 @@ class AngularModule {
|
|
|
1335
1187
|
NgOptimizedImage,
|
|
1336
1188
|
NgComponentOutlet,
|
|
1337
1189
|
PreventDefaultDirective] });
|
|
1338
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.
|
|
1190
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: AngularModule, providers: [DatePipe], imports: [CommonModule,
|
|
1339
1191
|
FormsModule,
|
|
1340
1192
|
ReactiveFormsModule, CommonModule,
|
|
1341
1193
|
FormsModule,
|
|
1342
1194
|
ReactiveFormsModule] });
|
|
1343
1195
|
}
|
|
1344
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
1196
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: AngularModule, decorators: [{
|
|
1345
1197
|
type: NgModule,
|
|
1346
1198
|
args: [{
|
|
1347
1199
|
imports: [
|
|
@@ -1372,131 +1224,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
1372
1224
|
}]
|
|
1373
1225
|
}] });
|
|
1374
1226
|
|
|
1375
|
-
class PrimeModule {
|
|
1376
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PrimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1377
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: PrimeModule, exports: [AutoCompleteModule,
|
|
1378
|
-
AvatarModule,
|
|
1379
|
-
ButtonModule,
|
|
1380
|
-
CardModule,
|
|
1381
|
-
CheckboxModule,
|
|
1382
|
-
ConfirmDialogModule,
|
|
1383
|
-
DatePickerModule,
|
|
1384
|
-
DialogModule,
|
|
1385
|
-
DividerModule,
|
|
1386
|
-
FileUploadModule,
|
|
1387
|
-
IconFieldModule,
|
|
1388
|
-
InputIconModule,
|
|
1389
|
-
InputNumberModule,
|
|
1390
|
-
InputPasswordModule,
|
|
1391
|
-
InputTagsModule,
|
|
1392
|
-
InputTextModule,
|
|
1393
|
-
ListboxModule,
|
|
1394
|
-
PaginatorModule,
|
|
1395
|
-
PanelModule,
|
|
1396
|
-
PopoverModule,
|
|
1397
|
-
ProgressBarModule,
|
|
1398
|
-
RadioButtonModule,
|
|
1399
|
-
RippleModule,
|
|
1400
|
-
SelectButtonModule,
|
|
1401
|
-
SelectModule,
|
|
1402
|
-
SkeletonModule,
|
|
1403
|
-
SplitButtonModule,
|
|
1404
|
-
StepsModule,
|
|
1405
|
-
TableModule,
|
|
1406
|
-
TabsModule,
|
|
1407
|
-
TagModule,
|
|
1408
|
-
TextareaModule,
|
|
1409
|
-
ToastModule,
|
|
1410
|
-
ToggleButtonModule,
|
|
1411
|
-
ToggleSwitchModule,
|
|
1412
|
-
TooltipModule,
|
|
1413
|
-
TreeTableModule,
|
|
1414
|
-
ProgressSpinnerModule] });
|
|
1415
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PrimeModule, imports: [AutoCompleteModule,
|
|
1416
|
-
AvatarModule,
|
|
1417
|
-
ButtonModule,
|
|
1418
|
-
CardModule,
|
|
1419
|
-
CheckboxModule,
|
|
1420
|
-
ConfirmDialogModule,
|
|
1421
|
-
DatePickerModule,
|
|
1422
|
-
DialogModule,
|
|
1423
|
-
DividerModule,
|
|
1424
|
-
FileUploadModule,
|
|
1425
|
-
IconFieldModule,
|
|
1426
|
-
InputIconModule,
|
|
1427
|
-
InputNumberModule,
|
|
1428
|
-
InputPasswordModule,
|
|
1429
|
-
InputTagsModule,
|
|
1430
|
-
InputTextModule,
|
|
1431
|
-
ListboxModule,
|
|
1432
|
-
PaginatorModule,
|
|
1433
|
-
PanelModule,
|
|
1434
|
-
PopoverModule,
|
|
1435
|
-
ProgressBarModule,
|
|
1436
|
-
RadioButtonModule,
|
|
1437
|
-
RippleModule,
|
|
1438
|
-
SelectButtonModule,
|
|
1439
|
-
SelectModule,
|
|
1440
|
-
SkeletonModule,
|
|
1441
|
-
SplitButtonModule,
|
|
1442
|
-
StepsModule,
|
|
1443
|
-
TableModule,
|
|
1444
|
-
TabsModule,
|
|
1445
|
-
TagModule,
|
|
1446
|
-
TextareaModule,
|
|
1447
|
-
ToastModule,
|
|
1448
|
-
ToggleButtonModule,
|
|
1449
|
-
ToggleSwitchModule,
|
|
1450
|
-
TooltipModule,
|
|
1451
|
-
TreeTableModule,
|
|
1452
|
-
ProgressSpinnerModule] });
|
|
1453
|
-
}
|
|
1454
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PrimeModule, decorators: [{
|
|
1455
|
-
type: NgModule,
|
|
1456
|
-
args: [{
|
|
1457
|
-
exports: [
|
|
1458
|
-
AutoCompleteModule,
|
|
1459
|
-
AvatarModule,
|
|
1460
|
-
ButtonModule,
|
|
1461
|
-
CardModule,
|
|
1462
|
-
CheckboxModule,
|
|
1463
|
-
ConfirmDialogModule,
|
|
1464
|
-
DatePickerModule,
|
|
1465
|
-
DialogModule,
|
|
1466
|
-
DividerModule,
|
|
1467
|
-
FileUploadModule,
|
|
1468
|
-
IconFieldModule,
|
|
1469
|
-
InputIconModule,
|
|
1470
|
-
InputNumberModule,
|
|
1471
|
-
InputPasswordModule,
|
|
1472
|
-
InputTagsModule,
|
|
1473
|
-
InputTextModule,
|
|
1474
|
-
ListboxModule,
|
|
1475
|
-
PaginatorModule,
|
|
1476
|
-
PanelModule,
|
|
1477
|
-
PopoverModule,
|
|
1478
|
-
ProgressBarModule,
|
|
1479
|
-
RadioButtonModule,
|
|
1480
|
-
RippleModule,
|
|
1481
|
-
SelectButtonModule,
|
|
1482
|
-
SelectModule,
|
|
1483
|
-
SkeletonModule,
|
|
1484
|
-
SplitButtonModule,
|
|
1485
|
-
StepsModule,
|
|
1486
|
-
TableModule,
|
|
1487
|
-
TabsModule,
|
|
1488
|
-
TagModule,
|
|
1489
|
-
TextareaModule,
|
|
1490
|
-
ToastModule,
|
|
1491
|
-
ToggleButtonModule,
|
|
1492
|
-
ToggleSwitchModule,
|
|
1493
|
-
TooltipModule,
|
|
1494
|
-
TreeTableModule,
|
|
1495
|
-
ProgressSpinnerModule,
|
|
1496
|
-
],
|
|
1497
|
-
}]
|
|
1498
|
-
}] });
|
|
1499
|
-
|
|
1500
1227
|
// ── Separate default filter into a named constant so it's sharable/testable ──
|
|
1501
1228
|
const DEFAULT_FILTER = {
|
|
1502
1229
|
pagination: { currentPage: 0, pageSize: 10 },
|
|
@@ -1740,10 +1467,10 @@ class BaseFormControl {
|
|
|
1740
1467
|
this.onTouched();
|
|
1741
1468
|
}
|
|
1742
1469
|
}
|
|
1743
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
1744
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
1470
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormControl, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1471
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: BaseFormControl, isStandalone: true, inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", touched: "touchedChange" }, ngImport: i0 });
|
|
1745
1472
|
}
|
|
1746
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
1473
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormControl, decorators: [{
|
|
1747
1474
|
type: Directive
|
|
1748
1475
|
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }] } });
|
|
1749
1476
|
/**
|
|
@@ -1766,208 +1493,13 @@ function provideValueAccessor(component) {
|
|
|
1766
1493
|
};
|
|
1767
1494
|
}
|
|
1768
1495
|
|
|
1769
|
-
class BaseListTemplateDirective {
|
|
1770
|
-
key = input.required({ ...(ngDevMode ? { debugName: "key" } : /* istanbul ignore next */ {}), alias: 'baseListTemplate' });
|
|
1771
|
-
templateRef = inject((TemplateRef));
|
|
1772
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: BaseListTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1773
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: BaseListTemplateDirective, isStandalone: true, selector: "ng-template[baseListTemplate]", inputs: { key: { classPropertyName: "key", publicName: "baseListTemplate", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
|
|
1774
|
-
}
|
|
1775
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: BaseListTemplateDirective, decorators: [{
|
|
1776
|
-
type: Directive,
|
|
1777
|
-
args: [{ selector: 'ng-template[baseListTemplate]' }]
|
|
1778
|
-
}], propDecorators: { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseListTemplate", required: true }] }] } });
|
|
1779
|
-
|
|
1780
|
-
class BaseListComponent {
|
|
1781
|
-
translateAdapter = inject(TranslateService, { optional: true });
|
|
1782
|
-
router = inject(Router, { optional: true });
|
|
1783
|
-
messageService = inject(MessageService, { optional: true });
|
|
1784
|
-
confirmationService = inject(ConfirmationService, { optional: true });
|
|
1785
|
-
columns = input.required(/* @ts-ignore */
|
|
1786
|
-
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
1787
|
-
actions = input([], /* @ts-ignore */
|
|
1788
|
-
...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
|
|
1789
|
-
title = input('', /* @ts-ignore */
|
|
1790
|
-
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
1791
|
-
showCreateButton = input(true, /* @ts-ignore */
|
|
1792
|
-
...(ngDevMode ? [{ debugName: "showCreateButton" }] : /* istanbul ignore next */ []));
|
|
1793
|
-
searchable = input(false, /* @ts-ignore */
|
|
1794
|
-
...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
|
|
1795
|
-
pageSize = input(10, /* @ts-ignore */
|
|
1796
|
-
...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
|
|
1797
|
-
emptyMessage = input('', /* @ts-ignore */
|
|
1798
|
-
...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
|
|
1799
|
-
createButtonLabel = input('', /* @ts-ignore */
|
|
1800
|
-
...(ngDevMode ? [{ debugName: "createButtonLabel" }] : /* istanbul ignore next */ []));
|
|
1801
|
-
createButtonIcon = input('pi pi-plus', /* @ts-ignore */
|
|
1802
|
-
...(ngDevMode ? [{ debugName: "createButtonIcon" }] : /* istanbul ignore next */ []));
|
|
1803
|
-
data = input([], /* @ts-ignore */
|
|
1804
|
-
...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
1805
|
-
total = input(0, /* @ts-ignore */
|
|
1806
|
-
...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
|
|
1807
|
-
isLoading = input(false, /* @ts-ignore */
|
|
1808
|
-
...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
|
|
1809
|
-
service = input(null, /* @ts-ignore */
|
|
1810
|
-
...(ngDevMode ? [{ debugName: "service" }] : /* istanbul ignore next */ []));
|
|
1811
|
-
filter = input({}, /* @ts-ignore */
|
|
1812
|
-
...(ngDevMode ? [{ debugName: "filter" }] : /* istanbul ignore next */ []));
|
|
1813
|
-
createRoute = input(null, /* @ts-ignore */
|
|
1814
|
-
...(ngDevMode ? [{ debugName: "createRoute" }] : /* istanbul ignore next */ []));
|
|
1815
|
-
editRoute = input(null, /* @ts-ignore */
|
|
1816
|
-
...(ngDevMode ? [{ debugName: "editRoute" }] : /* istanbul ignore next */ []));
|
|
1817
|
-
deleteConfirmField = input(null, /* @ts-ignore */
|
|
1818
|
-
...(ngDevMode ? [{ debugName: "deleteConfirmField" }] : /* istanbul ignore next */ []));
|
|
1819
|
-
idField = input('id', /* @ts-ignore */
|
|
1820
|
-
...(ngDevMode ? [{ debugName: "idField" }] : /* istanbul ignore next */ []));
|
|
1821
|
-
canEdit = input(null, /* @ts-ignore */
|
|
1822
|
-
...(ngDevMode ? [{ debugName: "canEdit" }] : /* istanbul ignore next */ []));
|
|
1823
|
-
canDelete = input(null, /* @ts-ignore */
|
|
1824
|
-
...(ngDevMode ? [{ debugName: "canDelete" }] : /* istanbul ignore next */ []));
|
|
1825
|
-
onCreate = output();
|
|
1826
|
-
onLazyLoad = output();
|
|
1827
|
-
onSearch = output();
|
|
1828
|
-
columnTemplates = contentChildren(BaseListTemplateDirective, /* @ts-ignore */
|
|
1829
|
-
...(ngDevMode ? [{ debugName: "columnTemplates" }] : /* istanbul ignore next */ []));
|
|
1830
|
-
_first = signal(0, /* @ts-ignore */
|
|
1831
|
-
...(ngDevMode ? [{ debugName: "_first" }] : /* istanbul ignore next */ []));
|
|
1832
|
-
_searchTerm = signal('', /* @ts-ignore */
|
|
1833
|
-
...(ngDevMode ? [{ debugName: "_searchTerm" }] : /* istanbul ignore next */ []));
|
|
1834
|
-
first = this._first.asReadonly();
|
|
1835
|
-
searchTerm = this._searchTerm.asReadonly();
|
|
1836
|
-
effectiveData = computed(() => this.service()?.data() ?? this.data(), /* @ts-ignore */
|
|
1837
|
-
...(ngDevMode ? [{ debugName: "effectiveData" }] : /* istanbul ignore next */ []));
|
|
1838
|
-
effectiveTotal = computed(() => this.service()?.total() ?? this.total(), /* @ts-ignore */
|
|
1839
|
-
...(ngDevMode ? [{ debugName: "effectiveTotal" }] : /* istanbul ignore next */ []));
|
|
1840
|
-
effectiveIsLoading = computed(() => this.service()?.isLoading() ?? this.isLoading(), /* @ts-ignore */
|
|
1841
|
-
...(ngDevMode ? [{ debugName: "effectiveIsLoading" }] : /* istanbul ignore next */ []));
|
|
1842
|
-
effectiveActions = computed(() => {
|
|
1843
|
-
const editRoute = this.editRoute();
|
|
1844
|
-
const deleteField = this.deleteConfirmField();
|
|
1845
|
-
const editAction = editRoute
|
|
1846
|
-
? [{ icon: 'pi pi-pencil', tooltip: 'shared.edit', severity: 'info',
|
|
1847
|
-
show: this.canEdit() ?? undefined, handler: (item) => this.handleEditItem(item) }]
|
|
1848
|
-
: [];
|
|
1849
|
-
const deleteAction = deleteField
|
|
1850
|
-
? [{ icon: 'pi pi-trash', tooltip: 'shared.delete', severity: 'danger',
|
|
1851
|
-
show: this.canDelete() ?? undefined, handler: (item) => this.handleDeleteItem(item) }]
|
|
1852
|
-
: [];
|
|
1853
|
-
return [...editAction, ...this.actions(), ...deleteAction];
|
|
1854
|
-
}, /* @ts-ignore */
|
|
1855
|
-
...(ngDevMode ? [{ debugName: "effectiveActions" }] : /* istanbul ignore next */ []));
|
|
1856
|
-
visibleColumns = computed(() => this.columns().filter((c) => !c.hidden), /* @ts-ignore */
|
|
1857
|
-
...(ngDevMode ? [{ debugName: "visibleColumns" }] : /* istanbul ignore next */ []));
|
|
1858
|
-
columnCount = computed(() => this.visibleColumns().length + (this.effectiveActions().length > 0 ? 1 : 0), /* @ts-ignore */
|
|
1859
|
-
...(ngDevMode ? [{ debugName: "columnCount" }] : /* istanbul ignore next */ []));
|
|
1860
|
-
resolvedEmptyMessage = computed(() => this.emptyMessage() || this.t('shared.no.data'), /* @ts-ignore */
|
|
1861
|
-
...(ngDevMode ? [{ debugName: "resolvedEmptyMessage" }] : /* istanbul ignore next */ []));
|
|
1862
|
-
resolvedCreateLabel = computed(() => this.createButtonLabel() || this.t('shared.create'), /* @ts-ignore */
|
|
1863
|
-
...(ngDevMode ? [{ debugName: "resolvedCreateLabel" }] : /* istanbul ignore next */ []));
|
|
1864
|
-
handleLazyLoad(event) {
|
|
1865
|
-
const first = event.first ?? 0;
|
|
1866
|
-
const rows = event.rows ?? this.pageSize();
|
|
1867
|
-
this._first.set(first);
|
|
1868
|
-
const service = this.service();
|
|
1869
|
-
if (service) {
|
|
1870
|
-
service.fetchList(this.searchTerm(), {
|
|
1871
|
-
pagination: { currentPage: Math.floor(first / rows), pageSize: rows },
|
|
1872
|
-
filter: this.filter(),
|
|
1873
|
-
});
|
|
1874
|
-
}
|
|
1875
|
-
this.onLazyLoad.emit({ first, rows });
|
|
1876
|
-
}
|
|
1877
|
-
onSearchChange(value) {
|
|
1878
|
-
this._first.set(0);
|
|
1879
|
-
this._searchTerm.set(value);
|
|
1880
|
-
const service = this.service();
|
|
1881
|
-
if (service) {
|
|
1882
|
-
service.fetchList(value, {
|
|
1883
|
-
pagination: { currentPage: 0, pageSize: this.pageSize() },
|
|
1884
|
-
filter: this.filter(),
|
|
1885
|
-
});
|
|
1886
|
-
}
|
|
1887
|
-
this.onSearch.emit(value);
|
|
1888
|
-
}
|
|
1889
|
-
handleCreate() {
|
|
1890
|
-
const route = this.createRoute();
|
|
1891
|
-
if (route && this.router)
|
|
1892
|
-
this.router.navigate([route]);
|
|
1893
|
-
this.onCreate.emit();
|
|
1894
|
-
}
|
|
1895
|
-
handleEditItem(item) {
|
|
1896
|
-
const route = this.editRoute();
|
|
1897
|
-
const id = this.getFieldValueAsString(item, this.idField());
|
|
1898
|
-
if (route && id && this.router)
|
|
1899
|
-
this.router.navigate([route, id]);
|
|
1900
|
-
}
|
|
1901
|
-
handleDeleteItem(item) {
|
|
1902
|
-
const nameField = this.deleteConfirmField();
|
|
1903
|
-
const name = this.getFieldValueAsString(item, nameField);
|
|
1904
|
-
const id = this.getFieldValueAsString(item, this.idField());
|
|
1905
|
-
this.confirmationService?.confirm({
|
|
1906
|
-
message: this.t('shared.confirm.delete.item', { name }),
|
|
1907
|
-
header: this.t('shared.confirm.delete'),
|
|
1908
|
-
icon: 'pi pi-exclamation-triangle',
|
|
1909
|
-
acceptButtonStyleClass: 'p-button-danger',
|
|
1910
|
-
accept: async () => {
|
|
1911
|
-
try {
|
|
1912
|
-
const response = await this.service()?.delete({ id, type: 'delete' });
|
|
1913
|
-
this.messageService?.add({
|
|
1914
|
-
severity: 'success',
|
|
1915
|
-
summary: this.t('shared.success'),
|
|
1916
|
-
detail: response?.messageKey
|
|
1917
|
-
? this.t(response.messageKey, response.messageVariables)
|
|
1918
|
-
: (response?.message ?? ''),
|
|
1919
|
-
});
|
|
1920
|
-
this.service()?.reload();
|
|
1921
|
-
}
|
|
1922
|
-
catch {
|
|
1923
|
-
// handled by global interceptor
|
|
1924
|
-
}
|
|
1925
|
-
},
|
|
1926
|
-
});
|
|
1927
|
-
}
|
|
1928
|
-
getFieldValue(item, field) {
|
|
1929
|
-
return field
|
|
1930
|
-
.split('.')
|
|
1931
|
-
.reduce((obj, key) => (obj != null ? obj[key] : null), item);
|
|
1932
|
-
}
|
|
1933
|
-
getFieldValueAsString(item, field) {
|
|
1934
|
-
return String(this.getFieldValue(item, field) ?? '');
|
|
1935
|
-
}
|
|
1936
|
-
getTagConfig(col, value) {
|
|
1937
|
-
return col.tagMap?.[String(value)] ?? null;
|
|
1938
|
-
}
|
|
1939
|
-
getColumnTemplate(field) {
|
|
1940
|
-
return this.columnTemplates().find((t) => t.key() === field)?.templateRef ?? null;
|
|
1941
|
-
}
|
|
1942
|
-
truncateText(value, limit) {
|
|
1943
|
-
const str = String(value ?? '');
|
|
1944
|
-
return limit && str.length > limit ? `${str.slice(0, limit)}…` : str;
|
|
1945
|
-
}
|
|
1946
|
-
getCellClass(col) {
|
|
1947
|
-
switch (col.align) {
|
|
1948
|
-
case 'center': return 'text-center';
|
|
1949
|
-
case 'right': return 'text-right';
|
|
1950
|
-
default: return '';
|
|
1951
|
-
}
|
|
1952
|
-
}
|
|
1953
|
-
t(key, vars) {
|
|
1954
|
-
return this.translateAdapter?.translate(key, vars) ?? key;
|
|
1955
|
-
}
|
|
1956
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: BaseListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1957
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: BaseListComponent, isStandalone: true, selector: "lib-base-list", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, createButtonLabel: { classPropertyName: "createButtonLabel", publicName: "createButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, createButtonIcon: { classPropertyName: "createButtonIcon", publicName: "createButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, createRoute: { classPropertyName: "createRoute", publicName: "createRoute", isSignal: true, isRequired: false, transformFunction: null }, editRoute: { classPropertyName: "editRoute", publicName: "editRoute", isSignal: true, isRequired: false, transformFunction: null }, deleteConfirmField: { classPropertyName: "deleteConfirmField", publicName: "deleteConfirmField", isSignal: true, isRequired: false, transformFunction: null }, idField: { classPropertyName: "idField", publicName: "idField", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCreate: "onCreate", onLazyLoad: "onLazyLoad", onSearch: "onSearch" }, queries: [{ propertyName: "columnTemplates", predicate: BaseListTemplateDirective, isSignal: true }], ngImport: i0, template: "<p-card>\n <ng-template #header>\n @if (title() || searchable() || showCreateButton()) {\n <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\">\n @if (title()) {\n <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n }\n <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n @if (searchable()) {\n <p-iconfield>\n <p-inputicon class=\"pi pi-search\" />\n <input\n pInputText\n type=\"text\"\n [ngModel]=\"searchTerm()\"\n (ngModelChange)=\"onSearchChange($event)\"\n [placeholder]=\"t('shared.search')\"\n />\n </p-iconfield>\n }\n @if (showCreateButton()) {\n <button\n pButton\n (click)=\"handleCreate()\"\n >\n <span pButtonIcon [class]=\"createButtonIcon()\"></span>\n <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n </button>\n }\n </div>\n </div>\n }\n </ng-template>\n\n <div class=\"overflow-x-auto\">\n <p-table\n [value]=\"effectiveData()\"\n [loading]=\"effectiveIsLoading()\"\n [lazy]=\"true\"\n [scrollable]=\"true\"\n [paginator]=\"effectiveTotal() > pageSize()\"\n [rows]=\"pageSize()\"\n [totalRecords]=\"effectiveTotal()\"\n [first]=\"first()\"\n (onLazyLoad)=\"handleLazyLoad($event)\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n class=\"p-datatable-striped\"\n >\n <ng-template #header>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <th [style.width]=\"col.width\" [style.min-width]=\"col.minWidth\" [class]=\"getCellClass(col)\">\n {{ col.header }}\n </th>\n }\n @if (effectiveActions().length > 0) {\n <th style=\"width: 120px; text-align: center;\">{{ t('shared.actions') }}</th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <td [class]=\"getCellClass(col)\">\n @switch (col.type ?? 'text') {\n @case ('tag') {\n @if (getTagConfig(col, getFieldValue(item, col.field)); as tagCfg) {\n <p-tag [severity]=\"tagCfg.severity\" [value]=\"tagCfg.label ?? getFieldValueAsString(item, col.field)\" />\n } @else {\n {{ getFieldValueAsString(item, col.field) }}\n }\n }\n @case ('boolean') {\n <p-tag\n [severity]=\"getFieldValue(item, col.field) ? 'success' : 'danger'\"\n [value]=\"getFieldValue(item, col.field) ? t('shared.yes') : t('shared.no')\"\n />\n }\n @case ('date') {\n {{ getFieldValueAsString(item, col.field) | date: (col.dateFormat ?? 'dd/MM/yyyy') }}\n }\n @case ('number') {\n {{ getFieldValueAsString(item, col.field) | number }}\n }\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getColumnTemplate(col.field); context: { $implicit: item, field: col.field }\"\n />\n }\n @default {\n {{ truncateText(getFieldValue(item, col.field), col.truncate) }}\n }\n }\n </td>\n }\n @if (effectiveActions().length > 0) {\n <td>\n <div class=\"flex items-center justify-center gap-2\">\n @for (action of effectiveActions(); track $index) {\n @if (!action.show || action.show(item)) {\n <button\n pButton\n [severity]=\"action.severity\"\n [pTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n [disabled]=\"action.disabled ? action.disabled(item) : false\"\n (click)=\"action.handler(item)\"\n [rounded]=\"true\"\n [text]=\"true\"\n >\n <span pButtonIcon [class]=\"action.icon\"></span>\n </button>\n }\n }\n </div>\n </td>\n }\n </tr>\n </ng-template>\n\n <ng-template #emptymessage>\n <tr>\n <td [attr.colspan]=\"columnCount()\">\n <div class=\"flex flex-col items-center justify-center py-12 text-surface-400\">\n <i class=\"pi pi-inbox text-5xl mb-3\"></i>\n <span>{{ resolvedEmptyMessage() }}</span>\n </div>\n </td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n</p-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: PrimeModule }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["pButton", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "link", "rounded", "fluid", "variant", "iconOnly", "loading", "severity"] }, { kind: "directive", type: i3.ButtonLabel, selector: "[pButtonLabel]", inputs: ["pButtonLabelPT", "pButtonLabelUnstyled"] }, { kind: "directive", type: i3.ButtonIcon, selector: "[pButtonIcon]", inputs: ["pButtonIconPT", "pButtonUnstyled"] }, { kind: "component", type: i4.Card, selector: "p-card", inputs: ["header", "subheader"] }, { kind: "component", type: i5.IconField, selector: "p-iconfield, p-icon-field", inputs: ["hostName", "iconPosition"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon", inputs: ["hostName"] }, { kind: "directive", type: i7.InputText, selector: "[pInputText]", inputs: ["hostName", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "firstChange", "rowsChange", "totalRecordsChange", "selectionChange", "selectAllChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "onStateSave", "onStateRestore"] }, { kind: "component", type: i9.Tag, selector: "p-tag", inputs: ["severity", "value", "icon", "rounded"] }, { kind: "directive", type: i10.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
|
|
1958
|
-
}
|
|
1959
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: BaseListComponent, decorators: [{
|
|
1960
|
-
type: Component,
|
|
1961
|
-
args: [{ selector: 'lib-base-list', imports: [AngularModule, PrimeModule], template: "<p-card>\n <ng-template #header>\n @if (title() || searchable() || showCreateButton()) {\n <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\">\n @if (title()) {\n <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n }\n <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n @if (searchable()) {\n <p-iconfield>\n <p-inputicon class=\"pi pi-search\" />\n <input\n pInputText\n type=\"text\"\n [ngModel]=\"searchTerm()\"\n (ngModelChange)=\"onSearchChange($event)\"\n [placeholder]=\"t('shared.search')\"\n />\n </p-iconfield>\n }\n @if (showCreateButton()) {\n <button\n pButton\n (click)=\"handleCreate()\"\n >\n <span pButtonIcon [class]=\"createButtonIcon()\"></span>\n <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n </button>\n }\n </div>\n </div>\n }\n </ng-template>\n\n <div class=\"overflow-x-auto\">\n <p-table\n [value]=\"effectiveData()\"\n [loading]=\"effectiveIsLoading()\"\n [lazy]=\"true\"\n [scrollable]=\"true\"\n [paginator]=\"effectiveTotal() > pageSize()\"\n [rows]=\"pageSize()\"\n [totalRecords]=\"effectiveTotal()\"\n [first]=\"first()\"\n (onLazyLoad)=\"handleLazyLoad($event)\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n class=\"p-datatable-striped\"\n >\n <ng-template #header>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <th [style.width]=\"col.width\" [style.min-width]=\"col.minWidth\" [class]=\"getCellClass(col)\">\n {{ col.header }}\n </th>\n }\n @if (effectiveActions().length > 0) {\n <th style=\"width: 120px; text-align: center;\">{{ t('shared.actions') }}</th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <td [class]=\"getCellClass(col)\">\n @switch (col.type ?? 'text') {\n @case ('tag') {\n @if (getTagConfig(col, getFieldValue(item, col.field)); as tagCfg) {\n <p-tag [severity]=\"tagCfg.severity\" [value]=\"tagCfg.label ?? getFieldValueAsString(item, col.field)\" />\n } @else {\n {{ getFieldValueAsString(item, col.field) }}\n }\n }\n @case ('boolean') {\n <p-tag\n [severity]=\"getFieldValue(item, col.field) ? 'success' : 'danger'\"\n [value]=\"getFieldValue(item, col.field) ? t('shared.yes') : t('shared.no')\"\n />\n }\n @case ('date') {\n {{ getFieldValueAsString(item, col.field) | date: (col.dateFormat ?? 'dd/MM/yyyy') }}\n }\n @case ('number') {\n {{ getFieldValueAsString(item, col.field) | number }}\n }\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getColumnTemplate(col.field); context: { $implicit: item, field: col.field }\"\n />\n }\n @default {\n {{ truncateText(getFieldValue(item, col.field), col.truncate) }}\n }\n }\n </td>\n }\n @if (effectiveActions().length > 0) {\n <td>\n <div class=\"flex items-center justify-center gap-2\">\n @for (action of effectiveActions(); track $index) {\n @if (!action.show || action.show(item)) {\n <button\n pButton\n [severity]=\"action.severity\"\n [pTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n [disabled]=\"action.disabled ? action.disabled(item) : false\"\n (click)=\"action.handler(item)\"\n [rounded]=\"true\"\n [text]=\"true\"\n >\n <span pButtonIcon [class]=\"action.icon\"></span>\n </button>\n }\n }\n </div>\n </td>\n }\n </tr>\n </ng-template>\n\n <ng-template #emptymessage>\n <tr>\n <td [attr.colspan]=\"columnCount()\">\n <div class=\"flex flex-col items-center justify-center py-12 text-surface-400\">\n <i class=\"pi pi-inbox text-5xl mb-3\"></i>\n <span>{{ resolvedEmptyMessage() }}</span>\n </div>\n </td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n</p-card>\n" }]
|
|
1962
|
-
}], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], showCreateButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCreateButton", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], createButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonLabel", required: false }] }], createButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonIcon", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], createRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "createRoute", required: false }] }], editRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRoute", required: false }] }], deleteConfirmField: [{ type: i0.Input, args: [{ isSignal: true, alias: "deleteConfirmField", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], canEdit: [{ type: i0.Input, args: [{ isSignal: true, alias: "canEdit", required: false }] }], canDelete: [{ type: i0.Input, args: [{ isSignal: true, alias: "canDelete", required: false }] }], onCreate: [{ type: i0.Output, args: ["onCreate"] }], onLazyLoad: [{ type: i0.Output, args: ["onLazyLoad"] }], onSearch: [{ type: i0.Output, args: ["onSearch"] }], columnTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BaseListTemplateDirective), { isSignal: true }] }] } });
|
|
1963
|
-
|
|
1964
1496
|
class BaseFormTemplateDirective {
|
|
1965
1497
|
key = input.required({ ...(ngDevMode ? { debugName: "key" } : /* istanbul ignore next */ {}), alias: 'baseFormTemplate' });
|
|
1966
1498
|
templateRef = inject((TemplateRef));
|
|
1967
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
1968
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
1499
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1500
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: BaseFormTemplateDirective, isStandalone: true, selector: "ng-template[baseFormTemplate]", inputs: { key: { classPropertyName: "key", publicName: "baseFormTemplate", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
|
|
1969
1501
|
}
|
|
1970
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
1502
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormTemplateDirective, decorators: [{
|
|
1971
1503
|
type: Directive,
|
|
1972
1504
|
args: [{ selector: 'ng-template[baseFormTemplate]' }]
|
|
1973
1505
|
}], propDecorators: { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseFormTemplate", required: true }] }] } });
|
|
@@ -2195,36 +1727,208 @@ class BaseFormComponent {
|
|
|
2195
1727
|
return '';
|
|
2196
1728
|
}
|
|
2197
1729
|
}
|
|
2198
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
2199
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: BaseFormComponent, isStandalone: true, selector: "lib-base-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, createTitle: { classPropertyName: "createTitle", publicName: "createTitle", isSignal: true, isRequired: false, transformFunction: null }, editTitle: { classPropertyName: "editTitle", publicName: "editTitle", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, submitLabel: { classPropertyName: "submitLabel", publicName: "submitLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: false, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null }, cancelRoute: { classPropertyName: "cancelRoute", publicName: "cancelRoute", isSignal: true, isRequired: false, transformFunction: null }, navigateOnSuccess: { classPropertyName: "navigateOnSuccess", publicName: "navigateOnSuccess", isSignal: true, isRequired: false, transformFunction: null }, mapToRequest: { classPropertyName: "mapToRequest", publicName: "mapToRequest", isSignal: true, isRequired: false, transformFunction: null }, mapFromEntity: { classPropertyName: "mapFromEntity", publicName: "mapFromEntity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onCancel: "onCancel", onValueChange: "onValueChange" }, queries: [{ propertyName: "fieldTemplates", predicate: BaseFormTemplateDirective, isSignal: true }], ngImport: i0, template: "<p-card>\n <ng-template #header>\n @if (resolvedTitle()) {\n <div class=\"flex justify-between items-center p-4\">\n <h2 class=\"text-xl font-semibold m-0\">{{ resolvedTitle() }}</h2>\n </div>\n }\n </ng-template>\n\n <form (ngSubmit)=\"handleSubmit()\" novalidate>\n <div class=\"grid gap-4\" [class]=\"gridClass()\">\n @for (field of fields(); track field.key) {\n <div class=\"flex flex-col gap-2\" [class.col-span-full]=\"field.fullWidth\">\n @if (field.type !== 'checkbox' && field.type !== 'toggle') {\n <label [for]=\"field.key\" class=\"font-medium\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n }\n\n @switch (field.type) {\n @case ('text') {\n <input\n pInputText\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('email') {\n <input\n pInputText\n type=\"email\"\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('password') {\n <p-iconfield iconPosition=\"right\" class=\"w-full\">\n <input\n pInputText\n pInputPassword\n [id]=\"field.key\"\n [name]=\"field.key\"\n [mask]=\"!isPasswordVisible(field.key)\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n <p-inputicon\n [class]=\"\n isPasswordVisible(field.key)\n ? 'pi pi-eye-slash cursor-pointer'\n : 'pi pi-eye cursor-pointer'\n \"\n (click)=\"togglePasswordVisibility(field.key)\"\n />\n </p-iconfield>\n }\n\n @case ('number') {\n <p-inputnumber\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (onBlur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [min]=\"field.min ?? undefined\"\n [max]=\"field.max ?? undefined\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n inputStyleClass=\"w-full\"\n />\n }\n\n @case ('textarea') {\n <textarea\n pTextarea\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [rows]=\"field.rows ?? 3\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n ></textarea>\n }\n\n @case ('select') {\n <p-select\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [options]=\"field.options ?? []\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('multiselect') {\n <p-select\n [multiple]=\"true\"\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [options]=\"field.options ?? []\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('date') {\n <p-datepicker\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (onBlur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [minDate]=\"field.minDate ?? undefined\"\n [maxDate]=\"field.maxDate ?? undefined\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n inputStyleClass=\"w-full\"\n />\n }\n\n @case ('checkbox') {\n <div class=\"flex items-center gap-2 h-9\">\n <p-checkbox\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [disabled]=\"field.disabled ?? false\"\n [binary]=\"true\"\n [invalid]=\"isFieldInvalid(field)\"\n />\n <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n </div>\n }\n\n @case ('toggle') {\n <div class=\"flex items-center gap-3 h-9\">\n <p-toggleswitch\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [disabled]=\"field.disabled ?? false\"\n />\n <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n </div>\n }\n\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getFieldTemplate(field.key); context: { $implicit: getFieldValue(field.key), field: field }\"\n />\n }\n }\n\n @if (isFieldInvalid(field)) {\n <small class=\"text-red-500\">{{ field.label }} {{ t('shared.required') }}</small>\n }\n\n @if (field.hint && !isFieldInvalid(field)) {\n <small class=\"text-surface-400\">{{ field.hint }}</small>\n }\n </div>\n }\n\n <div class=\"col-span-full flex justify-end gap-4 pt-4\">\n <button\n pButton\n type=\"button\"\n severity=\"secondary\"\n [outlined]=\"true\"\n [disabled]=\"effectiveIsLoading()\"\n (click)=\"handleCancel()\"\n >\n <span pButtonLabel>{{ cancelLabel() || t('shared.cancel') }}</span>\n </button>\n <button\n pButton\n type=\"submit\"\n [disabled]=\"!isFormValid() || effectiveIsLoading()\"\n >\n @if (effectiveIsLoading()) {\n <span pButtonIcon class=\"pi pi-spinner pi-spin\"></span>\n }\n <span pButtonLabel>{{ submitLabel() || (effectiveIsEditMode() ? t('shared.update') : t('shared.save')) }}</span>\n </button>\n </div>\n </div>\n </form>\n</p-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: PrimeModule }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["pButton", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "link", "rounded", "fluid", "variant", "iconOnly", "loading", "severity"] }, { kind: "directive", type: i3.ButtonLabel, selector: "[pButtonLabel]", inputs: ["pButtonLabelPT", "pButtonLabelUnstyled"] }, { kind: "directive", type: i3.ButtonIcon, selector: "[pButtonIcon]", inputs: ["pButtonIconPT", "pButtonUnstyled"] }, { kind: "component", type: i4.Card, selector: "p-card", inputs: ["header", "subheader"] }, { kind: "component", type: i5$1.Checkbox, selector: "p-checkbox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "component", type: i6$1.DatePicker, selector: "p-datepicker, p-date-picker", inputs: ["iconDisplay", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: i5.IconField, selector: "p-iconfield, p-icon-field", inputs: ["hostName", "iconPosition"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon", inputs: ["hostName"] }, { kind: "component", type: i9$1.InputNumber, selector: "p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i10$1.InputPassword, selector: "[pInputPassword]", inputs: ["mask"], outputs: ["maskChange"] }, { kind: "directive", type: i7.InputText, selector: "[pInputText]", inputs: ["hostName", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i12.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "multiple", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i13.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "component", type: i14.ToggleSwitch, selector: "p-toggleswitch, p-toggle-switch", inputs: ["tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }] });
|
|
1730
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1731
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: BaseFormComponent, isStandalone: true, selector: "lib-base-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, createTitle: { classPropertyName: "createTitle", publicName: "createTitle", isSignal: true, isRequired: false, transformFunction: null }, editTitle: { classPropertyName: "editTitle", publicName: "editTitle", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, submitLabel: { classPropertyName: "submitLabel", publicName: "submitLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: false, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null }, cancelRoute: { classPropertyName: "cancelRoute", publicName: "cancelRoute", isSignal: true, isRequired: false, transformFunction: null }, navigateOnSuccess: { classPropertyName: "navigateOnSuccess", publicName: "navigateOnSuccess", isSignal: true, isRequired: false, transformFunction: null }, mapToRequest: { classPropertyName: "mapToRequest", publicName: "mapToRequest", isSignal: true, isRequired: false, transformFunction: null }, mapFromEntity: { classPropertyName: "mapFromEntity", publicName: "mapFromEntity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onCancel: "onCancel", onValueChange: "onValueChange" }, queries: [{ propertyName: "fieldTemplates", predicate: BaseFormTemplateDirective, isSignal: true }], ngImport: i0, template: "<f-card>\n <ng-template #header>\n @if (resolvedTitle()) {\n <div class=\"flex justify-between items-center p-4\">\n <h2 class=\"text-xl font-semibold m-0\">{{ resolvedTitle() }}</h2>\n </div>\n }\n </ng-template>\n\n <form (ngSubmit)=\"handleSubmit()\" novalidate>\n <div class=\"grid gap-4\" [class]=\"gridClass()\">\n @for (field of fields(); track field.key) {\n <div class=\"flex flex-col gap-2\" [class.col-span-full]=\"field.fullWidth\">\n @if (field.type !== 'checkbox' && field.type !== 'toggle') {\n <label [for]=\"field.key\" class=\"font-medium\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n }\n\n @switch (field.type) {\n @case ('text') {\n <input\n fInputText\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('email') {\n <input\n fInputText\n type=\"email\"\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('password') {\n <f-iconfield iconPosition=\"right\" class=\"w-full\">\n <input\n fInputText\n fInputPassword\n [id]=\"field.key\"\n [name]=\"field.key\"\n [mask]=\"!isPasswordVisible(field.key)\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n <f-inputicon\n class=\"cursor-pointer\"\n (click)=\"togglePasswordVisibility(field.key)\"\n >\n <ui-icon [name]=\"isPasswordVisible(field.key) ? 'eye-slash' : 'eye'\"></ui-icon>\n </f-inputicon>\n </f-iconfield>\n }\n\n @case ('number') {\n <f-inputnumber\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (onBlur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [min]=\"field.min ?? null\"\n [max]=\"field.max ?? null\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n inputStyleClass=\"w-full\"\n />\n }\n\n @case ('textarea') {\n <textarea\n fTextarea\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [rows]=\"field.rows ?? 3\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n ></textarea>\n }\n\n @case ('select') {\n <f-select\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [options]=\"field.options ?? []\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('multiselect') {\n <f-multiselect\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [options]=\"field.options ?? []\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('date') {\n <f-datepicker\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (onBlur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [minDate]=\"field.minDate ?? null\"\n [maxDate]=\"field.maxDate ?? null\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n inputStyleClass=\"w-full\"\n />\n }\n\n @case ('checkbox') {\n <div class=\"flex items-center gap-2 h-9\">\n <f-checkbox\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [disabled]=\"field.disabled ?? false\"\n [binary]=\"true\"\n [invalid]=\"isFieldInvalid(field)\"\n />\n <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n </div>\n }\n\n @case ('toggle') {\n <div class=\"flex items-center gap-3 h-9\">\n <f-toggleswitch\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [disabled]=\"field.disabled ?? false\"\n />\n <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n </div>\n }\n\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getFieldTemplate(field.key); context: { $implicit: getFieldValue(field.key), field: field }\"\n />\n }\n }\n\n @if (isFieldInvalid(field)) {\n <small class=\"text-red-500\">{{ field.label }} {{ t('shared.required') }}</small>\n }\n\n @if (field.hint && !isFieldInvalid(field)) {\n <small class=\"text-surface-400\">{{ field.hint }}</small>\n }\n </div>\n }\n\n <div class=\"col-span-full flex justify-end gap-4 pt-4\">\n <button\n fButton\n type=\"button\"\n severity=\"secondary\"\n [outlined]=\"true\"\n [disabled]=\"effectiveIsLoading()\"\n (click)=\"handleCancel()\"\n >\n <span pButtonLabel>{{ cancelLabel() || t('shared.cancel') }}</span>\n </button>\n <button\n fButton\n type=\"submit\"\n [disabled]=\"!isFormValid() || effectiveIsLoading()\"\n >\n @if (effectiveIsLoading()) {\n <ui-icon pButtonIcon name=\"spinner\" [spin]=\"true\"></ui-icon>\n }\n <span pButtonLabel>{{ submitLabel() || (effectiveIsEditMode() ? t('shared.update') : t('shared.save')) }}</span>\n </button>\n </div>\n </div>\n </form>\n</f-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "rounded", "raised", "fluid", "disabled", "loading", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.CheckboxComponent, selector: "f-checkbox", inputs: ["label", "binary", "disabled", "inputId", "invalid", "indeterminate", "touched", "styleClass", "checked"], outputs: ["onChange", "onBlur", "touch", "checkedChange"] }, { kind: "component", type: i3.DatePickerComponent, selector: "f-datepicker", inputs: ["placeholder", "dateFormat", "disabled", "showTime", "selectionMode", "minDate", "maxDate", "inputId", "invalid", "touched", "showClear", "inputStyleClass", "showIcon", "showButtonBar", "appendTo", "styleClass"], outputs: ["onBlur"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield" }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["styleClass"] }, { kind: "component", type: i3.InputNumberComponent, selector: "f-inputnumber", inputs: ["min", "max", "step", "showButtons", "disabled", "inputId", "invalid", "touched", "placeholder", "prefix", "suffix", "useGrouping", "buttonLayout", "inputStyleClass"], outputs: ["onBlur"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched"] }, { kind: "directive", type: i3.InputPasswordDirective, selector: "[fInputPassword]", inputs: ["mask"] }, { kind: "component", type: i3.MultiSelectComponent, selector: "f-multiselect", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "inputId", "invalid", "touched", "showClear", "optionDisabled", "display", "maxSelectedLabels", "selectionLimit", "showToggleAll", "styleClass"], outputs: ["onBlur"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "showClear", "loading", "inputId", "invalid", "touched", "styleClass", "editable"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur"] }, { kind: "directive", type: i3.TextareaDirective, selector: "[fTextarea]", inputs: ["invalid", "touched"] }, { kind: "component", type: i3.ToggleSwitchComponent, selector: "f-toggleswitch", inputs: ["disabled", "readonly", "invalid", "ariaLabel", "trueValue", "falseValue", "inputId"] }, { kind: "component", type: i3.CardComponent, selector: "f-card", inputs: ["header", "subheader", "styleClass"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }] });
|
|
2200
1732
|
}
|
|
2201
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
1733
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormComponent, decorators: [{
|
|
2202
1734
|
type: Component,
|
|
2203
|
-
args: [{ selector: 'lib-base-form', imports: [AngularModule,
|
|
1735
|
+
args: [{ selector: 'lib-base-form', imports: [AngularModule, UiModule], template: "<f-card>\n <ng-template #header>\n @if (resolvedTitle()) {\n <div class=\"flex justify-between items-center p-4\">\n <h2 class=\"text-xl font-semibold m-0\">{{ resolvedTitle() }}</h2>\n </div>\n }\n </ng-template>\n\n <form (ngSubmit)=\"handleSubmit()\" novalidate>\n <div class=\"grid gap-4\" [class]=\"gridClass()\">\n @for (field of fields(); track field.key) {\n <div class=\"flex flex-col gap-2\" [class.col-span-full]=\"field.fullWidth\">\n @if (field.type !== 'checkbox' && field.type !== 'toggle') {\n <label [for]=\"field.key\" class=\"font-medium\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n }\n\n @switch (field.type) {\n @case ('text') {\n <input\n fInputText\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('email') {\n <input\n fInputText\n type=\"email\"\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('password') {\n <f-iconfield iconPosition=\"right\" class=\"w-full\">\n <input\n fInputText\n fInputPassword\n [id]=\"field.key\"\n [name]=\"field.key\"\n [mask]=\"!isPasswordVisible(field.key)\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n <f-inputicon\n class=\"cursor-pointer\"\n (click)=\"togglePasswordVisibility(field.key)\"\n >\n <ui-icon [name]=\"isPasswordVisible(field.key) ? 'eye-slash' : 'eye'\"></ui-icon>\n </f-inputicon>\n </f-iconfield>\n }\n\n @case ('number') {\n <f-inputnumber\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (onBlur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [min]=\"field.min ?? null\"\n [max]=\"field.max ?? null\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n inputStyleClass=\"w-full\"\n />\n }\n\n @case ('textarea') {\n <textarea\n fTextarea\n [id]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (blur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [rows]=\"field.rows ?? 3\"\n [class.ng-invalid]=\"isFieldInvalid(field)\"\n [class.ng-dirty]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n ></textarea>\n }\n\n @case ('select') {\n <f-select\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [options]=\"field.options ?? []\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('multiselect') {\n <f-multiselect\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [options]=\"field.options ?? []\"\n optionLabel=\"label\"\n optionValue=\"value\"\n [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n [disabled]=\"field.disabled ?? false\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n />\n }\n\n @case ('date') {\n <f-datepicker\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n (onBlur)=\"markFieldTouched(field.key)\"\n [placeholder]=\"field.placeholder ?? ''\"\n [disabled]=\"field.disabled ?? false\"\n [minDate]=\"field.minDate ?? null\"\n [maxDate]=\"field.maxDate ?? null\"\n [invalid]=\"isFieldInvalid(field)\"\n class=\"w-full\"\n inputStyleClass=\"w-full\"\n />\n }\n\n @case ('checkbox') {\n <div class=\"flex items-center gap-2 h-9\">\n <f-checkbox\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [disabled]=\"field.disabled ?? false\"\n [binary]=\"true\"\n [invalid]=\"isFieldInvalid(field)\"\n />\n <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n </div>\n }\n\n @case ('toggle') {\n <div class=\"flex items-center gap-3 h-9\">\n <f-toggleswitch\n [inputId]=\"field.key\"\n [name]=\"field.key\"\n [ngModel]=\"getFieldValue(field.key)\"\n (ngModelChange)=\"setFieldValue(field.key, $event)\"\n [disabled]=\"field.disabled ?? false\"\n />\n <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n {{ field.label }}\n @if (field.required) {\n <span class=\"text-red-500 ml-1\">*</span>\n }\n </label>\n </div>\n }\n\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getFieldTemplate(field.key); context: { $implicit: getFieldValue(field.key), field: field }\"\n />\n }\n }\n\n @if (isFieldInvalid(field)) {\n <small class=\"text-red-500\">{{ field.label }} {{ t('shared.required') }}</small>\n }\n\n @if (field.hint && !isFieldInvalid(field)) {\n <small class=\"text-surface-400\">{{ field.hint }}</small>\n }\n </div>\n }\n\n <div class=\"col-span-full flex justify-end gap-4 pt-4\">\n <button\n fButton\n type=\"button\"\n severity=\"secondary\"\n [outlined]=\"true\"\n [disabled]=\"effectiveIsLoading()\"\n (click)=\"handleCancel()\"\n >\n <span pButtonLabel>{{ cancelLabel() || t('shared.cancel') }}</span>\n </button>\n <button\n fButton\n type=\"submit\"\n [disabled]=\"!isFormValid() || effectiveIsLoading()\"\n >\n @if (effectiveIsLoading()) {\n <ui-icon pButtonIcon name=\"spinner\" [spin]=\"true\"></ui-icon>\n }\n <span pButtonLabel>{{ submitLabel() || (effectiveIsEditMode() ? t('shared.update') : t('shared.save')) }}</span>\n </button>\n </div>\n </div>\n </form>\n</f-card>\n" }]
|
|
2204
1736
|
}], ctorParameters: () => [], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], createTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "createTitle", required: false }] }], editTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "editTitle", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], submitLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "submitLabel", required: false }] }], cancelLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelLabel", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], isEditMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isEditMode", required: false }] }], initialValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialValue", required: false }] }], service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], editId: [{ type: i0.Input, args: [{ isSignal: true, alias: "editId", required: false }] }], cancelRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelRoute", required: false }] }], navigateOnSuccess: [{ type: i0.Input, args: [{ isSignal: true, alias: "navigateOnSuccess", required: false }] }], mapToRequest: [{ type: i0.Input, args: [{ isSignal: true, alias: "mapToRequest", required: false }] }], mapFromEntity: [{ type: i0.Input, args: [{ isSignal: true, alias: "mapFromEntity", required: false }] }], onSubmit: [{ type: i0.Output, args: ["onSubmit"] }], onCancel: [{ type: i0.Output, args: ["onCancel"] }], onValueChange: [{ type: i0.Output, args: ["onValueChange"] }], fieldTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BaseFormTemplateDirective), { isSignal: true }] }] } });
|
|
2205
1737
|
|
|
2206
|
-
class
|
|
2207
|
-
|
|
2208
|
-
|
|
2209
|
-
|
|
2210
|
-
|
|
2211
|
-
|
|
2212
|
-
|
|
2213
|
-
|
|
2214
|
-
|
|
2215
|
-
|
|
2216
|
-
|
|
1738
|
+
class BaseListTemplateDirective {
|
|
1739
|
+
key = input.required({ ...(ngDevMode ? { debugName: "key" } : /* istanbul ignore next */ {}), alias: 'baseListTemplate' });
|
|
1740
|
+
templateRef = inject((TemplateRef));
|
|
1741
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseListTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1742
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: BaseListTemplateDirective, isStandalone: true, selector: "ng-template[baseListTemplate]", inputs: { key: { classPropertyName: "key", publicName: "baseListTemplate", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
|
|
1743
|
+
}
|
|
1744
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseListTemplateDirective, decorators: [{
|
|
1745
|
+
type: Directive,
|
|
1746
|
+
args: [{ selector: 'ng-template[baseListTemplate]' }]
|
|
1747
|
+
}], propDecorators: { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseListTemplate", required: true }] }] } });
|
|
1748
|
+
|
|
1749
|
+
class BaseListComponent {
|
|
1750
|
+
translateAdapter = inject(TranslateService, { optional: true });
|
|
1751
|
+
router = inject(Router, { optional: true });
|
|
1752
|
+
messageService = inject(MessageService, { optional: true });
|
|
1753
|
+
confirmationService = inject(ConfirmationService, { optional: true });
|
|
1754
|
+
columns = input.required(/* @ts-ignore */
|
|
1755
|
+
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
1756
|
+
actions = input([], /* @ts-ignore */
|
|
1757
|
+
...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
|
|
1758
|
+
title = input('', /* @ts-ignore */
|
|
1759
|
+
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
1760
|
+
showCreateButton = input(true, /* @ts-ignore */
|
|
1761
|
+
...(ngDevMode ? [{ debugName: "showCreateButton" }] : /* istanbul ignore next */ []));
|
|
1762
|
+
searchable = input(false, /* @ts-ignore */
|
|
1763
|
+
...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
|
|
1764
|
+
pageSize = input(10, /* @ts-ignore */
|
|
1765
|
+
...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
|
|
1766
|
+
emptyMessage = input('', /* @ts-ignore */
|
|
1767
|
+
...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
|
|
1768
|
+
createButtonLabel = input('', /* @ts-ignore */
|
|
1769
|
+
...(ngDevMode ? [{ debugName: "createButtonLabel" }] : /* istanbul ignore next */ []));
|
|
1770
|
+
createButtonIcon = input('plus', /* @ts-ignore */
|
|
1771
|
+
...(ngDevMode ? [{ debugName: "createButtonIcon" }] : /* istanbul ignore next */ []));
|
|
1772
|
+
data = input([], /* @ts-ignore */
|
|
1773
|
+
...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
1774
|
+
total = input(0, /* @ts-ignore */
|
|
1775
|
+
...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
|
|
1776
|
+
isLoading = input(false, /* @ts-ignore */
|
|
1777
|
+
...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
|
|
1778
|
+
service = input(null, /* @ts-ignore */
|
|
1779
|
+
...(ngDevMode ? [{ debugName: "service" }] : /* istanbul ignore next */ []));
|
|
1780
|
+
filter = input({}, /* @ts-ignore */
|
|
1781
|
+
...(ngDevMode ? [{ debugName: "filter" }] : /* istanbul ignore next */ []));
|
|
1782
|
+
createRoute = input(null, /* @ts-ignore */
|
|
1783
|
+
...(ngDevMode ? [{ debugName: "createRoute" }] : /* istanbul ignore next */ []));
|
|
1784
|
+
editRoute = input(null, /* @ts-ignore */
|
|
1785
|
+
...(ngDevMode ? [{ debugName: "editRoute" }] : /* istanbul ignore next */ []));
|
|
1786
|
+
deleteConfirmField = input(null, /* @ts-ignore */
|
|
1787
|
+
...(ngDevMode ? [{ debugName: "deleteConfirmField" }] : /* istanbul ignore next */ []));
|
|
1788
|
+
idField = input('id', /* @ts-ignore */
|
|
1789
|
+
...(ngDevMode ? [{ debugName: "idField" }] : /* istanbul ignore next */ []));
|
|
1790
|
+
canEdit = input(null, /* @ts-ignore */
|
|
1791
|
+
...(ngDevMode ? [{ debugName: "canEdit" }] : /* istanbul ignore next */ []));
|
|
1792
|
+
canDelete = input(null, /* @ts-ignore */
|
|
1793
|
+
...(ngDevMode ? [{ debugName: "canDelete" }] : /* istanbul ignore next */ []));
|
|
1794
|
+
onCreate = output();
|
|
1795
|
+
onLazyLoad = output();
|
|
1796
|
+
onSearch = output();
|
|
1797
|
+
columnTemplates = contentChildren(BaseListTemplateDirective, /* @ts-ignore */
|
|
1798
|
+
...(ngDevMode ? [{ debugName: "columnTemplates" }] : /* istanbul ignore next */ []));
|
|
1799
|
+
_first = signal(0, /* @ts-ignore */
|
|
1800
|
+
...(ngDevMode ? [{ debugName: "_first" }] : /* istanbul ignore next */ []));
|
|
1801
|
+
_searchTerm = signal('', /* @ts-ignore */
|
|
1802
|
+
...(ngDevMode ? [{ debugName: "_searchTerm" }] : /* istanbul ignore next */ []));
|
|
1803
|
+
first = this._first.asReadonly();
|
|
1804
|
+
searchTerm = this._searchTerm.asReadonly();
|
|
1805
|
+
effectiveData = computed(() => this.service()?.data() ?? this.data(), /* @ts-ignore */
|
|
1806
|
+
...(ngDevMode ? [{ debugName: "effectiveData" }] : /* istanbul ignore next */ []));
|
|
1807
|
+
effectiveTotal = computed(() => this.service()?.total() ?? this.total(), /* @ts-ignore */
|
|
1808
|
+
...(ngDevMode ? [{ debugName: "effectiveTotal" }] : /* istanbul ignore next */ []));
|
|
1809
|
+
effectiveIsLoading = computed(() => this.service()?.isLoading() ?? this.isLoading(), /* @ts-ignore */
|
|
1810
|
+
...(ngDevMode ? [{ debugName: "effectiveIsLoading" }] : /* istanbul ignore next */ []));
|
|
1811
|
+
effectiveActions = computed(() => {
|
|
1812
|
+
const editRoute = this.editRoute();
|
|
1813
|
+
const deleteField = this.deleteConfirmField();
|
|
1814
|
+
const editAction = editRoute
|
|
1815
|
+
? [{ icon: 'pencil', tooltip: 'shared.edit', severity: 'info',
|
|
1816
|
+
show: this.canEdit() ?? undefined, handler: (item) => this.handleEditItem(item) }]
|
|
1817
|
+
: [];
|
|
1818
|
+
const deleteAction = deleteField
|
|
1819
|
+
? [{ icon: 'trash', tooltip: 'shared.delete', severity: 'danger',
|
|
1820
|
+
show: this.canDelete() ?? undefined, handler: (item) => this.handleDeleteItem(item) }]
|
|
1821
|
+
: [];
|
|
1822
|
+
return [...editAction, ...this.actions(), ...deleteAction];
|
|
1823
|
+
}, /* @ts-ignore */
|
|
1824
|
+
...(ngDevMode ? [{ debugName: "effectiveActions" }] : /* istanbul ignore next */ []));
|
|
1825
|
+
visibleColumns = computed(() => this.columns().filter((c) => !c.hidden), /* @ts-ignore */
|
|
1826
|
+
...(ngDevMode ? [{ debugName: "visibleColumns" }] : /* istanbul ignore next */ []));
|
|
1827
|
+
columnCount = computed(() => this.visibleColumns().length + (this.effectiveActions().length > 0 ? 1 : 0), /* @ts-ignore */
|
|
1828
|
+
...(ngDevMode ? [{ debugName: "columnCount" }] : /* istanbul ignore next */ []));
|
|
1829
|
+
resolvedEmptyMessage = computed(() => this.emptyMessage() || this.t('shared.no.data'), /* @ts-ignore */
|
|
1830
|
+
...(ngDevMode ? [{ debugName: "resolvedEmptyMessage" }] : /* istanbul ignore next */ []));
|
|
1831
|
+
resolvedCreateLabel = computed(() => this.createButtonLabel() || this.t('shared.create'), /* @ts-ignore */
|
|
1832
|
+
...(ngDevMode ? [{ debugName: "resolvedCreateLabel" }] : /* istanbul ignore next */ []));
|
|
1833
|
+
handleLazyLoad(event) {
|
|
1834
|
+
const first = event.first ?? 0;
|
|
1835
|
+
const rows = event.rows ?? this.pageSize();
|
|
1836
|
+
this._first.set(first);
|
|
1837
|
+
const service = this.service();
|
|
1838
|
+
if (service) {
|
|
1839
|
+
service.fetchList(this.searchTerm(), {
|
|
1840
|
+
pagination: { currentPage: Math.floor(first / rows), pageSize: rows },
|
|
1841
|
+
filter: this.filter(),
|
|
1842
|
+
});
|
|
1843
|
+
}
|
|
1844
|
+
this.onLazyLoad.emit({ first, rows });
|
|
2217
1845
|
}
|
|
2218
|
-
|
|
1846
|
+
onSearchChange(value) {
|
|
1847
|
+
this._first.set(0);
|
|
1848
|
+
this._searchTerm.set(value);
|
|
1849
|
+
const service = this.service();
|
|
1850
|
+
if (service) {
|
|
1851
|
+
service.fetchList(value, {
|
|
1852
|
+
pagination: { currentPage: 0, pageSize: this.pageSize() },
|
|
1853
|
+
filter: this.filter(),
|
|
1854
|
+
});
|
|
1855
|
+
}
|
|
1856
|
+
this.onSearch.emit(value);
|
|
1857
|
+
}
|
|
1858
|
+
handleCreate() {
|
|
1859
|
+
const route = this.createRoute();
|
|
1860
|
+
if (route && this.router)
|
|
1861
|
+
this.router.navigate([route]);
|
|
1862
|
+
this.onCreate.emit();
|
|
1863
|
+
}
|
|
1864
|
+
handleEditItem(item) {
|
|
1865
|
+
const route = this.editRoute();
|
|
1866
|
+
const id = this.getFieldValueAsString(item, this.idField());
|
|
1867
|
+
if (route && id && this.router)
|
|
1868
|
+
this.router.navigate([route, id]);
|
|
1869
|
+
}
|
|
1870
|
+
handleDeleteItem(item) {
|
|
1871
|
+
const nameField = this.deleteConfirmField();
|
|
1872
|
+
const name = this.getFieldValueAsString(item, nameField);
|
|
1873
|
+
const id = this.getFieldValueAsString(item, this.idField());
|
|
1874
|
+
this.confirmationService?.confirm({
|
|
1875
|
+
message: this.t('shared.confirm.delete.item', { name }),
|
|
1876
|
+
header: this.t('shared.confirm.delete'),
|
|
1877
|
+
icon: 'exclamation-triangle',
|
|
1878
|
+
acceptButtonStyleClass: 'p-button-danger',
|
|
1879
|
+
accept: async () => {
|
|
1880
|
+
try {
|
|
1881
|
+
const response = await this.service()?.delete({ id, type: 'delete' });
|
|
1882
|
+
this.messageService?.add({
|
|
1883
|
+
severity: 'success',
|
|
1884
|
+
summary: this.t('shared.success'),
|
|
1885
|
+
detail: response?.messageKey
|
|
1886
|
+
? this.t(response.messageKey, response.messageVariables)
|
|
1887
|
+
: (response?.message ?? ''),
|
|
1888
|
+
});
|
|
1889
|
+
this.service()?.reload();
|
|
1890
|
+
}
|
|
1891
|
+
catch {
|
|
1892
|
+
// handled by global interceptor
|
|
1893
|
+
}
|
|
1894
|
+
},
|
|
1895
|
+
});
|
|
1896
|
+
}
|
|
1897
|
+
getFieldValue(item, field) {
|
|
1898
|
+
return field
|
|
1899
|
+
.split('.')
|
|
1900
|
+
.reduce((obj, key) => (obj != null ? obj[key] : null), item);
|
|
1901
|
+
}
|
|
1902
|
+
getFieldValueAsString(item, field) {
|
|
1903
|
+
return String(this.getFieldValue(item, field) ?? '');
|
|
1904
|
+
}
|
|
1905
|
+
getTagConfig(col, value) {
|
|
1906
|
+
return col.tagMap?.[String(value)] ?? null;
|
|
1907
|
+
}
|
|
1908
|
+
getColumnTemplate(field) {
|
|
1909
|
+
return this.columnTemplates().find((t) => t.key() === field)?.templateRef ?? null;
|
|
1910
|
+
}
|
|
1911
|
+
truncateText(value, limit) {
|
|
1912
|
+
const str = String(value ?? '');
|
|
1913
|
+
return limit && str.length > limit ? `${str.slice(0, limit)}…` : str;
|
|
1914
|
+
}
|
|
1915
|
+
getCellClass(col) {
|
|
1916
|
+
switch (col.align) {
|
|
1917
|
+
case 'center': return 'text-center';
|
|
1918
|
+
case 'right': return 'text-right';
|
|
1919
|
+
default: return '';
|
|
1920
|
+
}
|
|
1921
|
+
}
|
|
1922
|
+
t(key, vars) {
|
|
1923
|
+
return this.translateAdapter?.translate(key, vars) ?? key;
|
|
1924
|
+
}
|
|
1925
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1926
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: BaseListComponent, isStandalone: true, selector: "lib-base-list", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, createButtonLabel: { classPropertyName: "createButtonLabel", publicName: "createButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, createButtonIcon: { classPropertyName: "createButtonIcon", publicName: "createButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, createRoute: { classPropertyName: "createRoute", publicName: "createRoute", isSignal: true, isRequired: false, transformFunction: null }, editRoute: { classPropertyName: "editRoute", publicName: "editRoute", isSignal: true, isRequired: false, transformFunction: null }, deleteConfirmField: { classPropertyName: "deleteConfirmField", publicName: "deleteConfirmField", isSignal: true, isRequired: false, transformFunction: null }, idField: { classPropertyName: "idField", publicName: "idField", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCreate: "onCreate", onLazyLoad: "onLazyLoad", onSearch: "onSearch" }, queries: [{ propertyName: "columnTemplates", predicate: BaseListTemplateDirective, isSignal: true }], ngImport: i0, template: "<f-card>\n <ng-template #header>\n @if (title() || searchable() || showCreateButton()) {\n <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\">\n @if (title()) {\n <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n }\n <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n @if (searchable()) {\n <f-iconfield>\n <f-inputicon><ui-icon name=\"search\" class=\"text-sm\"></ui-icon></f-inputicon>\n <input\n fInputText\n type=\"text\"\n [ngModel]=\"searchTerm()\"\n (ngModelChange)=\"onSearchChange($event)\"\n [placeholder]=\"t('shared.search')\"\n />\n </f-iconfield>\n }\n @if (showCreateButton()) {\n <button\n fButton\n (click)=\"handleCreate()\"\n >\n <ui-icon pButtonIcon [name]=\"createButtonIcon()\"></ui-icon>\n <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n </button>\n }\n </div>\n </div>\n }\n </ng-template>\n\n <div class=\"overflow-x-auto\">\n <f-table\n [value]=\"effectiveData()\"\n [loading]=\"effectiveIsLoading()\"\n [lazy]=\"true\"\n [scrollable]=\"true\"\n [paginator]=\"effectiveTotal() > pageSize()\"\n [rows]=\"pageSize()\"\n [totalRecords]=\"effectiveTotal()\"\n [first]=\"first()\"\n (onLazyLoad)=\"handleLazyLoad($event)\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n class=\"p-datatable-striped\"\n >\n <ng-template #header>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <th [style.width]=\"col.width\" [style.min-width]=\"col.minWidth\" [class]=\"getCellClass(col)\">\n {{ col.header }}\n </th>\n }\n @if (effectiveActions().length > 0) {\n <th style=\"width: 120px; text-align: center;\">{{ t('shared.actions') }}</th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <td [class]=\"getCellClass(col)\">\n @switch (col.type ?? 'text') {\n @case ('tag') {\n @if (getTagConfig(col, getFieldValue(item, col.field)); as tagCfg) {\n <f-tag [severity]=\"tagCfg.severity\" [value]=\"tagCfg.label ?? getFieldValueAsString(item, col.field)\" />\n } @else {\n {{ getFieldValueAsString(item, col.field) }}\n }\n }\n @case ('boolean') {\n <f-tag\n [severity]=\"getFieldValue(item, col.field) ? 'success' : 'danger'\"\n [value]=\"getFieldValue(item, col.field) ? t('shared.yes') : t('shared.no')\"\n />\n }\n @case ('date') {\n {{ getFieldValueAsString(item, col.field) | date: (col.dateFormat ?? 'dd/MM/yyyy') }}\n }\n @case ('number') {\n {{ getFieldValueAsString(item, col.field) | number }}\n }\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getColumnTemplate(col.field); context: { $implicit: item, field: col.field }\"\n />\n }\n @default {\n {{ truncateText(getFieldValue(item, col.field), col.truncate) }}\n }\n }\n </td>\n }\n @if (effectiveActions().length > 0) {\n <td>\n <div class=\"flex items-center justify-center gap-2\">\n @for (action of effectiveActions(); track $index) {\n @if (!action.show || action.show(item)) {\n <button\n fButton\n [severity]=\"action.severity ?? 'secondary'\"\n [fTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n [disabled]=\"action.disabled ? action.disabled(item) : false\"\n (click)=\"action.handler(item)\"\n [rounded]=\"true\"\n [text]=\"true\"\n >\n <ui-icon pButtonIcon [name]=\"action.icon\"></ui-icon>\n </button>\n }\n }\n </div>\n </td>\n }\n </tr>\n </ng-template>\n\n <ng-template #emptymessage>\n <tr>\n <td [attr.colspan]=\"columnCount()\">\n <div class=\"flex flex-col items-center justify-center py-12 text-surface-400\">\n <ui-icon name=\"inbox\" class=\"text-5xl mb-3\"></ui-icon>\n <span>{{ resolvedEmptyMessage() }}</span>\n </div>\n </td>\n </tr>\n </ng-template>\n </f-table>\n </div>\n</f-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "rounded", "raised", "fluid", "disabled", "loading", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.TagComponent, selector: "f-tag", inputs: ["value", "severity", "icon", "rounded", "color"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield" }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["styleClass"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched"] }, { kind: "component", type: i3.CardComponent, selector: "f-card", inputs: ["header", "subheader", "styleClass"] }, { kind: "component", type: i3.TableComponent, selector: "f-table", inputs: ["value", "lazy", "loading", "rows", "totalRecords", "rowHover", "dataKey", "scrollable", "paginator", "first", "rowsPerPageOptions", "showCurrentPageReport", "currentPageReportTemplate", "tableStyle", "styleClass", "globalFilterFields", "sortField", "sortOrder"], outputs: ["sortFieldChange", "sortOrderChange", "onLazyLoad", "onSort"] }, { kind: "directive", type: i3.TooltipDirective, selector: "[fTooltip]", inputs: ["fTooltip", "tooltipPosition", "tooltipStyleClass", "disabled", "tooltipEvent", "showDelay", "hideDelay"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
|
|
2219
1927
|
}
|
|
2220
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
1928
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseListComponent, decorators: [{
|
|
2221
1929
|
type: Component,
|
|
2222
|
-
args: [{ selector: '
|
|
2223
|
-
|
|
2224
|
-
<span [innerHTML]="svg.value()"></span>
|
|
2225
|
-
}
|
|
2226
|
-
`, styles: ["inline-svg{display:inline-flex;align-items:center}inline-svg span{display:inline-flex;align-items:center;height:100%;width:100%}inline-svg svg{height:100%;width:auto}\n"] }]
|
|
2227
|
-
}], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }] } });
|
|
1930
|
+
args: [{ selector: 'lib-base-list', imports: [AngularModule, UiModule], template: "<f-card>\n <ng-template #header>\n @if (title() || searchable() || showCreateButton()) {\n <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\">\n @if (title()) {\n <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n }\n <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n @if (searchable()) {\n <f-iconfield>\n <f-inputicon><ui-icon name=\"search\" class=\"text-sm\"></ui-icon></f-inputicon>\n <input\n fInputText\n type=\"text\"\n [ngModel]=\"searchTerm()\"\n (ngModelChange)=\"onSearchChange($event)\"\n [placeholder]=\"t('shared.search')\"\n />\n </f-iconfield>\n }\n @if (showCreateButton()) {\n <button\n fButton\n (click)=\"handleCreate()\"\n >\n <ui-icon pButtonIcon [name]=\"createButtonIcon()\"></ui-icon>\n <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n </button>\n }\n </div>\n </div>\n }\n </ng-template>\n\n <div class=\"overflow-x-auto\">\n <f-table\n [value]=\"effectiveData()\"\n [loading]=\"effectiveIsLoading()\"\n [lazy]=\"true\"\n [scrollable]=\"true\"\n [paginator]=\"effectiveTotal() > pageSize()\"\n [rows]=\"pageSize()\"\n [totalRecords]=\"effectiveTotal()\"\n [first]=\"first()\"\n (onLazyLoad)=\"handleLazyLoad($event)\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n class=\"p-datatable-striped\"\n >\n <ng-template #header>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <th [style.width]=\"col.width\" [style.min-width]=\"col.minWidth\" [class]=\"getCellClass(col)\">\n {{ col.header }}\n </th>\n }\n @if (effectiveActions().length > 0) {\n <th style=\"width: 120px; text-align: center;\">{{ t('shared.actions') }}</th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item>\n <tr>\n @for (col of visibleColumns(); track col.field) {\n <td [class]=\"getCellClass(col)\">\n @switch (col.type ?? 'text') {\n @case ('tag') {\n @if (getTagConfig(col, getFieldValue(item, col.field)); as tagCfg) {\n <f-tag [severity]=\"tagCfg.severity\" [value]=\"tagCfg.label ?? getFieldValueAsString(item, col.field)\" />\n } @else {\n {{ getFieldValueAsString(item, col.field) }}\n }\n }\n @case ('boolean') {\n <f-tag\n [severity]=\"getFieldValue(item, col.field) ? 'success' : 'danger'\"\n [value]=\"getFieldValue(item, col.field) ? t('shared.yes') : t('shared.no')\"\n />\n }\n @case ('date') {\n {{ getFieldValueAsString(item, col.field) | date: (col.dateFormat ?? 'dd/MM/yyyy') }}\n }\n @case ('number') {\n {{ getFieldValueAsString(item, col.field) | number }}\n }\n @case ('custom') {\n <ng-container\n *ngTemplateOutlet=\"getColumnTemplate(col.field); context: { $implicit: item, field: col.field }\"\n />\n }\n @default {\n {{ truncateText(getFieldValue(item, col.field), col.truncate) }}\n }\n }\n </td>\n }\n @if (effectiveActions().length > 0) {\n <td>\n <div class=\"flex items-center justify-center gap-2\">\n @for (action of effectiveActions(); track $index) {\n @if (!action.show || action.show(item)) {\n <button\n fButton\n [severity]=\"action.severity ?? 'secondary'\"\n [fTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n [disabled]=\"action.disabled ? action.disabled(item) : false\"\n (click)=\"action.handler(item)\"\n [rounded]=\"true\"\n [text]=\"true\"\n >\n <ui-icon pButtonIcon [name]=\"action.icon\"></ui-icon>\n </button>\n }\n }\n </div>\n </td>\n }\n </tr>\n </ng-template>\n\n <ng-template #emptymessage>\n <tr>\n <td [attr.colspan]=\"columnCount()\">\n <div class=\"flex flex-col items-center justify-center py-12 text-surface-400\">\n <ui-icon name=\"inbox\" class=\"text-5xl mb-3\"></ui-icon>\n <span>{{ resolvedEmptyMessage() }}</span>\n </div>\n </td>\n </tr>\n </ng-template>\n </f-table>\n </div>\n</f-card>\n" }]
|
|
1931
|
+
}], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], showCreateButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCreateButton", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], createButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonLabel", required: false }] }], createButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonIcon", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], createRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "createRoute", required: false }] }], editRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRoute", required: false }] }], deleteConfirmField: [{ type: i0.Input, args: [{ isSignal: true, alias: "deleteConfirmField", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], canEdit: [{ type: i0.Input, args: [{ isSignal: true, alias: "canEdit", required: false }] }], canDelete: [{ type: i0.Input, args: [{ isSignal: true, alias: "canDelete", required: false }] }], onCreate: [{ type: i0.Output, args: ["onCreate"] }], onLazyLoad: [{ type: i0.Output, args: ["onLazyLoad"] }], onSearch: [{ type: i0.Output, args: ["onSearch"] }], columnTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BaseListTemplateDirective), { isSignal: true }] }] } });
|
|
2228
1932
|
|
|
2229
1933
|
/**
|
|
2230
1934
|
* Injection Tokens for Provider Interfaces
|
|
@@ -2580,13 +2284,13 @@ class FileUploaderComponent {
|
|
|
2580
2284
|
}
|
|
2581
2285
|
return key;
|
|
2582
2286
|
}
|
|
2583
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
2584
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.
|
|
2287
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileUploaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2288
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: FileUploaderComponent, isStandalone: true, selector: "lib-file-uploader", inputs: { uploadFile: { classPropertyName: "uploadFile", publicName: "uploadFile", isSignal: true, isRequired: false, transformFunction: null }, uploadMultipleFiles: { classPropertyName: "uploadMultipleFiles", publicName: "uploadMultipleFiles", isSignal: true, isRequired: false, transformFunction: null }, acceptTypes: { classPropertyName: "acceptTypes", publicName: "acceptTypes", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, maxSizeMb: { classPropertyName: "maxSizeMb", publicName: "maxSizeMb", isSignal: true, isRequired: false, transformFunction: null }, uploadOptions: { classPropertyName: "uploadOptions", publicName: "uploadOptions", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showPreview: { classPropertyName: "showPreview", publicName: "showPreview", isSignal: true, isRequired: false, transformFunction: null }, autoUpload: { classPropertyName: "autoUpload", publicName: "autoUpload", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileUploaded: "fileUploaded", filesUploaded: "filesUploaded", onError: "onError", fileSelected: "fileSelected" }, ngImport: i0, template: `
|
|
2585
2289
|
@if (!hasUploadCapability()) {
|
|
2586
2290
|
<div
|
|
2587
2291
|
class="p-4 border border-dashed border-orange-300 bg-orange-50 dark:bg-orange-900/20 rounded-lg text-center"
|
|
2588
2292
|
>
|
|
2589
|
-
<
|
|
2293
|
+
<ui-icon name="exclamation-triangle" class="text-2xl text-orange-500 mb-2"></ui-icon>
|
|
2590
2294
|
<p class="text-sm text-orange-700 dark:text-orange-300">
|
|
2591
2295
|
{{
|
|
2592
2296
|
'shared.upload.provider.not.configured'
|
|
@@ -2610,9 +2314,7 @@ class FileUploaderComponent {
|
|
|
2610
2314
|
>
|
|
2611
2315
|
@if (isUploading()) {
|
|
2612
2316
|
<div class="flex flex-col items-center">
|
|
2613
|
-
<
|
|
2614
|
-
class="pi pi-spin pi-spinner text-3xl sm:text-4xl text-primary"
|
|
2615
|
-
></i>
|
|
2317
|
+
<ui-icon name="loader-circle" spin class="text-3xl sm:text-4xl text-primary"></ui-icon>
|
|
2616
2318
|
<p class="mt-2 text-sm sm:text-base break-all px-2">
|
|
2617
2319
|
{{
|
|
2618
2320
|
'shared.upload.uploading'
|
|
@@ -2620,7 +2322,7 @@ class FileUploaderComponent {
|
|
|
2620
2322
|
}}
|
|
2621
2323
|
</p>
|
|
2622
2324
|
@if (uploadProgress() > 0) {
|
|
2623
|
-
<
|
|
2325
|
+
<f-progressbar
|
|
2624
2326
|
[value]="uploadProgress()"
|
|
2625
2327
|
[showValue]="true"
|
|
2626
2328
|
class="w-full mt-2 max-w-xs"
|
|
@@ -2629,9 +2331,7 @@ class FileUploaderComponent {
|
|
|
2629
2331
|
</div>
|
|
2630
2332
|
} @else {
|
|
2631
2333
|
<div class="flex flex-col items-center">
|
|
2632
|
-
<
|
|
2633
|
-
class="pi pi-cloud-upload text-3xl sm:text-4xl text-primary"
|
|
2634
|
-
></i>
|
|
2334
|
+
<ui-icon name="cloud-upload" class="text-3xl sm:text-4xl text-primary"></ui-icon>
|
|
2635
2335
|
<p class="mt-2 mb-1 font-semibold text-sm sm:text-base">
|
|
2636
2336
|
{{
|
|
2637
2337
|
multiple()
|
|
@@ -2674,10 +2374,10 @@ class FileUploaderComponent {
|
|
|
2674
2374
|
<div
|
|
2675
2375
|
class="file-preview-item flex items-center gap-2 p-2 sm:p-3 rounded-lg"
|
|
2676
2376
|
>
|
|
2677
|
-
<
|
|
2678
|
-
[
|
|
2377
|
+
<ui-icon
|
|
2378
|
+
[name]="fileIcon"
|
|
2679
2379
|
class="text-lg sm:text-xl flex-shrink-0"
|
|
2680
|
-
></
|
|
2380
|
+
></ui-icon>
|
|
2681
2381
|
<span class="flex-1 truncate text-sm sm:text-base min-w-0">{{
|
|
2682
2382
|
file.name
|
|
2683
2383
|
}}</span>
|
|
@@ -2686,7 +2386,7 @@ class FileUploaderComponent {
|
|
|
2686
2386
|
>{{ fileSize }}</span
|
|
2687
2387
|
>
|
|
2688
2388
|
<button
|
|
2689
|
-
|
|
2389
|
+
fButton
|
|
2690
2390
|
[text]="true"
|
|
2691
2391
|
[rounded]="true"
|
|
2692
2392
|
size="small"
|
|
@@ -2694,7 +2394,7 @@ class FileUploaderComponent {
|
|
|
2694
2394
|
[disabled]="isUploading()"
|
|
2695
2395
|
(click)="removeFile(file)"
|
|
2696
2396
|
>
|
|
2697
|
-
<
|
|
2397
|
+
<ui-icon pButtonIcon name="times"></ui-icon>
|
|
2698
2398
|
</button>
|
|
2699
2399
|
</div>
|
|
2700
2400
|
}
|
|
@@ -2702,16 +2402,16 @@ class FileUploaderComponent {
|
|
|
2702
2402
|
}
|
|
2703
2403
|
</div>
|
|
2704
2404
|
}
|
|
2705
|
-
`, isInline: true, styles: [".upload-zone{border-color:var(--
|
|
2405
|
+
`, isInline: true, styles: [".upload-zone{border-color:var(--f-surface-300);background:var(--f-surface-50)}.upload-zone:hover:not(.cursor-not-allowed){border-color:var(--f-primary-color);background:var(--f-surface-100)}.upload-zone.drag-over{border-color:var(--f-primary-color);background:var(--f-primary-50)}:host-context(.p-dark) .upload-zone,.dark .upload-zone{border-color:var(--f-surface-600);background:var(--f-surface-800)}:host-context(.p-dark) .upload-zone:hover:not(.cursor-not-allowed),.dark .upload-zone:hover:not(.cursor-not-allowed){border-color:var(--f-primary-color);background:var(--f-surface-700)}:host-context(.p-dark) .upload-zone.drag-over,.dark .upload-zone.drag-over{border-color:var(--f-primary-color);background:var(--f-primary-900)}.file-preview-item{border:1px solid var(--f-surface-200);background:var(--f-surface-0)}:host-context(.p-dark) .file-preview-item,.dark .file-preview-item{border-color:var(--f-surface-600);background:var(--f-surface-800)}\n"], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "rounded", "raised", "fluid", "disabled", "loading", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.ProgressbarComponent, selector: "f-progressbar", inputs: ["value", "mode", "showValue"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2706
2406
|
}
|
|
2707
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
2407
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileUploaderComponent, decorators: [{
|
|
2708
2408
|
type: Component,
|
|
2709
|
-
args: [{ selector: 'lib-file-uploader', imports: [AngularModule,
|
|
2409
|
+
args: [{ selector: 'lib-file-uploader', imports: [AngularModule, UiModule, TranslatePipe], template: `
|
|
2710
2410
|
@if (!hasUploadCapability()) {
|
|
2711
2411
|
<div
|
|
2712
2412
|
class="p-4 border border-dashed border-orange-300 bg-orange-50 dark:bg-orange-900/20 rounded-lg text-center"
|
|
2713
2413
|
>
|
|
2714
|
-
<
|
|
2414
|
+
<ui-icon name="exclamation-triangle" class="text-2xl text-orange-500 mb-2"></ui-icon>
|
|
2715
2415
|
<p class="text-sm text-orange-700 dark:text-orange-300">
|
|
2716
2416
|
{{
|
|
2717
2417
|
'shared.upload.provider.not.configured'
|
|
@@ -2735,9 +2435,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2735
2435
|
>
|
|
2736
2436
|
@if (isUploading()) {
|
|
2737
2437
|
<div class="flex flex-col items-center">
|
|
2738
|
-
<
|
|
2739
|
-
class="pi pi-spin pi-spinner text-3xl sm:text-4xl text-primary"
|
|
2740
|
-
></i>
|
|
2438
|
+
<ui-icon name="loader-circle" spin class="text-3xl sm:text-4xl text-primary"></ui-icon>
|
|
2741
2439
|
<p class="mt-2 text-sm sm:text-base break-all px-2">
|
|
2742
2440
|
{{
|
|
2743
2441
|
'shared.upload.uploading'
|
|
@@ -2745,7 +2443,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2745
2443
|
}}
|
|
2746
2444
|
</p>
|
|
2747
2445
|
@if (uploadProgress() > 0) {
|
|
2748
|
-
<
|
|
2446
|
+
<f-progressbar
|
|
2749
2447
|
[value]="uploadProgress()"
|
|
2750
2448
|
[showValue]="true"
|
|
2751
2449
|
class="w-full mt-2 max-w-xs"
|
|
@@ -2754,9 +2452,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2754
2452
|
</div>
|
|
2755
2453
|
} @else {
|
|
2756
2454
|
<div class="flex flex-col items-center">
|
|
2757
|
-
<
|
|
2758
|
-
class="pi pi-cloud-upload text-3xl sm:text-4xl text-primary"
|
|
2759
|
-
></i>
|
|
2455
|
+
<ui-icon name="cloud-upload" class="text-3xl sm:text-4xl text-primary"></ui-icon>
|
|
2760
2456
|
<p class="mt-2 mb-1 font-semibold text-sm sm:text-base">
|
|
2761
2457
|
{{
|
|
2762
2458
|
multiple()
|
|
@@ -2799,10 +2495,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2799
2495
|
<div
|
|
2800
2496
|
class="file-preview-item flex items-center gap-2 p-2 sm:p-3 rounded-lg"
|
|
2801
2497
|
>
|
|
2802
|
-
<
|
|
2803
|
-
[
|
|
2498
|
+
<ui-icon
|
|
2499
|
+
[name]="fileIcon"
|
|
2804
2500
|
class="text-lg sm:text-xl flex-shrink-0"
|
|
2805
|
-
></
|
|
2501
|
+
></ui-icon>
|
|
2806
2502
|
<span class="flex-1 truncate text-sm sm:text-base min-w-0">{{
|
|
2807
2503
|
file.name
|
|
2808
2504
|
}}</span>
|
|
@@ -2811,7 +2507,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2811
2507
|
>{{ fileSize }}</span
|
|
2812
2508
|
>
|
|
2813
2509
|
<button
|
|
2814
|
-
|
|
2510
|
+
fButton
|
|
2815
2511
|
[text]="true"
|
|
2816
2512
|
[rounded]="true"
|
|
2817
2513
|
size="small"
|
|
@@ -2819,7 +2515,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2819
2515
|
[disabled]="isUploading()"
|
|
2820
2516
|
(click)="removeFile(file)"
|
|
2821
2517
|
>
|
|
2822
|
-
<
|
|
2518
|
+
<ui-icon pButtonIcon name="times"></ui-icon>
|
|
2823
2519
|
</button>
|
|
2824
2520
|
</div>
|
|
2825
2521
|
}
|
|
@@ -2827,7 +2523,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2827
2523
|
}
|
|
2828
2524
|
</div>
|
|
2829
2525
|
}
|
|
2830
|
-
`, styles: [".upload-zone{border-color:var(--
|
|
2526
|
+
`, styles: [".upload-zone{border-color:var(--f-surface-300);background:var(--f-surface-50)}.upload-zone:hover:not(.cursor-not-allowed){border-color:var(--f-primary-color);background:var(--f-surface-100)}.upload-zone.drag-over{border-color:var(--f-primary-color);background:var(--f-primary-50)}:host-context(.p-dark) .upload-zone,.dark .upload-zone{border-color:var(--f-surface-600);background:var(--f-surface-800)}:host-context(.p-dark) .upload-zone:hover:not(.cursor-not-allowed),.dark .upload-zone:hover:not(.cursor-not-allowed){border-color:var(--f-primary-color);background:var(--f-surface-700)}:host-context(.p-dark) .upload-zone.drag-over,.dark .upload-zone.drag-over{border-color:var(--f-primary-color);background:var(--f-primary-900)}.file-preview-item{border:1px solid var(--f-surface-200);background:var(--f-surface-0)}:host-context(.p-dark) .file-preview-item,.dark .file-preview-item{border-color:var(--f-surface-600);background:var(--f-surface-800)}\n"] }]
|
|
2831
2527
|
}], propDecorators: { uploadFile: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadFile", required: false }] }], uploadMultipleFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadMultipleFiles", required: false }] }], acceptTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "acceptTypes", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], maxSizeMb: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSizeMb", required: false }] }], uploadOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadOptions", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showPreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPreview", required: false }] }], autoUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoUpload", required: false }] }], fileUploaded: [{ type: i0.Output, args: ["fileUploaded"] }], filesUploaded: [{ type: i0.Output, args: ["filesUploaded"] }], onError: [{ type: i0.Output, args: ["onError"] }], fileSelected: [{ type: i0.Output, args: ["fileSelected"] }] } });
|
|
2832
2528
|
|
|
2833
2529
|
const DEFAULT_PAGE_SIZE$1 = 20;
|
|
@@ -3203,9 +2899,9 @@ class FileSelectorDialogComponent {
|
|
|
3203
2899
|
}
|
|
3204
2900
|
return key;
|
|
3205
2901
|
}
|
|
3206
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
3207
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.
|
|
3208
|
-
<
|
|
2902
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileSelectorDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2903
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: FileSelectorDialogComponent, isStandalone: true, selector: "lib-file-selector-dialog", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, acceptTypes: { classPropertyName: "acceptTypes", publicName: "acceptTypes", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, maxSelection: { classPropertyName: "maxSelection", publicName: "maxSelection", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, folderId: { classPropertyName: "folderId", publicName: "folderId", isSignal: true, isRequired: false, transformFunction: null }, withUploader: { classPropertyName: "withUploader", publicName: "withUploader", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", fileSelected: "fileSelected", filesSelected: "filesSelected", closed: "closed", onError: "onError" }, ngImport: i0, template: `
|
|
2904
|
+
<f-dialog
|
|
3209
2905
|
[header]="dialogHeader()"
|
|
3210
2906
|
[(visible)]="visible"
|
|
3211
2907
|
[modal]="true"
|
|
@@ -3219,9 +2915,7 @@ class FileSelectorDialogComponent {
|
|
|
3219
2915
|
>
|
|
3220
2916
|
@if (!fileProvider) {
|
|
3221
2917
|
<div class="p-6 text-center">
|
|
3222
|
-
<
|
|
3223
|
-
class="pi pi-exclamation-triangle text-4xl text-orange-500 mb-3"
|
|
3224
|
-
></i>
|
|
2918
|
+
<ui-icon name="exclamation-triangle" class="text-4xl text-orange-500 mb-3"></ui-icon>
|
|
3225
2919
|
<p class="text-lg font-medium text-color mb-2">
|
|
3226
2920
|
{{ 'shared.file.selector.provider.not.configured' | translate }}
|
|
3227
2921
|
</p>
|
|
@@ -3232,9 +2926,12 @@ class FileSelectorDialogComponent {
|
|
|
3232
2926
|
>provideStorageProviders()</code
|
|
3233
2927
|
>
|
|
3234
2928
|
</p>
|
|
3235
|
-
<
|
|
3236
|
-
|
|
3237
|
-
|
|
2929
|
+
<f-button
|
|
2930
|
+
[label]="'shared.close' | translate"
|
|
2931
|
+
severity="secondary"
|
|
2932
|
+
[text]="true"
|
|
2933
|
+
(onClick)="onCancel()"
|
|
2934
|
+
/>
|
|
3238
2935
|
</div>
|
|
3239
2936
|
} @else {
|
|
3240
2937
|
@if (withUploader()) {
|
|
@@ -3256,10 +2953,10 @@ class FileSelectorDialogComponent {
|
|
|
3256
2953
|
<div
|
|
3257
2954
|
class="flex flex-col sm:flex-row gap-2 mb-3 items-stretch sm:items-center"
|
|
3258
2955
|
>
|
|
3259
|
-
<
|
|
3260
|
-
<
|
|
2956
|
+
<f-iconfield class="flex-1">
|
|
2957
|
+
<f-inputicon><ui-icon name="search" /></f-inputicon>
|
|
3261
2958
|
<input
|
|
3262
|
-
|
|
2959
|
+
fInputText
|
|
3263
2960
|
type="text"
|
|
3264
2961
|
[ngModel]="searchTerm()"
|
|
3265
2962
|
(ngModelChange)="onSearchChange($event)"
|
|
@@ -3268,10 +2965,10 @@ class FileSelectorDialogComponent {
|
|
|
3268
2965
|
"
|
|
3269
2966
|
class="w-full"
|
|
3270
2967
|
/>
|
|
3271
|
-
</
|
|
2968
|
+
</f-iconfield>
|
|
3272
2969
|
|
|
3273
2970
|
@if (fileProvider.loadFolders) {
|
|
3274
|
-
<
|
|
2971
|
+
<f-select
|
|
3275
2972
|
[options]="folders()"
|
|
3276
2973
|
[ngModel]="selectedFolderId()"
|
|
3277
2974
|
(ngModelChange)="onFolderChange($event)"
|
|
@@ -3288,21 +2985,21 @@ class FileSelectorDialogComponent {
|
|
|
3288
2985
|
>
|
|
3289
2986
|
<ng-template #selectedItem let-folder>
|
|
3290
2987
|
<div class="flex items-center gap-2">
|
|
3291
|
-
<
|
|
2988
|
+
<ui-icon name="folder" class="text-color-secondary"></ui-icon>
|
|
3292
2989
|
<span>{{ folder?.name }}</span>
|
|
3293
2990
|
</div>
|
|
3294
2991
|
</ng-template>
|
|
3295
2992
|
<ng-template #item let-folder>
|
|
3296
2993
|
<div class="flex items-center gap-2">
|
|
3297
|
-
<
|
|
2994
|
+
<ui-icon name="folder" class="text-color-secondary"></ui-icon>
|
|
3298
2995
|
<span>{{ folder.name }}</span>
|
|
3299
2996
|
</div>
|
|
3300
2997
|
</ng-template>
|
|
3301
|
-
</
|
|
2998
|
+
</f-select>
|
|
3302
2999
|
}
|
|
3303
3000
|
|
|
3304
3001
|
@if (fileProvider.loadStorageConfigs) {
|
|
3305
|
-
<
|
|
3002
|
+
<f-select
|
|
3306
3003
|
[options]="storageConfigs()"
|
|
3307
3004
|
[ngModel]="selectedStorageConfigId()"
|
|
3308
3005
|
(ngModelChange)="onStorageConfigChange($event)"
|
|
@@ -3319,7 +3016,7 @@ class FileSelectorDialogComponent {
|
|
|
3319
3016
|
>
|
|
3320
3017
|
<ng-template #selectedItem let-config>
|
|
3321
3018
|
<div class="flex items-center gap-2">
|
|
3322
|
-
<
|
|
3019
|
+
<ui-icon name="database" class="text-color-secondary"></ui-icon>
|
|
3323
3020
|
<span>{{ config?.name }}</span>
|
|
3324
3021
|
@if (config?.isDefault) {
|
|
3325
3022
|
<span
|
|
@@ -3331,7 +3028,7 @@ class FileSelectorDialogComponent {
|
|
|
3331
3028
|
</ng-template>
|
|
3332
3029
|
<ng-template #item let-config>
|
|
3333
3030
|
<div class="flex items-center gap-2">
|
|
3334
|
-
<
|
|
3031
|
+
<ui-icon name="database" class="text-color-secondary"></ui-icon>
|
|
3335
3032
|
<span>{{ config.name }}</span>
|
|
3336
3033
|
@if (config.isDefault) {
|
|
3337
3034
|
<span
|
|
@@ -3341,7 +3038,7 @@ class FileSelectorDialogComponent {
|
|
|
3341
3038
|
}
|
|
3342
3039
|
</div>
|
|
3343
3040
|
</ng-template>
|
|
3344
|
-
</
|
|
3041
|
+
</f-select>
|
|
3345
3042
|
}
|
|
3346
3043
|
|
|
3347
3044
|
@if (multiple()) {
|
|
@@ -3359,13 +3056,11 @@ class FileSelectorDialogComponent {
|
|
|
3359
3056
|
<div class="file-grid" #scrollContainer (scroll)="onScroll($event)">
|
|
3360
3057
|
@if (isLoading() && files().length === 0) {
|
|
3361
3058
|
<div class="col-span-full flex justify-center p-4">
|
|
3362
|
-
<
|
|
3363
|
-
class="pi pi-spin pi-spinner text-4xl text-color-secondary"
|
|
3364
|
-
></i>
|
|
3059
|
+
<ui-icon name="loader-circle" spin class="text-4xl text-color-secondary"></ui-icon>
|
|
3365
3060
|
</div>
|
|
3366
3061
|
} @else if (files().length === 0) {
|
|
3367
3062
|
<div class="col-span-full text-center p-4 text-color-secondary">
|
|
3368
|
-
<
|
|
3063
|
+
<ui-icon name="inbox" class="text-4xl mb-2 block"></ui-icon>
|
|
3369
3064
|
<p>{{ 'shared.file.selector.no.files' | translate }}</p>
|
|
3370
3065
|
</div>
|
|
3371
3066
|
} @else {
|
|
@@ -3388,14 +3083,14 @@ class FileSelectorDialogComponent {
|
|
|
3388
3083
|
class="w-full h-full object-cover"
|
|
3389
3084
|
/>
|
|
3390
3085
|
} @else {
|
|
3391
|
-
<
|
|
3392
|
-
[
|
|
3086
|
+
<ui-icon
|
|
3087
|
+
[name]="fileIcon"
|
|
3393
3088
|
class="text-4xl sm:text-5xl text-color-secondary"
|
|
3394
|
-
></
|
|
3089
|
+
></ui-icon>
|
|
3395
3090
|
}
|
|
3396
3091
|
@if (fileSelected) {
|
|
3397
3092
|
<div class="selected-overlay">
|
|
3398
|
-
<
|
|
3093
|
+
<ui-icon name="check" class="text-xl sm:text-2xl"></ui-icon>
|
|
3399
3094
|
</div>
|
|
3400
3095
|
}
|
|
3401
3096
|
</div>
|
|
@@ -3416,7 +3111,7 @@ class FileSelectorDialogComponent {
|
|
|
3416
3111
|
|
|
3417
3112
|
@if (isLoading()) {
|
|
3418
3113
|
<div class="col-span-full flex justify-center p-2">
|
|
3419
|
-
<
|
|
3114
|
+
<ui-icon name="loader-circle" spin class="text-color-secondary"></ui-icon>
|
|
3420
3115
|
</div>
|
|
3421
3116
|
}
|
|
3422
3117
|
}
|
|
@@ -3426,38 +3121,34 @@ class FileSelectorDialogComponent {
|
|
|
3426
3121
|
<div
|
|
3427
3122
|
class="flex flex-col-reverse sm:flex-row gap-2 w-full sm:w-auto sm:justify-end"
|
|
3428
3123
|
>
|
|
3429
|
-
<button
|
|
3430
|
-
|
|
3431
|
-
|
|
3432
|
-
|
|
3433
|
-
(click)="onCancel()"
|
|
3434
|
-
>
|
|
3435
|
-
<span pButtonLabel>{{ 'shared.cancel' | translate }}</span>
|
|
3436
|
-
</button>
|
|
3437
|
-
<button
|
|
3438
|
-
pButton
|
|
3439
|
-
type="button"
|
|
3440
|
-
[disabled]="selectedFiles().length === 0"
|
|
3124
|
+
<f-button
|
|
3125
|
+
[label]="'shared.cancel' | translate"
|
|
3126
|
+
severity="secondary"
|
|
3127
|
+
[text]="true"
|
|
3441
3128
|
class="w-full sm:w-auto"
|
|
3442
|
-
(
|
|
3443
|
-
|
|
3444
|
-
|
|
3129
|
+
(onClick)="onCancel()"
|
|
3130
|
+
/>
|
|
3131
|
+
<f-button
|
|
3132
|
+
[label]="
|
|
3445
3133
|
multiple()
|
|
3446
3134
|
? ('shared.file.selector.select.multiple'
|
|
3447
3135
|
| translate: { count: selectedFiles().length })
|
|
3448
3136
|
: ('shared.file.selector.select' | translate)
|
|
3449
|
-
|
|
3450
|
-
|
|
3137
|
+
"
|
|
3138
|
+
[disabled]="selectedFiles().length === 0"
|
|
3139
|
+
class="w-full sm:w-auto"
|
|
3140
|
+
(onClick)="onConfirm()"
|
|
3141
|
+
/>
|
|
3451
3142
|
</div>
|
|
3452
3143
|
</ng-template>
|
|
3453
3144
|
}
|
|
3454
|
-
</
|
|
3455
|
-
`, isInline: true, styles: [".file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:300px;overflow-y:auto;padding:.5rem}@media(min-width:480px){.file-grid{grid-template-columns:repeat(3,1fr);max-height:350px}}@media(min-width:640px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:400px}}.file-card{border:2px solid var(--
|
|
3145
|
+
</f-dialog>
|
|
3146
|
+
`, isInline: true, styles: [".file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:300px;overflow-y:auto;padding:.5rem}@media(min-width:480px){.file-grid{grid-template-columns:repeat(3,1fr);max-height:350px}}@media(min-width:640px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:400px}}.file-card{border:2px solid var(--f-surface-300);border-radius:var(--f-border-radius);cursor:pointer;transition:all .2s ease;overflow:hidden;background:var(--f-surface-0)}:host-context(.p-dark) .file-card,.dark .file-card{border-color:var(--f-surface-600);background:var(--f-surface-800)}.file-card:hover:not(.disabled){border-color:var(--f-primary-color);transform:translateY(-2px);box-shadow:var(--f-overlay-shadow)}.file-card.selected{border-color:var(--f-primary-color);background:var(--f-primary-50)}:host-context(.p-dark) .file-card.selected,.dark .file-card.selected{background:var(--f-primary-900)}.file-card.disabled{opacity:.5;cursor:not-allowed}.file-preview{position:relative;height:80px;display:flex;align-items:center;justify-content:center;background:var(--f-surface-100)}@media(min-width:640px){.file-preview{height:100px}}:host-context(.p-dark) .file-preview,.dark .file-preview{background:var(--f-surface-700)}.selected-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--f-primary-500-rgb, 59, 130, 246),.3)}.selected-overlay i{color:var(--f-primary-color);background:var(--f-surface-0);border-radius:50%;padding:.5rem}:host-context(.p-dark) .selected-overlay i,.dark .selected-overlay i{background:var(--f-surface-900)}\n"], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IsEmptyImageDirective, selector: "img", inputs: ["src"] }, { kind: "ngmodule", type: UiModule }, { kind: "component", type: i3.ButtonComponent, selector: "f-button", inputs: ["label", "icon", "iconPos", "severity", "type", "disabled", "loading", "text", "link", "outlined", "raised", "rounded", "fluid", "size"], outputs: ["onClick"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield" }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["styleClass"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "showClear", "loading", "inputId", "invalid", "touched", "styleClass", "editable"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur"] }, { kind: "component", type: i3.DialogComponent, selector: "f-dialog", inputs: ["header", "visible", "modal", "closable", "dismissableMask", "resizable", "style", "breakpoints"], outputs: ["visibleChange", "onShow", "onHide"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }, { kind: "component", type: FileUploaderComponent, selector: "lib-file-uploader", inputs: ["uploadFile", "uploadMultipleFiles", "acceptTypes", "multiple", "maxFiles", "maxSizeMb", "uploadOptions", "disabled", "showPreview", "autoUpload"], outputs: ["fileUploaded", "filesUploaded", "onError", "fileSelected"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
3456
3147
|
}
|
|
3457
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
3148
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileSelectorDialogComponent, decorators: [{
|
|
3458
3149
|
type: Component,
|
|
3459
|
-
args: [{ selector: 'lib-file-selector-dialog', imports: [AngularModule,
|
|
3460
|
-
<
|
|
3150
|
+
args: [{ selector: 'lib-file-selector-dialog', imports: [AngularModule, UiModule, FileUploaderComponent, TranslatePipe], template: `
|
|
3151
|
+
<f-dialog
|
|
3461
3152
|
[header]="dialogHeader()"
|
|
3462
3153
|
[(visible)]="visible"
|
|
3463
3154
|
[modal]="true"
|
|
@@ -3471,9 +3162,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3471
3162
|
>
|
|
3472
3163
|
@if (!fileProvider) {
|
|
3473
3164
|
<div class="p-6 text-center">
|
|
3474
|
-
<
|
|
3475
|
-
class="pi pi-exclamation-triangle text-4xl text-orange-500 mb-3"
|
|
3476
|
-
></i>
|
|
3165
|
+
<ui-icon name="exclamation-triangle" class="text-4xl text-orange-500 mb-3"></ui-icon>
|
|
3477
3166
|
<p class="text-lg font-medium text-color mb-2">
|
|
3478
3167
|
{{ 'shared.file.selector.provider.not.configured' | translate }}
|
|
3479
3168
|
</p>
|
|
@@ -3484,9 +3173,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3484
3173
|
>provideStorageProviders()</code
|
|
3485
3174
|
>
|
|
3486
3175
|
</p>
|
|
3487
|
-
<
|
|
3488
|
-
|
|
3489
|
-
|
|
3176
|
+
<f-button
|
|
3177
|
+
[label]="'shared.close' | translate"
|
|
3178
|
+
severity="secondary"
|
|
3179
|
+
[text]="true"
|
|
3180
|
+
(onClick)="onCancel()"
|
|
3181
|
+
/>
|
|
3490
3182
|
</div>
|
|
3491
3183
|
} @else {
|
|
3492
3184
|
@if (withUploader()) {
|
|
@@ -3508,10 +3200,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3508
3200
|
<div
|
|
3509
3201
|
class="flex flex-col sm:flex-row gap-2 mb-3 items-stretch sm:items-center"
|
|
3510
3202
|
>
|
|
3511
|
-
<
|
|
3512
|
-
<
|
|
3203
|
+
<f-iconfield class="flex-1">
|
|
3204
|
+
<f-inputicon><ui-icon name="search" /></f-inputicon>
|
|
3513
3205
|
<input
|
|
3514
|
-
|
|
3206
|
+
fInputText
|
|
3515
3207
|
type="text"
|
|
3516
3208
|
[ngModel]="searchTerm()"
|
|
3517
3209
|
(ngModelChange)="onSearchChange($event)"
|
|
@@ -3520,10 +3212,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3520
3212
|
"
|
|
3521
3213
|
class="w-full"
|
|
3522
3214
|
/>
|
|
3523
|
-
</
|
|
3215
|
+
</f-iconfield>
|
|
3524
3216
|
|
|
3525
3217
|
@if (fileProvider.loadFolders) {
|
|
3526
|
-
<
|
|
3218
|
+
<f-select
|
|
3527
3219
|
[options]="folders()"
|
|
3528
3220
|
[ngModel]="selectedFolderId()"
|
|
3529
3221
|
(ngModelChange)="onFolderChange($event)"
|
|
@@ -3540,21 +3232,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3540
3232
|
>
|
|
3541
3233
|
<ng-template #selectedItem let-folder>
|
|
3542
3234
|
<div class="flex items-center gap-2">
|
|
3543
|
-
<
|
|
3235
|
+
<ui-icon name="folder" class="text-color-secondary"></ui-icon>
|
|
3544
3236
|
<span>{{ folder?.name }}</span>
|
|
3545
3237
|
</div>
|
|
3546
3238
|
</ng-template>
|
|
3547
3239
|
<ng-template #item let-folder>
|
|
3548
3240
|
<div class="flex items-center gap-2">
|
|
3549
|
-
<
|
|
3241
|
+
<ui-icon name="folder" class="text-color-secondary"></ui-icon>
|
|
3550
3242
|
<span>{{ folder.name }}</span>
|
|
3551
3243
|
</div>
|
|
3552
3244
|
</ng-template>
|
|
3553
|
-
</
|
|
3245
|
+
</f-select>
|
|
3554
3246
|
}
|
|
3555
3247
|
|
|
3556
3248
|
@if (fileProvider.loadStorageConfigs) {
|
|
3557
|
-
<
|
|
3249
|
+
<f-select
|
|
3558
3250
|
[options]="storageConfigs()"
|
|
3559
3251
|
[ngModel]="selectedStorageConfigId()"
|
|
3560
3252
|
(ngModelChange)="onStorageConfigChange($event)"
|
|
@@ -3571,7 +3263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3571
3263
|
>
|
|
3572
3264
|
<ng-template #selectedItem let-config>
|
|
3573
3265
|
<div class="flex items-center gap-2">
|
|
3574
|
-
<
|
|
3266
|
+
<ui-icon name="database" class="text-color-secondary"></ui-icon>
|
|
3575
3267
|
<span>{{ config?.name }}</span>
|
|
3576
3268
|
@if (config?.isDefault) {
|
|
3577
3269
|
<span
|
|
@@ -3583,7 +3275,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3583
3275
|
</ng-template>
|
|
3584
3276
|
<ng-template #item let-config>
|
|
3585
3277
|
<div class="flex items-center gap-2">
|
|
3586
|
-
<
|
|
3278
|
+
<ui-icon name="database" class="text-color-secondary"></ui-icon>
|
|
3587
3279
|
<span>{{ config.name }}</span>
|
|
3588
3280
|
@if (config.isDefault) {
|
|
3589
3281
|
<span
|
|
@@ -3593,7 +3285,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3593
3285
|
}
|
|
3594
3286
|
</div>
|
|
3595
3287
|
</ng-template>
|
|
3596
|
-
</
|
|
3288
|
+
</f-select>
|
|
3597
3289
|
}
|
|
3598
3290
|
|
|
3599
3291
|
@if (multiple()) {
|
|
@@ -3611,13 +3303,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3611
3303
|
<div class="file-grid" #scrollContainer (scroll)="onScroll($event)">
|
|
3612
3304
|
@if (isLoading() && files().length === 0) {
|
|
3613
3305
|
<div class="col-span-full flex justify-center p-4">
|
|
3614
|
-
<
|
|
3615
|
-
class="pi pi-spin pi-spinner text-4xl text-color-secondary"
|
|
3616
|
-
></i>
|
|
3306
|
+
<ui-icon name="loader-circle" spin class="text-4xl text-color-secondary"></ui-icon>
|
|
3617
3307
|
</div>
|
|
3618
3308
|
} @else if (files().length === 0) {
|
|
3619
3309
|
<div class="col-span-full text-center p-4 text-color-secondary">
|
|
3620
|
-
<
|
|
3310
|
+
<ui-icon name="inbox" class="text-4xl mb-2 block"></ui-icon>
|
|
3621
3311
|
<p>{{ 'shared.file.selector.no.files' | translate }}</p>
|
|
3622
3312
|
</div>
|
|
3623
3313
|
} @else {
|
|
@@ -3640,14 +3330,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3640
3330
|
class="w-full h-full object-cover"
|
|
3641
3331
|
/>
|
|
3642
3332
|
} @else {
|
|
3643
|
-
<
|
|
3644
|
-
[
|
|
3333
|
+
<ui-icon
|
|
3334
|
+
[name]="fileIcon"
|
|
3645
3335
|
class="text-4xl sm:text-5xl text-color-secondary"
|
|
3646
|
-
></
|
|
3336
|
+
></ui-icon>
|
|
3647
3337
|
}
|
|
3648
3338
|
@if (fileSelected) {
|
|
3649
3339
|
<div class="selected-overlay">
|
|
3650
|
-
<
|
|
3340
|
+
<ui-icon name="check" class="text-xl sm:text-2xl"></ui-icon>
|
|
3651
3341
|
</div>
|
|
3652
3342
|
}
|
|
3653
3343
|
</div>
|
|
@@ -3668,7 +3358,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3668
3358
|
|
|
3669
3359
|
@if (isLoading()) {
|
|
3670
3360
|
<div class="col-span-full flex justify-center p-2">
|
|
3671
|
-
<
|
|
3361
|
+
<ui-icon name="loader-circle" spin class="text-color-secondary"></ui-icon>
|
|
3672
3362
|
</div>
|
|
3673
3363
|
}
|
|
3674
3364
|
}
|
|
@@ -3678,73 +3368,88 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
3678
3368
|
<div
|
|
3679
3369
|
class="flex flex-col-reverse sm:flex-row gap-2 w-full sm:w-auto sm:justify-end"
|
|
3680
3370
|
>
|
|
3681
|
-
<button
|
|
3682
|
-
|
|
3683
|
-
|
|
3684
|
-
|
|
3685
|
-
(click)="onCancel()"
|
|
3686
|
-
>
|
|
3687
|
-
<span pButtonLabel>{{ 'shared.cancel' | translate }}</span>
|
|
3688
|
-
</button>
|
|
3689
|
-
<button
|
|
3690
|
-
pButton
|
|
3691
|
-
type="button"
|
|
3692
|
-
[disabled]="selectedFiles().length === 0"
|
|
3371
|
+
<f-button
|
|
3372
|
+
[label]="'shared.cancel' | translate"
|
|
3373
|
+
severity="secondary"
|
|
3374
|
+
[text]="true"
|
|
3693
3375
|
class="w-full sm:w-auto"
|
|
3694
|
-
(
|
|
3695
|
-
|
|
3696
|
-
|
|
3376
|
+
(onClick)="onCancel()"
|
|
3377
|
+
/>
|
|
3378
|
+
<f-button
|
|
3379
|
+
[label]="
|
|
3697
3380
|
multiple()
|
|
3698
3381
|
? ('shared.file.selector.select.multiple'
|
|
3699
3382
|
| translate: { count: selectedFiles().length })
|
|
3700
3383
|
: ('shared.file.selector.select' | translate)
|
|
3701
|
-
|
|
3702
|
-
|
|
3384
|
+
"
|
|
3385
|
+
[disabled]="selectedFiles().length === 0"
|
|
3386
|
+
class="w-full sm:w-auto"
|
|
3387
|
+
(onClick)="onConfirm()"
|
|
3388
|
+
/>
|
|
3703
3389
|
</div>
|
|
3704
3390
|
</ng-template>
|
|
3705
3391
|
}
|
|
3706
|
-
</
|
|
3707
|
-
`, styles: [".file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:300px;overflow-y:auto;padding:.5rem}@media(min-width:480px){.file-grid{grid-template-columns:repeat(3,1fr);max-height:350px}}@media(min-width:640px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:400px}}.file-card{border:2px solid var(--
|
|
3392
|
+
</f-dialog>
|
|
3393
|
+
`, styles: [".file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:300px;overflow-y:auto;padding:.5rem}@media(min-width:480px){.file-grid{grid-template-columns:repeat(3,1fr);max-height:350px}}@media(min-width:640px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:400px}}.file-card{border:2px solid var(--f-surface-300);border-radius:var(--f-border-radius);cursor:pointer;transition:all .2s ease;overflow:hidden;background:var(--f-surface-0)}:host-context(.p-dark) .file-card,.dark .file-card{border-color:var(--f-surface-600);background:var(--f-surface-800)}.file-card:hover:not(.disabled){border-color:var(--f-primary-color);transform:translateY(-2px);box-shadow:var(--f-overlay-shadow)}.file-card.selected{border-color:var(--f-primary-color);background:var(--f-primary-50)}:host-context(.p-dark) .file-card.selected,.dark .file-card.selected{background:var(--f-primary-900)}.file-card.disabled{opacity:.5;cursor:not-allowed}.file-preview{position:relative;height:80px;display:flex;align-items:center;justify-content:center;background:var(--f-surface-100)}@media(min-width:640px){.file-preview{height:100px}}:host-context(.p-dark) .file-preview,.dark .file-preview{background:var(--f-surface-700)}.selected-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--f-primary-500-rgb, 59, 130, 246),.3)}.selected-overlay i{color:var(--f-primary-color);background:var(--f-surface-0);border-radius:50%;padding:.5rem}:host-context(.p-dark) .selected-overlay i,.dark .selected-overlay i{background:var(--f-surface-900)}\n"] }]
|
|
3708
3394
|
}], ctorParameters: () => [], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], acceptTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "acceptTypes", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], maxSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelection", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], folderId: [{ type: i0.Input, args: [{ isSignal: true, alias: "folderId", required: false }] }], withUploader: [{ type: i0.Input, args: [{ isSignal: true, alias: "withUploader", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], fileSelected: [{ type: i0.Output, args: ["fileSelected"] }], filesSelected: [{ type: i0.Output, args: ["filesSelected"] }], closed: [{ type: i0.Output, args: ["closed"] }], onError: [{ type: i0.Output, args: ["onError"] }] } });
|
|
3709
3395
|
|
|
3710
3396
|
class IconComponent {
|
|
3711
3397
|
icon = input.required(/* @ts-ignore */
|
|
3712
3398
|
...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
3713
|
-
iconType = input(IconTypeEnum.
|
|
3399
|
+
iconType = input(IconTypeEnum.ICON_NAME, /* @ts-ignore */
|
|
3714
3400
|
...(ngDevMode ? [{ debugName: "iconType" }] : /* istanbul ignore next */ []));
|
|
3715
|
-
IconTypeEnum = IconTypeEnum;
|
|
3716
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
3717
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.
|
|
3401
|
+
IconTypeEnum = IconTypeEnum;
|
|
3402
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3403
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: IconComponent, isStandalone: true, selector: "lib-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, iconType: { classPropertyName: "iconType", publicName: "iconType", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
3718
3404
|
@if (icon()) {
|
|
3719
|
-
@if (iconType() === IconTypeEnum.
|
|
3720
|
-
<i [class]="icon()"></i>
|
|
3721
|
-
} @else if (iconType() === IconTypeEnum.IMAGE_FILE_LINK) {
|
|
3405
|
+
@if (iconType() === IconTypeEnum.IMAGE_FILE_LINK) {
|
|
3722
3406
|
<img [alt]="icon()" [src]="icon()" />
|
|
3723
3407
|
} @else {
|
|
3724
|
-
<
|
|
3408
|
+
<ui-icon [name]="icon()"></ui-icon>
|
|
3725
3409
|
}
|
|
3726
3410
|
}
|
|
3727
|
-
`, isInline: true, dependencies: [{ kind: "
|
|
3411
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }] });
|
|
3728
3412
|
}
|
|
3729
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
3413
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: IconComponent, decorators: [{
|
|
3730
3414
|
type: Component,
|
|
3731
3415
|
args: [{
|
|
3732
3416
|
selector: 'lib-icon',
|
|
3733
|
-
imports: [
|
|
3417
|
+
imports: [UiIconComponent],
|
|
3734
3418
|
template: `
|
|
3735
3419
|
@if (icon()) {
|
|
3736
|
-
@if (iconType() === IconTypeEnum.
|
|
3737
|
-
<i [class]="icon()"></i>
|
|
3738
|
-
} @else if (iconType() === IconTypeEnum.IMAGE_FILE_LINK) {
|
|
3420
|
+
@if (iconType() === IconTypeEnum.IMAGE_FILE_LINK) {
|
|
3739
3421
|
<img [alt]="icon()" [src]="icon()" />
|
|
3740
3422
|
} @else {
|
|
3741
|
-
<
|
|
3423
|
+
<ui-icon [name]="icon()"></ui-icon>
|
|
3742
3424
|
}
|
|
3743
3425
|
}
|
|
3744
3426
|
`,
|
|
3745
3427
|
}]
|
|
3746
3428
|
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], iconType: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconType", required: false }] }] } });
|
|
3747
3429
|
|
|
3430
|
+
class InlineSvgComponent {
|
|
3431
|
+
src = input.required(/* @ts-ignore */
|
|
3432
|
+
...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
3433
|
+
http = inject(HttpClient);
|
|
3434
|
+
sanitizer = inject(DomSanitizer);
|
|
3435
|
+
svg = resource({ ...(ngDevMode ? { debugName: "svg" } : /* istanbul ignore next */ {}), params: this.src,
|
|
3436
|
+
loader: ({ params: url }) => firstValueFrom(this.http.get(url, { responseType: 'text' })).then((text) => this.sanitizer.bypassSecurityTrustHtml(text)) });
|
|
3437
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: InlineSvgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3438
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: InlineSvgComponent, isStandalone: true, selector: "inline-svg", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
|
|
3439
|
+
@if (svg.hasValue()) {
|
|
3440
|
+
<span [innerHTML]="svg.value()"></span>
|
|
3441
|
+
}
|
|
3442
|
+
`, isInline: true, styles: ["inline-svg{display:inline-flex;align-items:center}inline-svg span{display:inline-flex;align-items:center;height:100%;width:100%}inline-svg svg{height:100%;width:auto}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
3443
|
+
}
|
|
3444
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: InlineSvgComponent, decorators: [{
|
|
3445
|
+
type: Component,
|
|
3446
|
+
args: [{ selector: 'inline-svg', encapsulation: ViewEncapsulation.None, template: `
|
|
3447
|
+
@if (svg.hasValue()) {
|
|
3448
|
+
<span [innerHTML]="svg.value()"></span>
|
|
3449
|
+
}
|
|
3450
|
+
`, styles: ["inline-svg{display:inline-flex;align-items:center}inline-svg span{display:inline-flex;align-items:center;height:100%;width:100%}inline-svg svg{height:100%;width:auto}\n"] }]
|
|
3451
|
+
}], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }] } });
|
|
3452
|
+
|
|
3748
3453
|
/**
|
|
3749
3454
|
* Lazy-loading multi-select component with search, pagination, and select-all.
|
|
3750
3455
|
*
|
|
@@ -3761,8 +3466,10 @@ class LazyMultiSelectComponent extends BaseFormControl {
|
|
|
3761
3466
|
});
|
|
3762
3467
|
onDocumentClickBound = this.handleDocumentClick.bind(this);
|
|
3763
3468
|
// View references
|
|
3764
|
-
pSelectRef = viewChild.required('pSelect'
|
|
3765
|
-
|
|
3469
|
+
pSelectRef = viewChild.required('pSelect', /* @ts-ignore */
|
|
3470
|
+
...(ngDevMode ? [{ debugName: "pSelectRef" }] : /* istanbul ignore next */ []));
|
|
3471
|
+
overlayTemplate = viewChild.required('overlayTpl', /* @ts-ignore */
|
|
3472
|
+
...(ngDevMode ? [{ debugName: "overlayTemplate" }] : /* istanbul ignore next */ []));
|
|
3766
3473
|
// Portal state
|
|
3767
3474
|
overlayViewRef = null;
|
|
3768
3475
|
// Inputs
|
|
@@ -3958,12 +3665,12 @@ class LazyMultiSelectComponent extends BaseFormControl {
|
|
|
3958
3665
|
}
|
|
3959
3666
|
return key;
|
|
3960
3667
|
}
|
|
3961
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
3962
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.
|
|
3668
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: LazyMultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3669
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: LazyMultiSelectComponent, isStandalone: true, selector: "lib-lazy-multi-select", inputs: { placeHolder: { classPropertyName: "placeHolder", publicName: "placeHolder", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null }, selectDataList: { classPropertyName: "selectDataList", publicName: "selectDataList", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", onSearch: "onSearch", onPagination: "onPagination" }, providers: [provideValueAccessor(LazyMultiSelectComponent)], viewQueries: [{ propertyName: "pSelectRef", first: true, predicate: ["pSelect"], descendants: true, isSignal: true }, { propertyName: "overlayTemplate", first: true, predicate: ["overlayTpl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"w-full flex items-center justify-between px-3 py-2 text-sm rounded-lg border border-(--f-form-field-border-color) bg-(--f-form-field-background) cursor-pointer min-h-[38px]\"\n #pSelect\n (click)=\"onSelectClick()\"\n [class.opacity-50]=\"disabled()\"\n [class.pointer-events-none]=\"disabled()\"\n [class.edit-mode-element-css]=\"!isEditMode()\"\n [class.overflow-hidden]=\"!isEditMode()\"\n>\n @if (selectedValueDisplay()) {\n <span class=\"flex-1 truncate text-(--f-form-field-color)\" [class.edit-mode-element-css]=\"!isEditMode()\">\n {{ selectedValueDisplay() }}\n </span>\n } @else {\n <span class=\"flex-1 truncate text-(--f-form-field-placeholder-color)\">{{ displayPlaceholder() }}</span>\n }\n\n @if (showClear() && hasSelectedValues()) {\n <span class=\"inline-flex items-center px-1 text-(--f-text-muted-color) hover:text-(--f-text-hover-color) cursor-pointer\" (click)=\"clear($event)\">\n <ui-icon name=\"times\" class=\"text-xs\"></ui-icon>\n </span>\n }\n\n @if (isEditMode()) {\n <span class=\"inline-flex items-center px-1 text-(--f-form-field-placeholder-color)\">\n <ui-icon name=\"chevron-down\" class=\"text-xs\"></ui-icon>\n </span>\n }\n</div>\n\n<ng-template #overlayTpl>\n <div class=\"flex flex-col max-h-[250px] overflow-hidden\" (click)=\"onOverlayClick($event)\">\n <div class=\"p-3 border-b border-(--f-content-border-color) bg-(--f-content-hover-background) shrink-0 w-full flex flex-row gap-2 items-center\">\n <f-checkbox\n [binary]=\"true\"\n [ngModel]=\"isSelectAll()\"\n [disabled]=\"disabled()\"\n (onChange)=\"changeSelectAll($event)\"\n />\n <input\n type=\"text\"\n fInputText\n class=\"w-full\"\n [placeholder]=\"'shared.search' | translate\"\n [ngModel]=\"searchTerm()\"\n (ngModelChange)=\"searchTerm.set($event)\"\n />\n </div>\n <div class=\"flex-1 overflow-y-auto min-h-0 w-full\" (scroll)=\"onScroll($event)\">\n <ul class=\"m-0 py-1 list-none bg-(--f-overlay-popover-background) text-(--f-text-color) w-full\">\n @for (data of selectDataList(); track data.value) {\n @let isItemSelected = isSelected(data);\n <li\n class=\"px-3 py-2 cursor-pointer transition-colors flex flex-row gap-2 items-center text-sm\"\n [class]=\"isItemSelected ? 'bg-primary/10 text-primary' : 'text-(--f-text-color) hover:bg-(--f-content-hover-background)'\"\n >\n <f-checkbox\n [binary]=\"true\"\n [ngModel]=\"isItemSelected\"\n [disabled]=\"disabled()\"\n (onChange)=\"selectValue($event, data)\"\n />\n <span>{{ data.label }}</span>\n </li>\n }\n </ul>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: UiModule }, { kind: "component", type: i3.CheckboxComponent, selector: "f-checkbox", inputs: ["label", "binary", "disabled", "inputId", "invalid", "indeterminate", "touched", "styleClass", "checked"], outputs: ["onChange", "onBlur", "touch", "checkedChange"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }, { kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
3963
3670
|
}
|
|
3964
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
3671
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: LazyMultiSelectComponent, decorators: [{
|
|
3965
3672
|
type: Component,
|
|
3966
|
-
args: [{ selector: 'lib-lazy-multi-select', imports: [
|
|
3673
|
+
args: [{ selector: 'lib-lazy-multi-select', imports: [UiModule, AngularModule, TranslatePipe], providers: [provideValueAccessor(LazyMultiSelectComponent)], template: "<div\n class=\"w-full flex items-center justify-between px-3 py-2 text-sm rounded-lg border border-(--f-form-field-border-color) bg-(--f-form-field-background) cursor-pointer min-h-[38px]\"\n #pSelect\n (click)=\"onSelectClick()\"\n [class.opacity-50]=\"disabled()\"\n [class.pointer-events-none]=\"disabled()\"\n [class.edit-mode-element-css]=\"!isEditMode()\"\n [class.overflow-hidden]=\"!isEditMode()\"\n>\n @if (selectedValueDisplay()) {\n <span class=\"flex-1 truncate text-(--f-form-field-color)\" [class.edit-mode-element-css]=\"!isEditMode()\">\n {{ selectedValueDisplay() }}\n </span>\n } @else {\n <span class=\"flex-1 truncate text-(--f-form-field-placeholder-color)\">{{ displayPlaceholder() }}</span>\n }\n\n @if (showClear() && hasSelectedValues()) {\n <span class=\"inline-flex items-center px-1 text-(--f-text-muted-color) hover:text-(--f-text-hover-color) cursor-pointer\" (click)=\"clear($event)\">\n <ui-icon name=\"times\" class=\"text-xs\"></ui-icon>\n </span>\n }\n\n @if (isEditMode()) {\n <span class=\"inline-flex items-center px-1 text-(--f-form-field-placeholder-color)\">\n <ui-icon name=\"chevron-down\" class=\"text-xs\"></ui-icon>\n </span>\n }\n</div>\n\n<ng-template #overlayTpl>\n <div class=\"flex flex-col max-h-[250px] overflow-hidden\" (click)=\"onOverlayClick($event)\">\n <div class=\"p-3 border-b border-(--f-content-border-color) bg-(--f-content-hover-background) shrink-0 w-full flex flex-row gap-2 items-center\">\n <f-checkbox\n [binary]=\"true\"\n [ngModel]=\"isSelectAll()\"\n [disabled]=\"disabled()\"\n (onChange)=\"changeSelectAll($event)\"\n />\n <input\n type=\"text\"\n fInputText\n class=\"w-full\"\n [placeholder]=\"'shared.search' | translate\"\n [ngModel]=\"searchTerm()\"\n (ngModelChange)=\"searchTerm.set($event)\"\n />\n </div>\n <div class=\"flex-1 overflow-y-auto min-h-0 w-full\" (scroll)=\"onScroll($event)\">\n <ul class=\"m-0 py-1 list-none bg-(--f-overlay-popover-background) text-(--f-text-color) w-full\">\n @for (data of selectDataList(); track data.value) {\n @let isItemSelected = isSelected(data);\n <li\n class=\"px-3 py-2 cursor-pointer transition-colors flex flex-row gap-2 items-center text-sm\"\n [class]=\"isItemSelected ? 'bg-primary/10 text-primary' : 'text-(--f-text-color) hover:bg-(--f-content-hover-background)'\"\n >\n <f-checkbox\n [binary]=\"true\"\n [ngModel]=\"isItemSelected\"\n [disabled]=\"disabled()\"\n (onChange)=\"selectValue($event, data)\"\n />\n <span>{{ data.label }}</span>\n </li>\n }\n </ul>\n </div>\n </div>\n</ng-template>\n" }]
|
|
3967
3674
|
}], ctorParameters: () => [], propDecorators: { pSelectRef: [{ type: i0.ViewChild, args: ['pSelect', { isSignal: true }] }], overlayTemplate: [{ type: i0.ViewChild, args: ['overlayTpl', { isSignal: true }] }], placeHolder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeHolder", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], isEditMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isEditMode", required: true }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: true }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: true }] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: true }] }], selectDataList: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectDataList", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], onSearch: [{ type: i0.Output, args: ["onSearch"] }], onPagination: [{ type: i0.Output, args: ["onPagination"] }] } });
|
|
3968
3675
|
|
|
3969
3676
|
/**
|
|
@@ -3983,7 +3690,8 @@ class LazySelectComponent extends BaseFormControl {
|
|
|
3983
3690
|
scrollTargetEl = null;
|
|
3984
3691
|
isDestroyed = false;
|
|
3985
3692
|
// View references
|
|
3986
|
-
scrollContainer = viewChild.required('scrollContainer'
|
|
3693
|
+
scrollContainer = viewChild.required('scrollContainer', /* @ts-ignore */
|
|
3694
|
+
...(ngDevMode ? [{ debugName: "scrollContainer" }] : /* istanbul ignore next */ []));
|
|
3987
3695
|
// Inputs
|
|
3988
3696
|
placeHolder = input('', /* @ts-ignore */
|
|
3989
3697
|
...(ngDevMode ? [{ debugName: "placeHolder" }] : /* istanbul ignore next */ []));
|
|
@@ -4074,7 +3782,7 @@ class LazySelectComponent extends BaseFormControl {
|
|
|
4074
3782
|
if (this.isDestroyed)
|
|
4075
3783
|
return;
|
|
4076
3784
|
const containerEl = this.scrollContainer().nativeElement;
|
|
4077
|
-
const target = containerEl.querySelector('
|
|
3785
|
+
const target = containerEl.querySelector('[data-select-list]');
|
|
4078
3786
|
if (target) {
|
|
4079
3787
|
target.addEventListener('scroll', this.onScrollBound);
|
|
4080
3788
|
this.scrollTargetEl = target;
|
|
@@ -4095,14 +3803,57 @@ class LazySelectComponent extends BaseFormControl {
|
|
|
4095
3803
|
}
|
|
4096
3804
|
return key;
|
|
4097
3805
|
}
|
|
4098
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
4099
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.
|
|
3806
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: LazySelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3807
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.6", type: LazySelectComponent, isStandalone: true, selector: "lib-lazy-select", inputs: { placeHolder: { classPropertyName: "placeHolder", publicName: "placeHolder", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: true, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: true, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null }, selectDataList: { classPropertyName: "selectDataList", publicName: "selectDataList", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", onSearch: "onSearch", onPagination: "onPagination" }, providers: [provideValueAccessor(LazySelectComponent)], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div #scrollContainer class=\"lib-scroll-container\">\n <f-select\n class=\"w-full\"\n [options]=\"selectDataList()\"\n [optionLabel]=\"optionLabel()\"\n [optionValue]=\"optionValue()\"\n [filter]=\"true\"\n [showClear]=\"showClear()\"\n [placeholder]=\"displayPlaceholder()\"\n [disabled]=\"disabled()\"\n [(ngModel)]=\"value\"\n appEditModeElementChanger\n [isEditMode]=\"isEditMode()\"\n (click)=\"showPanel()\"\n (onBlur)=\"onBlur()\"\n >\n <ng-template #filter let-filter>\n <input\n fInputText\n class=\"w-full\"\n [ngModel]=\"searchTerm()\"\n [ngModelOptions]=\"{ standalone: true }\"\n (ngModelChange)=\"searchTerm.set($event)\"\n />\n </ng-template>\n <ng-template #selectedItem let-selectedOption>\n {{ selectedOption[optionLabel()] }}\n </ng-template>\n <ng-template #item let-item>\n {{ item[optionLabel()] }}\n </ng-template>\n </f-select>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "showClear", "loading", "inputId", "invalid", "touched", "styleClass", "editable"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur"] }, { kind: "directive", type: EditModeElementChangerDirective, selector: "[appEditModeElementChanger]", inputs: ["isEditMode"] }] });
|
|
4100
3808
|
}
|
|
4101
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
3809
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: LazySelectComponent, decorators: [{
|
|
4102
3810
|
type: Component,
|
|
4103
|
-
args: [{ selector: 'lib-lazy-select', imports: [AngularModule,
|
|
3811
|
+
args: [{ selector: 'lib-lazy-select', imports: [AngularModule, UiModule, EditModeElementChangerDirective], providers: [provideValueAccessor(LazySelectComponent)], template: "<div #scrollContainer class=\"lib-scroll-container\">\n <f-select\n class=\"w-full\"\n [options]=\"selectDataList()\"\n [optionLabel]=\"optionLabel()\"\n [optionValue]=\"optionValue()\"\n [filter]=\"true\"\n [showClear]=\"showClear()\"\n [placeholder]=\"displayPlaceholder()\"\n [disabled]=\"disabled()\"\n [(ngModel)]=\"value\"\n appEditModeElementChanger\n [isEditMode]=\"isEditMode()\"\n (click)=\"showPanel()\"\n (onBlur)=\"onBlur()\"\n >\n <ng-template #filter let-filter>\n <input\n fInputText\n class=\"w-full\"\n [ngModel]=\"searchTerm()\"\n [ngModelOptions]=\"{ standalone: true }\"\n (ngModelChange)=\"searchTerm.set($event)\"\n />\n </ng-template>\n <ng-template #selectedItem let-selectedOption>\n {{ selectedOption[optionLabel()] }}\n </ng-template>\n <ng-template #item let-item>\n {{ item[optionLabel()] }}\n </ng-template>\n </f-select>\n</div>\n" }]
|
|
4104
3812
|
}], ctorParameters: () => [], propDecorators: { scrollContainer: [{ type: i0.ViewChild, args: ['scrollContainer', { isSignal: true }] }], placeHolder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeHolder", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: true }] }], optionValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionValue", required: true }] }], isEditMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isEditMode", required: true }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: true }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: true }] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: true }] }], selectDataList: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectDataList", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], onSearch: [{ type: i0.Output, args: ["onSearch"] }], onPagination: [{ type: i0.Output, args: ["onPagination"] }] } });
|
|
4105
3813
|
|
|
3814
|
+
class RouterTabsComponent {
|
|
3815
|
+
tabs = input([], /* @ts-ignore */
|
|
3816
|
+
...(ngDevMode ? [{ debugName: "tabs" }] : /* istanbul ignore next */ []));
|
|
3817
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: RouterTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3818
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: RouterTabsComponent, isStandalone: true, selector: "lib-router-tabs", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, ngImport: i0, template: `
|
|
3819
|
+
<div class="router-tabs-scroll flex gap-1 border-b border-(--f-content-border-color) overflow-x-auto flex-nowrap">
|
|
3820
|
+
@for (tab of tabs(); track tab.id) {
|
|
3821
|
+
<a
|
|
3822
|
+
[routerLink]="tab.route"
|
|
3823
|
+
routerLinkActive="router-tab-active"
|
|
3824
|
+
[routerLinkActiveOptions]="{ exact: tab.routerLinkActiveExact ?? false }"
|
|
3825
|
+
class="flex items-center gap-2 px-4 py-2 rounded-t-lg cursor-pointer transition-colors text-(--f-text-muted-color) no-underline border-b-2 border-transparent -mb-px hover:bg-(--f-content-hover-background) [&.router-tab-active]:text-primary [&.router-tab-active]:border-primary [&.router-tab-active]:bg-(--f-content-hover-background) whitespace-nowrap shrink-0"
|
|
3826
|
+
>
|
|
3827
|
+
@if (tab.icon) {
|
|
3828
|
+
<ui-icon [name]="tab.icon"></ui-icon>
|
|
3829
|
+
}
|
|
3830
|
+
<span>{{ tab.label }}</span>
|
|
3831
|
+
</a>
|
|
3832
|
+
}
|
|
3833
|
+
</div>
|
|
3834
|
+
`, isInline: true, styles: [".router-tabs-scroll{-ms-overflow-style:none;scrollbar-width:none}.router-tabs-scroll::-webkit-scrollbar{display:none}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill"] }] });
|
|
3835
|
+
}
|
|
3836
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: RouterTabsComponent, decorators: [{
|
|
3837
|
+
type: Component,
|
|
3838
|
+
args: [{ selector: 'lib-router-tabs', imports: [RouterLink, RouterLinkActive, UiIconComponent], host: { class: 'block' }, template: `
|
|
3839
|
+
<div class="router-tabs-scroll flex gap-1 border-b border-(--f-content-border-color) overflow-x-auto flex-nowrap">
|
|
3840
|
+
@for (tab of tabs(); track tab.id) {
|
|
3841
|
+
<a
|
|
3842
|
+
[routerLink]="tab.route"
|
|
3843
|
+
routerLinkActive="router-tab-active"
|
|
3844
|
+
[routerLinkActiveOptions]="{ exact: tab.routerLinkActiveExact ?? false }"
|
|
3845
|
+
class="flex items-center gap-2 px-4 py-2 rounded-t-lg cursor-pointer transition-colors text-(--f-text-muted-color) no-underline border-b-2 border-transparent -mb-px hover:bg-(--f-content-hover-background) [&.router-tab-active]:text-primary [&.router-tab-active]:border-primary [&.router-tab-active]:bg-(--f-content-hover-background) whitespace-nowrap shrink-0"
|
|
3846
|
+
>
|
|
3847
|
+
@if (tab.icon) {
|
|
3848
|
+
<ui-icon [name]="tab.icon"></ui-icon>
|
|
3849
|
+
}
|
|
3850
|
+
<span>{{ tab.label }}</span>
|
|
3851
|
+
</a>
|
|
3852
|
+
}
|
|
3853
|
+
</div>
|
|
3854
|
+
`, styles: [".router-tabs-scroll{-ms-overflow-style:none;scrollbar-width:none}.router-tabs-scroll::-webkit-scrollbar{display:none}\n"] }]
|
|
3855
|
+
}], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }] } });
|
|
3856
|
+
|
|
4106
3857
|
const DEFAULT_PAGE_SIZE = 20;
|
|
4107
3858
|
/**
|
|
4108
3859
|
* Base class for user selection components.
|
|
@@ -4262,10 +4013,10 @@ class BaseUserSelectComponent {
|
|
|
4262
4013
|
}
|
|
4263
4014
|
return key;
|
|
4264
4015
|
}
|
|
4265
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
4266
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.
|
|
4016
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseUserSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4017
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: BaseUserSelectComponent, isStandalone: true, inputs: { loadUsers: { classPropertyName: "loadUsers", publicName: "loadUsers", isSignal: true, isRequired: false, transformFunction: null }, placeHolder: { classPropertyName: "placeHolder", publicName: "placeHolder", isSignal: true, isRequired: false, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: true, transformFunction: null }, filterActive: { classPropertyName: "filterActive", publicName: "filterActive", isSignal: true, isRequired: false, transformFunction: null }, additionalFilters: { classPropertyName: "additionalFilters", publicName: "additionalFilters", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onError: "onError" }, ngImport: i0 });
|
|
4267
4018
|
}
|
|
4268
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
4019
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseUserSelectComponent, decorators: [{
|
|
4269
4020
|
type: Directive
|
|
4270
4021
|
}], ctorParameters: () => [], propDecorators: { loadUsers: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadUsers", required: false }] }], placeHolder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeHolder", required: false }] }], isEditMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isEditMode", required: true }] }], filterActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterActive", required: false }] }], additionalFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "additionalFilters", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], onError: [{ type: i0.Output, args: ["onError"] }] } });
|
|
4271
4022
|
|
|
@@ -4317,8 +4068,8 @@ class UserMultiSelectComponent extends BaseUserSelectComponent {
|
|
|
4317
4068
|
});
|
|
4318
4069
|
});
|
|
4319
4070
|
}
|
|
4320
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
4321
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.
|
|
4071
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: UserMultiSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4072
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.6", type: UserMultiSelectComponent, isStandalone: true, selector: "lib-user-multi-select", inputs: { showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", usersSelected: "usersSelected" }, usesInheritance: true, ngImport: i0, template: `
|
|
4322
4073
|
<lib-lazy-multi-select
|
|
4323
4074
|
[(value)]="value"
|
|
4324
4075
|
[placeHolder]="displayPlaceholder()"
|
|
@@ -4331,13 +4082,13 @@ class UserMultiSelectComponent extends BaseUserSelectComponent {
|
|
|
4331
4082
|
(onSearch)="handleSearch($event)"
|
|
4332
4083
|
(onPagination)="handlePagination($event)"
|
|
4333
4084
|
/>
|
|
4334
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "ngmodule", type:
|
|
4085
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "ngmodule", type: UiModule }, { kind: "component", type: LazyMultiSelectComponent, selector: "lib-lazy-multi-select", inputs: ["placeHolder", "showClear", "isEditMode", "isLoading", "total", "pagination", "selectDataList", "value"], outputs: ["valueChange", "onSearch", "onPagination"] }] });
|
|
4335
4086
|
}
|
|
4336
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
4087
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: UserMultiSelectComponent, decorators: [{
|
|
4337
4088
|
type: Component,
|
|
4338
4089
|
args: [{
|
|
4339
4090
|
selector: 'lib-user-multi-select',
|
|
4340
|
-
imports: [AngularModule,
|
|
4091
|
+
imports: [AngularModule, UiModule, LazyMultiSelectComponent],
|
|
4341
4092
|
template: `
|
|
4342
4093
|
<lib-lazy-multi-select
|
|
4343
4094
|
[(value)]="value"
|
|
@@ -4407,8 +4158,8 @@ class UserSelectComponent extends BaseUserSelectComponent {
|
|
|
4407
4158
|
});
|
|
4408
4159
|
});
|
|
4409
4160
|
}
|
|
4410
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.
|
|
4411
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.
|
|
4161
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: UserSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4162
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.6", type: UserSelectComponent, isStandalone: true, selector: "lib-user-select", inputs: { showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", userSelected: "userSelected" }, usesInheritance: true, ngImport: i0, template: `
|
|
4412
4163
|
<lib-lazy-select
|
|
4413
4164
|
[(value)]="value"
|
|
4414
4165
|
[placeHolder]="displayPlaceholder()"
|
|
@@ -4423,13 +4174,13 @@ class UserSelectComponent extends BaseUserSelectComponent {
|
|
|
4423
4174
|
(onSearch)="handleSearch($event)"
|
|
4424
4175
|
(onPagination)="handlePagination($event)"
|
|
4425
4176
|
/>
|
|
4426
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "ngmodule", type:
|
|
4177
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "ngmodule", type: UiModule }, { kind: "component", type: LazySelectComponent, selector: "lib-lazy-select", inputs: ["placeHolder", "showClear", "optionLabel", "optionValue", "isEditMode", "isLoading", "total", "pagination", "selectDataList", "value"], outputs: ["valueChange", "onSearch", "onPagination"] }] });
|
|
4427
4178
|
}
|
|
4428
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.
|
|
4179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: UserSelectComponent, decorators: [{
|
|
4429
4180
|
type: Component,
|
|
4430
4181
|
args: [{
|
|
4431
4182
|
selector: 'lib-user-select',
|
|
4432
|
-
imports: [AngularModule,
|
|
4183
|
+
imports: [AngularModule, UiModule, LazySelectComponent],
|
|
4433
4184
|
template: `
|
|
4434
4185
|
<lib-lazy-select
|
|
4435
4186
|
[(value)]="value"
|
|
@@ -4587,5 +4338,5 @@ function getUserTimezone() {
|
|
|
4587
4338
|
* Generated bundle index. Do not edit.
|
|
4588
4339
|
*/
|
|
4589
4340
|
|
|
4590
|
-
export { ACTION_PERMISSIONS, AUTH_STATE_PROVIDER, AngularModule, ApiResourceService, ApiResourceService as ApiService, BRANCH_PERMISSIONS, BaseFormComponent, BaseFormControl, BaseFormTemplateDirective, BaseListComponent, BaseListTemplateDirective, BaseUserSelectComponent, COMPANY_ACTION_PERMISSIONS, COMPANY_API_PROVIDER, COMPANY_PERMISSIONS, CookieService, EMAIL_CONFIG_PERMISSIONS, EMAIL_TEMPLATE_PERMISSIONS, EVENT_PERMISSIONS, EditModeElementChangerDirective, FILE_PERMISSIONS, FILE_PROVIDER, FILE_TYPE_FILTERS, FOLDER_PERMISSIONS, FORM_PERMISSIONS, FORM_RESULT_PERMISSIONS, FaviconService, FileSelectorDialogComponent, FileUploaderComponent, FileUrlService, HasPermissionDirective, IconComponent, IconTypeEnum, InlineSvgComponent, IsEmptyImageDirective, LANGUAGE_PERMISSIONS, LazyMultiSelectComponent, LazySelectComponent, NOTIFICATION_PERMISSIONS, PERMISSIONS, PROFILE_PERMISSION_PROVIDER, PermissionValidatorService, PlatformService, PreventDefaultDirective,
|
|
4341
|
+
export { ACTION_PERMISSIONS, AUTH_STATE_PROVIDER, AngularModule, ApiResourceService, ApiResourceService as ApiService, BRANCH_PERMISSIONS, BaseFormComponent, BaseFormControl, BaseFormTemplateDirective, BaseListComponent, BaseListTemplateDirective, BaseUserSelectComponent, COMPANY_ACTION_PERMISSIONS, COMPANY_API_PROVIDER, COMPANY_PERMISSIONS, CookieService, EMAIL_CONFIG_PERMISSIONS, EMAIL_TEMPLATE_PERMISSIONS, EVENT_PERMISSIONS, EditModeElementChangerDirective, FILE_PERMISSIONS, FILE_PROVIDER, FILE_TYPE_FILTERS, FOLDER_PERMISSIONS, FORM_PERMISSIONS, FORM_RESULT_PERMISSIONS, FaviconService, FileSelectorDialogComponent, FileUploaderComponent, FileUrlService, HasPermissionDirective, IconComponent, IconTypeEnum, InlineSvgComponent, IsEmptyImageDirective, LANGUAGE_PERMISSIONS, LazyMultiSelectComponent, LazySelectComponent, NOTIFICATION_PERMISSIONS, PERMISSIONS, PROFILE_PERMISSION_PROVIDER, PermissionValidatorService, PlatformService, PreventDefaultDirective, ROLE_ACTION_PERMISSIONS, ROLE_PERMISSIONS, RouterTabsComponent, SHARED_MESSAGES, SKIP_ERROR_TOAST, STORAGE_CONFIG_PERMISSIONS, TRANSLATION_KEY_PERMISSIONS, TRANSLATION_PERMISSIONS, TranslatePipe, TranslateService, UPLOAD_CONFIG_PERMISSIONS, USER_ACTION_PERMISSIONS, USER_PERMISSIONS, USER_PERMISSION_PROVIDER, USER_PROVIDER, USER_ROLE_PERMISSIONS, UserMultiSelectComponent, UserSelectComponent, allPermissionsGuard, anyPermissionGuard, checkScrollPagination, errorCatchingInterceptor, evaluateLogicNode, evaluatePermission, formatFileSize, formatInTimezone, getAcceptString, getFileIconClass, getUserTimezone, hasAllPermissions, hasAnyPermission, hasPermission, isFileTypeAllowed, localToUtc, permissionGuard, provideValueAccessor, resolveTranslationModule, utcToLocal };
|
|
4591
4342
|
//# sourceMappingURL=flusys-ng-shared.mjs.map
|