[DLAB-1874]: Fixed set of tasks for 'Environment management' page
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
index 88b005c..02d9012 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
@@ -21,7 +21,11 @@
<table mat-table [dataSource]="allFilteredEnvironmentData" class="data-grid management mat-elevation-z6">
<ng-container matColumnDef="checkbox">
<th mat-header-cell *matHeaderCellDef class="checkbox label-header">
- <div class="empty-checkbox header-checkbox" [ngClass]="{'checked': selected?.length === allActiveNotebooks?.length}" (click)="toggleSelectionAll();$event.stopPropagation()" >
+ <div class="empty-checkbox header-checkbox"
+ *ngIf="allActiveNotebooks?.length>0"
+ [ngClass]="{'checked': selected?.length === allActiveNotebooks?.length}"
+ (click)="toggleSelectionAll();$event.stopPropagation()"
+ >
<span class="checked-checkbox" *ngIf="selected?.length === allActiveNotebooks?.length"></span>
</div>
<button mat-icon-button aria-label="More" class="ar checkbox-border" (click)="toggleFilterRow()">
@@ -32,7 +36,12 @@
</button>
</th>
<td mat-cell *matCellDef="let element">
- <div *ngIf="element.type !== 'edge node' && (element.status==='running' || element.status==='stopped')" class="empty-checkbox" [ngClass]="{'checked': element.isSelected}" (click)="toggleActionForAll(element);$event.stopPropagation()" >
+ <div
+ *ngIf="element.type !== 'edge node' && (element.status==='running' || element.status==='stopped')"
+ class="empty-checkbox"
+ [ngClass]="{'checked': element.isSelected}"
+ (click)="toggleActionForAll(element);$event.stopPropagation()"
+ >
<span class="checked-checkbox" *ngIf="element.isSelected"></span>
</div>
</td>
@@ -80,7 +89,13 @@
</i>
</button> </th>
<td type mat-cell *matCellDef="let element">
- <span *ngIf="element.name" class="computation" (click)="openNotebookDetails(element)">{{element.name}}</span>
+ <span
+ *ngIf="element.name"
+ [ngClass]="{'computation': element.exploratory_urls?.length}"
+ (click)="openNotebookDetails(element)"
+ >
+ {{element.name}}
+ </span>
<span *ngIf="!element.name">{{element.type}}</span>
</td>
</ng-container>
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
index 99fde37..548451e 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
@@ -21,11 +21,10 @@
&.management {
.mat-column-checkbox{
padding-left: 10px;
- padding-right: 10px;
+ padding-right: 0px;
+ min-width: 68px;
&.label-header{
- width: 65px;
- display: flex;
- align-items: center;
+
}
}
@@ -130,4 +129,5 @@
.computation{
cursor: pointer;
+ color: #35afd5;
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts
index 38e4590..cb1c283 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts
@@ -124,7 +124,6 @@
if (filteredData.length) this.filtering = true;
if (config) {
filteredData = filteredData.filter(item => {
-
const isUser = config.users.length > 0 ? (config.users.indexOf(item.user) !== -1) : true;
const isTypeName = item.name ? item.name.toLowerCase()
.indexOf(config.type.toLowerCase()) !== -1 : item.type.toLowerCase().indexOf(config.type.toLowerCase()) !== -1;
@@ -208,7 +207,7 @@
return;
}
this.dialog.open(DetailDialogComponent, { data:
- {notebook: data, bucketStatus: {view: true, upload: true, download: true, delete: true}, buckets: [], type: 'environment'},
+ {notebook: data, buckets: [], type: 'environment'},
panelClass: 'modal-lg'
})
.afterClosed().subscribe(() => {});
@@ -251,7 +250,7 @@
<div class="resource-name">Notebook</div>
<div class="clusters-list">
<div class="clusters-list-item">
- <div class="cluster">Cluster</div>
+ <div class="cluster"><span *ngIf="isClusterLength">Cluster</span></div>
<div class="status">Further status</div>
</div>
</div>
@@ -304,7 +303,7 @@
header a:hover i { color: #35afd5; cursor: pointer; }
.plur { font-style: normal; }
.scrolling-content{overflow-y: auto; max-height: 200px; }
- .cluster { width: 50%; text-align: left; color: #577289;}
+ .cluster { width: 50%; text-align: left;}
.status { width: 50%;text-align: left;}
.label { font-size: 15px; font-weight: 500; font-family: "Open Sans",sans-serif;}
.node { font-weight: 300;}
@@ -325,6 +324,7 @@
export class ReconfirmationDialogComponent {
private notebooks;
+ private isClusterLength;
constructor(
public dialogRef: MatDialogRef<ReconfirmationDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any
@@ -333,6 +333,9 @@
this.notebooks = JSON.parse(JSON.stringify(data.notebooks));
this.notebooks = this.notebooks.map(notebook => {
notebook.resources = notebook.resources.filter(res => res.status !== 'terminated' && res.status.slice(0, 4) !== data.action);
+ if (notebook.resources.length) {
+ this.isClusterLength = true;
+ }
return notebook;
});
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts
index 3062a07..ed66061 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts
@@ -216,16 +216,15 @@
if (res) {
notebooks.forEach((env) => {
this.manageEnvironmentsService.environmentManagement(env.user, 'stop', env.project, env.name)
- .subscribe(
- response => {
- console.log(response);
+ .subscribe(response => {
this.buildGrid();
},
error => console.log(error)
);
});
+ this.clearSelection();
}
- this.clearSelection();
+ this.isActionsOpen = false;
});
} else if (action === 'terminate') {
this.dialog.open(ReconfirmationDialogComponent, {
@@ -237,13 +236,13 @@
.subscribe(
response => {
this.buildGrid();
-
},
error => console.log(error)
);
});
+ this.clearSelection();
}
- this.clearSelection();
+ this.isActionsOpen = false;
});
// } else if (action === 'run') {
// this.healthStatusService.runEdgeNode().subscribe(() => {
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
index a4b825e..87126a4 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
@@ -37,7 +37,7 @@
padding-left: 10px;
.detailed-link {
- color: #577289;
+ color: #35afd5;
cursor: pointer;
}
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
index 69edcc3..0d46d0f 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
@@ -22,7 +22,7 @@
class="data-grid resources mat-elevation-z6">
<ng-container matColumnDef="project">
- <td mat-cell *matCellDef="let element" [attr.colspan]="8" class="highlight"> {{ element.project }} </td>
+ <td mat-cell *matCellDef="let element" [attr.colspan]="8" class="project-name"> {{ element.project }} </td>
</ng-container>
<!-- <ng-container *ngFor="let column of filteringColumns; let i = index" matColumnDef="{{ column.name }}"
@@ -105,7 +105,7 @@
[@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'" sticky>
<tr *ngFor="let element of element.exploratory; let i = index" class="element-row mat-row">
- <td class="name-col" (click)="printDetailEnvironmentModal(element)">
+ <td class="name-col highlight" (click)="printDetailEnvironmentModal(element)">
<span matTooltip="{{ element.name }}" matTooltipPosition="above">{{ element.name }}</span>
</td>
<td class="status-col status" ngClass="{{ element.status.toLowerCase() || ''}}">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
index d8a6f0b..c0f0a6f 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
@@ -95,11 +95,19 @@
padding-right: 5px;
padding-left: 24px;
background-color: inherit;
+ &.notebook-name{
+
+ }
.label{
padding-top: 14px;
}
}
+ .project-name{
+ font-weight: 600;
+ color: #577289;
+ }
+
.status-col,
.shape-col {
width: 15%;
@@ -107,6 +115,12 @@
padding-top: 14px;
}
}
+ .shape-col{
+ color: #577289;
+ .label{
+ color: rgba(0,0,0,.54);
+ }
+ }
.tag-col {
width: 13%;
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
index bf3529d..48217e9 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
@@ -442,6 +442,10 @@
margin-top: 2px;
position: relative;
cursor: pointer;
+ &.header-checkbox{
+ margin-top: 13px;
+ float: left;
+ }
&.checked {
border-color: #35afd5;
background-color: #35afd5;
