Odradjen my-models stranica #55

4 files changed, 86 insertions, 33 deletions

diff --git a/frontend/src/app/_elements/item-model/item-model.component.html b/frontend/src/app/_elements/item-model/item-model.component.html
index ca170b3d..9466da01 100644
--- a/frontend/src/app/_elements/item-model/item-model.component.html
+++ b/frontend/src/app/_elements/item-model/item-model.component.html
@@ -1,26 +1,14 @@
-<!--
+
 <div class="card" style="min-width: 12rem;">
     <div class="card-header">
         {{model.name}}
     </div>
-    <div class="card-body">
+    <div class="card-body overflow-hidden">
         <p class="card-text">
-            {{model.description}}
+            {{"Opis: "+ model.description}}<br>
+            {{"Datum kreiranja:" + model.dateCreated}}<br>
+            {{"Poslednje ažuriranje:" + model.lastUpdated}}<br>
         </p>
-        <div class="d-flex flex-column align-items-center">
-            <table class="table table-bordered table-sm">
-                <thead>
-                    <th class="text-center" *ngFor="let column of model.inputs">{{column}}</th>
-                </thead>
-            </table>
-            <mat-icon>arrow_downward</mat-icon>
-            <p>
-                {{model.output}}
-            </p>
-        </div>
+        
     </div>
-    <div class="card-footer text-center">
-        <a routerLink="predict" mat-raised-button color="primary">Iskoristi</a>
-    </div>
-</div>
--->
\ No newline at end of file
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/_pages/my-models/my-models.component.html b/frontend/src/app/_pages/my-models/my-models.component.html
index e94f67f5..870e0ddb 100644
--- a/frontend/src/app/_pages/my-models/my-models.component.html
+++ b/frontend/src/app/_pages/my-models/my-models.component.html
@@ -1,5 +1,27 @@
-<ul class="list-group my-2">
-    <li class="list-group-item" *ngFor="let model of myModels">
-        <app-item-model [model]="model"></app-item-model>
-    </li>
-</ul>
\ No newline at end of file
+<div id="wrapper">
+    <div id="container" class="container p-5" style="background-color: white; min-height: 100%;">
+        <div class="row mt-3 mb-2 d-flex justify-content-center">
+        
+        <div class="col-sm-6" style="margin-bottom: 10px;">
+        </div>
+        
+            <div class="row">
+                <div class="col-sm-4" style="margin-bottom: 10px;" *ngFor="let model of myModels">
+                <app-item-model [model]="model"></app-item-model>
+                <div style="width: 25%; margin: auto;">
+                    <button (click)="deleteThisModel(model)" style="margin-top: 3px; width: 100%;">Obriši</button>
+                </div>
+                </div>
+            </div>
+        <div class="text-center" *ngIf="this.myModels.length == 0" >
+        <h2>Nema rezultata</h2>
+        </div>
+        </div>
+    
+    </div>
+    
+    
+    
+    
+    
+    </div>
diff --git a/frontend/src/app/_pages/my-models/my-models.component.ts b/frontend/src/app/_pages/my-models/my-models.component.ts
index 3ab57e59..bd6b0a2b 100644
--- a/frontend/src/app/_pages/my-models/my-models.component.ts
+++ b/frontend/src/app/_pages/my-models/my-models.component.ts
@@ -1,22 +1,55 @@
 import { Component, OnInit } from '@angular/core';
 import Model from 'src/app/_data/Model';
+import { ModelsService } from 'src/app/_services/models.service';
 
 @Component({
   selector: 'app-my-models',
   templateUrl: './my-models.component.html',
   styleUrls: ['./my-models.component.css']
 })
-export class MyModelsComponent /*implements OnInit*/ {
-  myModels: Model[];
+export class MyModelsComponent implements OnInit {
+  myModels: Model[] = [];
+  //myModel: Model;
 
-  constructor() {
-    this.myModels = [
-    new Model('Titanik', 'Opis titanik'),
-    new Model('Neki drugi set', 'opis'),
-    new Model('Treci set', 'opis')
-  ]; }
+  constructor(private modelsS : ModelsService) {
+
+    
+
+     }
+
+  ngOnInit(): void {
+    this.getAllMyModels();
 
-  /*ngOnInit(): void {
+  }
+/*
+  editModel(): void{
+    this.modelsS.editModel().subscribe(m => {
+      this.myModel = m;
+
+    })
   }
 */
+
+deleteThisModel(model: Model): void{
+  console.log("OK");
+  this.modelsS.deleteModel(model).subscribe((response) => {
+    console.log("OBRISANOOO JEE", response);
+    //na kraju uspesnog
+    this.getAllMyModels();
+  }, (error) =>{
+      if (error.error == "Model with name = {name} deleted") {
+        alert("Greška pri brisanju modela!");
+      }
+    });
+
+}
+
+  getAllMyModels(): void{
+    this.modelsS.getMyModels().subscribe(m => {
+      
+      this.myModels = m;
+      console.log(this.myModels);
+    });
+  }
+
 }
diff --git a/frontend/src/app/_services/models.service.ts b/frontend/src/app/_services/models.service.ts
index d0346c03..58ddb2e6 100644
--- a/frontend/src/app/_services/models.service.ts
+++ b/frontend/src/app/_services/models.service.ts
@@ -46,4 +46,14 @@ export class ModelsService {
   getMyModels(): Observable<Model[]> {
     return this.http.get<Model[]>(`${API_SETTINGS.apiURL}/model/mymodels`, { headers: this.authService.authHeader() });
   }
+
+  editModel(model:Model) : Observable<Model>
+  {
+    return this.http.put<Model>(`${API_SETTINGS.apiURL}/model/`, model, { headers: this.authService.authHeader() });
+  }
+
+  deleteModel(model:Model) : Observable<any>
+  {
+    return this.http.delete(`${API_SETTINGS.apiURL}/model/`+model.name, { headers: this.authService.authHeader() });
+  }
 }