You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ri...@apache.org on 2020/03/05 22:08:37 UTC

[incubator-streampipes] branch dev updated: STREAMPIPES-58: Dashboard overview allows to directly edit dashboards

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


The following commit(s) were added to refs/heads/dev by this push:
     new 0558b5a  STREAMPIPES-58: Dashboard overview allows to directly edit dashboards
0558b5a is described below

commit 0558b5a767fc9bd438a9786e276fbac210c7f8f9
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Thu Mar 5 23:08:18 2020 +0100

    STREAMPIPES-58: Dashboard overview allows to directly edit dashboards
---
 ui/src/app/core-model/base/Tuple2.ts               | 21 ++++++++++++++++
 .../overview/dashboard-overview.component.html     | 28 +++++++++++++++-------
 .../overview/dashboard-overview.component.ts       | 12 ++++++----
 ui/src/app/dashboard-v2/dashboard.component.ts     |  6 +++--
 4 files changed, 53 insertions(+), 14 deletions(-)

diff --git a/ui/src/app/core-model/base/Tuple2.ts b/ui/src/app/core-model/base/Tuple2.ts
new file mode 100644
index 0000000..ba85988
--- /dev/null
+++ b/ui/src/app/core-model/base/Tuple2.ts
@@ -0,0 +1,21 @@
+/*
+ *   Licensed to the Apache Software Foundation (ASF) under one or more
+ *   contributor license agreements.  See the NOTICE file distributed with
+ *   this work for additional information regarding copyright ownership.
+ *   The ASF licenses this file to You under the Apache License, Version 2.0
+ *   (the "License"); you may not use this file except in compliance with
+ *   the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+export interface Tuple2<A, B> {
+    a: A;
+    b: B;
+}
\ No newline at end of file
diff --git a/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.html b/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.html
index 86a80f4..9dde090 100644
--- a/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.html
+++ b/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.html
@@ -42,11 +42,11 @@
                 </ng-container>
 
                 <ng-container matColumnDef="open">
-                    <th fxFlex="10" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Show</th>
-                    <td fxFlex="10" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
+                    <th fxFlex="8" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Show</th>
+                    <td fxFlex="8" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
                         <div fxLayout="row">
                             <button mat-button mat-icon-button color="primary"
-                                    (click)="showDashboard(element)">
+                                    (click)="showDashboard(element, false)">
                                 <i class="material-icons">visibility</i>
                             </button>
                         </div>
@@ -54,8 +54,8 @@
                 </ng-container>
 
                 <ng-container matColumnDef="openWindow">
-                    <th fxFlex="10" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Window</th>
-                    <td fxFlex="10" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
+                    <th fxFlex="8" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Window</th>
+                    <td fxFlex="8" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
                         <div fxLayout="row">
                             <button mat-button mat-icon-button color="primary"
                                     (click)="openExternalDashboard(element)">
@@ -65,12 +65,24 @@
                     </td>
                 </ng-container>
 
-                <ng-container matColumnDef="edit">
-                    <th fxFlex="10" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Edit</th>
-                    <td fxFlex="10" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
+                <ng-container matColumnDef="settings">
+                    <th fxFlex="8" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Settings</th>
+                    <td fxFlex="8" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
                         <div fxLayout="row">
                             <button mat-button mat-icon-button color="primary"
                                     (click)="openEditDashboardDialog(element)">
+                                <i class="material-icons">settings</i>
+                            </button>
+                        </div>
+                    </td>
+                </ng-container>
+
+                <ng-container matColumnDef="edit">
+                    <th fxFlex="8" fxLayoutAlign="start center" mat-header-cell *matHeaderCellDef> Edit</th>
+                    <td fxFlex="8" fxLayoutAlign="start center" mat-cell *matCellDef="let element">
+                        <div fxLayout="row">
+                            <button mat-button mat-icon-button color="primary"
+                                    (click)="showDashboard(element, true)">
                                 <i class="material-icons">edit</i>
                             </button>
                         </div>
diff --git a/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.ts b/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.ts
index 4d291cf..296dde0 100644
--- a/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.ts
+++ b/ui/src/app/dashboard-v2/components/overview/dashboard-overview.component.ts
@@ -22,6 +22,7 @@ import {MatTableDataSource} from "@angular/material/table";
 import {MatDialog} from "@angular/material/dialog";
 import {DashboardService} from "../../services/dashboard.service";
 import {EditDashboardDialogComponent} from "../../dialogs/edit-dashboard/edit-dashboard-dialog.component";
+import {Tuple2} from "../../../core-model/base/Tuple2";
 
 @Component({
     selector: 'dashboard-overview',
@@ -32,10 +33,10 @@ export class DashboardOverviewComponent implements OnInit {
 
     @Input() dashboards: Array<Dashboard>;
     @Output() reloadDashboardsEmitter = new EventEmitter<void>();
-    @Output() selectDashboardEmitter = new EventEmitter<Dashboard>();
+    @Output() selectDashboardEmitter = new EventEmitter<Tuple2<Dashboard, boolean>>();
 
     dataSource = new MatTableDataSource<Dashboard>();
-    displayedColumns: string[] = ['name', 'open', 'openWindow', 'edit', 'delete'];
+    displayedColumns: string[] = ['name', 'open', 'openWindow', 'settings', 'edit', 'delete'];
 
     constructor(private dashboardService: DashboardService,
                 public dialog: MatDialog) {
@@ -77,8 +78,11 @@ export class DashboardOverviewComponent implements OnInit {
         });
     }
 
-    showDashboard(dashboard: Dashboard) {
-        this.selectDashboardEmitter.emit(dashboard);
+    showDashboard(dashboard: Dashboard, openInEditMode: boolean) {
+        let data: Tuple2<Dashboard, boolean> = {} as Tuple2<Dashboard, boolean>;
+        data.a = dashboard;
+        data.b = openInEditMode;
+        this.selectDashboardEmitter.emit(data);
     }
 
     openExternalDashboard(dashboard: Dashboard) {
diff --git a/ui/src/app/dashboard-v2/dashboard.component.ts b/ui/src/app/dashboard-v2/dashboard.component.ts
index bd00dc4..424d39a 100644
--- a/ui/src/app/dashboard-v2/dashboard.component.ts
+++ b/ui/src/app/dashboard-v2/dashboard.component.ts
@@ -20,6 +20,7 @@ import {Component, OnInit} from "@angular/core";
 import {Dashboard} from "./models/dashboard.model";
 import {DashboardService} from "./services/dashboard.service";
 import {RefreshDashboardService} from "./services/refresh-dashboard.service";
+import {Tuple2} from "../core-model/base/Tuple2";
 
 @Component({
     selector: 'dashboard',
@@ -48,8 +49,9 @@ export class DashboardComponent implements OnInit {
 
     }
 
-    openDashboard(dashboard: Dashboard) {
-        let index = this.dashboards.indexOf(dashboard);
+    openDashboard(data: Tuple2<Dashboard, boolean>) {
+        let index = this.dashboards.indexOf(data.a);
+        this.editMode = data.b;
         this.selectDashboard((index + 1));
     }