This is an automated email from the ASF dual-hosted git repository. riemer pushed a commit to branch dev in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
commit 49d41789b346bb6b171f22e374b923f2698a7adf Author: Dominik Riemer <[email protected]> AuthorDate: Sat May 22 11:17:44 2021 +0200 [hotfix] Show pipeline status in pipeline overview --- .../pipeline-overview.component.html | 6 ++++ .../pipeline-overview.component.scss | 39 ++++++++++++++++++++-- .../pipeline-overview.component.ts | 2 +- 3 files changed, 43 insertions(+), 4 deletions(-) diff --git a/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.html b/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.html index bfee5da..2d498c9 100644 --- a/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.html +++ b/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.html @@ -18,6 +18,12 @@ <div fxFlex="100" fxLayout="column" *ngIf="filteredPipelinesAvailable" style="margin:1px;"> <table fxFlex="100" mat-table [dataSource]="dataSource" style="width: 100%;" matSort> + <ng-container matColumnDef="status"> + <th mat-header-cell mat-sort-header *matHeaderCellDef> Status</th> + <td mat-cell *matCellDef="let pipeline"> + <div [matTooltip]="pipeline.running ? 'Running' : 'Stopped'" class="light" [ngClass]="pipeline.running ? 'light-green' : 'light-neutral'"></div> + </td> + </ng-container> <ng-container matColumnDef="start"> <th mat-header-cell *matHeaderCellDef> Start</th> <td mat-cell *matCellDef="let pipeline"> diff --git a/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.scss b/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.scss index 2ab2602..13ac91e 100644 --- a/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.scss +++ b/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.scss @@ -22,13 +22,46 @@ } .mat-paginator { - border-top: 1px solid rgba(0,0,0,.12); + border-top: 1px solid rgba(0, 0, 0, .12); background: #FAFAFA; } .mat-row:nth-child(even) { background-color: #FAFAFA; } + .mat-row:nth-child(odd) { - background-color:#ffffff; -} \ No newline at end of file + background-color: #ffffff; +} + +.mat-column-status { + width: 80px; + max-width: 80px; +} + +.light { + background-color:rgba(0, 0, 0, 0.3); + border-radius:50%; + width: 15px; + height: 15px; +} + +.light-red { + background-color: red; + box-shadow: 0 0 20px 5px red; +} + +.light-yellow { + background-color: yellow; + box-shadow: 0 0 20px 5px yellow; +} + +.light-green { + background-color: green; + box-shadow: 0 0 5px 2px green; +} + +.light-neutral { + background-color: #b4b4b4; + box-shadow: 0 0 5px 2px #b4b4b4; +} diff --git a/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.ts b/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.ts index 11d7545..79b73aa 100644 --- a/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.ts +++ b/ui/src/app/pipelines/components/pipeline-overview/pipeline-overview.component.ts @@ -42,7 +42,7 @@ export class PipelineOverviewComponent implements OnInit { @Output() refreshPipelinesEmitter: EventEmitter<boolean> = new EventEmitter<boolean>(); - displayedColumns: string[] = ['start', 'name', 'lastModified', 'action']; + displayedColumns: string[] = ['status', 'start', 'name', 'lastModified', 'action']; dataSource: MatTableDataSource<Pipeline>;
