@eo4geo/ngx-bok-utils 1.3.21 → 1.3.23
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.
|
@@ -4,7 +4,7 @@ import * as i0 from '@angular/core';
|
|
|
4
4
|
import { EventEmitter, Output, Input, Component, inject, Injectable, HostListener } from '@angular/core';
|
|
5
5
|
import * as i1 from 'primeng/toolbar';
|
|
6
6
|
import { ToolbarModule } from 'primeng/toolbar';
|
|
7
|
-
import * as
|
|
7
|
+
import * as i3 from 'primeng/button';
|
|
8
8
|
import { ButtonModule } from 'primeng/button';
|
|
9
9
|
import * as i4$1 from 'primeng/tieredmenu';
|
|
10
10
|
import { TieredMenuModule } from 'primeng/tieredmenu';
|
|
@@ -14,7 +14,7 @@ import { AvatarGroupModule } from 'primeng/avatargroup';
|
|
|
14
14
|
import { ReplaySubject, concatMap, of, Observable, from, take, filter, Subject, forkJoin, first, map, catchError, finalize } from 'rxjs';
|
|
15
15
|
import * as i6 from 'primeng/inputtext';
|
|
16
16
|
import { InputTextModule } from 'primeng/inputtext';
|
|
17
|
-
import * as i3 from 'primeng/dialog';
|
|
17
|
+
import * as i3$1 from 'primeng/dialog';
|
|
18
18
|
import { DialogModule } from 'primeng/dialog';
|
|
19
19
|
import * as i7 from 'primeng/floatlabel';
|
|
20
20
|
import { FloatLabelModule } from 'primeng/floatlabel';
|
|
@@ -27,21 +27,21 @@ import { IconFieldModule } from 'primeng/iconfield';
|
|
|
27
27
|
import { Message } from 'primeng/message';
|
|
28
28
|
import { Auth, user, signInWithEmailAndPassword, createUserWithEmailAndPassword, signInWithPopup, GoogleAuthProvider, sendPasswordResetEmail, signOut, updateProfile, authState } from '@angular/fire/auth';
|
|
29
29
|
import { Firestore, collection, doc, getDoc, setDoc, updateDoc, docData, query, where, getDocs, collectionData, deleteDoc } from '@angular/fire/firestore';
|
|
30
|
-
import * as i2
|
|
30
|
+
import * as i2 from '@angular/router';
|
|
31
31
|
import { Router } from '@angular/router';
|
|
32
|
-
import * as
|
|
32
|
+
import * as i9 from 'primeng/toast';
|
|
33
33
|
import { ToastModule } from 'primeng/toast';
|
|
34
|
-
import * as i2$
|
|
34
|
+
import * as i2$1 from 'primeng/api';
|
|
35
35
|
import { MessageService, ConfirmationService } from 'primeng/api';
|
|
36
|
-
import * as
|
|
36
|
+
import * as i5$2 from 'primeng/card';
|
|
37
37
|
import { CardModule } from 'primeng/card';
|
|
38
|
-
import * as i9 from 'primeng/accordion';
|
|
38
|
+
import * as i9$1 from 'primeng/accordion';
|
|
39
39
|
import { AccordionModule } from 'primeng/accordion';
|
|
40
|
-
import * as
|
|
40
|
+
import * as i7$2 from 'primeng/select';
|
|
41
41
|
import { SelectModule } from 'primeng/select';
|
|
42
42
|
import * as i14 from 'primeng/confirmdialog';
|
|
43
43
|
import { ConfirmDialogModule } from 'primeng/confirmdialog';
|
|
44
|
-
import * as
|
|
44
|
+
import * as i9$2 from 'primeng/tooltip';
|
|
45
45
|
import { TooltipModule } from 'primeng/tooltip';
|
|
46
46
|
import * as i6$2 from 'primeng/table';
|
|
47
47
|
import { TableModule } from 'primeng/table';
|
|
@@ -65,11 +65,11 @@ class FooterComponent {
|
|
|
65
65
|
this.openCopyright.emit();
|
|
66
66
|
}
|
|
67
67
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
68
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: FooterComponent, isStandalone: true, selector: "footer", inputs: { copyright: "copyright" }, outputs: { openReleaseNotes: "openReleaseNotes", openUserManual: "openUserManual", openCopyright: "openCopyright" }, ngImport: i0, template: "<div class=\"footer\">\r\n <p-toolbar [style]=\"{'color': 'white', 'background': 'none', 'border': '0px', 'gap': '3rem'}\">\r\n <ng-template #start>\r\n <div class=\"flex flex-column align-items-center gap-1\">\r\n <div class=\"inline\">\r\n <a href=\"http://www.eo4geo.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/EO4GEO_LOGO_WHITE.png\" alt=\"LogoEO4GEO\"></a>\r\n <a href=\"https://www.spacesuite-project.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/SpaceSUITE_horizontal_white.png\" alt=\"LogoSpaceSUITE\"></a>\r\n </div>\r\n <span style=\"font-size: x-small;\">All tools were developed by <a href=\"https://geotec.uji.es/\" target=\"_blank\">GEOTEC</a></span>\r\n </div>\r\n </ng-template>\r\n <ng-template #center>\r\n <div style=\"font-size: smaller;\" class=\"flex flex-wrap gap-1\">\r\n <span>\u00A9 2025 spaceSUITE</span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickUserManual()\">User Manual</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickReleaseNotes()\">Release Notes</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"mailto:eo4geo@gmail.com?subject=EO4GEO%20Tools%20Contact\">Contact</a>\r\n </span>\r\n <span *ngIf=\"copyright\" class=\"link-separator\">\r\n | <a (click)=\"clickCopyright()\">Copyright</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"https://www.spacesuite-project.eu/privacy-policy/\" target=\"_blank\">Privacy Policy</a>\r\n </span>\r\n </div>\r\n </ng-template>\r\n <ng-template #end>\r\n <div class=\"flex flex-column align-items-center gap-1 max-w-20rem\">\r\n <img class=\"logo\" src=\"assets/images/EU_Funding.png\" alt=\"LogoEU\">\r\n <span class=\"white-space-normal\" style=\"font-size: xx-small;\">Views and opinions expressed are however those of the author(s) only and do not necessarily reflect those of the European Union or the European Education and Culture Executive Agency (EACEA). Neither the European Union nor EACEA can be held responsible for them.</span>\r\n </div>\r\n </ng-template>\r\n </p-toolbar>\r\n</div>", styles: [".footer{background-color:var(--primary-color);color:#fff;padding:1.25rem;position:relative;bottom:0;left:0;width:100%}.footer a{color:gray;cursor:pointer;text-decoration:none}.footer a:hover{color:#fff}.logo{width:auto;height:2vw;margin:1rem;min-height:40px}.toolbar{background:var(--primary-color)!important;color:#fff!important;border:0px!important}.link-separator{color:gray}.link-separator:hover{color:var(--hover-color);cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i1.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
68
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: FooterComponent, isStandalone: true, selector: "footer", inputs: { copyright: "copyright" }, outputs: { openReleaseNotes: "openReleaseNotes", openUserManual: "openUserManual", openCopyright: "openCopyright" }, ngImport: i0, template: "<div class=\"footer\">\r\n <p-toolbar [style]=\"{'color': 'white', 'background': 'none', 'border': '0px', 'gap': '3rem'}\">\r\n <ng-template #start>\r\n <div class=\"flex flex-column align-items-center gap-1\">\r\n <div class=\"inline\">\r\n <a href=\"http://www.eo4geo.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/EO4GEO_LOGO_WHITE.png\" alt=\"LogoEO4GEO\"></a>\r\n <a href=\"https://www.spacesuite-project.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/SpaceSUITE_horizontal_white.png\" alt=\"LogoSpaceSUITE\"></a>\r\n </div>\r\n <span style=\"font-size: x-small;\">All tools were developed by <a href=\"https://geotec.uji.es/\" target=\"_blank\">GEOTEC</a></span>\r\n </div>\r\n </ng-template>\r\n <ng-template #center>\r\n <div style=\"font-size: smaller;\" class=\"flex flex-wrap gap-1\">\r\n <span>\u00A9 2025 spaceSUITE</span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickUserManual()\">User Manual</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickReleaseNotes()\">Release Notes</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"mailto:eo4geo@gmail.com?subject=EO4GEO%20Tools%20Contact\">Contact</a>\r\n </span>\r\n <span *ngIf=\"copyright\" class=\"link-separator\">\r\n | <a (click)=\"clickCopyright()\">License & Copyright</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"https://www.spacesuite-project.eu/privacy-policy/\" target=\"_blank\">Privacy Policy</a>\r\n </span>\r\n </div>\r\n </ng-template>\r\n <ng-template #end>\r\n <div class=\"flex flex-column align-items-center gap-1 max-w-20rem\">\r\n <img class=\"logo\" src=\"assets/images/EU_Funding.png\" alt=\"LogoEU\">\r\n <span class=\"white-space-normal\" style=\"font-size: xx-small;\">Views and opinions expressed are however those of the author(s) only and do not necessarily reflect those of the European Union or the European Education and Culture Executive Agency (EACEA). Neither the European Union nor EACEA can be held responsible for them.</span>\r\n </div>\r\n </ng-template>\r\n </p-toolbar>\r\n</div>", styles: [".footer{background-color:var(--primary-color);color:#fff;padding:1.25rem;position:relative;bottom:0;left:0;width:100%}.footer a{color:gray;cursor:pointer;text-decoration:none}.footer a:hover{color:#fff}.logo{width:auto;height:2vw;margin:1rem;min-height:40px}.toolbar{background:var(--primary-color)!important;color:#fff!important;border:0px!important}.link-separator{color:gray}.link-separator:hover{color:var(--hover-color);cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i1.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
69
69
|
}
|
|
70
70
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: FooterComponent, decorators: [{
|
|
71
71
|
type: Component,
|
|
72
|
-
args: [{ standalone: true, selector: 'footer', imports: [ToolbarModule, CommonModule], template: "<div class=\"footer\">\r\n <p-toolbar [style]=\"{'color': 'white', 'background': 'none', 'border': '0px', 'gap': '3rem'}\">\r\n <ng-template #start>\r\n <div class=\"flex flex-column align-items-center gap-1\">\r\n <div class=\"inline\">\r\n <a href=\"http://www.eo4geo.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/EO4GEO_LOGO_WHITE.png\" alt=\"LogoEO4GEO\"></a>\r\n <a href=\"https://www.spacesuite-project.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/SpaceSUITE_horizontal_white.png\" alt=\"LogoSpaceSUITE\"></a>\r\n </div>\r\n <span style=\"font-size: x-small;\">All tools were developed by <a href=\"https://geotec.uji.es/\" target=\"_blank\">GEOTEC</a></span>\r\n </div>\r\n </ng-template>\r\n <ng-template #center>\r\n <div style=\"font-size: smaller;\" class=\"flex flex-wrap gap-1\">\r\n <span>\u00A9 2025 spaceSUITE</span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickUserManual()\">User Manual</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickReleaseNotes()\">Release Notes</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"mailto:eo4geo@gmail.com?subject=EO4GEO%20Tools%20Contact\">Contact</a>\r\n </span>\r\n <span *ngIf=\"copyright\" class=\"link-separator\">\r\n | <a (click)=\"clickCopyright()\">Copyright</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"https://www.spacesuite-project.eu/privacy-policy/\" target=\"_blank\">Privacy Policy</a>\r\n </span>\r\n </div>\r\n </ng-template>\r\n <ng-template #end>\r\n <div class=\"flex flex-column align-items-center gap-1 max-w-20rem\">\r\n <img class=\"logo\" src=\"assets/images/EU_Funding.png\" alt=\"LogoEU\">\r\n <span class=\"white-space-normal\" style=\"font-size: xx-small;\">Views and opinions expressed are however those of the author(s) only and do not necessarily reflect those of the European Union or the European Education and Culture Executive Agency (EACEA). Neither the European Union nor EACEA can be held responsible for them.</span>\r\n </div>\r\n </ng-template>\r\n </p-toolbar>\r\n</div>", styles: [".footer{background-color:var(--primary-color);color:#fff;padding:1.25rem;position:relative;bottom:0;left:0;width:100%}.footer a{color:gray;cursor:pointer;text-decoration:none}.footer a:hover{color:#fff}.logo{width:auto;height:2vw;margin:1rem;min-height:40px}.toolbar{background:var(--primary-color)!important;color:#fff!important;border:0px!important}.link-separator{color:gray}.link-separator:hover{color:var(--hover-color);cursor:default}\n"] }]
|
|
72
|
+
args: [{ standalone: true, selector: 'footer', imports: [ToolbarModule, CommonModule], template: "<div class=\"footer\">\r\n <p-toolbar [style]=\"{'color': 'white', 'background': 'none', 'border': '0px', 'gap': '3rem'}\">\r\n <ng-template #start>\r\n <div class=\"flex flex-column align-items-center gap-1\">\r\n <div class=\"inline\">\r\n <a href=\"http://www.eo4geo.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/EO4GEO_LOGO_WHITE.png\" alt=\"LogoEO4GEO\"></a>\r\n <a href=\"https://www.spacesuite-project.eu/\" target=\"_blank\"><img class=\"logo\" src=\"assets/images/SpaceSUITE_horizontal_white.png\" alt=\"LogoSpaceSUITE\"></a>\r\n </div>\r\n <span style=\"font-size: x-small;\">All tools were developed by <a href=\"https://geotec.uji.es/\" target=\"_blank\">GEOTEC</a></span>\r\n </div>\r\n </ng-template>\r\n <ng-template #center>\r\n <div style=\"font-size: smaller;\" class=\"flex flex-wrap gap-1\">\r\n <span>\u00A9 2025 spaceSUITE</span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickUserManual()\">User Manual</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a (click)=\"clickReleaseNotes()\">Release Notes</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"mailto:eo4geo@gmail.com?subject=EO4GEO%20Tools%20Contact\">Contact</a>\r\n </span>\r\n <span *ngIf=\"copyright\" class=\"link-separator\">\r\n | <a (click)=\"clickCopyright()\">License & Copyright</a>\r\n </span>\r\n <span class=\"link-separator\">\r\n | <a href=\"https://www.spacesuite-project.eu/privacy-policy/\" target=\"_blank\">Privacy Policy</a>\r\n </span>\r\n </div>\r\n </ng-template>\r\n <ng-template #end>\r\n <div class=\"flex flex-column align-items-center gap-1 max-w-20rem\">\r\n <img class=\"logo\" src=\"assets/images/EU_Funding.png\" alt=\"LogoEU\">\r\n <span class=\"white-space-normal\" style=\"font-size: xx-small;\">Views and opinions expressed are however those of the author(s) only and do not necessarily reflect those of the European Union or the European Education and Culture Executive Agency (EACEA). Neither the European Union nor EACEA can be held responsible for them.</span>\r\n </div>\r\n </ng-template>\r\n </p-toolbar>\r\n</div>", styles: [".footer{background-color:var(--primary-color);color:#fff;padding:1.25rem;position:relative;bottom:0;left:0;width:100%}.footer a{color:gray;cursor:pointer;text-decoration:none}.footer a:hover{color:#fff}.logo{width:auto;height:2vw;margin:1rem;min-height:40px}.toolbar{background:var(--primary-color)!important;color:#fff!important;border:0px!important}.link-separator{color:gray}.link-separator:hover{color:var(--hover-color);cursor:default}\n"] }]
|
|
73
73
|
}], propDecorators: { openReleaseNotes: [{
|
|
74
74
|
type: Output
|
|
75
75
|
}], openUserManual: [{
|
|
@@ -329,7 +329,7 @@ class SessionModalComponent {
|
|
|
329
329
|
}
|
|
330
330
|
}
|
|
331
331
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SessionModalComponent, deps: [{ token: UserService }], target: i0.ɵɵFactoryTarget.Component });
|
|
332
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: SessionModalComponent, isStandalone: true, selector: "sessionModal", inputs: { visible: "visible" }, outputs: { visibleChange: "visibleChange" }, usesOnChanges: true, ngImport: i0, template: "<p-dialog [header]=\"getHeader()\" [modal]=\"true\" [visible]=\"visible\" resizable=\"false\" (visibleChange)=\"visibleChange.emit($event)\" [style]=\"{color: 'var(--primary-color)'}\">\r\n <p-message *ngIf=\"error\" severity=\"error\" variant=\"simple\" styleClass=\"mb-4 white-space-normal\" class=\"error-info\">{{error}}</p-message>\r\n <div class=\"flex items-center gap-4 mt-2 mb-1\">\r\n <p-floatlabel variant=\"on\" [class]=\"error ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-user\" />\r\n <input pInputText id=\"email\" autocomplete=\"off\" [class]=\"error ? 'custom-input error-input' : 'custom-input'\" [(ngModel)]=\"email\"/>\r\n </p-iconfield>\r\n <label for=\"email\">Email</label>\r\n </p-floatlabel>\r\n </div>\r\n <div *ngIf=\"!resetpassword\" class=\"flex items-center gap-4 mt-4 mb-1\">\r\n <p-floatlabel variant=\"on\" [class]=\"error ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-lock\" />\r\n <input [type]=\"showPassword ? 'text' : 'password'\" pInputText id=\"password\" autocomplete=\"off\" [class]=\"error ? 'custom-input error-input' : 'custom-input'\" [(ngModel)]=\"password\"/>\r\n <i [class]=\"showPassword ? 'eye-icon pi pi-eye-slash' : 'eye-icon pi pi-eye'\" (click)=\"showPassword = !showPassword\"></i>\r\n </p-iconfield>\r\n <label for=\"password\">Password</label>\r\n </p-floatlabel>\r\n </div>\r\n <div *ngIf=\"!login\" class=\"flex items-center gap-4 mt-4 mb-1\">\r\n <p-floatlabel variant=\"on\" [class]=\"error ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-lock\" />\r\n <input [type]=\"showRepeatPassword ? 'text' : 'password'\" pInputText id=\"rPassword\" autocomplete=\"off\" [class]=\"error ? 'custom-input error-input' : 'custom-input'\" [(ngModel)]=\"repeatPassword\"/>\r\n <i [class]=\"showRepeatPassword ? 'eye-icon pi pi-eye-slash' : 'eye-icon pi pi-eye'\" (click)=\"showRepeatPassword = !showRepeatPassword\"></i>\r\n </p-iconfield>\r\n <label for=\"rPassword\">Repeat Password</label>\r\n </p-floatlabel>\r\n </div>\r\n <a *ngIf=\"login && !resetpassword\" class=\"inline-flex ml-2 text-sm\" (click)=\"resetpassword = !resetpassword; error = null;\">Forgot Password?</a>\r\n <div class=\"flex align-items-center justify-content-between gap-2 mt-4\">\r\n <div class=\"flex justify-end gap-2\">\r\n <p-button class=\"custom-button\" [label]=\"getHeader()\" (click)=\"clickMainButton()\" />\r\n <p-button severity=\"secondary\" class=\"custom-secondary-button\" [label]=\"getSwitchLabel()\" (click)=\"clickSwitchButton()\" />\r\n </div>\r\n <p-button *ngIf=\"!resetpassword\" class=\"custom-button\" icon=\"pi pi-google\" label=\"Google\" (click)=\"loginWithGoogle()\" />\r\n </div>\r\n</p-dialog>", styles: [".custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color);min-width:100%;max-width:22rem!important}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color);min-width:100%}.custom-secondary-button{--p-button-secondary-hover-color: var(--primary-color);--p-button-secondary-active-color: var(--primary-color)}.custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}a{cursor:pointer}a:hover{color:var(--hover-color)}.error-info{--p-message-error-simple-color: var(--danger-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}.eye-icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);cursor:pointer;color:#94a3b8}.eye-icon:hover{color:var(--hover-color)}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type:
|
|
332
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: SessionModalComponent, isStandalone: true, selector: "sessionModal", inputs: { visible: "visible" }, outputs: { visibleChange: "visibleChange" }, usesOnChanges: true, ngImport: i0, template: "<p-dialog [header]=\"getHeader()\" [modal]=\"true\" [visible]=\"visible\" resizable=\"false\" (visibleChange)=\"visibleChange.emit($event)\" [style]=\"{color: 'var(--primary-color)'}\">\r\n <p-message *ngIf=\"error\" severity=\"error\" variant=\"simple\" styleClass=\"mb-4 white-space-normal\" class=\"error-info\">{{error}}</p-message>\r\n <div class=\"flex items-center gap-4 mt-2 mb-1\">\r\n <p-floatlabel variant=\"on\" [class]=\"error ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-user\" />\r\n <input pInputText id=\"email\" autocomplete=\"off\" [class]=\"error ? 'custom-input error-input' : 'custom-input'\" [(ngModel)]=\"email\"/>\r\n </p-iconfield>\r\n <label for=\"email\">Email</label>\r\n </p-floatlabel>\r\n </div>\r\n <div *ngIf=\"!resetpassword\" class=\"flex items-center gap-4 mt-4 mb-1\">\r\n <p-floatlabel variant=\"on\" [class]=\"error ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-lock\" />\r\n <input [type]=\"showPassword ? 'text' : 'password'\" pInputText id=\"password\" autocomplete=\"off\" [class]=\"error ? 'custom-input error-input' : 'custom-input'\" [(ngModel)]=\"password\"/>\r\n <i [class]=\"showPassword ? 'eye-icon pi pi-eye-slash' : 'eye-icon pi pi-eye'\" (click)=\"showPassword = !showPassword\"></i>\r\n </p-iconfield>\r\n <label for=\"password\">Password</label>\r\n </p-floatlabel>\r\n </div>\r\n <div *ngIf=\"!login\" class=\"flex items-center gap-4 mt-4 mb-1\">\r\n <p-floatlabel variant=\"on\" [class]=\"error ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-lock\" />\r\n <input [type]=\"showRepeatPassword ? 'text' : 'password'\" pInputText id=\"rPassword\" autocomplete=\"off\" [class]=\"error ? 'custom-input error-input' : 'custom-input'\" [(ngModel)]=\"repeatPassword\"/>\r\n <i [class]=\"showRepeatPassword ? 'eye-icon pi pi-eye-slash' : 'eye-icon pi pi-eye'\" (click)=\"showRepeatPassword = !showRepeatPassword\"></i>\r\n </p-iconfield>\r\n <label for=\"rPassword\">Repeat Password</label>\r\n </p-floatlabel>\r\n </div>\r\n <a *ngIf=\"login && !resetpassword\" class=\"inline-flex ml-2 text-sm\" (click)=\"resetpassword = !resetpassword; error = null;\">Forgot Password?</a>\r\n <div class=\"flex align-items-center justify-content-between gap-2 mt-4\">\r\n <div class=\"flex justify-end gap-2\">\r\n <p-button class=\"custom-button\" [label]=\"getHeader()\" (click)=\"clickMainButton()\" />\r\n <p-button severity=\"secondary\" class=\"custom-secondary-button\" [label]=\"getSwitchLabel()\" (click)=\"clickSwitchButton()\" />\r\n </div>\r\n <p-button *ngIf=\"!resetpassword\" class=\"custom-button\" icon=\"pi pi-google\" label=\"Google\" (click)=\"loginWithGoogle()\" />\r\n </div>\r\n</p-dialog>", styles: [".custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color);min-width:100%;max-width:22rem!important}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color);min-width:100%}.custom-secondary-button{--p-button-secondary-hover-color: var(--primary-color);--p-button-secondary-active-color: var(--primary-color)}.custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}a{cursor:pointer}a:hover{color:var(--hover-color)}.error-info{--p-message-error-simple-color: var(--danger-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}.eye-icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);cursor:pointer;color:#94a3b8}.eye-icon:hover{color:var(--hover-color)}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i3$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i7.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }] });
|
|
333
333
|
}
|
|
334
334
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SessionModalComponent, decorators: [{
|
|
335
335
|
type: Component,
|
|
@@ -469,6 +469,7 @@ class HeaderComponent {
|
|
|
469
469
|
}
|
|
470
470
|
async logout() {
|
|
471
471
|
await this.userService.logout();
|
|
472
|
+
this.navigateToMainPage();
|
|
472
473
|
}
|
|
473
474
|
clickout(event) {
|
|
474
475
|
if (!event.target.closest("p-tieredmenu") && !event.target.closest("p-button.custom-header-button")) {
|
|
@@ -478,13 +479,13 @@ class HeaderComponent {
|
|
|
478
479
|
navigateToMainPage() {
|
|
479
480
|
this.router.navigate(['']);
|
|
480
481
|
}
|
|
481
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: HeaderComponent, deps: [{ token: UserService }, { token: i2
|
|
482
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: HeaderComponent, isStandalone: true, selector: "header", inputs: { items: "items", toolName: "toolName", login: "login" }, outputs: { profileClick: "profileClick", organizationClick: "organizationClick" }, host: { listeners: { "document:click": "clickout($event)" } }, ngImport: i0, template: "<div class=\"header\">\r\n <div class=\"flex align-content-center p-4 mx-4\">\r\n <a (click)=\"navigateToMainPage()\" class=\"align-self-center\"><img class=\"logo flex align-items-center justify-content-center\" src=\"assets/images/SpaceSUITE_horizontal_color.png\" alt=\"LogoSpaceSUITE\"></a>\r\n <div class=\"hidden xl:flex align-self-center fixed-text\">\r\n <strong class=\"text-2xl overflow-hidden white-space-nowrap text-overflow-ellipsis\" style=\"cursor: pointer;\" (click)=\"navigateToMainPage()\">\r\n {{toolName}}\r\n </strong>\r\n </div>\r\n <div class=\"flex gap-6 ml-auto\">\r\n <div class=\"justify-content-center hidden md:flex\" *ngFor=\"let item of items;\">\r\n <div class=\"flex align-items-center justify-content-center gap-2 text-xl font-bold header-option\" (click)=\"subMenu.toggle($event)\" *ngIf=\"item.label != 'Share'; else share\">\r\n <i [class]=\"item.icon\"></i>\r\n <div>{{item.label}}</div>\r\n <i *ngIf=\"item.items\" class=\"pi pi-angle-down\"></i>\r\n </div>\r\n <p-tieredmenu #subMenu [model]=\"item.items\" [breakpoint]=\"'767px'\" class=\"custom-p-tieredmenu\" [popup]=\"true\" />\r\n <ng-template #share>\r\n <div class=\"flex align-items-center justify-content-center gap-3\">\r\n <div *ngFor=\"let social of item.items;\">\r\n <a [href]=\"social.url\" target=\"_blank\" class=\"flex\">\r\n <i [class]=\"social.icon\" style=\"font-size: 1.25rem\"></i>\r\n </a>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"login\" class=\"hidden md:flex align-items-center justify-content-center\">\r\n <p-avatar *ngIf=\"logged; else loginButton\" [label]=\"nameInitial\" class=\"custom-p-avatar\" shape=\"circle\" (click)=\"userMenu.toggle($event)\"></p-avatar>\r\n </div>\r\n <p-tieredmenu #userMenu [model]=\"userItems\" [breakpoint]=\"'767px'\" class=\"custom-p-tieredmenu\" [popup]=\"true\" />\r\n <ng-template #loginButton>\r\n <p-button class=\"custom-header-button\" size=\"small\" label=\"Login\" aria-label=\"Login\" (onClick)=\"showLoginModal = !showLoginModal\"></p-button>\r\n </ng-template>\r\n </div>\r\n \r\n <p-button #menuButton (click)=\"hideMenu = !hideMenu\" class=\"md:hidden flex align-items-center custom-header-button ml-auto\" icon=\"pi pi-bars\" aria-label=\"Menu\"></p-button>\r\n </div>\r\n <p-tieredmenu #menu [hidden]=\"hideMenu\" [model]=\"buttonItems\" class=\"md:hidden custom-p-tieredmenu\"/>\r\n</div>\r\n\r\n<sessionModal [(visible)]=\"showLoginModal\"></sessionModal>\r\n", styles: [".header{background-color:#fff;color:var(--primary-color);position:relative;top:0;left:0;width:100%}.header:after{content:\"\";position:absolute;bottom:0;left:2rem;right:2rem;height:1px;background-color:#0000001a}.header a{color:var(--primary-color);cursor:pointer;text-decoration:none}.header a:hover{color:var(--hover-color)}.logo{width:auto;height:50px}.custom-header-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.header-option:hover{color:var(--hover-color);cursor:pointer}.custom-p-tieredmenu{--p-tieredmenu-item-icon-color: var(--primary-color);--p-tieredmenu-item-icon-active-color: var(--hover-color);--p-tieredmenu-item-icon-focus-color: var(--hover-color);--p-tieredmenu-item-color: var(--primary-color);--p-tieredmenu-item-active-color: var(--hover-color);--p-tieredmenu-item-focus-color: var(--hover-color)}.custom-p-avatar{color:var(--primary-color);cursor:pointer}.custom-p-avatar:hover{color:var(--hover-color)}.fixed-text{position:absolute;left:50%;transform:translate(-50%);z-index:10;max-width:20%}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type:
|
|
482
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: HeaderComponent, deps: [{ token: UserService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
483
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: HeaderComponent, isStandalone: true, selector: "header", inputs: { items: "items", toolName: "toolName", login: "login" }, outputs: { profileClick: "profileClick", organizationClick: "organizationClick" }, host: { listeners: { "document:click": "clickout($event)" } }, ngImport: i0, template: "<div class=\"header\">\r\n <div class=\"flex align-content-center p-4 mx-4\">\r\n <a (click)=\"navigateToMainPage()\" class=\"align-self-center\"><img class=\"logo flex align-items-center justify-content-center\" src=\"assets/images/SpaceSUITE_horizontal_color.png\" alt=\"LogoSpaceSUITE\"></a>\r\n <div class=\"hidden xl:flex align-self-center fixed-text\">\r\n <strong class=\"text-2xl overflow-hidden white-space-nowrap text-overflow-ellipsis\" style=\"cursor: pointer;\" (click)=\"navigateToMainPage()\">\r\n {{toolName}}\r\n </strong>\r\n </div>\r\n <div class=\"flex gap-6 ml-auto\">\r\n <div class=\"justify-content-center hidden md:flex\" *ngFor=\"let item of items;\">\r\n <div class=\"flex align-items-center justify-content-center gap-2 text-xl font-bold header-option\" (click)=\"subMenu.toggle($event)\" *ngIf=\"item.label != 'Share'; else share\">\r\n <i [class]=\"item.icon\"></i>\r\n <div>{{item.label}}</div>\r\n <i *ngIf=\"item.items\" class=\"pi pi-angle-down\"></i>\r\n </div>\r\n <p-tieredmenu #subMenu [model]=\"item.items\" [breakpoint]=\"'767px'\" class=\"custom-p-tieredmenu\" [popup]=\"true\" />\r\n <ng-template #share>\r\n <div class=\"flex align-items-center justify-content-center gap-3\">\r\n <div *ngFor=\"let social of item.items;\">\r\n <a [href]=\"social.url\" target=\"_blank\" class=\"flex\">\r\n <i [class]=\"social.icon\" style=\"font-size: 1.25rem\"></i>\r\n </a>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"login\" class=\"hidden md:flex align-items-center justify-content-center\">\r\n <p-avatar *ngIf=\"logged; else loginButton\" [label]=\"nameInitial\" class=\"custom-p-avatar\" shape=\"circle\" (click)=\"userMenu.toggle($event)\"></p-avatar>\r\n </div>\r\n <p-tieredmenu #userMenu [model]=\"userItems\" [breakpoint]=\"'767px'\" class=\"custom-p-tieredmenu\" [popup]=\"true\" />\r\n <ng-template #loginButton>\r\n <p-button class=\"custom-header-button\" size=\"small\" label=\"Login\" aria-label=\"Login\" (onClick)=\"showLoginModal = !showLoginModal\"></p-button>\r\n </ng-template>\r\n </div>\r\n \r\n <p-button #menuButton (click)=\"hideMenu = !hideMenu\" class=\"md:hidden flex align-items-center custom-header-button ml-auto\" icon=\"pi pi-bars\" aria-label=\"Menu\"></p-button>\r\n </div>\r\n <p-tieredmenu #menu [hidden]=\"hideMenu\" [model]=\"buttonItems\" class=\"md:hidden custom-p-tieredmenu\"/>\r\n</div>\r\n\r\n<sessionModal [(visible)]=\"showLoginModal\"></sessionModal>\r\n", styles: [".header{background-color:#fff;color:var(--primary-color);position:relative;top:0;left:0;width:100%}.header:after{content:\"\";position:absolute;bottom:0;left:2rem;right:2rem;height:1px;background-color:#0000001a}.header a{color:var(--primary-color);cursor:pointer;text-decoration:none}.header a:hover{color:var(--hover-color)}.logo{width:auto;height:50px}.custom-header-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.header-option:hover{color:var(--hover-color);cursor:pointer}.custom-p-tieredmenu{--p-tieredmenu-item-icon-color: var(--primary-color);--p-tieredmenu-item-icon-active-color: var(--hover-color);--p-tieredmenu-item-icon-focus-color: var(--hover-color);--p-tieredmenu-item-color: var(--primary-color);--p-tieredmenu-item-active-color: var(--hover-color);--p-tieredmenu-item-focus-color: var(--hover-color)}.custom-p-avatar{color:var(--primary-color);cursor:pointer}.custom-p-avatar:hover{color:var(--hover-color)}.fixed-text{position:absolute;left:50%;transform:translate(-50%);z-index:10;max-width:20%}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TieredMenuModule }, { kind: "component", type: i4$1.TieredMenu, selector: "p-tieredMenu, p-tieredmenu, p-tiered-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "breakpoint", "autoZIndex", "baseZIndex", "autoDisplay", "showTransitionOptions", "hideTransitionOptions", "id", "ariaLabel", "ariaLabelledBy", "disabled", "tabindex"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i6$1.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "style", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: AvatarGroupModule }, { kind: "component", type: SessionModalComponent, selector: "sessionModal", inputs: ["visible"], outputs: ["visibleChange"] }] });
|
|
483
484
|
}
|
|
484
485
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
485
486
|
type: Component,
|
|
486
487
|
args: [{ standalone: true, selector: 'header', imports: [ButtonModule, TieredMenuModule, CommonModule, AvatarModule, AvatarGroupModule, SessionModalComponent], template: "<div class=\"header\">\r\n <div class=\"flex align-content-center p-4 mx-4\">\r\n <a (click)=\"navigateToMainPage()\" class=\"align-self-center\"><img class=\"logo flex align-items-center justify-content-center\" src=\"assets/images/SpaceSUITE_horizontal_color.png\" alt=\"LogoSpaceSUITE\"></a>\r\n <div class=\"hidden xl:flex align-self-center fixed-text\">\r\n <strong class=\"text-2xl overflow-hidden white-space-nowrap text-overflow-ellipsis\" style=\"cursor: pointer;\" (click)=\"navigateToMainPage()\">\r\n {{toolName}}\r\n </strong>\r\n </div>\r\n <div class=\"flex gap-6 ml-auto\">\r\n <div class=\"justify-content-center hidden md:flex\" *ngFor=\"let item of items;\">\r\n <div class=\"flex align-items-center justify-content-center gap-2 text-xl font-bold header-option\" (click)=\"subMenu.toggle($event)\" *ngIf=\"item.label != 'Share'; else share\">\r\n <i [class]=\"item.icon\"></i>\r\n <div>{{item.label}}</div>\r\n <i *ngIf=\"item.items\" class=\"pi pi-angle-down\"></i>\r\n </div>\r\n <p-tieredmenu #subMenu [model]=\"item.items\" [breakpoint]=\"'767px'\" class=\"custom-p-tieredmenu\" [popup]=\"true\" />\r\n <ng-template #share>\r\n <div class=\"flex align-items-center justify-content-center gap-3\">\r\n <div *ngFor=\"let social of item.items;\">\r\n <a [href]=\"social.url\" target=\"_blank\" class=\"flex\">\r\n <i [class]=\"social.icon\" style=\"font-size: 1.25rem\"></i>\r\n </a>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"login\" class=\"hidden md:flex align-items-center justify-content-center\">\r\n <p-avatar *ngIf=\"logged; else loginButton\" [label]=\"nameInitial\" class=\"custom-p-avatar\" shape=\"circle\" (click)=\"userMenu.toggle($event)\"></p-avatar>\r\n </div>\r\n <p-tieredmenu #userMenu [model]=\"userItems\" [breakpoint]=\"'767px'\" class=\"custom-p-tieredmenu\" [popup]=\"true\" />\r\n <ng-template #loginButton>\r\n <p-button class=\"custom-header-button\" size=\"small\" label=\"Login\" aria-label=\"Login\" (onClick)=\"showLoginModal = !showLoginModal\"></p-button>\r\n </ng-template>\r\n </div>\r\n \r\n <p-button #menuButton (click)=\"hideMenu = !hideMenu\" class=\"md:hidden flex align-items-center custom-header-button ml-auto\" icon=\"pi pi-bars\" aria-label=\"Menu\"></p-button>\r\n </div>\r\n <p-tieredmenu #menu [hidden]=\"hideMenu\" [model]=\"buttonItems\" class=\"md:hidden custom-p-tieredmenu\"/>\r\n</div>\r\n\r\n<sessionModal [(visible)]=\"showLoginModal\"></sessionModal>\r\n", styles: [".header{background-color:#fff;color:var(--primary-color);position:relative;top:0;left:0;width:100%}.header:after{content:\"\";position:absolute;bottom:0;left:2rem;right:2rem;height:1px;background-color:#0000001a}.header a{color:var(--primary-color);cursor:pointer;text-decoration:none}.header a:hover{color:var(--hover-color)}.logo{width:auto;height:50px}.custom-header-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.header-option:hover{color:var(--hover-color);cursor:pointer}.custom-p-tieredmenu{--p-tieredmenu-item-icon-color: var(--primary-color);--p-tieredmenu-item-icon-active-color: var(--hover-color);--p-tieredmenu-item-icon-focus-color: var(--hover-color);--p-tieredmenu-item-color: var(--primary-color);--p-tieredmenu-item-active-color: var(--hover-color);--p-tieredmenu-item-focus-color: var(--hover-color)}.custom-p-avatar{color:var(--primary-color);cursor:pointer}.custom-p-avatar:hover{color:var(--hover-color)}.fixed-text{position:absolute;left:50%;transform:translate(-50%);z-index:10;max-width:20%}\n"] }]
|
|
487
|
-
}], ctorParameters: () => [{ type: UserService }, { type: i2
|
|
488
|
+
}], ctorParameters: () => [{ type: UserService }, { type: i2.Router }], propDecorators: { items: [{
|
|
488
489
|
type: Input
|
|
489
490
|
}], toolName: [{
|
|
490
491
|
type: Input
|
|
@@ -507,28 +508,24 @@ class NotFoundPageComponent {
|
|
|
507
508
|
goToHomepage() {
|
|
508
509
|
this.router.navigate(['']);
|
|
509
510
|
}
|
|
510
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: NotFoundPageComponent, deps: [{ token: i2
|
|
511
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: NotFoundPageComponent, isStandalone: true, selector: "not-found-page", ngImport: i0, template: "<div class=\"flex flex-column justify-content-center align-items-center m-8\">\r\n <img src=\"assets/images/hosting-404-error-1.png\" alt=\"not Found\" class=\"w-4 m-4\">\r\n <h1>page not found</h1>\r\n <p-button label=\"Go To Homepage\" size=\"large\" class=\"custom-button\" (onClick)=\"goToHomepage()\"></p-button>\r\n</div>", styles: [".custom-button{--p-button-primary-color: white;--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type:
|
|
511
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: NotFoundPageComponent, deps: [{ token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
512
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: NotFoundPageComponent, isStandalone: true, selector: "not-found-page", ngImport: i0, template: "<div class=\"flex flex-column justify-content-center align-items-center m-8\">\r\n <img src=\"assets/images/hosting-404-error-1.png\" alt=\"not Found\" class=\"w-4 m-4\">\r\n <h1>page not found</h1>\r\n <p-button label=\"Go To Homepage\" size=\"large\" class=\"custom-button\" (onClick)=\"goToHomepage()\"></p-button>\r\n</div>", styles: [".custom-button{--p-button-primary-color: white;--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }] });
|
|
512
513
|
}
|
|
513
514
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: NotFoundPageComponent, decorators: [{
|
|
514
515
|
type: Component,
|
|
515
516
|
args: [{ standalone: true, selector: 'not-found-page', imports: [ButtonModule], template: "<div class=\"flex flex-column justify-content-center align-items-center m-8\">\r\n <img src=\"assets/images/hosting-404-error-1.png\" alt=\"not Found\" class=\"w-4 m-4\">\r\n <h1>page not found</h1>\r\n <p-button label=\"Go To Homepage\" size=\"large\" class=\"custom-button\" (onClick)=\"goToHomepage()\"></p-button>\r\n</div>", styles: [".custom-button{--p-button-primary-color: white;--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}\n"] }]
|
|
516
|
-
}], ctorParameters: () => [{ type: i2
|
|
517
|
+
}], ctorParameters: () => [{ type: i2.Router }] });
|
|
517
518
|
|
|
518
519
|
class UserPageComponent {
|
|
519
520
|
userService;
|
|
520
521
|
messageService;
|
|
521
|
-
router;
|
|
522
522
|
userSubscription;
|
|
523
|
-
loggedSubscription;
|
|
524
|
-
logged = false;
|
|
525
523
|
email = "";
|
|
526
524
|
name = "";
|
|
527
525
|
newName = "";
|
|
528
|
-
constructor(userService, messageService
|
|
526
|
+
constructor(userService, messageService) {
|
|
529
527
|
this.userService = userService;
|
|
530
528
|
this.messageService = messageService;
|
|
531
|
-
this.router = router;
|
|
532
529
|
}
|
|
533
530
|
ngOnInit() {
|
|
534
531
|
this.userSubscription = this.userService.getNameAndEmail().subscribe(userData => {
|
|
@@ -536,15 +533,9 @@ class UserPageComponent {
|
|
|
536
533
|
this.name = userData?.name ?? '';
|
|
537
534
|
this.newName = this.name;
|
|
538
535
|
});
|
|
539
|
-
this.loggedSubscription = this.userService.getUserState().pipe(filter(value => value != undefined)).subscribe(({ logged }) => {
|
|
540
|
-
this.logged = logged;
|
|
541
|
-
if (!logged)
|
|
542
|
-
this.router.navigate(['']);
|
|
543
|
-
});
|
|
544
536
|
}
|
|
545
537
|
ngOnDestroy() {
|
|
546
538
|
this.userSubscription?.unsubscribe();
|
|
547
|
-
this.loggedSubscription?.unsubscribe();
|
|
548
539
|
}
|
|
549
540
|
async updateName() {
|
|
550
541
|
try {
|
|
@@ -567,13 +558,13 @@ class UserPageComponent {
|
|
|
567
558
|
});
|
|
568
559
|
}
|
|
569
560
|
}
|
|
570
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: UserPageComponent, deps: [{ token: UserService }, { token: i2$
|
|
571
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: UserPageComponent, isStandalone: true, selector: "user-page", providers: [MessageService], ngImport: i0, template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<div class=\"flex flex-column align-items-center justify-content-center p-4\">\r\n <h2>User Profile</h2>\r\n <div class=\"flex gap-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"email\" [disabled]=\"true\" autocomplete=\"off\" class=\"w-full max-w-25rem custom-input\" [(ngModel)]=\"email\"/>\r\n </p-iconfield>\r\n <label for=\"email\">Email</label>\r\n </p-floatlabel>\r\n </div>\r\n <div class=\"flex gap-4 mt-4 mb-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-user\" />\r\n <input pInputText id=\"password\" [disabled]=\"
|
|
561
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: UserPageComponent, deps: [{ token: UserService }, { token: i2$1.MessageService }], target: i0.ɵɵFactoryTarget.Component });
|
|
562
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: UserPageComponent, isStandalone: true, selector: "user-page", providers: [MessageService], ngImport: i0, template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<div class=\"flex flex-column align-items-center justify-content-center p-4\">\r\n <h2>User Profile</h2>\r\n <div class=\"flex gap-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"email\" [disabled]=\"true\" autocomplete=\"off\" class=\"w-full max-w-25rem custom-input\" [(ngModel)]=\"email\"/>\r\n </p-iconfield>\r\n <label for=\"email\">Email</label>\r\n </p-floatlabel>\r\n </div>\r\n <div class=\"flex gap-4 mt-4 mb-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-user\" />\r\n <input pInputText id=\"password\" [disabled]=\"email == ''\" autocomplete=\"off\" class=\"w-full max-w-25rem custom-input\" [(ngModel)]=\"newName\"/>\r\n </p-iconfield>\r\n <label for=\"password\">Name</label>\r\n </p-floatlabel>\r\n </div>\r\n <p-button class=\"custom-button\" label=\"Update Name\" [disabled]=\"name == newName || email == ''\" (click)=\"updateName()\" />\r\n</div>", styles: [".custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.custom-secondary-button{--p-button-secondary-hover-color: var(--primary-color);--p-button-secondary-active-color: var(--primary-color)}.custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}a{cursor:pointer}a:hover{color:var(--hover-color)}.custom-toast{--p-toast-info-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-info-border-color: var(--secondary-color);--p-toast-info-color: var(--secondary-color);--p-toast-info-detail-color: var(--primary-color);--p-toast-error-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-error-border-color: var(--danger-color);--p-toast-error-color: var(--danger-color);--p-toast-error-detail-color: var(--primary-color)}::ng-deep .p-toast-close-button .p-button-label{font-size:0}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i7.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i9.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }] });
|
|
572
563
|
}
|
|
573
564
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: UserPageComponent, decorators: [{
|
|
574
565
|
type: Component,
|
|
575
|
-
args: [{ standalone: true, selector: 'user-page', imports: [ButtonModule, InputIconModule, IconFieldModule, InputTextModule, FloatLabelModule, FormsModule, CommonModule, ToastModule], providers: [MessageService], template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<div class=\"flex flex-column align-items-center justify-content-center p-4\">\r\n <h2>User Profile</h2>\r\n <div class=\"flex gap-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"email\" [disabled]=\"true\" autocomplete=\"off\" class=\"w-full max-w-25rem custom-input\" [(ngModel)]=\"email\"/>\r\n </p-iconfield>\r\n <label for=\"email\">Email</label>\r\n </p-floatlabel>\r\n </div>\r\n <div class=\"flex gap-4 mt-4 mb-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-user\" />\r\n <input pInputText id=\"password\" [disabled]=\"
|
|
576
|
-
}], ctorParameters: () => [{ type: UserService }, { type: i2$
|
|
566
|
+
args: [{ standalone: true, selector: 'user-page', imports: [ButtonModule, InputIconModule, IconFieldModule, InputTextModule, FloatLabelModule, FormsModule, CommonModule, ToastModule], providers: [MessageService], template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<div class=\"flex flex-column align-items-center justify-content-center p-4\">\r\n <h2>User Profile</h2>\r\n <div class=\"flex gap-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"email\" [disabled]=\"true\" autocomplete=\"off\" class=\"w-full max-w-25rem custom-input\" [(ngModel)]=\"email\"/>\r\n </p-iconfield>\r\n <label for=\"email\">Email</label>\r\n </p-floatlabel>\r\n </div>\r\n <div class=\"flex gap-4 mt-4 mb-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-user\" />\r\n <input pInputText id=\"password\" [disabled]=\"email == ''\" autocomplete=\"off\" class=\"w-full max-w-25rem custom-input\" [(ngModel)]=\"newName\"/>\r\n </p-iconfield>\r\n <label for=\"password\">Name</label>\r\n </p-floatlabel>\r\n </div>\r\n <p-button class=\"custom-button\" label=\"Update Name\" [disabled]=\"name == newName || email == ''\" (click)=\"updateName()\" />\r\n</div>", styles: [".custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.custom-secondary-button{--p-button-secondary-hover-color: var(--primary-color);--p-button-secondary-active-color: var(--primary-color)}.custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}a{cursor:pointer}a:hover{color:var(--hover-color)}.custom-toast{--p-toast-info-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-info-border-color: var(--secondary-color);--p-toast-info-color: var(--secondary-color);--p-toast-info-detail-color: var(--primary-color);--p-toast-error-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-error-border-color: var(--danger-color);--p-toast-error-color: var(--danger-color);--p-toast-error-detail-color: var(--primary-color)}::ng-deep .p-toast-close-button .p-button-label{font-size:0}\n"] }]
|
|
567
|
+
}], ctorParameters: () => [{ type: UserService }, { type: i2$1.MessageService }] });
|
|
577
568
|
|
|
578
569
|
class OrganizationFormComponent {
|
|
579
570
|
organization;
|
|
@@ -612,7 +603,7 @@ class OrganizationFormComponent {
|
|
|
612
603
|
this.formChange.emit(updateInfo);
|
|
613
604
|
}
|
|
614
605
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
615
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: OrganizationFormComponent, isStandalone: true, selector: "organization-form", inputs: { organization: "organization", descriptionError: "descriptionError", buttonLabel: "buttonLabel", validationFunction: "validationFunction" }, outputs: { formChange: "formChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-column gap-4 m-2 mb-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-pencil\" />\r\n <input pInputText id=\"name\" autocomplete=\"off\" class=\"w-full custom-input\" (ngModelChange)=\"descriptionError = false;\"\r\n [ngClass]=\"descriptionError ? 'error-input' : ''\" [(ngModel)]=\"newName\"/>\r\n </p-iconfield>\r\n <label for=\"name\">Name</label>\r\n </p-floatlabel>\r\n\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield class=\"textarea-iconfield\">\r\n <p-inputicon class=\"pi pi-align-justify\"></p-inputicon>\r\n <textarea id=\"description\" rows=\"5\" cols=\"30\" pTextarea [(ngModel)]=\"newDescription\" (ngModelChange)=\"descriptionError = false;\"\r\n style=\"resize: none;\" class=\"w-full custom-textarea\" [ngClass]=\"descriptionError ? 'error-textarea' : ''\"></textarea>\r\n </p-iconfield>\r\n <label for=\"description\">Description</label>\r\n </p-floatlabel>\r\n\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"contact\" autocomplete=\"off\" class=\"w-full custom-input\" (ngModelChange)=\"descriptionError = false;\"\r\n [ngClass]=\"descriptionError ? 'error-input' : ''\" [(ngModel)]=\"newContact\"/>\r\n </p-iconfield>\r\n <label for=\"contact\">Contact</label>\r\n </p-floatlabel>\r\n</div>\r\n<p-button class=\"custom-button ml-2\" [label]=\"buttonLabel\" size=\"small\" [disabled]=\"descriptionFormModified()\" (onClick)=\"updateDescription()\"/>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}.textarea-iconfield{position:relative;display:flex;align-items:flex-start}.textarea-iconfield .p-inputicon{position:absolute;top:17px;left:11px;z-index:1}.custom-textarea{padding-left:2.5rem}.custom-textarea:hover,.custom-textarea:focus{border-color:var(--hover-color)!important}.error-textarea{border-color:var(--danger-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type:
|
|
606
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: OrganizationFormComponent, isStandalone: true, selector: "organization-form", inputs: { organization: "organization", descriptionError: "descriptionError", buttonLabel: "buttonLabel", validationFunction: "validationFunction" }, outputs: { formChange: "formChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-column gap-4 m-2 mb-4\">\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-pencil\" />\r\n <input pInputText id=\"name\" autocomplete=\"off\" class=\"w-full custom-input\" (ngModelChange)=\"descriptionError = false;\"\r\n [ngClass]=\"descriptionError ? 'error-input' : ''\" [(ngModel)]=\"newName\"/>\r\n </p-iconfield>\r\n <label for=\"name\">Name</label>\r\n </p-floatlabel>\r\n\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield class=\"textarea-iconfield\">\r\n <p-inputicon class=\"pi pi-align-justify\"></p-inputicon>\r\n <textarea id=\"description\" rows=\"5\" cols=\"30\" pTextarea [(ngModel)]=\"newDescription\" (ngModelChange)=\"descriptionError = false;\"\r\n style=\"resize: none;\" class=\"w-full custom-textarea\" [ngClass]=\"descriptionError ? 'error-textarea' : ''\"></textarea>\r\n </p-iconfield>\r\n <label for=\"description\">Description</label>\r\n </p-floatlabel>\r\n\r\n <p-floatlabel variant=\"on\" class=\"custom-floatlabel\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"contact\" autocomplete=\"off\" class=\"w-full custom-input\" (ngModelChange)=\"descriptionError = false;\"\r\n [ngClass]=\"descriptionError ? 'error-input' : ''\" [(ngModel)]=\"newContact\"/>\r\n </p-iconfield>\r\n <label for=\"contact\">Contact</label>\r\n </p-floatlabel>\r\n</div>\r\n<p-button class=\"custom-button ml-2\" [label]=\"buttonLabel\" size=\"small\" [disabled]=\"descriptionFormModified()\" (onClick)=\"updateDescription()\"/>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}.textarea-iconfield{position:relative;display:flex;align-items:flex-start}.textarea-iconfield .p-inputicon{position:absolute;top:17px;left:11px;z-index:1}.custom-textarea{padding-left:2.5rem}.custom-textarea:hover,.custom-textarea:focus{border-color:var(--hover-color)!important}.error-textarea{border-color:var(--danger-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i7.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i8$1.Textarea, selector: "[pTextarea]", inputs: ["autoResize", "variant", "fluid", "pSize"], outputs: ["onResize"] }] });
|
|
616
607
|
}
|
|
617
608
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationFormComponent, decorators: [{
|
|
618
609
|
type: Component,
|
|
@@ -1191,47 +1182,36 @@ class OrganizationAdminComponent {
|
|
|
1191
1182
|
}
|
|
1192
1183
|
})).subscribe();
|
|
1193
1184
|
}
|
|
1194
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationAdminComponent, deps: [{ token: OrganizationService }, { token: UserService }, { token: i2$
|
|
1195
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: OrganizationAdminComponent, isStandalone: true, selector: "organization-admin", inputs: { organization: "organization" }, providers: [ConfirmationService], ngImport: i0, template: "<p-confirmdialog />\r\n\r\n<div class=\"mt-4\" *ngIf=\"inplaceIndicator; else AdminContent\">\r\n <p-accordion [value]=\"[]\" [multiple]=\"true\" class=\"custom-acordion\">\r\n <p-accordion-panel value=\"0\">\r\n <p-accordion-header>Description</p-accordion-header>\r\n <p-accordion-content>\r\n <organization-form [organization]=\"organization\" [descriptionError]=\"descriptionError\" (formChange)=\"updateDescription($event)\"></organization-form>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n \r\n <p-accordion-panel value=\"1\">\r\n <p-accordion-header>Users</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"flex flex-wrap my-3 justify-content-center align-items-center gap-4\">\r\n <p-floatlabel variant=\"on\" [class]=\"userError ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"nDivision\" autocomplete=\"off\" class=\"w-full max-w-25rem\" [class]=\"userError ? 'custom-input error-input' : 'custom-input'\" \r\n [(ngModel)]=\"newUser\" (ngModelChange)=\"userError = false;\"/>\r\n </p-iconfield>\r\n <label for=\"nDivision\">User Email</label>\r\n </p-floatlabel>\r\n <p-button class=\"custom-button\" label=\"Add User\" size=\"small\" [disabled]=\"!newUser\" (onClick)=\"addUserToOrganization()\"/>\r\n </div>\r\n <p-table [value]=\"users\" [paginator]=\"true\" [rows]=\"5\" class=\"custom-table\">\r\n <ng-template #header>\r\n <tr>\r\n <th>Email</th>\r\n <th>Name</th>\r\n <th>Admin</th>\r\n <th style=\"width: 5rem\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template #body let-user>\r\n <tr >\r\n <td>{{ user.email }}</td>\r\n <td>{{ user.name }}</td>\r\n <td>\r\n <p-toggleswitch class=\"custom-toogle\" [(ngModel)]=\"user.isAdmin\" (onChange)=\"switchAdminStateModal($event ,user._id, user.name, $event.checked)\"/>\r\n </td>\r\n <td>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-trash\" [disabled]=\"isCurrentUser(user._id)\" (onClick)=\"deleteUserModal($event, user._id, user.name)\"/>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n \r\n <p-accordion-panel value=\"2\">\r\n <p-accordion-header>Divisions</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"flex flex-wrap my-3 justify-content-center align-items-center gap-4\">\r\n <p-floatlabel variant=\"on\" [class]=\"divisionError ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-pencil\" />\r\n <input pInputText id=\"nDivision\" autocomplete=\"off\" class=\"w-full max-w-25rem\" [class]=\"divisionError ? 'custom-input error-input' : 'custom-input'\" \r\n [(ngModel)]=\"newDivision\" (ngModelChange)=\"divisionError = false;\"/>\r\n </p-iconfield>\r\n <label for=\"nDivision\">New Division</label>\r\n </p-floatlabel>\r\n <p-button class=\"custom-button\" label=\"Add Division\" size=\"small\" [disabled]=\"!newDivision\" (onClick)=\"addDivision()\"/>\r\n </div>\r\n <p-table [value]=\"divisions\" [paginator]=\"true\" [rows]=\"5\" class=\"custom-table\">\r\n <ng-template #header>\r\n <tr>\r\n <th>Name</th>\r\n <th style=\"width: 5rem\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template #body let-division>\r\n <tr >\r\n <td>{{ division }}</td>\r\n <td>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-trash\" (onClick)=\"deleteDivisionModal($event, division)\"/>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n </p-accordion>\r\n \r\n <div class=\"flex justify-content-between align-items-center mt-4 gap-4\">\r\n <div class=\"custom-inplace-display\" (click)=\"inplaceIndicator = false\">Collapse</div>\r\n <p-button class=\"delete-button\" label=\"Delete Organization\" size=\"small\" (onClick)=\"deleteOrganizationModal($event)\"/>\r\n </div>\r\n</div>\r\n\r\n<ng-template #AdminContent>\r\n <p class=\"mb-0 custom-inplace-display\" (click)=\"inplaceIndicator = true\">Admin Content</p>\r\n</ng-template>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.delete-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.trash-button{--p-button-text-primary-color: var(--danger-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--danger-color) 20%, rgba(255, 255, 255, 0) 80%)}.custom-toogle{--p-toggleswitch-checked-border-color: var(--secondary-color);--p-toggleswitch-checked-hover-border-color: var(--hover-color);--p-toggleswitch-checked-background: var(--secondary-color);--p-toggleswitch-checked-hover-background: var(--hover-color)}.custom-acordion{--p-accordion-header-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-accordion-header-hover-color: var(--hover-color);--p-accordion-header-active-color: var(--primary-color);--p-accordion-content-color: var(--primary-color)}.custom-table{--p-datatable-header-cell-color: var(--primary-color);--p-datatable-row-color: var(--primary-color);--p-paginator-nav-button-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-paginator-nav-button-selected-background: color-mix(in srgb, var(--hover-color) 10%, rgba(255, 255, 255, 0) 90%);--p-paginator-nav-button-hover-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, 0) 90%)}.custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}::ng-deep .p-confirmdialog{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-confirmdialog-icon{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.custom-inplace-display{display:block!important;max-width:fit-content;white-space:nowrap;cursor:pointer;color:var(--secondary-color);padding:0!important;border:none!important;border-radius:.1rem;outline:none}.custom-inplace-display:hover,.custom-inplace-display:focus{color:var(--hover-color)}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i6$2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i7$1.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i9.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i9.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i9.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i9.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i7.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i14.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "component", type: OrganizationFormComponent, selector: "organization-form", inputs: ["organization", "descriptionError", "buttonLabel", "validationFunction"], outputs: ["formChange"] }] });
|
|
1185
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationAdminComponent, deps: [{ token: OrganizationService }, { token: UserService }, { token: i2$1.ConfirmationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1186
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: OrganizationAdminComponent, isStandalone: true, selector: "organization-admin", inputs: { organization: "organization" }, providers: [ConfirmationService], ngImport: i0, template: "<p-confirmdialog />\r\n\r\n<div class=\"mt-4\" *ngIf=\"inplaceIndicator; else AdminContent\">\r\n <p-accordion [value]=\"[]\" [multiple]=\"true\" class=\"custom-acordion\">\r\n <p-accordion-panel value=\"0\">\r\n <p-accordion-header>Description</p-accordion-header>\r\n <p-accordion-content>\r\n <organization-form [organization]=\"organization\" [descriptionError]=\"descriptionError\" (formChange)=\"updateDescription($event)\"></organization-form>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n \r\n <p-accordion-panel value=\"1\">\r\n <p-accordion-header>Users</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"flex flex-wrap my-3 justify-content-center align-items-center gap-4\">\r\n <p-floatlabel variant=\"on\" [class]=\"userError ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"nDivision\" autocomplete=\"off\" class=\"w-full max-w-25rem\" [class]=\"userError ? 'custom-input error-input' : 'custom-input'\" \r\n [(ngModel)]=\"newUser\" (ngModelChange)=\"userError = false;\"/>\r\n </p-iconfield>\r\n <label for=\"nDivision\">User Email</label>\r\n </p-floatlabel>\r\n <p-button class=\"custom-button\" label=\"Add User\" size=\"small\" [disabled]=\"!newUser\" (onClick)=\"addUserToOrganization()\"/>\r\n </div>\r\n <p-table [value]=\"users\" [paginator]=\"true\" [rows]=\"5\" class=\"custom-table\">\r\n <ng-template #header>\r\n <tr>\r\n <th>Email</th>\r\n <th>Name</th>\r\n <th>Admin</th>\r\n <th style=\"width: 5rem\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template #body let-user>\r\n <tr >\r\n <td>{{ user.email }}</td>\r\n <td>{{ user.name }}</td>\r\n <td>\r\n <p-toggleswitch class=\"custom-toogle\" [(ngModel)]=\"user.isAdmin\" (onChange)=\"switchAdminStateModal($event ,user._id, user.name, $event.checked)\"/>\r\n </td>\r\n <td>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-trash\" [disabled]=\"isCurrentUser(user._id)\" (onClick)=\"deleteUserModal($event, user._id, user.name)\"/>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n \r\n <p-accordion-panel value=\"2\">\r\n <p-accordion-header>Divisions</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"flex flex-wrap my-3 justify-content-center align-items-center gap-4\">\r\n <p-floatlabel variant=\"on\" [class]=\"divisionError ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-pencil\" />\r\n <input pInputText id=\"nDivision\" autocomplete=\"off\" class=\"w-full max-w-25rem\" [class]=\"divisionError ? 'custom-input error-input' : 'custom-input'\" \r\n [(ngModel)]=\"newDivision\" (ngModelChange)=\"divisionError = false;\"/>\r\n </p-iconfield>\r\n <label for=\"nDivision\">New Division</label>\r\n </p-floatlabel>\r\n <p-button class=\"custom-button\" label=\"Add Division\" size=\"small\" [disabled]=\"!newDivision\" (onClick)=\"addDivision()\"/>\r\n </div>\r\n <p-table [value]=\"divisions\" [paginator]=\"true\" [rows]=\"5\" class=\"custom-table\">\r\n <ng-template #header>\r\n <tr>\r\n <th>Name</th>\r\n <th style=\"width: 5rem\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template #body let-division>\r\n <tr >\r\n <td>{{ division }}</td>\r\n <td>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-trash\" (onClick)=\"deleteDivisionModal($event, division)\"/>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n </p-accordion>\r\n \r\n <div class=\"flex justify-content-between align-items-center mt-4 gap-4\">\r\n <div class=\"custom-inplace-display\" (click)=\"inplaceIndicator = false\">Collapse</div>\r\n <p-button class=\"delete-button\" label=\"Delete Organization\" size=\"small\" (onClick)=\"deleteOrganizationModal($event)\"/>\r\n </div>\r\n</div>\r\n\r\n<ng-template #AdminContent>\r\n <p class=\"mb-0 custom-inplace-display\" (click)=\"inplaceIndicator = true\">Admin Content</p>\r\n</ng-template>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.delete-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.trash-button{--p-button-text-primary-color: var(--danger-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--danger-color) 20%, rgba(255, 255, 255, 0) 80%)}.custom-toogle{--p-toggleswitch-checked-border-color: var(--secondary-color);--p-toggleswitch-checked-hover-border-color: var(--hover-color);--p-toggleswitch-checked-background: var(--secondary-color);--p-toggleswitch-checked-hover-background: var(--hover-color)}.custom-acordion{--p-accordion-header-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-accordion-header-hover-color: var(--hover-color);--p-accordion-header-active-color: var(--primary-color);--p-accordion-content-color: var(--primary-color)}.custom-table{--p-datatable-header-cell-color: var(--primary-color);--p-datatable-row-color: var(--primary-color);--p-paginator-nav-button-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-paginator-nav-button-selected-background: color-mix(in srgb, var(--hover-color) 10%, rgba(255, 255, 255, 0) 90%);--p-paginator-nav-button-hover-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, 0) 90%)}.custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}::ng-deep .p-confirmdialog{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-confirmdialog-icon{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.custom-inplace-display{display:block!important;max-width:fit-content;white-space:nowrap;cursor:pointer;color:var(--secondary-color);padding:0!important;border:none!important;border-radius:.1rem;outline:none}.custom-inplace-display:hover,.custom-inplace-display:focus{color:var(--hover-color)}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i6$2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i7$1.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i9$1.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i9$1.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i9$1.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i9$1.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i7.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i14.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "component", type: OrganizationFormComponent, selector: "organization-form", inputs: ["organization", "descriptionError", "buttonLabel", "validationFunction"], outputs: ["formChange"] }] });
|
|
1196
1187
|
}
|
|
1197
1188
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationAdminComponent, decorators: [{
|
|
1198
1189
|
type: Component,
|
|
1199
1190
|
args: [{ standalone: true, selector: 'organization-admin', imports: [ButtonModule, CommonModule, TableModule, ToggleSwitchModule, FormsModule, AccordionModule, InputIconModule,
|
|
1200
1191
|
IconFieldModule, InputTextModule, FloatLabelModule, ConfirmDialogModule, OrganizationFormComponent], providers: [ConfirmationService], template: "<p-confirmdialog />\r\n\r\n<div class=\"mt-4\" *ngIf=\"inplaceIndicator; else AdminContent\">\r\n <p-accordion [value]=\"[]\" [multiple]=\"true\" class=\"custom-acordion\">\r\n <p-accordion-panel value=\"0\">\r\n <p-accordion-header>Description</p-accordion-header>\r\n <p-accordion-content>\r\n <organization-form [organization]=\"organization\" [descriptionError]=\"descriptionError\" (formChange)=\"updateDescription($event)\"></organization-form>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n \r\n <p-accordion-panel value=\"1\">\r\n <p-accordion-header>Users</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"flex flex-wrap my-3 justify-content-center align-items-center gap-4\">\r\n <p-floatlabel variant=\"on\" [class]=\"userError ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-envelope\" />\r\n <input pInputText id=\"nDivision\" autocomplete=\"off\" class=\"w-full max-w-25rem\" [class]=\"userError ? 'custom-input error-input' : 'custom-input'\" \r\n [(ngModel)]=\"newUser\" (ngModelChange)=\"userError = false;\"/>\r\n </p-iconfield>\r\n <label for=\"nDivision\">User Email</label>\r\n </p-floatlabel>\r\n <p-button class=\"custom-button\" label=\"Add User\" size=\"small\" [disabled]=\"!newUser\" (onClick)=\"addUserToOrganization()\"/>\r\n </div>\r\n <p-table [value]=\"users\" [paginator]=\"true\" [rows]=\"5\" class=\"custom-table\">\r\n <ng-template #header>\r\n <tr>\r\n <th>Email</th>\r\n <th>Name</th>\r\n <th>Admin</th>\r\n <th style=\"width: 5rem\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template #body let-user>\r\n <tr >\r\n <td>{{ user.email }}</td>\r\n <td>{{ user.name }}</td>\r\n <td>\r\n <p-toggleswitch class=\"custom-toogle\" [(ngModel)]=\"user.isAdmin\" (onChange)=\"switchAdminStateModal($event ,user._id, user.name, $event.checked)\"/>\r\n </td>\r\n <td>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-trash\" [disabled]=\"isCurrentUser(user._id)\" (onClick)=\"deleteUserModal($event, user._id, user.name)\"/>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n \r\n <p-accordion-panel value=\"2\">\r\n <p-accordion-header>Divisions</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"flex flex-wrap my-3 justify-content-center align-items-center gap-4\">\r\n <p-floatlabel variant=\"on\" [class]=\"divisionError ? 'custom-floatlabel error-floatlabel' : 'custom-floatlabel'\">\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-pencil\" />\r\n <input pInputText id=\"nDivision\" autocomplete=\"off\" class=\"w-full max-w-25rem\" [class]=\"divisionError ? 'custom-input error-input' : 'custom-input'\" \r\n [(ngModel)]=\"newDivision\" (ngModelChange)=\"divisionError = false;\"/>\r\n </p-iconfield>\r\n <label for=\"nDivision\">New Division</label>\r\n </p-floatlabel>\r\n <p-button class=\"custom-button\" label=\"Add Division\" size=\"small\" [disabled]=\"!newDivision\" (onClick)=\"addDivision()\"/>\r\n </div>\r\n <p-table [value]=\"divisions\" [paginator]=\"true\" [rows]=\"5\" class=\"custom-table\">\r\n <ng-template #header>\r\n <tr>\r\n <th>Name</th>\r\n <th style=\"width: 5rem\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template #body let-division>\r\n <tr >\r\n <td>{{ division }}</td>\r\n <td>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-trash\" (onClick)=\"deleteDivisionModal($event, division)\"/>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n </p-accordion>\r\n \r\n <div class=\"flex justify-content-between align-items-center mt-4 gap-4\">\r\n <div class=\"custom-inplace-display\" (click)=\"inplaceIndicator = false\">Collapse</div>\r\n <p-button class=\"delete-button\" label=\"Delete Organization\" size=\"small\" (onClick)=\"deleteOrganizationModal($event)\"/>\r\n </div>\r\n</div>\r\n\r\n<ng-template #AdminContent>\r\n <p class=\"mb-0 custom-inplace-display\" (click)=\"inplaceIndicator = true\">Admin Content</p>\r\n</ng-template>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.delete-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.trash-button{--p-button-text-primary-color: var(--danger-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--danger-color) 20%, rgba(255, 255, 255, 0) 80%)}.custom-toogle{--p-toggleswitch-checked-border-color: var(--secondary-color);--p-toggleswitch-checked-hover-border-color: var(--hover-color);--p-toggleswitch-checked-background: var(--secondary-color);--p-toggleswitch-checked-hover-background: var(--hover-color)}.custom-acordion{--p-accordion-header-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-accordion-header-hover-color: var(--hover-color);--p-accordion-header-active-color: var(--primary-color);--p-accordion-content-color: var(--primary-color)}.custom-table{--p-datatable-header-cell-color: var(--primary-color);--p-datatable-row-color: var(--primary-color);--p-paginator-nav-button-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-paginator-nav-button-selected-background: color-mix(in srgb, var(--hover-color) 10%, rgba(255, 255, 255, 0) 90%);--p-paginator-nav-button-hover-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, 0) 90%)}.custom-input{--p-inputtext-focus-border-color: var(--hover-color);--p-inputtext-hover-border-color: var(--hover-color)}.custom-floatlabel{--p-floatlabel-focus-color: var(--hover-color)}.error-input{--p-inputtext-border-color: var(--danger-color)}.error-floatlabel{--p-floatlabel-color: var(--danger-color)}::ng-deep .p-confirmdialog{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-confirmdialog-icon{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.custom-inplace-display{display:block!important;max-width:fit-content;white-space:nowrap;cursor:pointer;color:var(--secondary-color);padding:0!important;border:none!important;border-radius:.1rem;outline:none}.custom-inplace-display:hover,.custom-inplace-display:focus{color:var(--hover-color)}\n"] }]
|
|
1201
|
-
}], ctorParameters: () => [{ type: OrganizationService }, { type: UserService }, { type: i2$
|
|
1192
|
+
}], ctorParameters: () => [{ type: OrganizationService }, { type: UserService }, { type: i2$1.ConfirmationService }], propDecorators: { organization: [{
|
|
1202
1193
|
type: Input
|
|
1203
1194
|
}] } });
|
|
1204
1195
|
|
|
1205
1196
|
class OrganizationPageComponent {
|
|
1206
1197
|
orgService;
|
|
1207
1198
|
messageService;
|
|
1208
|
-
userService;
|
|
1209
1199
|
confirmationService;
|
|
1210
|
-
router;
|
|
1211
1200
|
userOrganizations = [];
|
|
1212
1201
|
orgSubscription;
|
|
1213
|
-
userStateSubscription;
|
|
1214
1202
|
adminMessageSubscription;
|
|
1215
1203
|
organizations = [];
|
|
1216
1204
|
selectedOrganization;
|
|
1217
|
-
logged = false;
|
|
1218
1205
|
duplicatedOrg = false;
|
|
1219
1206
|
newOrganization = { _id: "", name: "", description: "", email: "", isAdmin: true };
|
|
1220
1207
|
newOrganizationError = false;
|
|
1221
1208
|
newOrganizationAcordion = [];
|
|
1222
|
-
constructor(orgService, messageService,
|
|
1209
|
+
constructor(orgService, messageService, confirmationService) {
|
|
1223
1210
|
this.orgService = orgService;
|
|
1224
1211
|
this.messageService = messageService;
|
|
1225
|
-
this.userService = userService;
|
|
1226
1212
|
this.confirmationService = confirmationService;
|
|
1227
|
-
this.router = router;
|
|
1228
1213
|
}
|
|
1229
1214
|
ngOnInit() {
|
|
1230
|
-
this.userStateSubscription = this.userService.getUserState().pipe(filter(value => value != undefined)).subscribe(({ logged }) => {
|
|
1231
|
-
this.logged = logged;
|
|
1232
|
-
if (!logged)
|
|
1233
|
-
this.router.navigate(['']);
|
|
1234
|
-
});
|
|
1235
1215
|
this.orgSubscription = this.orgService.getUserOrganizations().subscribe(orgs => {
|
|
1236
1216
|
this.userOrganizations = orgs;
|
|
1237
1217
|
});
|
|
@@ -1246,7 +1226,6 @@ class OrganizationPageComponent {
|
|
|
1246
1226
|
}
|
|
1247
1227
|
ngOnDestroy() {
|
|
1248
1228
|
this.orgSubscription?.unsubscribe();
|
|
1249
|
-
this.userStateSubscription?.unsubscribe();
|
|
1250
1229
|
this.adminMessageSubscription?.unsubscribe();
|
|
1251
1230
|
}
|
|
1252
1231
|
leaveOrganization(orgId, orgName) {
|
|
@@ -1391,13 +1370,13 @@ class OrganizationPageComponent {
|
|
|
1391
1370
|
newOrganizationValidation(data) {
|
|
1392
1371
|
return data.some(([first, second]) => first === second || first === "");
|
|
1393
1372
|
}
|
|
1394
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationPageComponent, deps: [{ token: OrganizationService }, { token: i2$
|
|
1395
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: OrganizationPageComponent, isStandalone: true, selector: "organization-page", providers: [MessageService, ConfirmationService], ngImport: i0, template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<p-confirmdialog />\r\n<div class=\"flex flex-column align-items-stretch p-4\">\r\n <h2 class=\"mx-auto\">Your Organization(s) Details</h2>\r\n <p class=\"mx-auto\">You are part of {{userOrganizations.length}} organization(s). You can also create your own organization.</p>\r\n <div class=\"flex flex-wrap mb-4 align-items-center gap-4 justify-content-center w-full\">\r\n <p-select [options]=\"organizations\" [showClear]=\"true\" [disabled]=\"!logged\" [(ngModel)]=\"selectedOrganization\" \r\n [optionLabel]=\"'name'\" placeholder=\"Select an Organization\" [ngClass]=\"duplicatedOrg ? 'invalid-select' : 'custom-select'\" \r\n (onChange)=\"updateDuplicatedOrg()\" class=\"w-full max-w-30rem\" [checkmark]=\"true\" panelStyleClass=\"max-w-30rem\" />\r\n <p-button class=\"custom-button\" label=\"Join Organization\" size=\"small\" (click)=\"joinOrganization()\" [disabled]=\"!logged || !selectedOrganization\"/>\r\n </div>\r\n <div class=\"flex flex-column gap-4\">\r\n <p-card class=\"custom-color-card flex justify-content-center\" styleClass=\"flex-auto\" [style]=\"{ 'max-width': '50rem', 'min-width': '20rem', height: 'auto'}\" *ngFor=\"let organization of userOrganizations; let i = index\">\r\n <ng-template #header>\r\n <div class=\"flex justify-content-between\" style=\"padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 1.25rem;\">\r\n <div class=\"p-card-title\">{{organization.name}}</div>\r\n <div class=\"flex gap-1\">\r\n <p-button class=\"flex email-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-envelope\" [disabled]=\"!logged || !organization.email\" \r\n (click)=\"copyEmail(organization.email, organization.name)\" pTooltip=\"{{organization.email}}\" tooltipPosition=\"top\"/>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-sign-out\" [disabled]=\"!logged\"\r\n (click)=\"deleteModal($event, organization._id, organization.name)\"/>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <p class=\"m-0\">\r\n {{organization.description}}\r\n </p>\r\n <div *ngIf=\"organization.isAdmin\">\r\n <organization-admin [organization]=\"organization\"></organization-admin>\r\n </div>\r\n </p-card>\r\n <p-card class=\"custom-color-card flex justify-content-center\" styleClass=\"flex-auto plus-card\" [style]=\"{ 'max-width': '50rem', 'min-width': '20rem', height: 'auto'}\">\r\n <ng-template #content>\r\n <p-accordion [value]=\"newOrganizationAcordion\" [multiple]=\"true\" class=\"custom-acordion\" [expandIcon]=\"'pi pi-plus'\" [collapseIcon]=\"'pi pi-minus'\">\r\n <p-accordion-panel class=\"custom-accordionpanel\" value=\"0\" [disabled]=\"!logged\">\r\n <p-accordion-header class=\"custom-accordionheader\">Create New Organization</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"pt-4\">\r\n <organization-form [organization]=\"newOrganization\" [descriptionError]=\"newOrganizationError\" [buttonLabel]=\"'Create Organization'\" [validationFunction]=\"newOrganizationValidation\" (formChange)=\"createOrganization($event)\"></organization-form>\r\n </div>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n </p-accordion>\r\n </ng-template>\r\n </p-card>\r\n </div>\r\n</div>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.custom-color-card{--p-card-color: var(--primary-color);--p-card-subtitle-color: var(--secondary-color);--p-card-title-font-size: 1.25rem;--p-card-title-font-weight: 600}.custom-toast{--p-toast-info-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-info-border-color: var(--secondary-color);--p-toast-info-color: var(--secondary-color);--p-toast-info-detail-color: var(--primary-color);--p-toast-error-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-error-border-color: var(--danger-color);--p-toast-error-color: var(--danger-color);--p-toast-error-detail-color: var(--primary-color);--p-toast-warn-background: color-mix(in srgb, var(--warning-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-warn-border-color: var(--warning-color);--p-toast-warn-color: var(--warning-color);--p-toast-warn-detail-color: var(--primary-color)}::ng-deep .p-toast-close-button .p-button-label{font-size:0}.custom-select{--p-select-hover-border-color: var(--hover-color);--p-select-focus-border-color: var(--hover-color)}.invalid-select{--p-select-border-color: var(--danger-color);--p-select-color: var(--danger-color);--p-select-hover-border-color: var(--hover-color);--p-select-focus-border-color: var(--hover-color)}.trash-button{--p-button-text-primary-color: var(--danger-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--danger-color) 20%, rgba(255, 255, 255, 0) 80%)}.email-button{--p-button-text-primary-color: var(--secondary-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--secondary-color) 20%, rgba(255, 255, 255, 0) 80%)}::ng-deep .p-tooltip{--p-tooltip-background: var(--primary-color);--p-tooltip-max-width: 20rem}::ng-deep .p-tooltip-text{white-space:nowrap!important;word-break:keep-all!important;overflow:hidden!important;text-overflow:ellipsis!important}::ng-deep .p-confirmdialog{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-confirmdialog-icon{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.custom-acordion{--p-accordion-header-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-accordion-header-hover-color: var(--hover-color);--p-accordion-header-active-color: var(--primary-color);--p-accordion-content-color: var(--primary-color)}.custom-accordionpanel{border-style:none!important}.custom-accordionheader{padding:0!important;padding-right:.75rem!important}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i7$2.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i10.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i9$1.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: OrganizationAdminComponent, selector: "organization-admin", inputs: ["organization"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i11.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i14.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i9.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i9.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i9.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i9.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type: OrganizationFormComponent, selector: "organization-form", inputs: ["organization", "descriptionError", "buttonLabel", "validationFunction"], outputs: ["formChange"] }] });
|
|
1373
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationPageComponent, deps: [{ token: OrganizationService }, { token: i2$1.MessageService }, { token: i2$1.ConfirmationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1374
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: OrganizationPageComponent, isStandalone: true, selector: "organization-page", providers: [MessageService, ConfirmationService], ngImport: i0, template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<p-confirmdialog />\r\n<div class=\"flex flex-column align-items-stretch p-4\">\r\n <h2 class=\"mx-auto\">Your Organization(s) Details</h2>\r\n <p class=\"mx-auto\">You are part of {{userOrganizations.length}} organization(s). You can also create your own organization.</p>\r\n <div class=\"flex flex-wrap mb-4 align-items-center gap-4 justify-content-center w-full\">\r\n <p-select [options]=\"organizations\" [showClear]=\"true\" [(ngModel)]=\"selectedOrganization\" \r\n [optionLabel]=\"'name'\" placeholder=\"Select an Organization\" [ngClass]=\"duplicatedOrg ? 'invalid-select' : 'custom-select'\" \r\n (onChange)=\"updateDuplicatedOrg()\" class=\"w-full max-w-30rem\" [checkmark]=\"true\" panelStyleClass=\"max-w-30rem\" />\r\n <p-button class=\"custom-button\" label=\"Join Organization\" size=\"small\" (click)=\"joinOrganization()\" [disabled]=\"!selectedOrganization\"/>\r\n </div>\r\n <div class=\"flex flex-column gap-4\">\r\n <p-card class=\"custom-color-card flex justify-content-center\" styleClass=\"flex-auto\" [style]=\"{ 'max-width': '50rem', 'min-width': '20rem', height: 'auto'}\" *ngFor=\"let organization of userOrganizations; let i = index\">\r\n <ng-template #header>\r\n <div class=\"flex justify-content-between\" style=\"padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 1.25rem;\">\r\n <div class=\"p-card-title\">{{organization.name}}</div>\r\n <div class=\"flex gap-1\">\r\n <p-button class=\"flex email-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-envelope\" [disabled]=\"!organization.email\" \r\n (click)=\"copyEmail(organization.email, organization.name)\" pTooltip=\"{{organization.email}}\" tooltipPosition=\"top\"/>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-sign-out\"\r\n (click)=\"deleteModal($event, organization._id, organization.name)\"/>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <p class=\"m-0\">\r\n {{organization.description}}\r\n </p>\r\n <div *ngIf=\"organization.isAdmin\">\r\n <organization-admin [organization]=\"organization\"></organization-admin>\r\n </div>\r\n </p-card>\r\n <p-card class=\"custom-color-card flex justify-content-center\" styleClass=\"flex-auto plus-card\" [style]=\"{ 'max-width': '50rem', 'min-width': '20rem', height: 'auto'}\">\r\n <ng-template #content>\r\n <p-accordion [value]=\"newOrganizationAcordion\" [multiple]=\"true\" class=\"custom-acordion\" [expandIcon]=\"'pi pi-plus'\" [collapseIcon]=\"'pi pi-minus'\">\r\n <p-accordion-panel class=\"custom-accordionpanel\" value=\"0\">\r\n <p-accordion-header class=\"custom-accordionheader\">Create New Organization</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"pt-4\">\r\n <organization-form [organization]=\"newOrganization\" [descriptionError]=\"newOrganizationError\" [buttonLabel]=\"'Create Organization'\" [validationFunction]=\"newOrganizationValidation\" (formChange)=\"createOrganization($event)\"></organization-form>\r\n </div>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n </p-accordion>\r\n </ng-template>\r\n </p-card>\r\n </div>\r\n</div>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.custom-color-card{--p-card-color: var(--primary-color);--p-card-subtitle-color: var(--secondary-color);--p-card-title-font-size: 1.25rem;--p-card-title-font-weight: 600}.custom-toast{--p-toast-info-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-info-border-color: var(--secondary-color);--p-toast-info-color: var(--secondary-color);--p-toast-info-detail-color: var(--primary-color);--p-toast-error-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-error-border-color: var(--danger-color);--p-toast-error-color: var(--danger-color);--p-toast-error-detail-color: var(--primary-color);--p-toast-warn-background: color-mix(in srgb, var(--warning-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-warn-border-color: var(--warning-color);--p-toast-warn-color: var(--warning-color);--p-toast-warn-detail-color: var(--primary-color)}::ng-deep .p-toast-close-button .p-button-label{font-size:0}.custom-select{--p-select-hover-border-color: var(--hover-color);--p-select-focus-border-color: var(--hover-color)}.invalid-select{--p-select-border-color: var(--danger-color);--p-select-color: var(--danger-color);--p-select-hover-border-color: var(--hover-color);--p-select-focus-border-color: var(--hover-color)}.trash-button{--p-button-text-primary-color: var(--danger-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--danger-color) 20%, rgba(255, 255, 255, 0) 80%)}.email-button{--p-button-text-primary-color: var(--secondary-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--secondary-color) 20%, rgba(255, 255, 255, 0) 80%)}::ng-deep .p-tooltip{--p-tooltip-background: var(--primary-color);--p-tooltip-max-width: 20rem}::ng-deep .p-tooltip-text{white-space:nowrap!important;word-break:keep-all!important;overflow:hidden!important;text-overflow:ellipsis!important}::ng-deep .p-confirmdialog{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-confirmdialog-icon{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.custom-acordion{--p-accordion-header-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-accordion-header-hover-color: var(--hover-color);--p-accordion-header-active-color: var(--primary-color);--p-accordion-content-color: var(--primary-color)}.custom-accordionpanel{border-style:none!important}.custom-accordionheader{padding:0!important;padding-right:.75rem!important}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5$2.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i9.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i7$2.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: OrganizationAdminComponent, selector: "organization-admin", inputs: ["organization"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i9$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i14.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i9$1.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i9$1.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i9$1.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i9$1.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type: OrganizationFormComponent, selector: "organization-form", inputs: ["organization", "descriptionError", "buttonLabel", "validationFunction"], outputs: ["formChange"] }] });
|
|
1396
1375
|
}
|
|
1397
1376
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: OrganizationPageComponent, decorators: [{
|
|
1398
1377
|
type: Component,
|
|
1399
|
-
args: [{ standalone: true, selector: 'organization-page', imports: [ButtonModule, CommonModule, CardModule, ToastModule, SelectModule, FormsModule, OrganizationAdminComponent, TooltipModule, ConfirmDialogModule, AccordionModule, OrganizationFormComponent], providers: [MessageService, ConfirmationService], template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<p-confirmdialog />\r\n<div class=\"flex flex-column align-items-stretch p-4\">\r\n <h2 class=\"mx-auto\">Your Organization(s) Details</h2>\r\n <p class=\"mx-auto\">You are part of {{userOrganizations.length}} organization(s). You can also create your own organization.</p>\r\n <div class=\"flex flex-wrap mb-4 align-items-center gap-4 justify-content-center w-full\">\r\n <p-select [options]=\"organizations\" [showClear]=\"true\" [
|
|
1400
|
-
}], ctorParameters: () => [{ type: OrganizationService }, { type: i2$
|
|
1378
|
+
args: [{ standalone: true, selector: 'organization-page', imports: [ButtonModule, CommonModule, CardModule, ToastModule, SelectModule, FormsModule, OrganizationAdminComponent, TooltipModule, ConfirmDialogModule, AccordionModule, OrganizationFormComponent], providers: [MessageService, ConfirmationService], template: "<p-toast class=\"custom-toast\" position=\"bottom-right\"/>\r\n<p-confirmdialog />\r\n<div class=\"flex flex-column align-items-stretch p-4\">\r\n <h2 class=\"mx-auto\">Your Organization(s) Details</h2>\r\n <p class=\"mx-auto\">You are part of {{userOrganizations.length}} organization(s). You can also create your own organization.</p>\r\n <div class=\"flex flex-wrap mb-4 align-items-center gap-4 justify-content-center w-full\">\r\n <p-select [options]=\"organizations\" [showClear]=\"true\" [(ngModel)]=\"selectedOrganization\" \r\n [optionLabel]=\"'name'\" placeholder=\"Select an Organization\" [ngClass]=\"duplicatedOrg ? 'invalid-select' : 'custom-select'\" \r\n (onChange)=\"updateDuplicatedOrg()\" class=\"w-full max-w-30rem\" [checkmark]=\"true\" panelStyleClass=\"max-w-30rem\" />\r\n <p-button class=\"custom-button\" label=\"Join Organization\" size=\"small\" (click)=\"joinOrganization()\" [disabled]=\"!selectedOrganization\"/>\r\n </div>\r\n <div class=\"flex flex-column gap-4\">\r\n <p-card class=\"custom-color-card flex justify-content-center\" styleClass=\"flex-auto\" [style]=\"{ 'max-width': '50rem', 'min-width': '20rem', height: 'auto'}\" *ngFor=\"let organization of userOrganizations; let i = index\">\r\n <ng-template #header>\r\n <div class=\"flex justify-content-between\" style=\"padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 1.25rem;\">\r\n <div class=\"p-card-title\">{{organization.name}}</div>\r\n <div class=\"flex gap-1\">\r\n <p-button class=\"flex email-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-envelope\" [disabled]=\"!organization.email\" \r\n (click)=\"copyEmail(organization.email, organization.name)\" pTooltip=\"{{organization.email}}\" tooltipPosition=\"top\"/>\r\n <p-button class=\"flex trash-button\" variant=\"text\" rounded=\"true\" size=\"large\" icon=\"pi pi-sign-out\"\r\n (click)=\"deleteModal($event, organization._id, organization.name)\"/>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <p class=\"m-0\">\r\n {{organization.description}}\r\n </p>\r\n <div *ngIf=\"organization.isAdmin\">\r\n <organization-admin [organization]=\"organization\"></organization-admin>\r\n </div>\r\n </p-card>\r\n <p-card class=\"custom-color-card flex justify-content-center\" styleClass=\"flex-auto plus-card\" [style]=\"{ 'max-width': '50rem', 'min-width': '20rem', height: 'auto'}\">\r\n <ng-template #content>\r\n <p-accordion [value]=\"newOrganizationAcordion\" [multiple]=\"true\" class=\"custom-acordion\" [expandIcon]=\"'pi pi-plus'\" [collapseIcon]=\"'pi pi-minus'\">\r\n <p-accordion-panel class=\"custom-accordionpanel\" value=\"0\">\r\n <p-accordion-header class=\"custom-accordionheader\">Create New Organization</p-accordion-header>\r\n <p-accordion-content>\r\n <div class=\"pt-4\">\r\n <organization-form [organization]=\"newOrganization\" [descriptionError]=\"newOrganizationError\" [buttonLabel]=\"'Create Organization'\" [validationFunction]=\"newOrganizationValidation\" (formChange)=\"createOrganization($event)\"></organization-form>\r\n </div>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n </p-accordion>\r\n </ng-template>\r\n </p-card>\r\n </div>\r\n</div>", styles: [".custom-button{--p-button-primary-background: var(--secondary-color);--p-button-primary-border-color: var(--secondary-color);--p-button-primary-hover-background: var(--hover-color);--p-button-primary-hover-border-color: var(--hover-color);--p-button-primary-active-background: color-mix(in srgb, var(--hover-color) 80%, black 20%);--p-button-primary-active-border-color: color-mix(in srgb, var(--hover-color) 90%, black 10%)}.custom-color-card{--p-card-color: var(--primary-color);--p-card-subtitle-color: var(--secondary-color);--p-card-title-font-size: 1.25rem;--p-card-title-font-weight: 600}.custom-toast{--p-toast-info-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-info-border-color: var(--secondary-color);--p-toast-info-color: var(--secondary-color);--p-toast-info-detail-color: var(--primary-color);--p-toast-error-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-error-border-color: var(--danger-color);--p-toast-error-color: var(--danger-color);--p-toast-error-detail-color: var(--primary-color);--p-toast-warn-background: color-mix(in srgb, var(--warning-color) 10%, rgba(255, 255, 255, .9) 90%);--p-toast-warn-border-color: var(--warning-color);--p-toast-warn-color: var(--warning-color);--p-toast-warn-detail-color: var(--primary-color)}::ng-deep .p-toast-close-button .p-button-label{font-size:0}.custom-select{--p-select-hover-border-color: var(--hover-color);--p-select-focus-border-color: var(--hover-color)}.invalid-select{--p-select-border-color: var(--danger-color);--p-select-color: var(--danger-color);--p-select-hover-border-color: var(--hover-color);--p-select-focus-border-color: var(--hover-color)}.trash-button{--p-button-text-primary-color: var(--danger-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--danger-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--danger-color) 20%, rgba(255, 255, 255, 0) 80%)}.email-button{--p-button-text-primary-color: var(--secondary-color);--p-button-text-primary-hover-background: color-mix(in srgb, var(--secondary-color) 10%, rgba(255, 255, 255, 0) 90%);--p-button-text-primary-active-background: color-mix(in srgb, var(--secondary-color) 20%, rgba(255, 255, 255, 0) 80%)}::ng-deep .p-tooltip{--p-tooltip-background: var(--primary-color);--p-tooltip-max-width: 20rem}::ng-deep .p-tooltip-text{white-space:nowrap!important;word-break:keep-all!important;overflow:hidden!important;text-overflow:ellipsis!important}::ng-deep .p-confirmdialog{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-confirmdialog-icon{color:var(--primary-color)!important}::ng-deep .p-confirmdialog .p-button{--p-button-primary-background: var(--danger-color);--p-button-primary-border-color: var(--danger-color);--p-button-primary-hover-background: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-hover-border-color: color-mix(in srgb, var(--danger-color) 90%, black 10%);--p-button-primary-active-background: color-mix(in srgb, var(--danger-color) 70%, black 30%);--p-button-primary-active-border-color: color-mix(in srgb, var(--danger-color) 80%, black 20%)}.custom-acordion{--p-accordion-header-color: color-mix(in srgb, var(--primary-color) 60%, rgba(255, 255, 255, 0) 40%);--p-accordion-header-hover-color: var(--hover-color);--p-accordion-header-active-color: var(--primary-color);--p-accordion-content-color: var(--primary-color)}.custom-accordionpanel{border-style:none!important}.custom-accordionheader{padding:0!important;padding-right:.75rem!important}\n"] }]
|
|
1379
|
+
}], ctorParameters: () => [{ type: OrganizationService }, { type: i2$1.MessageService }, { type: i2$1.ConfirmationService }] });
|
|
1401
1380
|
|
|
1402
1381
|
const AuthGuard = () => {
|
|
1403
1382
|
const userService = inject(UserService);
|