diff --git a/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.html b/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.html new file mode 100644 index 000000000..994387237 --- /dev/null +++ b/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.html @@ -0,0 +1,19 @@ +
+
+

{{'USER-PROFILE.ACTIONS.ADD-NEW-ACCOUNT' | translate}}

+ close +
+ +
+ + + +
+
+
+ + +
+
+
diff --git a/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss b/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss new file mode 100644 index 000000000..f5f248a49 --- /dev/null +++ b/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss @@ -0,0 +1,55 @@ +.template-container { + .header { + display: flex; + width: 100%; + height: 89px; + background-color: #129d99; + color: #ffffff; + font-size: 1.25rem; + } + + .title { + font-weight: 700; + font-size: 1.25rem; + color: #212121; + opacity: 1; + } + + .template-title { + margin-left: 37px; + } + + .close-icon { + cursor: pointer; + margin-right: 20px; + } + + .close-icon:hover { + background-color: #fefefe6e !important; + border-radius: 50%; + } + + .cancel-btn { + width: 101px; + height: 43px; + background: #ffffff; + border: 1px solid #b5b5b5; + border-radius: 30px; + opacity: 1; + } + + .add-btn { + width: 84px; + height: 43px; + background: #ffffff; + color: #129d99; + border: 1px solid #129d99; + border-radius: 30px; + opacity: 1; + } + + .add-btn:hover { + background-color: #129d99; + color: #ffffff; + } +} diff --git a/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.ts b/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.ts new file mode 100644 index 000000000..498e17c9b --- /dev/null +++ b/dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.ts @@ -0,0 +1,40 @@ +import { Component, Inject, OnInit } from '@angular/core'; +import { FormGroup } from '@angular/forms'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { DatasetDescriptionFormEditorModel } from '@app/ui/misc/dataset-description-form/dataset-description-form.model'; + +@Component({ + selector: 'app-add-account-dialog-component', + templateUrl: 'add-account-dialog.component.html', + styleUrls: ['./add-account-dialog.component.scss'], +}) +export class AddAccountDialogComponent implements OnInit { + + datasetProfileDefinitionModel: DatasetDescriptionFormEditorModel; + datasetProfileDefinitionFormGroup: FormGroup; + progressIndication = false; + + constructor( + public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data: any + ) { + + } + + ngOnInit(): void { + + } + + add(): void { + this.dialogRef.close(true); + } + + cancel(): void { + this.dialogRef.close(); + } + + closeDialog(): void { + this.dialogRef.close(); + } + +} diff --git a/dmp-frontend/src/app/ui/user-profile/user-profile.component.html b/dmp-frontend/src/app/ui/user-profile/user-profile.component.html index 366e68a10..1cc529b1d 100644 --- a/dmp-frontend/src/app/ui/user-profile/user-profile.component.html +++ b/dmp-frontend/src/app/ui/user-profile/user-profile.component.html @@ -13,7 +13,7 @@
{{formGroup.get('name').value}}
-
{{'USER-PROFILE.SETTINGS.CONNECTED-WITH' | translate}}:{{userProfile.email}}
+
@@ -25,7 +25,7 @@
- + @@ -33,6 +33,37 @@
+ +
+
+
+
{{'USER-PROFILE.SETTINGS.ACCOUNTS' | translate}}
+
+
+
+ +
+
+
+
+
+ +
{{userCredential.email}}
+ +
+
+
+
+
+ add + {{'USER-PROFILE.ACTIONS.ADD-NEW' | translate}} +
+
+
+
+
+
diff --git a/dmp-frontend/src/app/ui/user-profile/user-profile.component.scss b/dmp-frontend/src/app/ui/user-profile/user-profile.component.scss index 0738bacc5..b0b18cab9 100644 --- a/dmp-frontend/src/app/ui/user-profile/user-profile.component.scss +++ b/dmp-frontend/src/app/ui/user-profile/user-profile.component.scss @@ -121,6 +121,65 @@ cursor: pointer; } +.vertical-line { + border-left: 2px solid #129d99; +} + +.email-title { + margin-top: 1.6875rem; + letter-spacing: 0.15px; + color: #a8a8a8; + opacity: 1; +} + +.mail-text { + cursor: pointer; + line-height: 2; + letter-spacing: 0.15px; + color: #212121; +} + +// .mail-text:hover { +// background-color: #f4f8f9; +// } + +.check-icon { + color: #129d99; + transform: scale(0.75); +} + +.clear-icon { + color: #f16868; + cursor: pointer; +} + +.add-new-btn { + margin-top: 2rem; +} + +.add-mail { + padding-left: 22px; + line-height: 2rem; + cursor: pointer; + + mat-icon { + color: #129d99; + display: inline-flex; + vertical-align: middle; + } + + span { + font-weight: 500; + letter-spacing: -0.35px; + color: #212121; + opacity: 1; + } +} + +.add-mail:hover { + background-color: #f4f8f9; +} + ::ng-deep .name-form .mat-form-field-appearance-outline .mat-form-field-outline { background: #fafafa !important; } diff --git a/dmp-frontend/src/app/ui/user-profile/user-profile.component.ts b/dmp-frontend/src/app/ui/user-profile/user-profile.component.ts index 534e5c0c3..5d4901523 100644 --- a/dmp-frontend/src/app/ui/user-profile/user-profile.component.ts +++ b/dmp-frontend/src/app/ui/user-profile/user-profile.component.ts @@ -22,6 +22,9 @@ import { ExternalSourcesService } from '@app/core/services/external-sources/exte import { UserProfileEditorModel } from './user-profile-editor.model'; import { RoleOrganizationType } from '@app/core/common/enum/role-organization-type'; import { EnumUtils } from '@app/core/services/utilities/enum-utils.service'; +import { AddAccountDialogComponent } from './add-account/add-account-dialog.component'; +import { MatDialog } from '@angular/material'; +import { UserCredentialModel } from '@app/core/model/user/user-credential'; const availableLanguages: any[] = require('../../../assets/resources/language.json'); @@ -34,6 +37,7 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes userProfileEditorModel: UserProfileEditorModel; user: Observable; + userCredentials: UserCredentialModel[]; currentUserId: string; cultures: Observable; timezones: Observable; @@ -64,6 +68,7 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes private languageService: LanguageService, private configurationService: ConfigurationService, private oauth2DialogService: Oauth2DialogService, + private dialog: MatDialog, public enumUtils: EnumUtils ) { super(); } @@ -97,6 +102,11 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes this.unlock(); return result; })); + + this.userService.getEmails(userId).pipe(takeUntil(this._destroyed)) + .subscribe(result => { + this.userCredentials = result; + }); }); } @@ -237,4 +247,22 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes .subscribe(() => this.router.navigate(['/reload']).then(() => this.router.navigate(['/profile']))); } + public removeAccount() { + + } + + public addAccount() { + const dialogRef = this.dialog.open(AddAccountDialogComponent, { + restoreFocus: false, + autoFocus: false, + width: '603px', + data: { + } + }); + dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => { + if (result) { + } + }); + } + } diff --git a/dmp-frontend/src/app/ui/user-profile/user-profile.module.ts b/dmp-frontend/src/app/ui/user-profile/user-profile.module.ts index 0c28ce678..ac528e61c 100644 --- a/dmp-frontend/src/app/ui/user-profile/user-profile.module.ts +++ b/dmp-frontend/src/app/ui/user-profile/user-profile.module.ts @@ -3,6 +3,7 @@ import { FormattingModule } from '@app/core/formatting.module'; import { AutoCompleteModule } from '@app/library/auto-complete/auto-complete.module'; import { CommonFormsModule } from '@common/forms/common-forms.module'; import { CommonUiModule } from '@common/ui/common-ui.module'; +import { AddAccountDialogComponent } from './add-account/add-account-dialog.component'; import { UserProfileComponent } from './user-profile.component'; import { UserProfileRoutingModule } from './user-profile.routing'; @@ -15,7 +16,11 @@ import { UserProfileRoutingModule } from './user-profile.routing'; AutoCompleteModule ], declarations: [ - UserProfileComponent + UserProfileComponent, + AddAccountDialogComponent + ], + entryComponents: [ + AddAccountDialogComponent ] }) export class UserProfileModule { } diff --git a/dmp-frontend/src/assets/i18n/de.json b/dmp-frontend/src/assets/i18n/de.json index 3195a88fd..84bcb3b00 100644 --- a/dmp-frontend/src/assets/i18n/de.json +++ b/dmp-frontend/src/assets/i18n/de.json @@ -1368,7 +1368,8 @@ "ROLE": "Rolle", "SELECT-ROLE": "Select Role", "ACCOUNTS": "Accounts", - "EMAILS": "Emails" + "EMAILS": "Emails", + "YOUR-EMAIL": "Your Email" }, "ASSOCIATED-DMPS": "Zugehörige DMPs", "DMPS": { @@ -1400,7 +1401,10 @@ }, "ACTIONS": { "SAVE": "Save", - "ADD-NEW": "Add new" + "ADD-NEW": "Add new", + "ADD-NEW-ACCOUNT": "Add new account", + "ADD": "Add", + "CANCEL": "Cancel" } }, "DATASET-REFERENCED-MODELS": { diff --git a/dmp-frontend/src/assets/i18n/en.json b/dmp-frontend/src/assets/i18n/en.json index db9f476b4..c7ef4bab4 100644 --- a/dmp-frontend/src/assets/i18n/en.json +++ b/dmp-frontend/src/assets/i18n/en.json @@ -1368,7 +1368,8 @@ "ROLE": "Role", "SELECT-ROLE": "Select Role", "ACCOUNTS": "Accounts", - "EMAILS": "Emails" + "EMAILS": "Emails", + "YOUR-EMAIL": "Your Email" }, "ASSOCIATED-DMPS": "Associated DMPs", "DMPS": { @@ -1400,7 +1401,10 @@ }, "ACTIONS": { "SAVE": "Save", - "ADD-NEW": "Add new" + "ADD-NEW": "Add new", + "ADD-NEW-ACCOUNT": "Add new account", + "ADD": "Add", + "CANCEL": "Cancel" } }, "DATASET-REFERENCED-MODELS": { diff --git a/dmp-frontend/src/assets/i18n/es.json b/dmp-frontend/src/assets/i18n/es.json index c8edb246f..371d6be5f 100644 --- a/dmp-frontend/src/assets/i18n/es.json +++ b/dmp-frontend/src/assets/i18n/es.json @@ -1368,7 +1368,8 @@ "ROLE": "Role", "SELECT-ROLE": "Select Role", "ACCOUNTS": "Accounts", - "EMAILS": "Emails" + "EMAILS": "Emails", + "YOUR-EMAIL": "Your Email" }, "ASSOCIATED-DMPS": "PGDs asociados", "DMPS": { @@ -1400,7 +1401,10 @@ }, "ACTIONS": { "SAVE": "Save", - "ADD-NEW": "Add new" + "ADD-NEW": "Add new", + "ADD-NEW-ACCOUNT": "Add new account", + "ADD": "Add", + "CANCEL": "Cancel" } }, "DATASET-REFERENCED-MODELS": { diff --git a/dmp-frontend/src/assets/i18n/gr.json b/dmp-frontend/src/assets/i18n/gr.json index 604ae7388..fff083cd2 100644 --- a/dmp-frontend/src/assets/i18n/gr.json +++ b/dmp-frontend/src/assets/i18n/gr.json @@ -1368,7 +1368,8 @@ "ROLE": "Ρόλος", "SELECT-ROLE": "Select Role", "ACCOUNTS": "Accounts", - "EMAILS": "Emails" + "EMAILS": "Emails", + "YOUR-EMAIL": "Your Email" }, "ASSOCIATED-DMPS": "Συσχετιζόμενα Σχέδια Διαχείρισης Δεδομένων", "DMPS": { @@ -1400,7 +1401,10 @@ }, "ACTIONS": { "SAVE": "Save", - "ADD-NEW": "Add new" + "ADD-NEW": "Add new", + "ADD-NEW-ACCOUNT": "Add new account", + "ADD": "Add", + "CANCEL": "Cancel" } }, "DATASET-REFERENCED-MODELS": { diff --git a/dmp-frontend/src/assets/i18n/sk.json b/dmp-frontend/src/assets/i18n/sk.json index ab38bcdd8..ba760a1d3 100644 --- a/dmp-frontend/src/assets/i18n/sk.json +++ b/dmp-frontend/src/assets/i18n/sk.json @@ -1368,7 +1368,8 @@ "ROLE": "Rola", "SELECT-ROLE": "Select Role", "ACCOUNTS": "Accounts", - "EMAILS": "Emails" + "EMAILS": "Emails", + "YOUR-EMAIL": "Your Email" }, "ASSOCIATED-DMPS": "Pridružené DMP", "DMPS": { @@ -1400,7 +1401,10 @@ }, "ACTIONS": { "SAVE": "Save", - "ADD-NEW": "Add new" + "ADD-NEW": "Add new", + "ADD-NEW-ACCOUNT": "Add new account", + "ADD": "Add", + "CANCEL": "Cancel" } }, "DATASET-REFERENCED-MODELS": { diff --git a/dmp-frontend/src/assets/i18n/tr.json b/dmp-frontend/src/assets/i18n/tr.json index 0b6040591..c88b578cf 100644 --- a/dmp-frontend/src/assets/i18n/tr.json +++ b/dmp-frontend/src/assets/i18n/tr.json @@ -1368,7 +1368,8 @@ "ROLE": "Görev", "SELECT-ROLE": "Select Role", "ACCOUNTS": "Accounts", - "EMAILS": "Emails" + "EMAILS": "Emails", + "YOUR-EMAIL": "Your Email" }, "ASSOCIATED-DMPS": "İlişkili VYP'ları", "DMPS": { @@ -1400,7 +1401,10 @@ }, "ACTIONS": { "SAVE": "Save", - "ADD-NEW": "Add new" + "ADD-NEW": "Add new", + "ADD-NEW-ACCOUNT": "Add new account", + "ADD": "Add", + "CANCEL": "Cancel" } }, "DATASET-REFERENCED-MODELS": {