277 lines
11 KiB
TypeScript
277 lines
11 KiB
TypeScript
import {AfterViewInit, ChangeDetectorRef, Component, Input, OnDestroy, OnInit, ViewChild} from "@angular/core";
|
|
import {User} from "../login/utils/helper.class";
|
|
import {ActivatedRoute, Router} from "@angular/router";
|
|
import {UserManagementService} from "../services/user-management.service";
|
|
import {UserRegistryService} from "../services/user-registry.service";
|
|
import {LoginErrorCodes} from "../login/utils/guardHelper.class";
|
|
import {Subscriber, Subscription} from "rxjs";
|
|
import {UntypedFormBuilder, UntypedFormControl, Validators} from "@angular/forms";
|
|
import {AlertModal} from "../utils/modal/alert";
|
|
import {properties} from "../../../environments/environment";
|
|
import {EmailService} from "../utils/email/email.service";
|
|
import {Composer} from "../utils/email/composer";
|
|
import {ClearCacheService} from "../services/clear-cache.service";
|
|
|
|
@Component({
|
|
selector: 'role-verification',
|
|
template: `
|
|
<modal-alert #managerModal [overflowBody]="false" (alertOutput)="verifyManager()" (cancelOutput)="cancel()"
|
|
[okDisabled]="code.invalid || loading">
|
|
<div>
|
|
You have been invited to join <span
|
|
class="uk-text-bold">{{name}}</span> {{(service === 'monitor' ? 'Monitor' : 'Research Community')}} Dashboard
|
|
as a manager.
|
|
<span class="uk-text-primary">Fill</span> in the <span class="uk-text-primary">verification code</span>, sent to
|
|
your
|
|
email, to accept the invitation request.
|
|
</div>
|
|
<div *ngIf="!loading" class="uk-margin-medium-top uk-flex uk-flex-center">
|
|
<div input [formInput]="code" class="uk-width-medium" placeholder="Verification code">
|
|
<span *ngIf="error" error>{{error}}</span>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="loading" class="uk-margin-medium-top uk-flex uk-flex-center">
|
|
<loading></loading>
|
|
</div>
|
|
</modal-alert>
|
|
<modal-alert #memberModal [overflowBody]="false" *ngIf="service == 'monitor'" (cancelOutput)="cancel()"
|
|
(alertOutput)="verifyMember()" [okDisabled]="(code.invalid || loading) && !isMember">
|
|
<div *ngIf="!isMember">
|
|
<div>
|
|
You have been invited to join <span class="uk-text-bold">{{name}}</span> Monitor Dashboard as a member.
|
|
<span class="uk-text-primary">Fill</span> in the <span class="uk-text-primary">verification code</span>, sent
|
|
to
|
|
your
|
|
email, to accept the invitation request.
|
|
</div>
|
|
<div *ngIf="!loading" class="uk-margin-medium-top uk-flex uk-flex-wrap uk-flex-center">
|
|
<div input [formInput]="code" class="uk-width-medium" placeholder="Verification code">
|
|
<span *ngIf="error" error>{{error}}</span>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="loading" class="uk-margin-medium-top">
|
|
<loading></loading>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="isMember">
|
|
<div>
|
|
Welcome! You are now a member of the OpenAIRE Monitor Dashboard for the <span
|
|
class="uk-text-bold">{{name}}</span>!
|
|
From now on, you will have access to our restricted content.
|
|
</div>
|
|
</div>
|
|
</modal-alert>
|
|
<modal-alert #errorModal (alertOutput)="cancel()" [overflowBody]="false">
|
|
<div>
|
|
We are unable to process the request. What happened?
|
|
<ul class="uk-margin-top uk-list uk-list-circle uk-list-primary">
|
|
<li>You are logged in with a different email, than the one you have received the invitation.
|
|
Check
|
|
<a *ngIf="!userInfoLink" [routerLink]="[userInfoLinkPrefix + '/user-info']" (click)="errorModal.cancel()">here</a>
|
|
<a *ngIf="userInfoLink" [href]="userInfoLink" (click)="errorModal.cancel()">here</a>
|
|
the email of your account.</li>
|
|
<li>The invitation has been canceled.</li>
|
|
<li>The URL is invalid.</li>
|
|
</ul>
|
|
</div>
|
|
</modal-alert>
|
|
`
|
|
})
|
|
export class RoleVerificationComponent implements OnInit, OnDestroy, AfterViewInit {
|
|
@Input()
|
|
public id: string;
|
|
@Input()
|
|
public type: string;
|
|
@Input()
|
|
public name: string;
|
|
@Input()
|
|
public service: "connect" | "monitor" = "monitor";
|
|
@Input()
|
|
public userInfoLinkPrefix = '';
|
|
@Input()
|
|
public userInfoLink = null;
|
|
public user: User;
|
|
public verification: any;
|
|
public code: UntypedFormControl;
|
|
private subscriptions: any[] = [];
|
|
private paramsSubscription: Subscription;
|
|
@ViewChild('managerModal') managerModal: AlertModal;
|
|
@ViewChild('memberModal') memberModal: AlertModal;
|
|
@ViewChild('errorModal') errorModal: AlertModal;
|
|
public error: string = null;
|
|
public loading: boolean = false;
|
|
public isMember: boolean = false;
|
|
|
|
constructor(private route: ActivatedRoute,
|
|
private router: Router,
|
|
private fb: UntypedFormBuilder,
|
|
private emailService: EmailService,
|
|
private userManagementService: UserManagementService,
|
|
private userRegistryService: UserRegistryService,
|
|
private clearCacheService: ClearCacheService,
|
|
private cdr: ChangeDetectorRef) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
this.reset();
|
|
}
|
|
|
|
ngAfterViewInit() {
|
|
this.subscriptions.push(this.userManagementService.getUserInfo().subscribe(user => {
|
|
this.user = user;
|
|
if (this.paramsSubscription instanceof Subscription) {
|
|
this.paramsSubscription.unsubscribe();
|
|
}
|
|
this.paramsSubscription = this.route.queryParams.subscribe(params => {
|
|
if (params) {
|
|
this.isMember = !!params['isMember'];
|
|
this.cdr.detectChanges();
|
|
if(params['verify'] && !this.isMember) {
|
|
if (this.user) {
|
|
this.subscriptions.push(this.userRegistryService.getInvitation(params['verify']).subscribe(verification => {
|
|
this.verification = verification;
|
|
if (this.user.email === this.verification.email.toLowerCase() && this.id === this.verification.entity && this.type === this.verification.type) {
|
|
if (this.verification.verificationType === 'manager') {
|
|
this.openManagerModal();
|
|
} else if (this.verification.verificationType === 'member' && this.service === "monitor") {
|
|
this.openMemberModal();
|
|
} else {
|
|
this.openErrorModal();
|
|
}
|
|
} else {
|
|
this.openErrorModal();
|
|
}
|
|
}, error => {
|
|
this.openErrorModal();
|
|
}));
|
|
} else {
|
|
this.router.navigate(['user-info'], {
|
|
queryParams: {
|
|
'errorCode': LoginErrorCodes.NOT_LOGIN,
|
|
'redirectUrl': this.router.url
|
|
},
|
|
relativeTo: this.route
|
|
});
|
|
}
|
|
} else if(this.isMember) {
|
|
this.openMemberModal();
|
|
}
|
|
} else {
|
|
this.isMember = false;
|
|
this.cdr.detectChanges();
|
|
}
|
|
});
|
|
}));
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
if (this.paramsSubscription instanceof Subscription) {
|
|
this.paramsSubscription.unsubscribe();
|
|
}
|
|
this.subscriptions.forEach(subscription => {
|
|
if (subscription instanceof Subscriber) {
|
|
subscription.unsubscribe();
|
|
}
|
|
});
|
|
}
|
|
|
|
public openManagerModal() {
|
|
this.error = null;
|
|
this.managerModal.okButtonLeft = false;
|
|
this.managerModal.okButtonText = 'Accept';
|
|
this.managerModal.stayOpen = true;
|
|
this.managerModal.cancelButtonText = 'Cancel';
|
|
this.managerModal.alertTitle = 'Manager Invitation';
|
|
this.managerModal.open();
|
|
}
|
|
|
|
public openMemberModal() {
|
|
this.error = null;
|
|
if(this.isMember) {
|
|
this.memberModal.cancelButton = false;
|
|
this.memberModal.okButtonText = 'Close';
|
|
} else {
|
|
this.memberModal.cancelButton = true;
|
|
this.memberModal.okButtonText = 'Accept';
|
|
}
|
|
this.memberModal.okButtonLeft = false;
|
|
this.memberModal.stayOpen = true;
|
|
this.memberModal.cancelButtonText = 'Cancel';
|
|
this.memberModal.alertTitle = 'Member Invitation';
|
|
this.cdr.detectChanges();
|
|
this.memberModal.open();
|
|
}
|
|
|
|
public openErrorModal() {
|
|
this.error = null;
|
|
this.errorModal.cancelButton = false;
|
|
this.errorModal.okButtonText = 'Ok';
|
|
this.errorModal.alertTitle = 'Invalid URL';
|
|
this.errorModal.open();
|
|
}
|
|
|
|
public verifyManager() {
|
|
this.loading = true;
|
|
this.subscriptions.push(this.userRegistryService.verify(this.verification.id, this.code.value).subscribe(() => {
|
|
this.clearCacheService.clearCache('Managers updated');
|
|
this.managerModal.cancel();
|
|
this.error = null;
|
|
this.userManagementService.updateUserInfo(() => {
|
|
if (this.service === "monitor") {
|
|
this.loading = false;
|
|
this.router.navigate(['/admin/' + this.verification.entity]);
|
|
} else {
|
|
this.subscriptions.push(this.emailService.notifyManagers(this.id, 'manager',
|
|
Composer.composeEmailToInformOldManagersForTheNewOnes(this.name, this.id)).subscribe(() => {
|
|
this.subscriptions.push(this.emailService.notifyNewManager(Composer.composeEmailForNewManager(this.id, this.name)).subscribe(
|
|
() => {
|
|
this.loading = false;
|
|
window.location.href = properties.adminPortalURL + '/' + this.verification.entity;
|
|
},
|
|
error1 => {
|
|
console.error(error1);
|
|
this.loading = false;
|
|
window.location.href = properties.adminPortalURL + '/' + this.verification.entity;
|
|
}
|
|
));
|
|
}, error => {
|
|
console.error(error);
|
|
this.loading = false;
|
|
window.location.href = properties.adminPortalURL + '/' + this.verification.entity;
|
|
}));
|
|
}
|
|
});
|
|
}, error => {
|
|
this.loading = false;
|
|
this.error = 'The verification code is invalid';
|
|
}));
|
|
}
|
|
|
|
public verifyMember() {
|
|
this.loading = true;
|
|
if (!this.isMember) {
|
|
this.subscriptions.push(this.userRegistryService.verify(this.verification.id, this.code.value, "member").subscribe(() => {
|
|
this.clearCacheService.clearCache('Members updated');
|
|
this.loading = false;
|
|
this.error = null;
|
|
this.userManagementService.updateUserInfo(() => {
|
|
this.router.navigate([], {queryParams: {'verify': null, 'isMember': true}});
|
|
});
|
|
}, error => {
|
|
this.loading = false;
|
|
this.error = 'The verification code is invalid';
|
|
}));
|
|
} else {
|
|
this.memberModal.cancel();
|
|
}
|
|
}
|
|
|
|
public reset() {
|
|
this.code = this.fb.control('', [Validators.required, Validators.pattern('^[+0-9]{6}$')]);
|
|
}
|
|
|
|
cancel() {
|
|
this.router.navigate([], {queryParams: {'verify': null, 'isMember': null}});
|
|
}
|
|
}
|