From ed06f5d1ca61675ffa79b43d543befebd17d0691 Mon Sep 17 00:00:00 2001
From: Phan Huy Tran <p.tran@neusta.de>
Date: Wed, 20 Nov 2024 10:20:42 +0100
Subject: [PATCH] delete

---
 .../main-view/main-view.component.html        |  2 +-
 .../main-view/main-view.component.ts          | 10 +-------
 .../show-form/show-form.component.ts          |  3 ++-
 .../show-list/show-list.component.html        | 24 +++++++++++++++----
 .../show-list/show-list.component.ts          | 15 ++++++++++--
 src/index.html                                |  1 +
 tailwind.config.js                            | 11 ---------
 7 files changed, 38 insertions(+), 28 deletions(-)
 delete mode 100644 tailwind.config.js

diff --git a/src/app/components/main-view/main-view.component.html b/src/app/components/main-view/main-view.component.html
index d775106..a034650 100644
--- a/src/app/components/main-view/main-view.component.html
+++ b/src/app/components/main-view/main-view.component.html
@@ -2,7 +2,7 @@
   <div class="row mt-3"><h1>TV-Serien</h1></div>
   <div class="row mt-1">
     <div class="col-md-7 mb-3">
-      <app-show-list [shows]="shows"></app-show-list>
+      <app-show-list></app-show-list>
     </div>
     <div class="col-md-5">
     </div>
diff --git a/src/app/components/main-view/main-view.component.ts b/src/app/components/main-view/main-view.component.ts
index 52b49d7..7bb45e8 100644
--- a/src/app/components/main-view/main-view.component.ts
+++ b/src/app/components/main-view/main-view.component.ts
@@ -1,7 +1,5 @@
-import {Component, inject} from '@angular/core';
+import {Component} from '@angular/core';
 import {ShowListComponent} from '../show-list/show-list.component';
-import {Show} from '../../model/show';
-import {ShowService} from '../../services/show.service';
 import {ShowFormComponent} from '../show-form/show-form.component';
 
 @Component({
@@ -15,10 +13,4 @@ import {ShowFormComponent} from '../show-form/show-form.component';
   styleUrl: './main-view.component.css'
 })
 export class MainViewComponent {
-  private dataService: ShowService = inject(ShowService);
-  public shows: Show[] = [];
-
-  constructor() {
-    this.shows = this.dataService.getShows();
-  }
 }
diff --git a/src/app/components/show-form/show-form.component.ts b/src/app/components/show-form/show-form.component.ts
index 66794eb..70f2fd4 100644
--- a/src/app/components/show-form/show-form.component.ts
+++ b/src/app/components/show-form/show-form.component.ts
@@ -15,9 +15,10 @@ import {FormsModule} from '@angular/forms';
 export class ShowFormComponent {
   showService: ShowService = inject(ShowService);
   show: Show = new Show(null, null);
+  shows: Show[] = this.showService.getShows();
 
   save() {
-    this.showService.getShows().push(this.show);
+    this.shows.push(this.show);
 
     this.show = new Show(null, null);
   }
diff --git a/src/app/components/show-list/show-list.component.html b/src/app/components/show-list/show-list.component.html
index 7c34cb2..e5c99cd 100644
--- a/src/app/components/show-list/show-list.component.html
+++ b/src/app/components/show-list/show-list.component.html
@@ -1,6 +1,22 @@
-@for (show of shows; track show.id) {
+<table class="table table-striped table-hover">
+  <thead>
   <tr>
-    <td>{{ show.id }}</td>
-    <td>{{ show.title }}</td>
+    <th>Id</th>
+    <th>Serientitel</th>
   </tr>
-}
+  </thead>
+  <tbody>
+    @for (show of shows; track show.id) {
+      <tr>
+        <td>{{ show.id }}</td>
+        <td>{{ show.title }}</td>
+        <td>
+          <button class="btn btn-secondary">Bearbeiten</button>
+        </td>
+        <td>
+          <button class="btn btn-danger" (click)="delete(show)">Löschen</button>
+        </td>
+      </tr>
+    }
+  </tbody>
+</table>
diff --git a/src/app/components/show-list/show-list.component.ts b/src/app/components/show-list/show-list.component.ts
index 632d4c1..a055cdb 100644
--- a/src/app/components/show-list/show-list.component.ts
+++ b/src/app/components/show-list/show-list.component.ts
@@ -1,5 +1,6 @@
-import {Component, Input} from '@angular/core';
+import {Component, inject, Input} from '@angular/core';
 import {Show} from '../../model/show';
+import {ShowService} from '../../services/show.service';
 
 @Component({
   selector: 'app-show-list',
@@ -9,5 +10,15 @@ import {Show} from '../../model/show';
   styleUrl: './show-list.component.css'
 })
 export class ShowListComponent {
-  @Input() shows: Show[] = [];
+  showService: ShowService = inject(ShowService);
+  shows: Show[] = this.showService.getShows();
+
+  updateShow(show: Show) {
+    this.shows = this.shows.filter(s => s !== show);
+    this.shows.push(show);
+  }
+
+  delete(show: Show) {
+    this.shows = this.shows.filter(s => s !== show);
+  }
 }
diff --git a/src/index.html b/src/index.html
index eeb9a85..614d65e 100644
--- a/src/index.html
+++ b/src/index.html
@@ -6,6 +6,7 @@
   <base href="/">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <link href=https://fonts.googleapis.com/icon?family=Material+Icons rel="stylesheet">
 </head>
 <body>
   <app-root></app-root>
diff --git a/tailwind.config.js b/tailwind.config.js
deleted file mode 100644
index 7586753..0000000
--- a/tailwind.config.js
+++ /dev/null
@@ -1,11 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: [
-    "./src/**/*.{html,ts}",
-  ],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-}
-