show image in dashboard

2023-02-26 18:38:27 +01:00
parent d52033b5f0
commit bd1b4fb655
6 changed files with 120 additions and 30 deletions
--- a/pdb-js/src/app/dashboard-page/dashboard/plot-widget/plot-widget.component.html
+++ b/pdb-js/src/app/dashboard-page/dashboard/plot-widget/plot-widget.component.html
@@ -1,4 +1,23 @@
 <style>
-
+  :host {
+    float: left;
+  }
+  .dashboard-card {
+    border: solid 1px red;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .size-medium {
+    width: 602px;
+    height: 502px;
+  }
 </style>
-<p>{{data.config.query}}</p>
+<div class="dashboard-card" [ngClass]="{'size-medium' : data.size=='MEDIUM'}">
+  <mat-spinner *ngIf="!thumbnailUrl && !isError"></mat-spinner>
+  <img *ngIf="thumbnailUrl" src="{{thumbnailUrl}}" />
+  <div *ngIf="isError">
+    There was an error! This is a good time to panic!
+  </div>
+</div>
+