Move to new server

src/app/components/player-list/player-list.component.html

@@ -0,0 +1,42 @@
+<mat-card appearance="outlined">
+<!--
+  <mat-card-header>
+    <h5>Spelers</h5>
+  </mat-card-header>
+-->
+  <mat-card-content>
+    <table class="table table-hover">
+      <thead class="thead-dark">
+        <tr>
+          <th scope="col">#</th>
+          <th scope="col">Naam</th>
+          <th scope="col">M/V</th>
+          <th scope="col">Club</th>
+          <th scope="col"></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr *ngFor="let player of players">
+          <td class="align-middle">{{ player.id }}</td>
+          <td class="align-middle">{{ player | fullName }}</td>
+          <td class="align-middle">{{ player.sex }}</td>
+          <td class="align-middle">{{ player.club }}</td>
+          <td class="align-middle">
+            <a mat-button [routerLink]="['/players/edit', player.id]">
+              <mat-icon>edit</mat-icon>
+              Bewerk
+            </a>
+            <a mat-button [routerLink]="['/players', player.id, 'registrations']">
+              <mat-icon>app_registration</mat-icon>
+              Inschrijvingen
+            </a>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+    <a mat-button routerLink="/players/add">
+      <mat-icon>person_add</mat-icon>
+      Nieuwe speler
+    </a>
+  </mat-card-content>
+</mat-card>

src/app/components/player-list/player-list.component.scss

@@ -0,0 +1,7 @@
+a {
+  margin-right: 1em;
+}
+
+td, th {
+  background-color: transparent !important;
+}

src/app/components/player-list/player-list.component.ts

@@ -0,0 +1,36 @@
+import {Component, OnInit} from '@angular/core';
+import {Player} from "../../model/player";
+import {PlayerService} from "../../service/player.service";
+import {NgFor} from "@angular/common";
+import {RouterLink} from "@angular/router";
+import {MatAnchor} from "@angular/material/button";
+import {MatIcon} from "@angular/material/icon";
+import {MatCard, MatCardContent, MatCardHeader} from "@angular/material/card";
+import {FullNamePipe} from "../../pipes/fullname-pipe";
+import {TitleService} from "../../service/title.service";
+
+@Component({
+  selector: 'app-player-list',
+  standalone: true,
+  imports: [NgFor, RouterLink, MatAnchor, MatIcon, MatCard, MatCardHeader, MatCardContent, FullNamePipe],
+  templateUrl: './player-list.component.html',
+  styleUrl: './player-list.component.scss'
+})
+export class PlayerListComponent implements OnInit {
+
+  players: Player[];
+
+  constructor(
+    private titleService: TitleService,
+    private playerService: PlayerService) {
+  }
+
+  ngOnInit() {
+    this.titleService.setTitle("Spelers");
+    this.playerService.getAll().subscribe(data => {
+      this.players = data;
+    });
+  }
+
+  protected readonly Player = Player;
+}