dashboard #1

Merged
andi merged 118 commits from dashboard into master 2024-09-29 06:47:35 +00:00
5 changed files with 23 additions and 77 deletions
Showing only changes of commit 96ed788793 - Show all commits

View File

@@ -53,7 +53,7 @@
<ng-container matColumnDef="delete"> <ng-container matColumnDef="delete">
<th mat-header-cell *matHeaderCellDef></th> <th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element"> <td mat-cell *matCellDef="let element">
<button mat-icon-button (click)="delete(element)"> <button mat-icon-button (click)="delete(element)" aria-label="delete dashboard">
<img src="assets/img/recycle-bin-line.svg" class="icon-small" title="delete" /> <img src="assets/img/recycle-bin-line.svg" class="icon-small" title="delete" />
</button> </button>
</td> </td>

View File

@@ -1,6 +1,7 @@
import { HttpErrorResponse } from '@angular/common/http'; import { HttpErrorResponse } from '@angular/common/http';
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ConfirmationDialogComponent } from '../confirmation-dialog/confirmation-dialog.component'; import { ConfirmationDialogComponent } from '../confirmation-dialog/confirmation-dialog.component';
import { Dashboard, DashboardCreationData, DashboardList, DashboardService } from '../dashboard.service'; import { Dashboard, DashboardCreationData, DashboardList, DashboardService } from '../dashboard.service';
import { NewDashboardComponent } from './new-dashboard/new-dashboard.component'; import { NewDashboardComponent } from './new-dashboard/new-dashboard.component';
@@ -16,9 +17,10 @@ export class DashboardPageComponent implements OnInit {
loading = true; loading = true;
error = ""; error = "";
constructor(public dialog: MatDialog, private dashboardService: DashboardService){ constructor(
public dialog: MatDialog,
} private dashboardService: DashboardService,
private snackBar: MatSnackBar){}
ngOnInit(): void { ngOnInit(): void {
this.refreshTable(); this.refreshTable();
@@ -44,39 +46,32 @@ export class DashboardPageComponent implements OnInit {
createNewDashboard() { createNewDashboard() {
const dialogRef = this.dialog.open(NewDashboardComponent, { const dialogRef = this.dialog.open(NewDashboardComponent, {
data: {name: "", description: ""}, data: {name: "", description: ""}
hasBackdrop: true
}); });
dialogRef.afterClosed().subscribe((result: DashboardCreationData) => { dialogRef.afterClosed().subscribe((result: DashboardCreationData) => {
console.log('The dialog was closed with result ', JSON.stringify(result)); this.dashboardService.createDashboard(result).subscribe(result => this.refreshTable());
this.dashboardService.createDashboard(result).subscribe(result => {
console.log(result);
this.refreshTable();
});
}); });
} }
delete(dashboard: Dashboard){ delete(dashboard: Dashboard){
const dialogRef = this.dialog.open(ConfirmationDialogComponent, { const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
data: {title: "", text: "Delete dashboard '"+dashboard.name+"'?", btnOkLabel: "Delete", btnCancelLabel: "Cancel"}, data: {title: "", text: "Delete dashboard '"+dashboard.name+"'?", btnOkLabel: "Delete", btnCancelLabel: "Cancel"}
hasBackdrop: true
}); });
dialogRef.afterClosed().subscribe((result: boolean) => { dialogRef.afterClosed().subscribe((result: boolean) => {
if (result === true) { if (result === true) {
this.dashboardService.deleteDashboard(dashboard.id).subscribe({ this.dashboardService.deleteDashboard(dashboard.id).subscribe({
'error': (error) => { 'error': (error) => {
this.snackBar.open("failed to delete dashboard","", {
duration: 5000,
verticalPosition: 'top'
});
}, },
'complete': () => this.refreshTable() 'complete': () => this.refreshTable()
}); });
} }
}); });
} }
} }

View File

@@ -18,7 +18,6 @@ export class AddTextDialogComponent {
this.dialogRef.close(undefined); this.dialogRef.close(undefined);
} }
onSaveClick(): void { onSaveClick(): void {
this.dialogRef.close(this.text); this.dialogRef.close(this.text);
} }

View File

@@ -4,8 +4,8 @@ import { Component, ElementRef, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar'; import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { BaseWidget, Dashboard, DashboardCreationData, DashboardService, PlotSize, PlotWidget, PlotWidgetRenderData, TextWidget } from 'src/app/dashboard.service'; import { Dashboard, DashboardCreationData, DashboardService, PlotWidget, PlotWidgetRenderData, TextWidget } from 'src/app/dashboard.service';
import { PlotConfig, PlotRequest, PlotResponse, PlotService, RenderOptions } from 'src/app/plot.service'; import { PlotConfig, PlotResponse, PlotService } from 'src/app/plot.service';
import { NewDashboardComponent } from '../new-dashboard/new-dashboard.component'; import { NewDashboardComponent } from '../new-dashboard/new-dashboard.component';
import { AddPlotDialogComponent } from './add-plot-dialog/add-plot-dialog.component'; import { AddPlotDialogComponent } from './add-plot-dialog/add-plot-dialog.component';
import { AddTextDialogComponent } from './add-text-dialog/add-text-dialog.component'; import { AddTextDialogComponent } from './add-text-dialog/add-text-dialog.component';
@@ -71,48 +71,6 @@ export class DashboardComponent implements OnInit {
} }
} }
/*
createPlotRequest(plotWidget: PlotWidget): PlotRequest {
const height = this.height(plotWidget.size);
const width = this.width(plotWidget.size);
const fullWidth = window.innerWidth-30;
const fullHeight = window.innerHeight-30;
const request = new PlotRequest(
(<any>window).submitterId+crypto.randomUUID(),
plotWidget.config,
{
'main': new RenderOptions(height,width, false, true),
'fullScreen': new RenderOptions(fullHeight,fullWidth, false, true)
}
);
return request;
}
height(size: PlotSize): number{
switch (size) {
case 'SMALL':
return 300;
case 'MEDIUM':
return 400;
case 'LARGE':
return 600;
}
}
width(size: PlotSize): number{
switch (size) {
case 'SMALL':
return 400;
case 'MEDIUM':
return 600;
case 'LARGE':
return 900;
}
}
*/
private repairArrangement(){ private repairArrangement(){
const arrangement = this.dashboard!.arrangement || []; const arrangement = this.dashboard!.arrangement || [];
if (arrangement.length == 0){ if (arrangement.length == 0){
@@ -220,7 +178,6 @@ export class DashboardComponent implements OnInit {
this.dashboard!.description = result.description; this.dashboard!.description = result.description;
} }
}); });
} }
isTextWidget(id: string): boolean { isTextWidget(id: string): boolean {

View File

@@ -1,8 +1,8 @@
import { AfterViewInit, Component, Input, OnInit, ViewChild } from '@angular/core'; import { AfterViewInit, Component, Input, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { PlotSize, PlotWidget, PlotWidgetRenderData } from 'src/app/dashboard.service'; import { PlotWidget, PlotWidgetRenderData } from 'src/app/dashboard.service';
import { PlotViewComponent } from 'src/app/plot-view/plot-view.component'; import { PlotViewComponent } from 'src/app/plot-view/plot-view.component';
import { PlotConfig, PlotRequest, PlotResponse, PlotService, RenderOptions } from 'src/app/plot.service'; import { PlotConfig, PlotResponse, PlotService } from 'src/app/plot.service';
import { AddPlotDialogComponent } from '../add-plot-dialog/add-plot-dialog.component'; import { AddPlotDialogComponent } from '../add-plot-dialog/add-plot-dialog.component';
import { FullScreenPlotDialogComponent } from '../full-screen-plot-dialog/full-screen-plot-dialog.component'; import { FullScreenPlotDialogComponent } from '../full-screen-plot-dialog/full-screen-plot-dialog.component';
@@ -10,7 +10,7 @@ import { FullScreenPlotDialogComponent } from '../full-screen-plot-dialog/full-s
selector: 'app-plot-widget', selector: 'app-plot-widget',
templateUrl: './plot-widget.component.html' templateUrl: './plot-widget.component.html'
}) })
export class PlotWidgetComponent implements AfterViewInit { export class PlotWidgetComponent {
@Input("data") @Input("data")
data!: PlotWidgetRenderData; data!: PlotWidgetRenderData;
@@ -22,13 +22,9 @@ export class PlotWidgetComponent implements AfterViewInit {
constructor(private dialog: MatDialog, private service: PlotService){} constructor(private dialog: MatDialog, private service: PlotService){}
ngAfterViewInit(): void {
}
hasRender(name: string): boolean{ hasRender(name: string): boolean{
const hasRender = this.data !== undefined && this.data.plotResponse !== undefined && this.data.plotResponse?.rendered[name] !== undefined; return this.data !== undefined && this.data.plotResponse !== undefined && this.data.plotResponse?.rendered[name] !== undefined;
return hasRender;
} }
getImageUrl(name: string ): string | undefined { getImageUrl(name: string ): string | undefined {
@@ -36,11 +32,10 @@ export class PlotWidgetComponent implements AfterViewInit {
} }
showFullScreenImage() { showFullScreenImage() {
this.dialog.open(FullScreenPlotDialogComponent,{ this.dialog.open(FullScreenPlotDialogComponent,{
width: 'calc(100% - 15px)', width: 'calc(100% - 15px)',
height: 'calc(100% - 15px)', height: 'calc(100% - 15px)',
'data': {'imageUrl': this.getImageUrl('fullScreen')} data: {'imageUrl': this.getImageUrl('fullScreen')}
}).afterClosed().subscribe(() => { }).afterClosed().subscribe(() => {
}); });