implement image post, put, delete;

frontend/src/app/component/images/images.component.html

@@ -1,18 +1,30 @@
 <h2>Available Images</h2>
 
-<div>
-  <span style="width: 9.5em; display: inline-block; margin-left: 1.5em">Name</span>
+<div style="font-weight: bolder; font-size: 20px">
+  <span style="width: 7.6em; display: inline-block; margin-left: 1em">Name</span>
   <span style="width: 15em; display: inline-block">Date</span>
 </div>
 
-<mat-expansion-panel *ngFor="let image of images | slice:paginationGetStart():paginationGetEnd()">
+<mat-expansion-panel *ngFor="let image of images | slice:paginationGetStart():paginationGetEnd(); let i = index">
   <mat-expansion-panel-header (click)="$event.stopPropagation()">
     <span style="width: 10em"
     >{{image.name}}</span>
     <span style="width: 15em"
     >{{image.datetime}}</span>
   </mat-expansion-panel-header>
-  TEST
+
+  <div style="width: 20em; height: 20em; border: solid; margin-bottom: 1em">
+    IMAGE
+  </div>
+
+  <angular-file-uploader style="margin-left: 0 !important;"
+                         [config]="getImageUpdateConfig(image.filename)"
+
+  >
+  </angular-file-uploader>
+  <span style="float: right">
+    <button mat-raised-button color="warn" (click)="deleteImage(image)">Delete</button>
+  </span>
 </mat-expansion-panel>
 
 <mat-paginator [length]="images.length"
@@ -21,3 +33,8 @@
                (page)="lastPageEvent = $event"
                showFirstLastButtons
 ></mat-paginator>
+
+<h3>Upload New Image</h3>
+<angular-file-uploader style="margin-left: 0 !important;"
+  [config]="imageUploadConfig" id="generalUpload">
+</angular-file-uploader>