add-account functionality from my-profile and styling changes
This commit is contained in:
parent
49164dac9b
commit
190317a413
|
@ -75,3 +75,7 @@ export interface DmpAssociatedUser {
|
||||||
name: string;
|
name: string;
|
||||||
email: string;
|
email: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface UserMergeRequestPersist {
|
||||||
|
email: string;
|
||||||
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http';
|
import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http';
|
||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import { IsActive } from '@app/core/common/enum/is-active.enum';
|
import { IsActive } from '@app/core/common/enum/is-active.enum';
|
||||||
import { DmpAssociatedUser, User, UserPersist, UserRolePatchPersist } from '@app/core/model/user/user';
|
import { DmpAssociatedUser, User, UserMergeRequestPersist, UserPersist, UserRolePatchPersist } from '@app/core/model/user/user';
|
||||||
import { UserLookup } from '@app/core/query/user.lookup';
|
import { UserLookup } from '@app/core/query/user.lookup';
|
||||||
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
||||||
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
|
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
|
||||||
|
@ -99,6 +99,14 @@ export class UserService {
|
||||||
return this.http.post(url, formData, { params: params });
|
return this.http.post(url, formData, { params: params });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
mergeAccount(item: UserMergeRequestPersist): Observable<boolean> {
|
||||||
|
const url = `${this.apiBase}/mine/merge-account-request`;
|
||||||
|
|
||||||
|
return this.http
|
||||||
|
.post<boolean>(url, item).pipe(
|
||||||
|
catchError((error: any) => throwError(error)));
|
||||||
|
}
|
||||||
|
|
||||||
//
|
//
|
||||||
// Autocomplete Commons
|
// Autocomplete Commons
|
||||||
//
|
//
|
||||||
|
|
|
@ -1,5 +1,21 @@
|
||||||
<h2 mat-dialog-title>{{notification.title}}</h2>
|
<div class="dialog-wrapper">
|
||||||
<mat-dialog-content>{{notification.message}}</mat-dialog-content>
|
<div mat-dialog-title class="row d-flex mb-4">
|
||||||
<mat-dialog-actions class="d-flex">
|
<div class="col p-0">
|
||||||
|
<span>
|
||||||
|
{{notification.title}}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row mt-2 mb-4">
|
||||||
|
<div class="col-12">
|
||||||
|
<span>
|
||||||
|
{{notification.message}}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row justify-content-end">
|
||||||
|
<div class="col-auto">
|
||||||
<button class="ml-auto" mat-button mat-dialog-close>{{'GENERAL.NOTIFICATION-DIALOG.POPUP.CLOSE' | translate}}</button>
|
<button class="ml-auto" mat-button mat-dialog-close>{{'GENERAL.NOTIFICATION-DIALOG.POPUP.CLOSE' | translate}}</button>
|
||||||
</mat-dialog-actions>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
.dialog-wrapper {
|
||||||
|
padding: 2.0rem;
|
||||||
|
width: 40vw;
|
||||||
|
}
|
|
@ -4,7 +4,8 @@ import { PopupNotification } from '../../../core/services/notification/ui-notifi
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-popup-notification-dialog',
|
selector: 'app-popup-notification-dialog',
|
||||||
templateUrl: './popup-notification.component.html'
|
templateUrl: './popup-notification.component.html',
|
||||||
|
styleUrls: ['popup-notification.component.scss']
|
||||||
})
|
})
|
||||||
export class PopupNotificationDialogComponent {
|
export class PopupNotificationDialogComponent {
|
||||||
|
|
||||||
|
|
|
@ -1,20 +1,27 @@
|
||||||
<div class="template-container">
|
<div class="template-container">
|
||||||
<div mat-dialog-title class="row d-flex m-0">
|
<div mat-dialog-title class="row d-flex mb-4">
|
||||||
<h1 mat-dialog-title class="title">{{'USER-PROFILE.ACTIONS.LINK-NEW-ACCOUNT' | translate}}</h1>
|
<div class="col p-0">
|
||||||
<span class="ml-auto align-self-center" (click)="closeDialog()"><mat-icon class="close-icon">close</mat-icon></span>
|
<span class="title">{{'USER-PROFILE.ACTIONS.LINK-NEW-ACCOUNT' | translate}}</span>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto p-0">
|
||||||
|
<mat-icon class="close-icon" (click)="closeDialog()">close</mat-icon>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- <app-login *ngIf="hasEmail" [mergeUsers]="true" redirect="false"></app-login> -->
|
<!-- <app-login *ngIf="hasEmail" [mergeUsers]="true" redirect="false"></app-login> -->
|
||||||
<div *ngIf="!hasEmail">
|
<!-- <div *ngIf="!hasEmail"> -->
|
||||||
<div mat-dialog-content class="definition-content pt-2">
|
<div class="row mt-2 mb-4">
|
||||||
<mat-form-field class="full-width">
|
<div class="col-12">
|
||||||
<input matInput placeholder="{{'USER-PROFILE.SETTINGS.YOUR-EMAIL' | translate}}">
|
<mat-form-field class="w-100">
|
||||||
|
<input required matInput [formControl]="form.get('email')" placeholder="{{'USER-PROFILE.SETTINGS.YOUR-EMAIL' | translate}}">
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
<div mat-mat-dialog-actions>
|
|
||||||
<div class="col-auto d-flex pb-2 pt-2">
|
|
||||||
<button mat-raised-button type="button" class="cancel-btn ml-auto" (click)="cancel()">{{'USER-PROFILE.ACTIONS.CANCEL' | translate}}</button>
|
|
||||||
<button mat-raised-button type="button" class="add-btn ml-4" (click)="add()">{{'USER-PROFILE.ACTIONS.ADD' | translate}}</button>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="row justify-content-end">
|
||||||
|
<div class="col-auto">
|
||||||
|
<button mat-raised-button type="button" class="cancel-btn ml-auto" (click)="cancel()">{{'USER-PROFILE.ACTIONS.CANCEL' | translate}}</button>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button mat-raised-button type="button" class="add-btn ml-4" (click)="add()" [disabled]="!form.valid">{{'USER-PROFILE.ACTIONS.ADD' | translate}}</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,4 +1,8 @@
|
||||||
.template-container {
|
.template-container {
|
||||||
|
|
||||||
|
width: 40vw;
|
||||||
|
padding: 2.0rem;
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { Component, Inject, OnInit } from '@angular/core';
|
import { Component, Inject, OnInit } from '@angular/core';
|
||||||
import { UntypedFormGroup } from '@angular/forms';
|
import { FormBuilder, FormGroup, UntypedFormGroup, Validators } from '@angular/forms';
|
||||||
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
|
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -13,18 +13,22 @@ export class AddAccountDialogComponent implements OnInit {
|
||||||
datasetProfileDefinitionModel: any;
|
datasetProfileDefinitionModel: any;
|
||||||
datasetProfileDefinitionFormGroup: UntypedFormGroup;
|
datasetProfileDefinitionFormGroup: UntypedFormGroup;
|
||||||
progressIndication = false;
|
progressIndication = false;
|
||||||
public hasEmail = true;
|
form: FormGroup;
|
||||||
|
// public hasEmail = true;
|
||||||
//TODO: refactor
|
//TODO: refactor
|
||||||
private request: any;
|
// private request: any;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
|
private formBuilder: FormBuilder,
|
||||||
public dialogRef: MatDialogRef<AddAccountDialogComponent>,
|
public dialogRef: MatDialogRef<AddAccountDialogComponent>,
|
||||||
@Inject(MAT_DIALOG_DATA) public data: any
|
@Inject(MAT_DIALOG_DATA) public data: any
|
||||||
) {
|
) { }
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
|
this.form = this.formBuilder.group({
|
||||||
|
email: [this.data.email, [Validators.required, Validators.email]]
|
||||||
|
});
|
||||||
|
|
||||||
//TODO refactor
|
//TODO refactor
|
||||||
// this.mergeLoginService.getObservable().subscribe(result => {
|
// this.mergeLoginService.getObservable().subscribe(result => {
|
||||||
// if (result !== undefined) {
|
// if (result !== undefined) {
|
||||||
|
@ -39,16 +43,14 @@ export class AddAccountDialogComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
add(): void {
|
add(): void {
|
||||||
this.request.email = 'email';
|
this.closeDialog(this.form.value);
|
||||||
this.dialogRef.close(this.request);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
cancel(): void {
|
cancel(): void {
|
||||||
this.dialogRef.close();
|
this.closeDialog();
|
||||||
}
|
}
|
||||||
|
|
||||||
closeDialog(): void {
|
closeDialog(data?: any): void {
|
||||||
this.dialogRef.close();
|
this.dialogRef.close(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -330,13 +330,30 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes
|
||||||
const dialogRef = this.dialog.open(AddAccountDialogComponent, {
|
const dialogRef = this.dialog.open(AddAccountDialogComponent, {
|
||||||
restoreFocus: false,
|
restoreFocus: false,
|
||||||
autoFocus: false,
|
autoFocus: false,
|
||||||
width: '653px',
|
// width: '653px',
|
||||||
maxHeight: '90vh',
|
// maxHeight: '90vh',
|
||||||
data: {
|
data: {
|
||||||
|
email: ''
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
|
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
|
||||||
if (result) {
|
if (result) {
|
||||||
|
console.log('email result:');
|
||||||
|
console.log(result);
|
||||||
|
this.userService.mergeAccount({ email: result.email })
|
||||||
|
.subscribe(result => {
|
||||||
|
if (result) {
|
||||||
|
this.dialog.open(PopupNotificationDialogComponent, {
|
||||||
|
data: {
|
||||||
|
title: this.language.instant('USER-PROFILE.MERGING-EMAILS-DIALOG.TITLE'),
|
||||||
|
message: this.language.instant('USER-PROFILE.MERGING-EMAILS-DIALOG.MESSAGE')
|
||||||
|
}//, maxWidth: '30em'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error => console.error(error)); //TODO how to handle this
|
||||||
|
|
||||||
|
|
||||||
//TODO refactor
|
//TODO refactor
|
||||||
// this.mergeEmailConfirmation.sendConfirmationEmail(result).pipe(takeUntil(this._destroyed))
|
// this.mergeEmailConfirmation.sendConfirmationEmail(result).pipe(takeUntil(this._destroyed))
|
||||||
// .subscribe(res => {
|
// .subscribe(res => {
|
||||||
|
|
Loading…
Reference in New Issue