This is an automated email from the ASF dual-hosted git repository. dgnatyshyn pushed a commit to branch develop in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git
The following commit(s) were added to refs/heads/develop by this push: new c4a0802 [DLAB-1512]: Combined the similar action for a project (#579) c4a0802 is described below commit c4a080228de70ecea3870391e2cc8e93186f9c72 Author: Dmytro Gnatyshyn <42860905+dg1...@users.noreply.github.com> AuthorDate: Tue Feb 4 14:53:20 2020 +0200 [DLAB-1512]: Combined the similar action for a project (#579) --- .../management-grid/management-grid.component.ts | 6 ++-- .../project-list/project-list.component.html | 6 ---- .../project/project-list/project-list.component.ts | 34 ++++++++----------- .../administration/project/project.component.ts | 9 ----- .../install-libraries.component.ts | 32 +++++++++--------- .../edge-action-dialog.component.ts | 38 +++++++++++++++++----- 6 files changed, 63 insertions(+), 62 deletions(-) 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 f13f0b5..f8f6b84 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 @@ -27,7 +27,7 @@ import { ConfirmationDialogType } from '../../../shared'; import { ConfirmationDialogComponent } from '../../../shared/modal-dialog/confirmation-dialog'; import { EnvironmentsDataService } from '../management-data.service'; import { EnvironmentModel, ManagementConfigModel } from '../management.model'; -import {ProgressBarService} from "../../../core/services/progress-bar.service"; +import {ProgressBarService} from '../../../core/services/progress-bar.service'; export interface ManageAction { action: string; @@ -72,11 +72,11 @@ export class ManagementGridComponent implements OnInit { ) { } ngOnInit() { - this.getEnvironmentData() + this.getEnvironmentData(); } getEnvironmentData() { - setTimeout(() => {this.progressBarService.startProgressBar()} , 0); + setTimeout(() => {this.progressBarService.startProgressBar();} , 0); this.environmentsDataService._data.subscribe(data => { if (data) { this.allEnvironmentData = EnvironmentModel.loadEnvironments(data); diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html index efed1eb..a2fc6cf 100644 --- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html +++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html @@ -93,12 +93,6 @@ Edit project </a> </li> - <li class="project-seting-item" *ngIf="!isInProgress(element) && isActiveEndpoint(element)" (click)="deleteProject(element)"> - <i class="material-icons">delete_forever</i> - <a class="action" [ngClass]="{'not-allowed' : isInProgress(element) || !isActiveEndpoint(element) }"> - Delete project - </a> - </li> </ul> </bubble-up> </td> diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts index b57dd29..9010480 100644 --- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts @@ -26,9 +26,8 @@ import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dial import { ProjectDataService } from '../project-data.service'; import { Project, Endpoint } from '../project.component'; import { CheckUtils } from '../../../core/util'; -import {ProgressBarService} from "../../../core/services/progress-bar.service"; -import {EdgeActionDialogComponent} from "../../../shared/modal-dialog/edge-action-dialog"; -import {EndpointService} from "../../../core/services"; +import {ProgressBarService} from '../../../core/services/progress-bar.service'; +import {EdgeActionDialogComponent} from '../../../shared/modal-dialog/edge-action-dialog'; @Component({ selector: 'project-list', @@ -42,7 +41,6 @@ export class ProjectListComponent implements OnInit, OnDestroy { projectList: Project[]; @Output() editItem: EventEmitter<{}> = new EventEmitter(); - @Output() deleteItem: EventEmitter<{}> = new EventEmitter(); @Output() toggleStatus: EventEmitter<{}> = new EventEmitter(); private subscriptions: Subscription = new Subscription(); @@ -65,8 +63,8 @@ export class ProjectListComponent implements OnInit, OnDestroy { this.subscriptions.unsubscribe(); } - private getProjectList(){ - setTimeout(() => {this.progressBarService.startProgressBar()} , 0); + private getProjectList() { + setTimeout(() => {this.progressBarService.startProgressBar(); } , 0); this.subscriptions.add(this.projectDataService._projects.subscribe((value: Project[]) => { this.projectList = value; if (value) this.dataSource = new MatTableDataSource(value); @@ -91,13 +89,9 @@ export class ProjectListComponent implements OnInit, OnDestroy { this.editItem.emit(item); } - public deleteProject(item: Project[]) { - this.deleteItem.emit(item); - } - public isInProgress(project) { if (project) - return project.endpoints.some(e => e.status !== 'RUNNING' && e.status !== 'STOPPED' && e.status !== 'TERMINATED' && e.status !== 'FAILED') + return project.endpoints.some(e => e.status !== 'RUNNING' && e.status !== 'STOPPED' && e.status !== 'TERMINATED' && e.status !== 'FAILED'); } public isActiveEndpoint(project) { @@ -111,19 +105,19 @@ export class ProjectListComponent implements OnInit, OnDestroy { public openEdgeDialog(action, project) { const endpoints = project.endpoints.filter(endpoint => { - if(action === "stop"){ - return endpoint.status == 'RUNNING' + if (action === 'stop') { + return endpoint.status === 'RUNNING'; } - if(action === "start"){ - return endpoint.status == 'STOPPED' + if (action === 'start') { + return endpoint.status === 'STOPPED'; } - if(action === "terminate"){ - return endpoint.status == 'RUNNING' || endpoint.status == 'STOPPED' + if (action === 'terminate') { + return endpoint.status === 'RUNNING' || endpoint.status == 'STOPPED'; } }); this.dialog.open(EdgeActionDialogComponent, {data: {type: action, item: endpoints}, panelClass: 'modal-sm'}) .afterClosed().subscribe(endpoint => { - if(endpoint && endpoint.length){ + if (endpoint && endpoint.length) { this.toggleStatus.emit({project, endpoint, action}); } }, error => this.toastr.error(error.message || `Endpoint ${action} failed!`, 'Oops!') @@ -131,10 +125,10 @@ export class ProjectListComponent implements OnInit, OnDestroy { } public areStartedEndpoints(project) { - return project.endpoints.filter(endpoint => endpoint.status == 'RUNNING').length > 0; + return project.endpoints.filter(endpoint => endpoint.status === 'RUNNING').length > 0; } public areStoppedEndpoints(project) { - return project.endpoints.filter(endpoint => endpoint.status == 'STOPPED').length > 0; + return project.endpoints.filter(endpoint => endpoint.status === 'STOPPED').length > 0; } } diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/project/project.component.ts index 06a4f2a..ba3d45a 100644 --- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project.component.ts @@ -104,15 +104,6 @@ export class ProjectComponent implements OnInit, OnDestroy { }); } - public deleteProject($event) { - this.dialog.open(NotificationDialogComponent, { data: { type: 'confirmation', item: $event , action: 'decommissioned', }, panelClass: 'modal-sm' }) - .afterClosed().subscribe(result => { - result && this.projectService.deleteProject($event.name).subscribe(() => { - this.refreshGrid(); - }); - }); - } - public toggleStatus($event) { const data = { 'project_name': $event.project.name, endpoint: $event.endpoint.map(endpoint => endpoint.name)}; this.toggleStatusRequest(data, $event.action); diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts index 0b49cb7..3bee009 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts @@ -27,7 +27,7 @@ import { debounceTime } from 'rxjs/operators'; import { InstallLibrariesModel } from './install-libraries.model'; import { LibrariesInstallationService } from '../../../core/services'; import { SortUtils, HTTP_STATUS_CODES } from '../../../core/util'; -import {FilterLibsModel} from "./filter-libs.model"; +import {FilterLibsModel} from './filter-libs.model'; @Component({ @@ -69,8 +69,8 @@ export class InstallLibrariesComponent implements OnInit { private clear: number; private clearCheckInstalling = undefined; - public filterConfiguration: FilterLibsModel = new FilterLibsModel('',[],[],[],[]); - public filterModel: FilterLibsModel = new FilterLibsModel('', [], [], [],[]); + public filterConfiguration: FilterLibsModel = new FilterLibsModel('', [], [], [], []); + public filterModel: FilterLibsModel = new FilterLibsModel('', [], [], [], []); public filtered: boolean; public filtredNotebookLibs: Array<any> = []; @@ -199,10 +199,12 @@ export class InstallLibrariesComponent implements OnInit { if (response.status === HTTP_STATUS_CODES.OK) { this.getInstalledLibrariesList(); this.resetDialog(); + console.log('Open response status'); } }, error => this.toastr.error(error.message || 'Library installation failed!', 'Oops!'), () => { + console.log('Failed open response status'); this.getInstalledLibrariesList(true); this.changeDetector.detectChanges(); this.selectorsReset(); @@ -217,7 +219,7 @@ export class InstallLibrariesComponent implements OnInit { public isInstallingInProgress(): void { const isInstallingNow = this.notebookLibs.some(lib => lib.filteredStatus.some(status => status.status === 'installing')); - if (isInstallingNow){ + if (isInstallingNow) { this.clearCheckInstalling = window.setInterval(() => this.getInstalledLibrariesList(), 10000); } else { window.clearInterval(this.clearCheckInstalling); @@ -237,28 +239,28 @@ export class InstallLibrariesComponent implements OnInit { private getInstalledLibrariesList(init?: boolean) { this.model.getInstalledLibrariesList(this.notebook) .subscribe((data: any) => { - if( !this.filtredNotebookLibs.length || data.length !== this.notebookLibs.length){ + if ( !this.filtredNotebookLibs.length || data.length !== this.notebookLibs.length) { this.filtredNotebookLibs = [...data]; } this.filtredNotebookLibs = data.filter(lib => this.filtredNotebookLibs.some(v => (v.name + v.version === lib.name + v.version) && v.resource === lib.resource)); this.notebookLibs = data ? data : []; this.notebookLibs.forEach(lib => { lib.filteredStatus = lib.status; - if(lib.version && lib.version !== 'N/A') - lib.version = 'v.' + lib.version + if (lib.version && lib.version !== 'N/A') + lib.version = 'v.' + lib.version; } ); this.changeDetector.markForCheck(); - this.filterConfiguration.group = this.createFilterList(this.notebookLibs.map(v=>this.groupsListMap[v.group])); - this.filterConfiguration.resource = this.createFilterList(this.notebookLibs.map(lib=>lib.status.map(status=>status.resource))); - this.filterConfiguration.resourceType = this.createFilterList(this.notebookLibs.map(lib=>lib.status.map(status=>status.resourceType))); - this.filterConfiguration.status = this.createFilterList(this.notebookLibs.map(lib=>lib.status.map(status=>status.status))); + this.filterConfiguration.group = this.createFilterList(this.notebookLibs.map(v => this.groupsListMap[v.group])); + this.filterConfiguration.resource = this.createFilterList(this.notebookLibs.map(lib => lib.status.map(status => status.resource))); + this.filterConfiguration.resourceType = this.createFilterList(this.notebookLibs.map(lib => lib.status.map(status => status.resourceType))); + this.filterConfiguration.status = this.createFilterList(this.notebookLibs.map(lib => lib.status.map(status => status.status))); this.isInstallingInProgress(); }); } public createFilterList(array): [] { - return array.flat().filter((v,i,arr)=> arr.indexOf(v) === i); + return array.flat().filter((v, i, arr) => arr.indexOf(v) === i); } private getInstalledLibsByResource() { @@ -325,7 +327,7 @@ export class InstallLibrariesComponent implements OnInit { } public toggleFilterRow(): void { - this.filtered = !this.filtered + this.filtered = !this.filtered; } public filterLibs(): void { @@ -333,10 +335,10 @@ export class InstallLibrariesComponent implements OnInit { const isName = this.filterModel.name ? lib.name.toLowerCase().indexOf(this.filterModel.name.toLowerCase().trim()) !== -1 || lib.version.indexOf(this.filterModel.name.toLowerCase().trim()) !== -1 : true; const isGroup = this.filterModel.group.length ? this.filterModel.group.includes(this.groupsListMap[lib.group]) : true; lib.filteredStatus = lib.status.filter(status => { - const isResource = this.filterModel.resource.length ? this.filterModel.resource.includes(status.resource) :true; + const isResource = this.filterModel.resource.length ? this.filterModel.resource.includes(status.resource) : true; const isResourceType = this.filterModel.resourceType.length ? this.filterModel.resourceType.includes(status.resourceType) : true; const isStatus = this.filterModel.status.length ? this.filterModel.status.includes(status.status) : true; - return isResource && isResourceType && isStatus + return isResource && isResourceType && isStatus; }); return isName && isGroup && lib.filteredStatus.length; }); diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/edge-action-dialog/edge-action-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/edge-action-dialog/edge-action-dialog.component.ts index 511cd62..b514e78 100644 --- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/edge-action-dialog/edge-action-dialog.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/edge-action-dialog/edge-action-dialog.component.ts @@ -11,14 +11,22 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; <button type="button" class="close" (click)="closeModal()">×</button> </header> <div mat-dialog-content class="content message mat-dialog-content"> - <h3 class="strong">Select the items you want to {{data.type}}</h3> + <h3 class="strong">Select the edge nodes you want to {{data.type}}</h3> <ul class="endpoint-list scrolling-content"> - <li *ngFor="let endpoint of data.item" class="endpoint-list-item"> - <label class="strong"> - <input type="checkbox" [(ngModel)]="endpoint.checked" (change)="endpointAction()"> - {{endpoint.name}} - </label> - </li> + <li *ngIf="data.item.length>1" class="endpoint-list-item header-item"> + <label class="strong all"> + <input type="checkbox" [(ngModel)]="isAllChecked" (change)="chooseAll()"> + {{data.type | titlecase}} all + </label> + </li> + <div class="scrolling-content" id="scrolling"> + <li *ngFor="let endpoint of data.item" class="endpoint-list-item"> + <label class="strong"> + <input type="checkbox" [(ngModel)]="endpoint.checked" (change)="endpointAction()"> + {{endpoint.name}} + </label> + </li> + </div> </ul> <p class="m-top-20 action-text"><span class="strong">Do you want to proceed?</span></p> @@ -39,18 +47,20 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; header a i { font-size: 20px; } header a:hover i { color: #35afd5; cursor: pointer; } .endpoint-list{text-align: left; margin-top: 30px} - .endpoint-list-item{padding: 5px 0} + .endpoint-list-item{padding: 5px 20px} .action{text-transform: capitalize} .action-text { text-align: center; } .scrolling-content{overflow-y: auto; max-height: 200px; } label { font-size: 15px; font-weight: 500; font-family: "Open Sans",sans-serif; cursor: pointer; display: flex; align-items: center;} - label input {margin-top: 2px; margin-right: 5px;} + label input {margin-top: 2px; margin-right: 10px;cursor: pointer;} + .all{font-size: 16px; font-weight: 600;} .scrolling-content{overflow-y: auto; max-height: 200px;} `] }) export class EdgeActionDialogComponent { public endpointsNewStatus: Array<object> = []; + public isAllChecked: boolean; constructor( public dialogRef: MatDialogRef<EdgeActionDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) { @@ -63,5 +73,15 @@ export class EdgeActionDialogComponent { public endpointAction() { this.endpointsNewStatus = this.data.item.filter(endpoint => endpoint.checked); + this.isAllChecked = this.endpointsNewStatus.length === this.data.item.length; + } + + public chooseAll() { + if (this.isAllChecked) { + this.data.item.forEach(endpoint => endpoint.checked = true); + } else { + this.data.item.forEach(endpoint => endpoint.checked = false); + } + this.endpointAction(); } } --------------------------------------------------------------------- To unsubscribe, e-mail: commits-unsubscr...@dlab.apache.org For additional commands, e-mail: commits-h...@dlab.apache.org