lib-portal-angular 0.0.52 → 0.0.53
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2022/lib/components/basic-registration/basic-registration.component.mjs +3 -3
- package/esm2022/lib/components/components.module.mjs +8 -3
- package/esm2022/lib/components/custom-switch/custom-switch.component.mjs +49 -0
- package/esm2022/lib/components/multi-select/multi-select.component.mjs +132 -41
- package/esm2022/lib/components/select/select.component.mjs +14 -4
- package/esm2022/lib/components/tables/data-table.component.mjs +3 -3
- package/esm2022/public-api.mjs +2 -1
- package/fesm2022/lib-portal-angular.mjs +237 -91
- package/fesm2022/lib-portal-angular.mjs.map +1 -1
- package/lib/components/components.module.d.ts +6 -5
- package/lib/components/custom-switch/custom-switch.component.d.ts +15 -0
- package/lib/components/multi-select/multi-select.component.d.ts +20 -5
- package/lib/components/select/select.component.d.ts +8 -3
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
@@ -1,21 +1,98 @@
|
|
1
1
|
import * as i0 from '@angular/core';
|
2
|
-
import {
|
2
|
+
import { Injectable, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostListener, forwardRef, ViewChild, Directive, NgModule, createComponent } from '@angular/core';
|
3
3
|
import * as i1 from '@angular/common';
|
4
4
|
import { CommonModule } from '@angular/common';
|
5
|
-
import * as
|
5
|
+
import * as i4 from '@angular/forms';
|
6
6
|
import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
7
7
|
import hljs from 'highlight.js';
|
8
8
|
import * as i1$1 from '@ng-bootstrap/ng-bootstrap';
|
9
9
|
import { Subject, of, Subscription, Observable } from 'rxjs';
|
10
|
-
import
|
10
|
+
import { debounceTime, startWith, switchMap, map, catchError, takeUntil } from 'rxjs/operators';
|
11
|
+
import * as i2 from '@angular/common/http';
|
12
|
+
import { HttpParams } from '@angular/common/http';
|
13
|
+
import * as i5 from '@ng-select/ng-select';
|
11
14
|
import { NgSelectModule } from '@ng-select/ng-select';
|
12
|
-
import
|
13
|
-
import * as i4 from 'lucide-angular';
|
15
|
+
import * as i4$1 from 'lucide-angular';
|
14
16
|
import { LucideAngularModule, icons } from 'lucide-angular';
|
15
|
-
import * as i1$2 from '@angular/common/http';
|
16
|
-
import { HttpParams } from '@angular/common/http';
|
17
17
|
import * as CryptoJS from 'crypto-js';
|
18
18
|
|
19
|
+
class AuthService {
|
20
|
+
constructor() {
|
21
|
+
this.userRoles = [];
|
22
|
+
this.loadUserRoles();
|
23
|
+
}
|
24
|
+
loadUserRoles() {
|
25
|
+
const storedUser = localStorage.getItem('user');
|
26
|
+
if (!storedUser) {
|
27
|
+
throw new Error('User not found in localStorage');
|
28
|
+
}
|
29
|
+
const { role } = JSON.parse(storedUser);
|
30
|
+
if (!role || !Array.isArray(role)) {
|
31
|
+
throw new Error('Roles not found or invalid in localStorage');
|
32
|
+
}
|
33
|
+
this.userRoles = role.flatMap((roleArray) => roleArray.map(role => role.toString()));
|
34
|
+
}
|
35
|
+
hasPermission(requiredPermissions) {
|
36
|
+
if (this.userRoles.length === 0) {
|
37
|
+
throw new Error('No roles found for the user');
|
38
|
+
}
|
39
|
+
return requiredPermissions.every(permission => this.userRoles.includes(permission));
|
40
|
+
}
|
41
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
42
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthService, providedIn: 'root' }); }
|
43
|
+
}
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthService, decorators: [{
|
45
|
+
type: Injectable,
|
46
|
+
args: [{
|
47
|
+
providedIn: 'root'
|
48
|
+
}]
|
49
|
+
}], ctorParameters: function () { return []; } });
|
50
|
+
|
51
|
+
class CustomSwitchComponent {
|
52
|
+
constructor(authService) {
|
53
|
+
this.authService = authService;
|
54
|
+
this.checked = false;
|
55
|
+
this.label = '';
|
56
|
+
this.permissions = [];
|
57
|
+
this.switchChange = new EventEmitter();
|
58
|
+
}
|
59
|
+
toggleSwitch() {
|
60
|
+
this.checked = !this.checked;
|
61
|
+
this.switchChange.emit(this.checked);
|
62
|
+
}
|
63
|
+
hasPermission() {
|
64
|
+
if (!this.permissions || this.permissions.length === 0) {
|
65
|
+
return true;
|
66
|
+
}
|
67
|
+
try {
|
68
|
+
return this.authService.hasPermission(this.permissions);
|
69
|
+
}
|
70
|
+
catch (error) {
|
71
|
+
if (error instanceof Error) {
|
72
|
+
console.error('Permission error:', error.message);
|
73
|
+
}
|
74
|
+
else {
|
75
|
+
console.error('Unknown error occurred during permission check');
|
76
|
+
}
|
77
|
+
return true;
|
78
|
+
}
|
79
|
+
}
|
80
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomSwitchComponent, deps: [{ token: AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
|
81
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomSwitchComponent, selector: "argenta-custom-switch", inputs: { checked: "checked", label: "label", permissions: "permissions" }, outputs: { switchChange: "switchChange" }, ngImport: i0, template: "<ng-container *ngIf=\"hasPermission()\">\n <div class=\"form-check form-switch\">\n <input \n class=\"form-check-input\" \n type=\"checkbox\" \n [checked]=\"checked\" \n (change)=\"toggleSwitch()\" \n id=\"flexSwitchCheckDefault\" \n />\n <label class=\"form-check-label\" for=\"flexSwitchCheckDefault\">\n {{ label }}\n </label>\n </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.form-check{display:flex;align-items:center}.form-check-input{width:50px;height:24px;margin-right:10px;cursor:pointer}.form-check-input:checked{background-color:#00444c;border-color:#00444c}.form-check-input:not(:checked){border-color:#3ec9d6;box-shadow:0 0 5px #e5e5e5}.form-check-label{color:#00444c;font-family:Inter,sans-serif;font-size:16px;font-weight:600;height:24px;line-height:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
82
|
+
}
|
83
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomSwitchComponent, decorators: [{
|
84
|
+
type: Component,
|
85
|
+
args: [{ selector: 'argenta-custom-switch', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"hasPermission()\">\n <div class=\"form-check form-switch\">\n <input \n class=\"form-check-input\" \n type=\"checkbox\" \n [checked]=\"checked\" \n (change)=\"toggleSwitch()\" \n id=\"flexSwitchCheckDefault\" \n />\n <label class=\"form-check-label\" for=\"flexSwitchCheckDefault\">\n {{ label }}\n </label>\n </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.form-check{display:flex;align-items:center}.form-check-input{width:50px;height:24px;margin-right:10px;cursor:pointer}.form-check-input:checked{background-color:#00444c;border-color:#00444c}.form-check-input:not(:checked){border-color:#3ec9d6;box-shadow:0 0 5px #e5e5e5}.form-check-label{color:#00444c;font-family:Inter,sans-serif;font-size:16px;font-weight:600;height:24px;line-height:24px}\n"] }]
|
86
|
+
}], ctorParameters: function () { return [{ type: AuthService }]; }, propDecorators: { checked: [{
|
87
|
+
type: Input
|
88
|
+
}], label: [{
|
89
|
+
type: Input
|
90
|
+
}], permissions: [{
|
91
|
+
type: Input
|
92
|
+
}], switchChange: [{
|
93
|
+
type: Output
|
94
|
+
}] } });
|
95
|
+
|
19
96
|
class AlertComponent {
|
20
97
|
constructor() {
|
21
98
|
this.alerts = [];
|
@@ -281,38 +358,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
281
358
|
args: ['mouseup']
|
282
359
|
}] } });
|
283
360
|
|
284
|
-
class AuthService {
|
285
|
-
constructor() {
|
286
|
-
this.userRoles = [];
|
287
|
-
this.loadUserRoles();
|
288
|
-
}
|
289
|
-
loadUserRoles() {
|
290
|
-
const storedUser = localStorage.getItem('user');
|
291
|
-
if (!storedUser) {
|
292
|
-
throw new Error('User not found in localStorage');
|
293
|
-
}
|
294
|
-
const { role } = JSON.parse(storedUser);
|
295
|
-
if (!role || !Array.isArray(role)) {
|
296
|
-
throw new Error('Roles not found or invalid in localStorage');
|
297
|
-
}
|
298
|
-
this.userRoles = role.flatMap((roleArray) => roleArray.map(role => role.toString()));
|
299
|
-
}
|
300
|
-
hasPermission(requiredPermissions) {
|
301
|
-
if (this.userRoles.length === 0) {
|
302
|
-
throw new Error('No roles found for the user');
|
303
|
-
}
|
304
|
-
return requiredPermissions.every(permission => this.userRoles.includes(permission));
|
305
|
-
}
|
306
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
307
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthService, providedIn: 'root' }); }
|
308
|
-
}
|
309
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthService, decorators: [{
|
310
|
-
type: Injectable,
|
311
|
-
args: [{
|
312
|
-
providedIn: 'root'
|
313
|
-
}]
|
314
|
-
}], ctorParameters: function () { return []; } });
|
315
|
-
|
316
361
|
class ButtonComponent {
|
317
362
|
constructor(authService) {
|
318
363
|
this.authService = authService;
|
@@ -558,11 +603,11 @@ class BasicRegistrationComponent {
|
|
558
603
|
this.saveClick.emit(event);
|
559
604
|
}
|
560
605
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BasicRegistrationComponent, deps: [{ token: AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
|
561
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BasicRegistrationComponent, selector: "argenta-basic-registration", inputs: { cancelLabel: "cancelLabel", saveLabel: "saveLabel", cancelPermissions: "cancelPermissions", savePermissions: "savePermissions" }, outputs: { cancelClick: "cancelClick", saveClick: "saveClick" }, ngImport: i0, template: "<div class=\"row row-car\">\n <div class=\"card\">\n <div class=\"card-content\">\n <ng-content></ng-content> <!-- Permite a inclus\u00E3o de conte\u00FAdo din\u00E2mico -->\n </div>\n <div class=\"card-footer\">\n <div class=\"button-group\">\n <argenta-custom-button\n *ngIf=\"hasPermission(cancelPermissions)\"\n [type]=\"'button'\"\n [label]=\"cancelLabel\"\n [btnClass]=\"ButtonClasses.Light\"\n (onButtonClick)=\"handleCancel($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n <argenta-custom-button\n *ngIf=\"hasPermission(savePermissions)\"\n [type]=\"'submit'\"\n [label]=\"saveLabel\"\n [btnClass]=\"ButtonClasses.Primary\"\n (onButtonClick)=\"handleSave($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n </div>\n </div>\n </div> \n</div>\n", styles: ["@charset \"UTF-8\";.card{border-radius:10px;padding:1rem;background-color:#fff;border:none}.card-footer{display:flex;justify-content:flex-end;margin-top:1rem;padding-top:1rem;border-radius:.25rem}.button-group{display:flex;gap:1rem;height:3rem}.argenta-custom-button{height:100%}.row-car{margin-left:-.8rem;margin-right:-.8rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "argenta-custom-button", inputs: ["type", "label", "btnClass", "fontSize", "disabled", "autofocus", "form", "formaction", "formenctype", "formmethod", "formnovalidate", "formtarget", "name", "value", "permissions"], outputs: ["onButtonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
606
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BasicRegistrationComponent, selector: "argenta-basic-registration", inputs: { cancelLabel: "cancelLabel", saveLabel: "saveLabel", cancelPermissions: "cancelPermissions", savePermissions: "savePermissions" }, outputs: { cancelClick: "cancelClick", saveClick: "saveClick" }, ngImport: i0, template: "<div class=\"row row-car\">\n <div class=\"card\">\n <div class=\"card-content\" style=\"margin-top: 2.5rem;\">\n <ng-content></ng-content> <!-- Permite a inclus\u00E3o de conte\u00FAdo din\u00E2mico -->\n </div>\n <div class=\"card-footer\">\n <div class=\"button-group\">\n <argenta-custom-button\n *ngIf=\"hasPermission(cancelPermissions)\"\n [type]=\"'button'\"\n [label]=\"cancelLabel\"\n [btnClass]=\"ButtonClasses.Light\"\n (onButtonClick)=\"handleCancel($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n <argenta-custom-button\n *ngIf=\"hasPermission(savePermissions)\"\n [type]=\"'submit'\"\n [label]=\"saveLabel\"\n [btnClass]=\"ButtonClasses.Primary\"\n (onButtonClick)=\"handleSave($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n </div>\n </div>\n </div> \n</div>\n", styles: ["@charset \"UTF-8\";.card{border-radius:10px;padding:1rem;background-color:#fff;border:none}.card-footer{display:flex;justify-content:flex-end;margin-top:1rem;padding-top:1rem;border-radius:.25rem}.button-group{display:flex;gap:1rem;height:3rem}.argenta-custom-button{height:100%}.row-car{margin-left:-.8rem;margin-right:-.8rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "argenta-custom-button", inputs: ["type", "label", "btnClass", "fontSize", "disabled", "autofocus", "form", "formaction", "formenctype", "formmethod", "formnovalidate", "formtarget", "name", "value", "permissions"], outputs: ["onButtonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
562
607
|
}
|
563
608
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BasicRegistrationComponent, decorators: [{
|
564
609
|
type: Component,
|
565
|
-
args: [{ selector: 'argenta-basic-registration', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row row-car\">\n <div class=\"card\">\n <div class=\"card-content\">\n <ng-content></ng-content> <!-- Permite a inclus\u00E3o de conte\u00FAdo din\u00E2mico -->\n </div>\n <div class=\"card-footer\">\n <div class=\"button-group\">\n <argenta-custom-button\n *ngIf=\"hasPermission(cancelPermissions)\"\n [type]=\"'button'\"\n [label]=\"cancelLabel\"\n [btnClass]=\"ButtonClasses.Light\"\n (onButtonClick)=\"handleCancel($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n <argenta-custom-button\n *ngIf=\"hasPermission(savePermissions)\"\n [type]=\"'submit'\"\n [label]=\"saveLabel\"\n [btnClass]=\"ButtonClasses.Primary\"\n (onButtonClick)=\"handleSave($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n </div>\n </div>\n </div> \n</div>\n", styles: ["@charset \"UTF-8\";.card{border-radius:10px;padding:1rem;background-color:#fff;border:none}.card-footer{display:flex;justify-content:flex-end;margin-top:1rem;padding-top:1rem;border-radius:.25rem}.button-group{display:flex;gap:1rem;height:3rem}.argenta-custom-button{height:100%}.row-car{margin-left:-.8rem;margin-right:-.8rem}\n"] }]
|
610
|
+
args: [{ selector: 'argenta-basic-registration', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row row-car\">\n <div class=\"card\">\n <div class=\"card-content\" style=\"margin-top: 2.5rem;\">\n <ng-content></ng-content> <!-- Permite a inclus\u00E3o de conte\u00FAdo din\u00E2mico -->\n </div>\n <div class=\"card-footer\">\n <div class=\"button-group\">\n <argenta-custom-button\n *ngIf=\"hasPermission(cancelPermissions)\"\n [type]=\"'button'\"\n [label]=\"cancelLabel\"\n [btnClass]=\"ButtonClasses.Light\"\n (onButtonClick)=\"handleCancel($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n <argenta-custom-button\n *ngIf=\"hasPermission(savePermissions)\"\n [type]=\"'submit'\"\n [label]=\"saveLabel\"\n [btnClass]=\"ButtonClasses.Primary\"\n (onButtonClick)=\"handleSave($event)\"\n class=\"argenta-custom-button\">\n </argenta-custom-button>\n </div>\n </div>\n </div> \n</div>\n", styles: ["@charset \"UTF-8\";.card{border-radius:10px;padding:1rem;background-color:#fff;border:none}.card-footer{display:flex;justify-content:flex-end;margin-top:1rem;padding-top:1rem;border-radius:.25rem}.button-group{display:flex;gap:1rem;height:3rem}.argenta-custom-button{height:100%}.row-car{margin-left:-.8rem;margin-right:-.8rem}\n"] }]
|
566
611
|
}], ctorParameters: function () { return [{ type: AuthService }]; }, propDecorators: { cancelLabel: [{
|
567
612
|
type: Input
|
568
613
|
}], saveLabel: [{
|
@@ -978,7 +1023,7 @@ class InputComponent {
|
|
978
1023
|
[attr.pattern]="pattern"
|
979
1024
|
[autofocus]="autofocus">
|
980
1025
|
</div>
|
981
|
-
`, isInline: true, styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.form-group{font-family:Inter,Arial,sans-serif;font-size:1rem;font-weight:700}.form-check-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left}.custom-select,.custom-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem}.form-label{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:700}.label-styles{font-weight:400;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type:
|
1026
|
+
`, isInline: true, styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.form-group{font-family:Inter,Arial,sans-serif;font-size:1rem;font-weight:700}.form-check-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left}.custom-select,.custom-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem}.form-label{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:700}.label-styles{font-weight:400;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
982
1027
|
}
|
983
1028
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InputComponent, decorators: [{
|
984
1029
|
type: Component,
|
@@ -1055,25 +1100,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1055
1100
|
}] } });
|
1056
1101
|
|
1057
1102
|
class MultiSelectComponent {
|
1058
|
-
constructor() {
|
1103
|
+
constructor(authService, http) {
|
1104
|
+
this.authService = authService;
|
1105
|
+
this.http = http;
|
1059
1106
|
this.label = 'Multi Select';
|
1060
|
-
this.data = []; //
|
1107
|
+
this.data = []; // Accepts an array of generic objects
|
1061
1108
|
this.placeholder = 'Select items';
|
1062
|
-
this.selected = []; //
|
1109
|
+
this.selected = []; // The selected variable should be an array
|
1063
1110
|
this.id = 'multiSelectId';
|
1064
|
-
this.bindLabel = ''; //
|
1065
|
-
this.
|
1066
|
-
this.
|
1067
|
-
this.
|
1068
|
-
this.marginRight = 0;
|
1111
|
+
this.bindLabel = ''; // Generic dynamic label
|
1112
|
+
this.bindValue = ''; // Generic dynamic value
|
1113
|
+
this.closeOnSelect = false; // New property to control dropdown close behavior
|
1114
|
+
this.searchUrl = ''; // URL for backend search
|
1069
1115
|
this.keyupEvent = new EventEmitter();
|
1070
|
-
this.
|
1116
|
+
this.originalData = []; // Store the original list
|
1117
|
+
this.allItems = []; // Store the combined list
|
1118
|
+
this.items = of([]); // Initialization of the property
|
1119
|
+
this.filteredItems = of([]); // Filtered items
|
1120
|
+
this.searchTerms = new Subject(); // For search debounce
|
1121
|
+
this.backendItems = []; // Items found from backend
|
1071
1122
|
this.onChangeCallback = () => { };
|
1072
1123
|
this.onTouchedCallback = () => { };
|
1073
1124
|
this.isCourseEntered = false;
|
1125
|
+
this.compareFn = (item1, item2) => {
|
1126
|
+
return item1 && item2 ? item1[this.bindValue] === item2[this.bindValue] : item1 === item2;
|
1127
|
+
};
|
1074
1128
|
}
|
1075
1129
|
ngOnInit() {
|
1076
|
-
this.
|
1130
|
+
this.originalData = [...this.data]; // Preserve the original data
|
1131
|
+
this.allItems = [...this.data]; // Initialize allItems with the original data
|
1132
|
+
this.items = of(this.allItems);
|
1133
|
+
this.filteredItems = this.searchTerms.pipe(debounceTime(700), startWith(''), // Start with an empty search to load the original list
|
1134
|
+
switchMap(term => this.search(term)));
|
1077
1135
|
}
|
1078
1136
|
onFocus() {
|
1079
1137
|
this.isCourseEntered = true;
|
@@ -1084,6 +1142,66 @@ class MultiSelectComponent {
|
|
1084
1142
|
onKeyUp(event) {
|
1085
1143
|
this.keyupEvent.emit(event);
|
1086
1144
|
}
|
1145
|
+
onSelectedChange(event) {
|
1146
|
+
const newlySelectedItems = event.filter((item) => !this.selected.includes(item));
|
1147
|
+
this.selected = event;
|
1148
|
+
// Check if any newly selected item is from backendItems
|
1149
|
+
const addedFromBackend = this.backendItems.filter((item) => newlySelectedItems.includes(item));
|
1150
|
+
if (addedFromBackend.length > 0) {
|
1151
|
+
// Transform the backend items to match the format expected by the component
|
1152
|
+
const transformedItems = addedFromBackend.map((item) => ({
|
1153
|
+
[this.bindValue]: item[this.bindValue],
|
1154
|
+
[this.bindLabel]: item[this.bindLabel]
|
1155
|
+
}));
|
1156
|
+
// Add backend items to the allItems list and update the observable
|
1157
|
+
this.originalData = [...this.originalData, ...transformedItems];
|
1158
|
+
this.allItems = [...this.originalData];
|
1159
|
+
this.items = of(this.allItems); // Update the observable with new data
|
1160
|
+
this.backendItems = []; // Clear backend items after processing
|
1161
|
+
this.searchTerms.next(''); // Reset the search term to update the list
|
1162
|
+
console.log('Added items from backend to the list and reset the dropdown.');
|
1163
|
+
}
|
1164
|
+
this.onChangeCallback(this.selected);
|
1165
|
+
}
|
1166
|
+
onInputChange(event) {
|
1167
|
+
const input = event.target.value;
|
1168
|
+
this.searchTerms.next(input);
|
1169
|
+
}
|
1170
|
+
search(term) {
|
1171
|
+
if (!term.trim()) {
|
1172
|
+
// If the search term is empty, show the complete list
|
1173
|
+
return of(this.allItems);
|
1174
|
+
}
|
1175
|
+
const filtered = this.allItems.filter((item) => item[this.bindLabel].toLowerCase().includes(term.toLowerCase()));
|
1176
|
+
if (filtered.length > 0) {
|
1177
|
+
console.log('Items filtered locally.');
|
1178
|
+
return of(filtered);
|
1179
|
+
}
|
1180
|
+
else if (this.searchUrl) {
|
1181
|
+
return this.http.get(`${this.searchUrl}?term=${term}`).pipe(map((response) => {
|
1182
|
+
if (response && response.length > 0) {
|
1183
|
+
// Transform the backend items to match the format expected by the component
|
1184
|
+
const transformedItems = response.map((item) => ({
|
1185
|
+
[this.bindValue]: item[this.bindValue],
|
1186
|
+
[this.bindLabel]: item[this.bindLabel]
|
1187
|
+
}));
|
1188
|
+
this.backendItems = transformedItems;
|
1189
|
+
return [...filtered, ...transformedItems];
|
1190
|
+
}
|
1191
|
+
else {
|
1192
|
+
console.log('No items found in the backend search.');
|
1193
|
+
return filtered;
|
1194
|
+
}
|
1195
|
+
}), catchError((error) => {
|
1196
|
+
console.error('Error fetching from backend:', error);
|
1197
|
+
return of(filtered);
|
1198
|
+
}));
|
1199
|
+
}
|
1200
|
+
else {
|
1201
|
+
console.log('No search URL provided and no items found locally.');
|
1202
|
+
return of(filtered);
|
1203
|
+
}
|
1204
|
+
}
|
1087
1205
|
writeValue(value) {
|
1088
1206
|
this.selected = value || [];
|
1089
1207
|
}
|
@@ -1096,31 +1214,47 @@ class MultiSelectComponent {
|
|
1096
1214
|
setDisabledState(isDisabled) {
|
1097
1215
|
// No implementation needed for this example
|
1098
1216
|
}
|
1099
|
-
|
1100
|
-
|
1217
|
+
hasPermission() {
|
1218
|
+
if (!this.permissions || this.permissions.length === 0) {
|
1219
|
+
return true;
|
1220
|
+
}
|
1221
|
+
try {
|
1222
|
+
return this.authService.hasPermission(this.permissions);
|
1223
|
+
}
|
1224
|
+
catch (error) {
|
1225
|
+
if (error instanceof Error) {
|
1226
|
+
console.error('Permission error:', error.message);
|
1227
|
+
}
|
1228
|
+
else {
|
1229
|
+
console.error('Unknown error occurred during permission check');
|
1230
|
+
}
|
1231
|
+
return true;
|
1232
|
+
}
|
1233
|
+
}
|
1234
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiSelectComponent, deps: [{ token: AuthService }, { token: i2.HttpClient }], target: i0.ɵɵFactoryTarget.Component }); }
|
1235
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MultiSelectComponent, selector: "argenta-custom-multi-select", inputs: { label: "label", data: "data", placeholder: "placeholder", selected: "selected", id: "id", bindLabel: "bindLabel", bindValue: "bindValue", permissions: "permissions", closeOnSelect: "closeOnSelect", searchUrl: "searchUrl" }, outputs: { keyupEvent: "keyupEvent" }, providers: [
|
1101
1236
|
{
|
1102
1237
|
provide: NG_VALUE_ACCESSOR,
|
1103
1238
|
useExisting: forwardRef(() => MultiSelectComponent),
|
1104
1239
|
multi: true
|
1105
1240
|
}
|
1106
1241
|
], ngImport: i0, template: `
|
1107
|
-
<div class="form-group"
|
1108
|
-
'margin-top': marginTop + 'rem',
|
1109
|
-
'margin-bottom': marginBottom + 'rem',
|
1110
|
-
'margin-left': marginLeft + 'rem',
|
1111
|
-
'margin-right': marginRight + 'rem'
|
1112
|
-
}">
|
1242
|
+
<div *ngIf="hasPermission()" class="form-group">
|
1113
1243
|
<label [for]="id" class="form-label">{{ label }}</label>
|
1114
1244
|
<ng-select
|
1115
1245
|
[class.course-entry]="isCourseEntered"
|
1116
1246
|
class="ng-select"
|
1117
|
-
[items]="
|
1247
|
+
[items]="filteredItems | async"
|
1118
1248
|
[multiple]="true"
|
1119
|
-
[closeOnSelect]="
|
1249
|
+
[closeOnSelect]="closeOnSelect"
|
1120
1250
|
[hideSelected]="true"
|
1121
1251
|
[bindLabel]="bindLabel"
|
1252
|
+
[bindValue]="bindValue"
|
1122
1253
|
[(ngModel)]="selected"
|
1254
|
+
[compareWith]="compareFn"
|
1255
|
+
(change)="onSelectedChange($event)"
|
1123
1256
|
(keyup)="onKeyUp($event)"
|
1257
|
+
(input)="onInputChange($event)"
|
1124
1258
|
[id]="id"
|
1125
1259
|
[placeholder]="selected && selected.length === 0 ? placeholder : ''"
|
1126
1260
|
(focus)="onFocus()"
|
@@ -1131,28 +1265,27 @@ class MultiSelectComponent {
|
|
1131
1265
|
</ng-template>
|
1132
1266
|
</ng-select>
|
1133
1267
|
</div>
|
1134
|
-
`, isInline: true, styles: [".form-group{font-family:Arial,sans-serif;font-size:1rem}.form-label{font-weight:
|
1268
|
+
`, isInline: true, styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.form-group{font-family:Inter,Arial,sans-serif;font-size:1rem}.form-check-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left}.custom-select{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem 2rem .5rem .5rem;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:none;background-repeat:no-repeat;background-position:right .5rem center}.custom-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem}.form-label{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem}.label-styles{font-weight:400;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}.select-container{position:relative;display:inline-block;width:100%}.select-container lucide-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);pointer-events:none;color:#5e6366}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1135
1269
|
}
|
1136
1270
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiSelectComponent, decorators: [{
|
1137
1271
|
type: Component,
|
1138
|
-
args: [{ selector: '
|
1139
|
-
<div class="form-group"
|
1140
|
-
'margin-top': marginTop + 'rem',
|
1141
|
-
'margin-bottom': marginBottom + 'rem',
|
1142
|
-
'margin-left': marginLeft + 'rem',
|
1143
|
-
'margin-right': marginRight + 'rem'
|
1144
|
-
}">
|
1272
|
+
args: [{ selector: 'argenta-custom-multi-select', template: `
|
1273
|
+
<div *ngIf="hasPermission()" class="form-group">
|
1145
1274
|
<label [for]="id" class="form-label">{{ label }}</label>
|
1146
1275
|
<ng-select
|
1147
1276
|
[class.course-entry]="isCourseEntered"
|
1148
1277
|
class="ng-select"
|
1149
|
-
[items]="
|
1278
|
+
[items]="filteredItems | async"
|
1150
1279
|
[multiple]="true"
|
1151
|
-
[closeOnSelect]="
|
1280
|
+
[closeOnSelect]="closeOnSelect"
|
1152
1281
|
[hideSelected]="true"
|
1153
1282
|
[bindLabel]="bindLabel"
|
1283
|
+
[bindValue]="bindValue"
|
1154
1284
|
[(ngModel)]="selected"
|
1285
|
+
[compareWith]="compareFn"
|
1286
|
+
(change)="onSelectedChange($event)"
|
1155
1287
|
(keyup)="onKeyUp($event)"
|
1288
|
+
(input)="onInputChange($event)"
|
1156
1289
|
[id]="id"
|
1157
1290
|
[placeholder]="selected && selected.length === 0 ? placeholder : ''"
|
1158
1291
|
(focus)="onFocus()"
|
@@ -1169,8 +1302,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1169
1302
|
useExisting: forwardRef(() => MultiSelectComponent),
|
1170
1303
|
multi: true
|
1171
1304
|
}
|
1172
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, styles: [".form-group{font-family:Arial,sans-serif;font-size:1rem}.form-label{font-weight:
|
1173
|
-
}], propDecorators: { label: [{
|
1305
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.form-group{font-family:Inter,Arial,sans-serif;font-size:1rem}.form-check-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left}.custom-select{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem 2rem .5rem .5rem;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:none;background-repeat:no-repeat;background-position:right .5rem center}.custom-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem}.form-label{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem}.label-styles{font-weight:400;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}.select-container{position:relative;display:inline-block;width:100%}.select-container lucide-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);pointer-events:none;color:#5e6366}\n"] }]
|
1306
|
+
}], ctorParameters: function () { return [{ type: AuthService }, { type: i2.HttpClient }]; }, propDecorators: { label: [{
|
1174
1307
|
type: Input
|
1175
1308
|
}], data: [{
|
1176
1309
|
type: Input
|
@@ -1182,13 +1315,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1182
1315
|
type: Input
|
1183
1316
|
}], bindLabel: [{
|
1184
1317
|
type: Input
|
1185
|
-
}],
|
1318
|
+
}], bindValue: [{
|
1186
1319
|
type: Input
|
1187
|
-
}],
|
1320
|
+
}], permissions: [{
|
1188
1321
|
type: Input
|
1189
|
-
}],
|
1322
|
+
}], closeOnSelect: [{
|
1190
1323
|
type: Input
|
1191
|
-
}],
|
1324
|
+
}], searchUrl: [{
|
1192
1325
|
type: Input
|
1193
1326
|
}], keyupEvent: [{
|
1194
1327
|
type: Output
|
@@ -1394,7 +1527,7 @@ class SearchInputComponent {
|
|
1394
1527
|
useExisting: forwardRef(() => SearchInputComponent),
|
1395
1528
|
multi: true
|
1396
1529
|
}
|
1397
|
-
], ngImport: i0, template: "<div class=\"form-group\">\n <label [for]=\"id\" [ngStyle]=\"getLabelStyles()\">{{ label }}</label>\n <input [type]=\"type\"\n class=\"form-control custom-input\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [(ngModel)]=\"value\"\n (input)=\"onInput($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"onKeyup($event)\"\n (keydown)=\"onKeydown($event)\"\n (keypress)=\"onKeypress($event)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [required]=\"required\"\n [attr.pattern]=\"pattern\"\n [autofocus]=\"autofocus\">\n</div>\n", styles: [".form-group{font-family:Inter;font-size:1rem;font-weight:700}.custom-input{font-family:Inter;color:#333;font-size:.9rem;width:227px;height:46px}.custom-input::placeholder{font-size:14px;color:#d3d3d3}label{font-family:Inter;font-size:16px;line-height:19.36px;text-align:left}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type:
|
1530
|
+
], ngImport: i0, template: "<div class=\"form-group\">\n <label [for]=\"id\" [ngStyle]=\"getLabelStyles()\">{{ label }}</label>\n <input [type]=\"type\"\n class=\"form-control custom-input\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [(ngModel)]=\"value\"\n (input)=\"onInput($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"onKeyup($event)\"\n (keydown)=\"onKeydown($event)\"\n (keypress)=\"onKeypress($event)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [required]=\"required\"\n [attr.pattern]=\"pattern\"\n [autofocus]=\"autofocus\">\n</div>\n", styles: [".form-group{font-family:Inter;font-size:1rem;font-weight:700}.custom-input{font-family:Inter;color:#333;font-size:.9rem;width:227px;height:46px}.custom-input::placeholder{font-size:14px;color:#d3d3d3}label{font-family:Inter;font-size:16px;line-height:19.36px;text-align:left}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
1398
1531
|
}
|
1399
1532
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchInputComponent, decorators: [{
|
1400
1533
|
type: Component,
|
@@ -1459,7 +1592,7 @@ class SelectComponent {
|
|
1459
1592
|
this.changeEvent = new EventEmitter();
|
1460
1593
|
this.onChangeCallback = () => { };
|
1461
1594
|
this.onTouchedCallback = () => { };
|
1462
|
-
this.
|
1595
|
+
this.destroy$ = new Subject();
|
1463
1596
|
}
|
1464
1597
|
onSelectChange(event) {
|
1465
1598
|
const selectElement = event.target;
|
@@ -1479,6 +1612,14 @@ class SelectComponent {
|
|
1479
1612
|
setDisabledState(isDisabled) {
|
1480
1613
|
this.disabled = isDisabled;
|
1481
1614
|
}
|
1615
|
+
ngOnChanges(changes) {
|
1616
|
+
if (changes['options'] && changes['options'].currentValue !== changes['options'].previousValue) {
|
1617
|
+
this.updateOptions(changes['options'].currentValue);
|
1618
|
+
}
|
1619
|
+
}
|
1620
|
+
updateOptions(newOptions) {
|
1621
|
+
this.options = newOptions;
|
1622
|
+
}
|
1482
1623
|
hasPermission() {
|
1483
1624
|
if (!this.permissions || this.permissions.length === 0) {
|
1484
1625
|
return true;
|
@@ -1497,7 +1638,8 @@ class SelectComponent {
|
|
1497
1638
|
}
|
1498
1639
|
}
|
1499
1640
|
ngOnDestroy() {
|
1500
|
-
this.
|
1641
|
+
this.destroy$.next();
|
1642
|
+
this.destroy$.complete();
|
1501
1643
|
}
|
1502
1644
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectComponent, deps: [{ token: AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
|
1503
1645
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SelectComponent, selector: "argenta-custom-select", inputs: { label: "label", id: "id", disabled: "disabled", options: "options", permissions: "permissions" }, outputs: { changeEvent: "changeEvent" }, providers: [
|
@@ -1506,7 +1648,7 @@ class SelectComponent {
|
|
1506
1648
|
useExisting: forwardRef(() => SelectComponent),
|
1507
1649
|
multi: true
|
1508
1650
|
}
|
1509
|
-
], ngImport: i0, template: `
|
1651
|
+
], usesOnChanges: true, ngImport: i0, template: `
|
1510
1652
|
<div *ngIf="hasPermission()" class="form-group">
|
1511
1653
|
<label [for]="id" [ngClass]="'label-styles'">{{ label }}</label>
|
1512
1654
|
<div class="select-container">
|
@@ -1520,7 +1662,7 @@ class SelectComponent {
|
|
1520
1662
|
<lucide-icon name="chevron-down" [size]="16" color="#5E6366" [strokeWidth]="1.75"></lucide-icon>
|
1521
1663
|
</div>
|
1522
1664
|
</div>
|
1523
|
-
`, isInline: true, styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.form-group{font-family:Inter,Arial,sans-serif;font-size:1rem;font-weight:700}.form-check-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left}.custom-select{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem 2rem .5rem .5rem;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:none;background-repeat:no-repeat;background-position:right .5rem center}.custom-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem}.form-label{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:700}.label-styles{font-weight:400;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}.select-container{position:relative;display:inline-block;width:100%}.select-container lucide-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);pointer-events:none;color:#5e6366}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type:
|
1665
|
+
`, isInline: true, styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.form-group{font-family:Inter,Arial,sans-serif;font-size:1rem;font-weight:700}.form-check-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left}.custom-select{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem 2rem .5rem .5rem;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:none;background-repeat:no-repeat;background-position:right .5rem center}.custom-input{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:400;border:1px solid #ccc;border-radius:4px;padding:.5rem}.form-label{font-family:Inter,Arial,sans-serif;color:#333;font-size:1rem;font-weight:700}.label-styles{font-weight:400;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}.select-container{position:relative;display:inline-block;width:100%}.select-container lucide-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);pointer-events:none;color:#5e6366}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: i4$1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1524
1666
|
}
|
1525
1667
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectComponent, decorators: [{
|
1526
1668
|
type: Component,
|
@@ -1735,11 +1877,11 @@ class DataTableComponent {
|
|
1735
1877
|
this.onButtonClick.emit(); // Emitindo o evento
|
1736
1878
|
}
|
1737
1879
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: AuthService }, { token: RefreshService }], target: i0.ɵɵFactoryTarget.Component }); }
|
1738
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataTableComponent, selector: "argenta-list-data-table", inputs: { columns: "columns", hiddenColumns: "hiddenColumns", defaultItemsPerPage: "defaultItemsPerPage", itemsPerPageLabel: "itemsPerPageLabel", showActionColumn: "showActionColumn", actionColumnLabel: "actionColumnLabel", totalItems: "totalItems", fetchDataFunction: "fetchDataFunction", editPermissions: "editPermissions", deletePermissions: "deletePermissions", viewPermissions: "viewPermissions", showPageInfo: "showPageInfo", pageText: "pageText", ofText: "ofText", filterDescription: "filterDescription", buttonLabel: "buttonLabel" }, outputs: { sortChange: "sortChange", pageChange: "pageChange", itemsPerPageChange: "itemsPerPageChange", onEditTable: "onEditTable", onDeleteTable: "onDeleteTable", onViewTable: "onViewTable", onButtonClick: "onButtonClick" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"data-table-header\" style=\"margin-top: 2.5rem;\">\n <div class=\"left-section\">\n <div class=\"form-group\">\n <label for=\"itemsPerPageSelect\" class=\"items-per-page-label\">{{ itemsPerPageLabel }}</label>\n <select\n id=\"itemsPerPageSelect\"\n class=\"form-control form-control-sm d-inline-block w-auto custom-select\"\n [(ngModel)]=\"defaultItemsPerPage\"\n (ngModelChange)=\"onItemsPerPageChange()\">\n <option *ngFor=\"let option of itemsPerPageOptions\" [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n </div>\n <div class=\"right-section\">\n <button class=\"custom-button\" (click)=\"onNewButtonClick()\">\n <lucide-icon name=\"plus\" [size]=\"28\" [strokeWidth]=\"1.75\"></lucide-icon>\n {{ buttonLabel }}\n </button>\n </div>\n</div>\n\n<div class=\"search-input-container\">\n <argenta-search-input id=\"search\" label=\"\" placeholder=\"
|
1880
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataTableComponent, selector: "argenta-list-data-table", inputs: { columns: "columns", hiddenColumns: "hiddenColumns", defaultItemsPerPage: "defaultItemsPerPage", itemsPerPageLabel: "itemsPerPageLabel", showActionColumn: "showActionColumn", actionColumnLabel: "actionColumnLabel", totalItems: "totalItems", fetchDataFunction: "fetchDataFunction", editPermissions: "editPermissions", deletePermissions: "deletePermissions", viewPermissions: "viewPermissions", showPageInfo: "showPageInfo", pageText: "pageText", ofText: "ofText", filterDescription: "filterDescription", buttonLabel: "buttonLabel" }, outputs: { sortChange: "sortChange", pageChange: "pageChange", itemsPerPageChange: "itemsPerPageChange", onEditTable: "onEditTable", onDeleteTable: "onDeleteTable", onViewTable: "onViewTable", onButtonClick: "onButtonClick" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"data-table-header\" style=\"margin-top: 2.5rem;\">\n <div class=\"left-section\">\n <div class=\"form-group\">\n <label for=\"itemsPerPageSelect\" class=\"items-per-page-label\">{{ itemsPerPageLabel }}</label>\n <select\n id=\"itemsPerPageSelect\"\n class=\"form-control form-control-sm d-inline-block w-auto custom-select\"\n [(ngModel)]=\"defaultItemsPerPage\"\n (ngModelChange)=\"onItemsPerPageChange()\">\n <option *ngFor=\"let option of itemsPerPageOptions\" [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n </div>\n <div class=\"right-section\">\n <button class=\"custom-button\" (click)=\"onNewButtonClick()\">\n <lucide-icon name=\"plus\" [size]=\"28\" [strokeWidth]=\"1.75\"></lucide-icon>\n {{ buttonLabel }}\n </button>\n </div>\n</div>\n\n<div class=\"search-input-container\">\n <argenta-search-input id=\"search\" label=\"\" placeholder=\"Buscar\" [(ngModel)]=\"filterDescription\" (search)=\"onSearch($event)\"></argenta-search-input>\n</div>\n\n<div class=\"table-responsive\" style=\"margin-top: 1rem;\">\n <table class=\"table table-hover\">\n <thead>\n <tr>\n <ng-container *ngFor=\"let column of columns\">\n <th *ngIf=\"!isColumnHidden(column.prop)\" (click)=\"onSort(column.prop)\">\n {{ column.label }}\n </th>\n </ng-container>\n <th *ngIf=\"showActionColumn\" class=\"text-end\" style=\"padding-right: 6.3rem;\">{{ actionColumnLabel }}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of pagedData; let i = index\">\n <ng-container *ngFor=\"let column of columns\">\n <td *ngIf=\"!isColumnHidden(column.prop)\">\n {{ item[column.prop] }}\n </td>\n </ng-container>\n <td *ngIf=\"showActionColumn\" class=\"text-end\">\n <div class=\"d-flex justify-content-end\">\n <div *ngIf=\"hasPermission(editPermissions) && onEditTable.observers.length > 0\" (click)=\"handleAction('edit', item, i)\" class=\"clickable-icon\" style=\"margin-right: 1.5rem;\">\n <lucide-icon name=\"square-pen\" [size]=\"20\" color=\"#2CA58D\" [strokeWidth]=\"1.75\"></lucide-icon>\n </div>\n <div *ngIf=\"hasPermission(viewPermissions) && onViewTable.observers.length > 0\" (click)=\"handleAction('view', item, i)\" class=\"clickable-icon\" style=\"margin-right: 1.5rem;\">\n <lucide-icon name=\"user-round\" [size]=\"20\" color=\"#2CA58D\" [strokeWidth]=\"1.75\"></lucide-icon>\n </div>\n <div *ngIf=\"hasPermission(deletePermissions) && onDeleteTable.observers.length > 0\" (click)=\"handleAction('delete', item, i)\" class=\"clickable-icon\" style=\"margin-right: 1.5rem;\">\n <i-lucide name=\"trash-2\" [size]=\"20\" color=\"#F26E6E\" [strokeWidth]=\"1.75\"></i-lucide>\n </div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"text-center pagination-controls\">\n <custom-pagination\n [totalItems]=\"totalItems\"\n [itemsPerPage]=\"defaultItemsPerPage\"\n [currentPage]=\"currentPage\"\n [showPageInfo]=\"showPageInfo\"\n (pageChange)=\"onPageChange($event)\">\n </custom-pagination>\n</div>\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.clickable-icon{cursor:pointer}:host{font-family:Inter,Arial,sans-serif}.data-table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:-.2rem}.left-section,.right-section{display:flex;align-items:center}.search-input-container{display:flex;justify-content:flex-start}.left-section .form-group{display:flex;align-items:center}.items-per-page-label{font-family:Inter,Arial,sans-serif;font-size:14px;color:#666;margin-right:.2rem}.custom-select{font-family:Inter,Arial,sans-serif;font-size:14px;color:#666;background:#fff url('data:image/svg+xml;charset=US-ASCII,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 4 5\"><path fill=\"#666\" d=\"M2 0L0 2h4L2 0zM2 5l2-2H0l2 2z\"/></svg>') no-repeat right .75rem center/8px 10px;border:1px solid #ccc;border-radius:.25rem;padding:.375rem 1.75rem .375rem .75rem;appearance:none;-webkit-appearance:none;-moz-appearance:none}.custom-select:focus{border-color:#80bdff;outline:0;box-shadow:0 0 0 .2rem #007bff40}.table{font-family:Inter,Arial,sans-serif;font-size:var(--table-font-size, 14px);color:var(--table-font-color, #737B7B);border-collapse:separate;border-spacing:0;border-radius:8px;overflow:hidden}.table thead tr{height:60px}.table thead th{background-color:#00444c;color:#fff;font-family:Inter,Arial,sans-serif;font-size:13px;font-weight:600;padding:10px;border-bottom:.1rem solid #dcdcdc;text-align:center;line-height:2.5}.table thead th:first-child{text-align:left;padding-left:1.4rem}.table tbody td{font-family:Inter,Arial,sans-serif;font-size:14px;color:#737b7b;padding:10px;border-bottom:.1rem solid #dcdcdc;text-align:center}.table tbody td:first-child{text-align:left;padding-left:1.4rem}.table tbody tr:last-child td{border-bottom:.1rem solid #dcdcdc}.table tbody td{border-right:none;border-left:none}.table thead th:first-child{border-top-left-radius:0}.table thead th:last-child{border-top-right-radius:0}.table tbody tr:last-child td:first-child{border-bottom-left-radius:0}.table tbody tr:last-child td:last-child{border-bottom-right-radius:0}.btn-icon{width:24px;height:24px;background-size:cover;display:inline-block;cursor:pointer;margin-right:16px}.pagination-controls{display:flex;justify-content:center;align-items:center;margin-top:1rem}.custom-button{display:flex;align-items:center;padding:.5rem 1rem .5rem .5rem;border-radius:.25rem;transition:background-color .3s,border-color .3s,filter .3s;font-family:Inter,sans-serif;font-size:16px;font-weight:600;height:40px;letter-spacing:.005em;text-align:left;color:#fff;background-color:#2ca58d;border:none;cursor:pointer}.custom-button lucide-icon{margin-right:.5rem}.custom-button:hover{background-color:#217d6b}.custom-button:active{background-color:#3acaae}.custom-button:focus{outline:none;box-shadow:0 0 0 .2rem #2ca58d40}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "component", type: CustomPaginationComponent, selector: "custom-pagination", inputs: ["totalItems", "itemsPerPage", "currentPage", "showPageInfo"], outputs: ["pageChange"] }, { kind: "component", type: SearchInputComponent, selector: "argenta-search-input", inputs: ["id", "label", "type", "placeholder", "value", "disabled", "readonly", "autofocus", "maxlength", "minlength", "required", "pattern", "debounceTime"], outputs: ["search", "inputChange", "change", "focus", "blur", "keyup", "keydown", "keypress"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1739
1881
|
}
|
1740
1882
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataTableComponent, decorators: [{
|
1741
1883
|
type: Component,
|
1742
|
-
args: [{ selector: 'argenta-list-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"data-table-header\" style=\"margin-top: 2.5rem;\">\n <div class=\"left-section\">\n <div class=\"form-group\">\n <label for=\"itemsPerPageSelect\" class=\"items-per-page-label\">{{ itemsPerPageLabel }}</label>\n <select\n id=\"itemsPerPageSelect\"\n class=\"form-control form-control-sm d-inline-block w-auto custom-select\"\n [(ngModel)]=\"defaultItemsPerPage\"\n (ngModelChange)=\"onItemsPerPageChange()\">\n <option *ngFor=\"let option of itemsPerPageOptions\" [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n </div>\n <div class=\"right-section\">\n <button class=\"custom-button\" (click)=\"onNewButtonClick()\">\n <lucide-icon name=\"plus\" [size]=\"28\" [strokeWidth]=\"1.75\"></lucide-icon>\n {{ buttonLabel }}\n </button>\n </div>\n</div>\n\n<div class=\"search-input-container\">\n <argenta-search-input id=\"search\" label=\"\" placeholder=\"
|
1884
|
+
args: [{ selector: 'argenta-list-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"data-table-header\" style=\"margin-top: 2.5rem;\">\n <div class=\"left-section\">\n <div class=\"form-group\">\n <label for=\"itemsPerPageSelect\" class=\"items-per-page-label\">{{ itemsPerPageLabel }}</label>\n <select\n id=\"itemsPerPageSelect\"\n class=\"form-control form-control-sm d-inline-block w-auto custom-select\"\n [(ngModel)]=\"defaultItemsPerPage\"\n (ngModelChange)=\"onItemsPerPageChange()\">\n <option *ngFor=\"let option of itemsPerPageOptions\" [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n </div>\n <div class=\"right-section\">\n <button class=\"custom-button\" (click)=\"onNewButtonClick()\">\n <lucide-icon name=\"plus\" [size]=\"28\" [strokeWidth]=\"1.75\"></lucide-icon>\n {{ buttonLabel }}\n </button>\n </div>\n</div>\n\n<div class=\"search-input-container\">\n <argenta-search-input id=\"search\" label=\"\" placeholder=\"Buscar\" [(ngModel)]=\"filterDescription\" (search)=\"onSearch($event)\"></argenta-search-input>\n</div>\n\n<div class=\"table-responsive\" style=\"margin-top: 1rem;\">\n <table class=\"table table-hover\">\n <thead>\n <tr>\n <ng-container *ngFor=\"let column of columns\">\n <th *ngIf=\"!isColumnHidden(column.prop)\" (click)=\"onSort(column.prop)\">\n {{ column.label }}\n </th>\n </ng-container>\n <th *ngIf=\"showActionColumn\" class=\"text-end\" style=\"padding-right: 6.3rem;\">{{ actionColumnLabel }}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of pagedData; let i = index\">\n <ng-container *ngFor=\"let column of columns\">\n <td *ngIf=\"!isColumnHidden(column.prop)\">\n {{ item[column.prop] }}\n </td>\n </ng-container>\n <td *ngIf=\"showActionColumn\" class=\"text-end\">\n <div class=\"d-flex justify-content-end\">\n <div *ngIf=\"hasPermission(editPermissions) && onEditTable.observers.length > 0\" (click)=\"handleAction('edit', item, i)\" class=\"clickable-icon\" style=\"margin-right: 1.5rem;\">\n <lucide-icon name=\"square-pen\" [size]=\"20\" color=\"#2CA58D\" [strokeWidth]=\"1.75\"></lucide-icon>\n </div>\n <div *ngIf=\"hasPermission(viewPermissions) && onViewTable.observers.length > 0\" (click)=\"handleAction('view', item, i)\" class=\"clickable-icon\" style=\"margin-right: 1.5rem;\">\n <lucide-icon name=\"user-round\" [size]=\"20\" color=\"#2CA58D\" [strokeWidth]=\"1.75\"></lucide-icon>\n </div>\n <div *ngIf=\"hasPermission(deletePermissions) && onDeleteTable.observers.length > 0\" (click)=\"handleAction('delete', item, i)\" class=\"clickable-icon\" style=\"margin-right: 1.5rem;\">\n <i-lucide name=\"trash-2\" [size]=\"20\" color=\"#F26E6E\" [strokeWidth]=\"1.75\"></i-lucide>\n </div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"text-center pagination-controls\">\n <custom-pagination\n [totalItems]=\"totalItems\"\n [itemsPerPage]=\"defaultItemsPerPage\"\n [currentPage]=\"currentPage\"\n [showPageInfo]=\"showPageInfo\"\n (pageChange)=\"onPageChange($event)\">\n </custom-pagination>\n</div>\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\";body{font-family:Inter,sans-serif}.clickable-icon{cursor:pointer}:host{font-family:Inter,Arial,sans-serif}.data-table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:-.2rem}.left-section,.right-section{display:flex;align-items:center}.search-input-container{display:flex;justify-content:flex-start}.left-section .form-group{display:flex;align-items:center}.items-per-page-label{font-family:Inter,Arial,sans-serif;font-size:14px;color:#666;margin-right:.2rem}.custom-select{font-family:Inter,Arial,sans-serif;font-size:14px;color:#666;background:#fff url('data:image/svg+xml;charset=US-ASCII,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 4 5\"><path fill=\"#666\" d=\"M2 0L0 2h4L2 0zM2 5l2-2H0l2 2z\"/></svg>') no-repeat right .75rem center/8px 10px;border:1px solid #ccc;border-radius:.25rem;padding:.375rem 1.75rem .375rem .75rem;appearance:none;-webkit-appearance:none;-moz-appearance:none}.custom-select:focus{border-color:#80bdff;outline:0;box-shadow:0 0 0 .2rem #007bff40}.table{font-family:Inter,Arial,sans-serif;font-size:var(--table-font-size, 14px);color:var(--table-font-color, #737B7B);border-collapse:separate;border-spacing:0;border-radius:8px;overflow:hidden}.table thead tr{height:60px}.table thead th{background-color:#00444c;color:#fff;font-family:Inter,Arial,sans-serif;font-size:13px;font-weight:600;padding:10px;border-bottom:.1rem solid #dcdcdc;text-align:center;line-height:2.5}.table thead th:first-child{text-align:left;padding-left:1.4rem}.table tbody td{font-family:Inter,Arial,sans-serif;font-size:14px;color:#737b7b;padding:10px;border-bottom:.1rem solid #dcdcdc;text-align:center}.table tbody td:first-child{text-align:left;padding-left:1.4rem}.table tbody tr:last-child td{border-bottom:.1rem solid #dcdcdc}.table tbody td{border-right:none;border-left:none}.table thead th:first-child{border-top-left-radius:0}.table thead th:last-child{border-top-right-radius:0}.table tbody tr:last-child td:first-child{border-bottom-left-radius:0}.table tbody tr:last-child td:last-child{border-bottom-right-radius:0}.btn-icon{width:24px;height:24px;background-size:cover;display:inline-block;cursor:pointer;margin-right:16px}.pagination-controls{display:flex;justify-content:center;align-items:center;margin-top:1rem}.custom-button{display:flex;align-items:center;padding:.5rem 1rem .5rem .5rem;border-radius:.25rem;transition:background-color .3s,border-color .3s,filter .3s;font-family:Inter,sans-serif;font-size:16px;font-weight:600;height:40px;letter-spacing:.005em;text-align:left;color:#fff;background-color:#2ca58d;border:none;cursor:pointer}.custom-button lucide-icon{margin-right:.5rem}.custom-button:hover{background-color:#217d6b}.custom-button:active{background-color:#3acaae}.custom-button:focus{outline:none;box-shadow:0 0 0 .2rem #2ca58d40}\n"] }]
|
1743
1885
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: AuthService }, { type: RefreshService }]; }, propDecorators: { columns: [{
|
1744
1886
|
type: Input
|
1745
1887
|
}], hiddenColumns: [{
|
@@ -2034,7 +2176,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2034
2176
|
// Select some icons (use an object, not an array)
|
2035
2177
|
class LucideIconsModule {
|
2036
2178
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LucideIconsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
2037
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: LucideIconsModule, imports: [i4.LucideAngularModule], exports: [LucideAngularModule] }); }
|
2179
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: LucideIconsModule, imports: [i4$1.LucideAngularModule], exports: [LucideAngularModule] }); }
|
2038
2180
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LucideIconsModule, imports: [LucideAngularModule.pick(icons), LucideAngularModule] }); }
|
2039
2181
|
}
|
2040
2182
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LucideIconsModule, decorators: [{
|
@@ -2065,7 +2207,8 @@ class ComponentsModule {
|
|
2065
2207
|
TreeNodeComponent,
|
2066
2208
|
SearchInputComponent,
|
2067
2209
|
AppBackgroundComponent,
|
2068
|
-
BasicRegistrationComponent
|
2210
|
+
BasicRegistrationComponent,
|
2211
|
+
CustomSwitchComponent], imports: [CommonModule,
|
2069
2212
|
FormsModule,
|
2070
2213
|
ReactiveFormsModule,
|
2071
2214
|
NgSelectModule,
|
@@ -2090,7 +2233,8 @@ class ComponentsModule {
|
|
2090
2233
|
SearchInputComponent,
|
2091
2234
|
LucideIconsModule,
|
2092
2235
|
AppBackgroundComponent,
|
2093
|
-
BasicRegistrationComponent
|
2236
|
+
BasicRegistrationComponent,
|
2237
|
+
CustomSwitchComponent] }); }
|
2094
2238
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ComponentsModule, imports: [CommonModule,
|
2095
2239
|
FormsModule,
|
2096
2240
|
ReactiveFormsModule,
|
@@ -2123,6 +2267,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2123
2267
|
SearchInputComponent,
|
2124
2268
|
AppBackgroundComponent,
|
2125
2269
|
BasicRegistrationComponent,
|
2270
|
+
CustomSwitchComponent,
|
2126
2271
|
],
|
2127
2272
|
imports: [
|
2128
2273
|
CommonModule,
|
@@ -2154,6 +2299,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2154
2299
|
LucideIconsModule,
|
2155
2300
|
AppBackgroundComponent,
|
2156
2301
|
BasicRegistrationComponent,
|
2302
|
+
CustomSwitchComponent,
|
2157
2303
|
],
|
2158
2304
|
}]
|
2159
2305
|
}] });
|
@@ -2242,7 +2388,7 @@ class DataPaginateService {
|
|
2242
2388
|
};
|
2243
2389
|
}));
|
2244
2390
|
}
|
2245
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataPaginateService, deps: [{ token:
|
2391
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataPaginateService, deps: [{ token: i2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
2246
2392
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataPaginateService, providedIn: 'root' }); }
|
2247
2393
|
}
|
2248
2394
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataPaginateService, decorators: [{
|
@@ -2250,7 +2396,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2250
2396
|
args: [{
|
2251
2397
|
providedIn: 'root'
|
2252
2398
|
}]
|
2253
|
-
}], ctorParameters: function () { return [{ type:
|
2399
|
+
}], ctorParameters: function () { return [{ type: i2.HttpClient }]; } });
|
2254
2400
|
|
2255
2401
|
class RouterParameterService {
|
2256
2402
|
constructor() {
|
@@ -2315,5 +2461,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2315
2461
|
* Generated bundle index. Do not edit.
|
2316
2462
|
*/
|
2317
2463
|
|
2318
|
-
export { AlertComponent, AppBackgroundComponent, BadgeComponent, BasicRegistrationComponent, ButtonClasses, ButtonComponent, CardComponent, CheckboxComponent, CodeHighlightComponent, ComponentsModule, ConfirmationComponent, ConfirmationService, CustomPaginationComponent, DataPaginateService, DataTableComponent, InputComponent, LibPortalAngularModule, LucideIconsModule, MultiSelectComponent, NotificationService, RadioComponent, RefreshService, RouterParameterService, SearchInputComponent, SelectComponent, TextareaComponent, TreeNodeComponent };
|
2464
|
+
export { AlertComponent, AppBackgroundComponent, BadgeComponent, BasicRegistrationComponent, ButtonClasses, ButtonComponent, CardComponent, CheckboxComponent, CodeHighlightComponent, ComponentsModule, ConfirmationComponent, ConfirmationService, CustomPaginationComponent, CustomSwitchComponent, DataPaginateService, DataTableComponent, InputComponent, LibPortalAngularModule, LucideIconsModule, MultiSelectComponent, NotificationService, RadioComponent, RefreshService, RouterParameterService, SearchInputComponent, SelectComponent, TextareaComponent, TreeNodeComponent };
|
2319
2465
|
//# sourceMappingURL=lib-portal-angular.mjs.map
|