You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dlab.apache.org by dg...@apache.org on 2019/12/12 13:13:00 UTC
[incubator-dlab] 02/02: [DLAB-1321]: Conveyed all resources which
will be terminated on confirmation dialog
This is an automated email from the ASF dual-hosted git repository.
dgnatyshyn pushed a commit to branch DLAB-1321
in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git
commit 11902bb98e34e3adbe7f54eb812a1ec1e791b6fa
Author: Dmytro Gnatyshyn <di...@ukr.net>
AuthorDate: Wed Dec 11 15:25:05 2019 +0200
[DLAB-1321]: Conveyed all resources which will be terminated on confirmation dialog
---
.../management/endpoints/endpoints.component.ts | 4 +-
.../modal-dialog/notification-dialog/index.ts | 3 +-
.../notification-dialog.component.ts | 63 +++++++++++++++-------
3 files changed, 48 insertions(+), 22 deletions(-)
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.ts
index 32554f2..725447e 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.ts
@@ -75,13 +75,13 @@ export class EndpointsComponent implements OnInit {
public deleteEndpoint(data) {
this.filtredResource = this.resources.filter(project => {
- project.filtredExploratory = project.exploratory.filter(resource => resource.endpoint === data.name);
+ project.filtredExploratory = project.exploratory.filter(resource => resource.endpoint === data.name && resource.status !== 'terminated');
return project.filtredExploratory.length
});
this.dialog.open(NotificationDialogComponent, { data: { type: 'confirmation', item: data, list: this.filtredResource }, panelClass: 'modal-sm' })
.afterClosed().subscribe(result => {
- result && this.endpointService.deleteEndpoint(data.name).subscribe(() => {
+ result === 'noTerminate' && this.endpointService.deleteEndpoint(data.name).subscribe(() => {
this.toastr.success('Endpoint successfully deleted!', 'Success!');
this.getEndpointList();
}, error => this.toastr.error(error.message || 'Endpoint creation failed!', 'Oops!'));
diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/index.ts b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/index.ts
index 7f66ebc..501f2c6 100644
--- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/index.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/index.ts
@@ -22,11 +22,12 @@ import { CommonModule } from '@angular/common';
import { NotificationDialogComponent } from './notification-dialog.component';
import { MaterialModule } from '../../material.module';
+import {FormsModule} from "@angular/forms";
export * from './notification-dialog.component';
@NgModule({
- imports: [CommonModule, MaterialModule],
+ imports: [CommonModule, MaterialModule, FormsModule],
declarations: [NotificationDialogComponent],
entryComponents: [NotificationDialogComponent],
exports: [NotificationDialogComponent]
diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts
index 31b29c8..f371079 100644
--- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts
@@ -55,25 +55,35 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
<ng-template #label>
<p>
<span class="ellipsis label-name strong" matTooltip="{{ data.item.name }}" matTooltipPosition="above" [matTooltipDisabled]="data.item.name.length > 35">
- {{ data.item.name }}</span> will be {{ data.action || 'decommissioned' }}.
+ {{ data.item.name }}</span> will be {{ data.action || 'disconnected' }}.
</p>
</ng-template>
- <mat-list *ngIf="data.list && data.list.length && data.type === 'confirmation'">
- <mat-list-item class="list-header sans">
- <div class="endpoint">Project</div>
- <div class="status">Resource</div>
- </mat-list-item>
- <div class="scrolling-content">
- <mat-list-item *ngFor="let project of data.list" class="sans node">
- <div class="endpoint ellipsis">
+ <div *ngIf="data.list && data.list.length && data.type === 'confirmation'">
+ <div class="resource-list">
+ <div class="resource-list-header">
+ <div class="resource-name">Resource</div>
+ <div class="project">Project</div>
+ </div>
+ <div class="scrolling-content resource-heigth" >
+ <div class="resource-list-row sans node" *ngFor="let project of data.list">
+ <div class="resource-name ellipsis">
<div *ngFor="let notebook of project.filtredExploratory">{{notebook.name}}</div>
</div>
- <div class="status ellipsis">{{project.project}}</div>
- </mat-list-item>
+ <div class="project ellipsis">{{project.project}}</div>
+ </div>
</div>
- </mat-list>
-
+ </div>
+ <div class="confirm-resource-terminating">
+ <label>
+ <input class="checkbox" type="checkbox"
+ (change)="terminateResource()"/>Terminate all related resources
+ </label>
+ </div>
+ <p class="confirm-message">
+ <span *ngIf="willResourceTermineted">All connected computational resources will be terminated as well</span>
+ </p>
+ </div>
<mat-list *ngIf="data.item.endpoints?.length">
<mat-list-item class="list-header sans">
<div class="endpoint">Edge node in endpoint</div>
@@ -90,8 +100,9 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
<div class="text-center m-top-30 m-bott-10">
<button type="button" class="butt" mat-raised-button (click)="dialogRef.close()">No</button>
- <button type="button" class="butt butt-success" mat-raised-button (click)="dialogRef.close(true)">Yes</button>
- </div>
+ <button *ngIf="!this.willResourceTermineted" type="button" class="butt butt-success" mat-raised-button (click)="dialogRef.close('noTerminate')">Yes</button>
+ <button *ngIf="this.willResourceTermineted" type="button" class="butt butt-success" mat-raised-button (click)="dialogRef.close('terminate')">Yes</button>
+ </div>
</div>
</div>
</div>
@@ -110,17 +121,31 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
.endpoint { width: 70%; text-align: left; color: #577289;}
.status { width: 30%;text-align: left;}
.label { font-size: 15px; font-weight: 500; font-family: "Open Sans",sans-serif;}
- .node { font-weight: 300;}
- .label-name { display: inline-block; width: 100%}
- .scrolling-content{overflow-y: auto; max-height: 200px;}
- .endpoint { width: 280px;text-align: left;}
+ .node { font-weight: 300;}
+ .label-name { display: inline-block; width: 100%}
+ .resource-name { width: 280px;text-align: left; padding: 10px 0;line-height: 26px;}
+ .project { width: 30%;text-align: left; padding: 10px 0;line-height: 26px;}
+ .resource-list{max-width: 100%; margin: 0 auto;margin-top: 20px; }
+ .resource-list-header{display: flex; font-weight: 600; font-size: 16px;height: 48px; border-top: 1px solid #edf1f5; border-bottom: 1px solid #edf1f5; padding: 0 20px;}
+ .resource-list-row{display: flex; border-bottom: 1px solid #edf1f5;padding: 0 20px;}
+ .confirm-resource-terminating{text-align: left; padding: 10px 20px;}
+ .confirm-message{color: #35afd5;font-size: 13px;min-height: 18px; text-align: center;}
+ .checkbox{margin-right: 5px;vertical-align: middle; margin-bottom: 3px;}
+ label{cursor: pointer}
+
+
`]
})
export class NotificationDialogComponent {
+ public willResourceTermineted: boolean = false;
constructor(
public dialogRef: MatDialogRef<NotificationDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any
) {
console.log(data);
}
+
+ public terminateResource(): void{
+ this.willResourceTermineted = !this.willResourceTermineted;
+ }
}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@dlab.apache.org
For additional commands, e-mail: commits-help@dlab.apache.org