Fix all dashboard modals heights. Role verification remove custom buttons.

This commit is contained in:
Konstantinos Triantafyllou 2022-06-20 16:17:26 +03:00
parent d01ba65537
commit cc417adb6b
19 changed files with 74 additions and 112 deletions

View File

@ -100,4 +100,4 @@
<div input [formInput]="classForm.get('portalType')" placeholder="Portal Type" [options]="portalUtils.portalTypes" type="select"></div> <div input [formInput]="classForm.get('portalType')" placeholder="Portal Type" [options]="portalUtils.portalTypes" type="select"></div>
</form> </form>
</modal-alert> </modal-alert>
<modal-alert #deleteModal (alertOutput)="confirmedDeleteDivIds($event)"></modal-alert> <modal-alert #deleteModal [overflowBody]="false" (alertOutput)="confirmedDeleteDivIds($event)"></modal-alert>

View File

@ -132,8 +132,6 @@ export class DivIdsComponent implements OnInit {
} }
private confirmModalOpen() { private confirmModalOpen() {
this.deleteModal.cancelButton = true;
this.deleteModal.okButton = true;
this.deleteModal.alertTitle = "Delete Confirmation"; this.deleteModal.alertTitle = "Delete Confirmation";
this.deleteModal.message = "Are you sure you want to delete the selected class(es)?"; this.deleteModal.message = "Are you sure you want to delete the selected class(es)?";
this.deleteModal.okButtonText = "Yes"; this.deleteModal.okButtonText = "Yes";
@ -189,8 +187,6 @@ export class DivIdsComponent implements OnInit {
} }
private divIdsModalOpen(title: string, yesBtn: string) { private divIdsModalOpen(title: string, yesBtn: string) {
this.editModal.cancelButton = true;
this.editModal.okButton = true;
this.editModal.okButtonLeft = false; this.editModal.okButtonLeft = false;
this.editModal.alertTitle = title; this.editModal.alertTitle = title;
this.editModal.okButtonText = yesBtn; this.editModal.okButtonText = yesBtn;

View File

@ -148,8 +148,6 @@ export class ClassHelpContentsComponent implements OnInit {
} }
private confirmModalOpen() { private confirmModalOpen() {
this.alertModalDeletePageHelpContents.cancelButton = true;
this.alertModalDeletePageHelpContents.okButton = true;
this.alertModalDeletePageHelpContents.alertTitle = 'Delete Confirmation'; this.alertModalDeletePageHelpContents.alertTitle = 'Delete Confirmation';
this.alertModalDeletePageHelpContents.message = 'Are you sure you want to delete the selected page content(s)?'; this.alertModalDeletePageHelpContents.message = 'Are you sure you want to delete the selected page content(s)?';
this.alertModalDeletePageHelpContents.okButtonText = 'Yes'; this.alertModalDeletePageHelpContents.okButtonText = 'Yes';

View File

@ -117,6 +117,5 @@
<div input [formInput]="entityForm.get('pid')" placeholder="Entity Pid"></div> <div input [formInput]="entityForm.get('pid')" placeholder="Entity Pid"></div>
</form> </form>
</modal-alert> </modal-alert>
<modal-alert #relatedPages (alertOutput)="continueToggling($event)"></modal-alert> <modal-alert #relatedPages [overflowBody]="false" (alertOutput)="continueToggling($event)"></modal-alert>
<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="confirmedDeleteEntities($event)"></modal-alert>
<modal-alert #deleteModal (alertOutput)="confirmedDeleteEntities($event)"></modal-alert>

View File

@ -176,8 +176,6 @@ export class EntitiesComponent implements OnInit {
} }
private confirmDeleteEntitiesModalOpen() { private confirmDeleteEntitiesModalOpen() {
this.deleteModal.cancelButton = true;
this.deleteModal.okButton = true;
this.deleteModal.alertTitle = 'Delete Confirmation'; this.deleteModal.alertTitle = 'Delete Confirmation';
this.deleteModal.message = 'Are you sure you want to delete the selected entity(-ies)?'; this.deleteModal.message = 'Are you sure you want to delete the selected entity(-ies)?';
this.deleteModal.okButtonText = 'Yes'; this.deleteModal.okButtonText = 'Yes';
@ -221,8 +219,6 @@ export class EntitiesComponent implements OnInit {
} }
private entitiesModalOpen(title: string, yesBtn: string) { private entitiesModalOpen(title: string, yesBtn: string) {
this.editModal.cancelButton = true;
this.editModal.okButton = true;
this.editModal.okButtonLeft = false; this.editModal.okButtonLeft = false;
this.editModal.alertTitle = title; this.editModal.alertTitle = title;
this.editModal.okButtonText = yesBtn; this.editModal.okButtonText = yesBtn;
@ -333,8 +329,6 @@ export class EntitiesComponent implements OnInit {
} }
private confirmRelatedPagesModalOpen() { private confirmRelatedPagesModalOpen() {
this.relatedPages.cancelButton = true;
this.relatedPages.okButton = true;
this.relatedPages.alertTitle = 'Warning'; this.relatedPages.alertTitle = 'Warning';
this.relatedPages.message = "This action will affect all search pages related to this entity! Pages' status will change to entity's status! Do you want to continue?"; this.relatedPages.message = "This action will affect all search pages related to this entity! Pages' status will change to entity's status! Do you want to continue?";
this.relatedPages.okButtonText = 'Yes'; this.relatedPages.okButtonText = 'Yes';

View File

@ -152,8 +152,6 @@ export class PageHelpContentsComponent implements OnInit {
} }
private confirmModalOpen() { private confirmModalOpen() {
this.alertModalDeletePageHelpContents.cancelButton = true;
this.alertModalDeletePageHelpContents.okButton = true;
this.alertModalDeletePageHelpContents.alertTitle = 'Delete Confirmation'; this.alertModalDeletePageHelpContents.alertTitle = 'Delete Confirmation';
this.alertModalDeletePageHelpContents.message = 'Are you sure you want to delete the selected page content(s)?'; this.alertModalDeletePageHelpContents.message = 'Are you sure you want to delete the selected page content(s)?';
this.alertModalDeletePageHelpContents.okButtonText = 'Yes'; this.alertModalDeletePageHelpContents.okButtonText = 'Yes';

View File

@ -164,5 +164,4 @@
</div> </div>
</form> </form>
</modal-alert> </modal-alert>
<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="confirmedDeleteMenuItem($event)"></modal-alert>
<modal-alert #deleteModal (alertOutput)="confirmedDeleteMenuItem($event)"></modal-alert>

View File

@ -286,8 +286,6 @@ export class MenuComponent implements OnInit {
} }
private confirmModalOpen() { private confirmModalOpen() {
this.deleteModal.cancelButton = true;
this.deleteModal.okButton = true;
this.deleteModal.alertTitle = 'Delete Confirmation'; this.deleteModal.alertTitle = 'Delete Confirmation';
this.deleteModal.message = 'Are you sure you want to delete this menu item?'; this.deleteModal.message = 'Are you sure you want to delete this menu item?';
this.deleteModal.okButtonText = 'Yes'; this.deleteModal.okButtonText = 'Yes';
@ -328,8 +326,6 @@ export class MenuComponent implements OnInit {
} }
private menuItemsModalOpen(title: string, yesBtn: string) { private menuItemsModalOpen(title: string, yesBtn: string) {
this.editModal.cancelButton = true;
this.editModal.okButton = true;
this.editModal.okButtonLeft = false; this.editModal.okButtonLeft = false;
this.editModal.alertTitle = title; this.editModal.alertTitle = title;
this.editModal.okButtonText = yesBtn; this.editModal.okButtonText = yesBtn;

View File

@ -181,5 +181,4 @@
</form> </form>
</modal-alert> </modal-alert>
<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="confirmedDeletePages($event)"></modal-alert>
<modal-alert #deleteModal (alertOutput)="confirmedDeletePages($event)"></modal-alert>

View File

@ -225,8 +225,6 @@ export class PagesComponent implements OnInit {
} }
private confirmModalOpen() { private confirmModalOpen() {
this.deleteModal.cancelButton = true;
this.deleteModal.okButton = true;
this.deleteModal.alertTitle = 'Delete Confirmation'; this.deleteModal.alertTitle = 'Delete Confirmation';
this.deleteModal.message = 'Are you sure you want to delete the selected page(s)?'; this.deleteModal.message = 'Are you sure you want to delete the selected page(s)?';
this.deleteModal.okButtonText = 'Yes'; this.deleteModal.okButtonText = 'Yes';
@ -297,8 +295,6 @@ export class PagesComponent implements OnInit {
} }
private pagesModalOpen(title: string, yesBtn: string) { private pagesModalOpen(title: string, yesBtn: string) {
this.editModal.cancelButton = true;
this.editModal.okButton = true;
this.editModal.okButtonLeft = false; this.editModal.okButtonLeft = false;
this.editModal.alertTitle = title; this.editModal.alertTitle = title;
this.editModal.okButtonText = yesBtn; this.editModal.okButtonText = yesBtn;

View File

@ -98,4 +98,4 @@
</form> </form>
</modal-alert> </modal-alert>
<modal-alert #deleteModal (alertOutput)="confirmedDeletePortals($event)"></modal-alert> <modal-alert #deleteModal [overflowBody]="false" (alertOutput)="confirmedDeletePortals($event)"></modal-alert>

View File

@ -134,8 +134,6 @@ export class PortalsComponent implements OnInit {
} }
private confirmModalOpen() { private confirmModalOpen() {
this.deleteModal.cancelButton = true;
this.deleteModal.okButton = true;
this.deleteModal.alertTitle = 'Delete Confirmation'; this.deleteModal.alertTitle = 'Delete Confirmation';
this.deleteModal.message = 'Are you sure you want to delete the selected portal(-ies)?'; this.deleteModal.message = 'Are you sure you want to delete the selected portal(-ies)?';
this.deleteModal.okButtonText = 'Yes'; this.deleteModal.okButtonText = 'Yes';
@ -198,8 +196,6 @@ export class PortalsComponent implements OnInit {
}); });
} else { } else {
this.editModal.okButtonLeft = false; this.editModal.okButtonLeft = false;
this.editModal.cancelButton = true;
this.editModal.okButton = true;
this.editModal.alertTitle = title; this.editModal.alertTitle = title;
this.editModal.okButtonText = yesBtn; this.editModal.okButtonText = yesBtn;
this.editModal.open(); this.editModal.open();

View File

@ -75,29 +75,27 @@
</div> </div>
</div> </div>
</div> </div>
<modal-alert #inviteModal (alertOutput)="invite()" [okDisabled]="invited && invited.invalid"> <modal-alert #inviteModal (alertOutput)="invite()" [overflowBody]="false" [okDisabled]="invited && invited.invalid">
<div class="uk-padding uk-padding-remove-horizontal"> <div *ngIf="message" class="uk-margin-medium-bottom uk-text-small">
<div *ngIf="message" class="uk-margin-medium-bottom uk-text-small"> <div [innerHTML]="message | safeHtml"></div>
<div [innerHTML]="message | safeHtml"></div> </div>
</div> <div *ngIf="invited">
<div *ngIf="invited"> <div input [formInput]="invited"
<div input [formInput]="invited" placeholder="Email"></div>
placeholder="Email"></div> </div>
</div>
</div>
</modal-alert> </modal-alert>
<modal-alert #deleteModal (alertOutput)="deleteActive()"> <modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteActive()">
<div *ngIf="selectedUser" class="uk-padding-small uk-padding-remove-horizontal"> <div *ngIf="selectedUser">
Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from {{role}}s? Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from {{role}}s?
</div> </div>
</modal-alert> </modal-alert>
<modal-alert #deletePendingModal (alertOutput)="deletePending()"> <modal-alert #deletePendingModal [overflowBody]="false" (alertOutput)="deletePending()">
<div *ngIf="selectedUser" class="uk-padding-small uk-padding-remove-horizontal"> <div *ngIf="selectedUser">
Are you sure you want to cancel {{role}} invitation of <span class="uk-text-bold">{{selectedUser}}</span>? Are you sure you want to cancel {{role}} invitation of <span class="uk-text-bold">{{selectedUser}}</span>?
</div> </div>
</modal-alert> </modal-alert>
<modal-alert #createRoleModal (alertOutput)="createGroup()" [okDisabled]="roleFb && roleFb.invalid"> <modal-alert #createRoleModal [overflowBody]="false" (alertOutput)="createGroup()" [okDisabled]="roleFb && roleFb.invalid">
<div *ngIf="roleFb" class="uk-padding uk-padding-remove-horizontal"> <div *ngIf="roleFb">
<div class="uk-grid" uk-grid [formGroup]="roleFb"> <div class="uk-grid" uk-grid [formGroup]="roleFb">
<div input [formInput]="roleFb.get('name')" <div input [formInput]="roleFb.get('name')"
placeholder="Name" class="uk-width-1-1"></div> placeholder="Name" class="uk-width-1-1"></div>

View File

@ -79,12 +79,10 @@
</div> </div>
<modal-alert *ngIf="user" #inviteModal (alertOutput)="subscriberInvite.invite()" [okDisabled]="!subscriberInvite.valid" <modal-alert *ngIf="user" #inviteModal (alertOutput)="subscriberInvite.invite()" [okDisabled]="!subscriberInvite.valid"
[large]="true"> [large]="true">
<div class="uk-padding uk-padding-remove-horizontal">
<subscriber-invite #subscriberInvite [user]="user"></subscriber-invite> <subscriber-invite #subscriberInvite [user]="user"></subscriber-invite>
</div>
</modal-alert> </modal-alert>
<modal-alert #deleteModal (alertOutput)="deleteSubscriber()"> <modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteSubscriber()">
<div *ngIf="selectedUser" class="uk-padding-small uk-padding-remove-horizontal"> <div *ngIf="selectedUser">
Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from subscribers? Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from subscribers?
</div> </div>
</modal-alert> </modal-alert>

View File

@ -14,10 +14,14 @@ import {Composer} from "../utils/email/composer";
@Component({ @Component({
selector: 'role-verification', selector: 'role-verification',
template: ` template: `
<modal-alert #managerModal> <modal-alert #managerModal [overflowBody]="false" (alertOutput)="verifyManager()" (cancelOutput)="cancel()"
[okDisabled]="code.invalid || loading">
<div> <div>
You have been invited to join <span class="uk-text-bold">{{name}}</span> {{(service === 'monitor'?'Monitor':'Research Community')}} Dashboard as a manager. You have been invited to join <span
<span class="portal-color">Fill</span> in the <span class="portal-color">verification code</span>, sent to your 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. email, to accept the invitation request.
</div> </div>
<div *ngIf="!loading" class="uk-margin-medium-top uk-flex uk-flex-center"> <div *ngIf="!loading" class="uk-margin-medium-top uk-flex uk-flex-center">
@ -28,20 +32,14 @@ import {Composer} from "../utils/email/composer";
<div *ngIf="loading" class="uk-margin-medium-top uk-flex uk-flex-center"> <div *ngIf="loading" class="uk-margin-medium-top uk-flex uk-flex-center">
<loading></loading> <loading></loading>
</div> </div>
<div class="uk-margin-medium-top uk-flex uk-flex-right">
<button class="uk-button uk-button-default uk-margin-medium-right" [class.uk-disabled]="loading"
(click)="cancel(managerModal)">Cancel
</button>
<button class="uk-button" [class.uk-button-primary]="code.valid" [class.uk-disabled]="code.invalid || loading"
(click)="verifyManager()">Accept
</button>
</div>
</modal-alert> </modal-alert>
<modal-alert *ngIf="service == 'monitor'" #memberModal> <modal-alert #memberModal [overflowBody]="false" *ngIf="service == 'monitor'" (cancelOutput)="cancel()"
(alertOutput)="verifyMember()" [okDisabled]="code.invalid || loading">
<div *ngIf="!isMember"> <div *ngIf="!isMember">
<div> <div>
You have been invited to join <span class="uk-text-bold">{{name}}</span> Monitor Dashboard as a member. You have been invited to join <span class="uk-text-bold">{{name}}</span> Monitor Dashboard as a member.
<span class="portal-color">Fill</span> in the <span class="portal-color">verification code</span>, sent to <span class="uk-text-primary">Fill</span> in the <span class="uk-text-primary">verification code</span>, sent
to
your your
email, to accept the invitation request. email, to accept the invitation request.
</div> </div>
@ -53,28 +51,16 @@ import {Composer} from "../utils/email/composer";
<div *ngIf="loading" class="uk-margin-medium-top"> <div *ngIf="loading" class="uk-margin-medium-top">
<loading></loading> <loading></loading>
</div> </div>
<div class="uk-margin-medium-top uk-flex uk-flex-right">
<button class="uk-button uk-button-default uk-margin-medium-right" [class.uk-disabled]="loading"
(click)="cancel(memberModal)">Cancel
</button>
<button class="uk-button" [class.uk-button-primary]="code.valid" [class.uk-disabled]="code.invalid || loading"
(click)="verifyMember()">Accept
</button>
</div>
</div> </div>
<div *ngIf="isMember"> <div *ngIf="isMember">
<div> <div>
Welcome! You are now a member of the OpenAIRE Monitor Dashboard for the <span class="uk-text-bold">{{name}}</span>! 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. From now on, you will have access to our restricted content.
</div> </div>
<div class="uk-margin-medium-top uk-flex uk-flex-right">
<button class="uk-button uk-button-default" [class.uk-disabled]="loading"
(click)="cancel(memberModal)">Close
</button>
</div>
</div> </div>
</modal-alert> </modal-alert>
<modal-alert #errorModal (alertOutput)="cancel(errorModal)"> <modal-alert #errorModal (alertOutput)="cancel()" [overflowBody]="false">
<div> <div>
We are unable to process the request because the link is invalid, or it has expired. We are unable to process the request because the link is invalid, or it has expired.
</div> </div>
@ -127,7 +113,7 @@ export class RoleVerificationComponent implements OnInit, OnDestroy, AfterViewIn
this.openManagerModal(); this.openManagerModal();
} else if (this.verification.verificationType === 'member' && this.service === "monitor") { } else if (this.verification.verificationType === 'member' && this.service === "monitor") {
this.openMemberModal(); this.openMemberModal();
} else { } else {
this.openErrorModal(); this.openErrorModal();
} }
} else { } else {
@ -159,16 +145,21 @@ export class RoleVerificationComponent implements OnInit, OnDestroy, AfterViewIn
public openManagerModal() { public openManagerModal() {
this.error = null; this.error = null;
this.managerModal.okButton = false; this.managerModal.okButtonLeft = false;
this.managerModal.cancelButton = false; this.managerModal.okButtonText = 'Accept';
this.managerModal.stayOpen = true;
this.managerModal.cancelButtonText = 'Cancel';
this.managerModal.alertTitle = 'Manager Invitation'; this.managerModal.alertTitle = 'Manager Invitation';
this.managerModal.open(); this.managerModal.open();
} }
public openMemberModal() { public openMemberModal() {
this.error = null; this.error = null;
this.memberModal.okButton = false; this.isMember = false;
this.memberModal.cancelButton = false; this.memberModal.okButtonLeft = false;
this.memberModal.okButtonText = 'Accept';
this.memberModal.stayOpen = true;
this.memberModal.cancelButtonText = 'Cancel';
this.memberModal.alertTitle = 'Member Invitation'; this.memberModal.alertTitle = 'Member Invitation';
this.memberModal.open(); this.memberModal.open();
} }
@ -187,7 +178,7 @@ export class RoleVerificationComponent implements OnInit, OnDestroy, AfterViewIn
this.managerModal.cancel(); this.managerModal.cancel();
this.error = null; this.error = null;
this.userManagementService.updateUserInfo(() => { this.userManagementService.updateUserInfo(() => {
if(this.service === "monitor") { if (this.service === "monitor") {
this.loading = false; this.loading = false;
this.router.navigate(['/admin/' + this.verification.entity]); this.router.navigate(['/admin/' + this.verification.entity]);
} else { } else {
@ -219,24 +210,29 @@ export class RoleVerificationComponent implements OnInit, OnDestroy, AfterViewIn
public verifyMember() { public verifyMember() {
this.loading = true; this.loading = true;
this.subs.push(this.userRegistryService.verify(this.verification.id, this.code.value, "member").subscribe(() => { if (!this.isMember) {
this.loading = false; this.subs.push(this.userRegistryService.verify(this.verification.id, this.code.value, "member").subscribe(() => {
this.error = null; this.loading = false;
this.userManagementService.updateUserInfo(() => { this.error = null;
this.isMember = true; this.userManagementService.updateUserInfo(() => {
}); this.memberModal.cancelButton = false;
}, error => { this.memberModal.okButtonText = 'Close';
this.loading = false; this.isMember = true;
this.error = 'The verification code is invalid'; });
})); }, error => {
this.loading = false;
this.error = 'The verification code is invalid';
}));
} else {
this.memberModal.cancel();
}
} }
public reset() { public reset() {
this.code = this.fb.control('', [Validators.required, Validators.pattern('^[+0-9]{6}$')]); this.code = this.fb.control('', [Validators.required, Validators.pattern('^[+0-9]{6}$')]);
} }
cancel(modal: AlertModal) { cancel() {
modal.cancel();
this.router.navigate([this.router.url.split('?')[0]]); this.router.navigate([this.router.url.split('?')[0]]);
} }
} }

View File

@ -91,10 +91,7 @@
</div> </div>
</li> </li>
</ul> </ul>
<modal-alert #AlertModal (alertOutput)="goToPage($event)"> <modal-alert #AlertModal [overflowBody]="false" (alertOutput)="goToPage($event)">
<div class="uk-text-left">
You will be navigated to a new tab. Are you sure that you want to proceed?
</div>
</modal-alert> </modal-alert>
<ng-template #resultPreview let-result="result"> <ng-template #resultPreview let-result="result">
<div class="uk-flex uk-flex-center"> <div class="uk-flex uk-flex-center">

View File

@ -75,14 +75,12 @@ export class PortalSearchResultComponent implements OnInit{
public confirmModalOpen(result: CommunityInfo & Stakeholder) { public confirmModalOpen(result: CommunityInfo & Stakeholder) {
this.selected = result; this.selected = result;
this.modal.cancelButton = true;
this.modal.okButton = true;
if(this.type === 'stakeholder') { if(this.type === 'stakeholder') {
this.modal.alertTitle = 'You are going to visit ' + result.name + ' Monitor Dashboard'; this.modal.alertTitle = 'You are going to visit ' + result.name + ' Monitor Dashboard';
} else if (this.type === 'community') { } else if (this.type === 'community') {
this.modal.alertTitle = 'You are going to visit ' + ((result.title) ? result.title : result.shortTitle) +' Gateway'; this.modal.alertTitle = 'You are going to visit ' + ((result.title) ? result.title : result.shortTitle) +' Gateway';
} }
this.modal.alertMessage = false; this.modal.message = 'You will be navigated to a new tab. Are you sure that you want to proceed?';
this.modal.okButtonLeft = false; this.modal.okButtonLeft = false;
this.modal.okButtonText = 'Yes'; this.modal.okButtonText = 'Yes';
this.modal.cancelButtonText = 'No'; this.modal.cancelButtonText = 'No';

View File

@ -1,7 +1,6 @@
import {Component, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild} from '@angular/core'; import {Component, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild} from '@angular/core';
import {FormGroup} from "@angular/forms"; import {FormGroup} from "@angular/forms";
import {Subscriber} from "rxjs"; import {Subscriber} from "rxjs";
import {SearchForm} from "../../searchPages/searchUtils/newSearchPage.component";
import {Background} from "../../utils/background-utils"; import {Background} from "../../utils/background-utils";
declare var UIkit; declare var UIkit;

View File

@ -123,11 +123,15 @@ export class AlertModal {
*/ */
public select: boolean = true; public select: boolean = true;
/** /**
* Emitted when a ok button was clicked * Emitted when ok button was clicked
* or when Ok method is called. * or when Ok method is called.
*/ */
@Output() public alertOutput: EventEmitter<any> = new EventEmitter(); @Output() public alertOutput: EventEmitter<any> = new EventEmitter();
/**
* Emitted when cancel button was clicked
* or when cancel method is called.
*/
@Output() public cancelOutput: EventEmitter<any> = new EventEmitter();
@ViewChild('element') element: ElementRef; @ViewChild('element') element: ElementRef;
@ -136,7 +140,7 @@ export class AlertModal {
/** /**
* Opens a alert window creating backdrop. * Opens an alert window creating backdrop.
*/ */
open() { open() {
UIkit.modal(this.element.nativeElement).show(); UIkit.modal(this.element.nativeElement).show();
@ -164,5 +168,6 @@ export class AlertModal {
*/ */
cancel() { cancel() {
UIkit.modal(this.element.nativeElement).hide(); UIkit.modal(this.element.nativeElement).hide();
this.cancelOutput.emit(true);
} }
} }