Neues Referee zeug

src/components/admin/pages/event/RefereesList.svelte

@@ -0,0 +1,99 @@
+<!--
+  -   This file is a part of the SteamWar software.
+  -
+  -   Copyright (C) 2024 SteamWar.de-Serverteam
+  -
+  -   This program is free software: you can redistribute it and/or modify
+  -   it under the terms of the GNU Affero General Public License as published by
+  -   the Free Software Foundation, either version 3 of the License, or
+  -   (at your option) any later version.
+  -
+  -   This program is distributed in the hope that it will be useful,
+  -   but WITHOUT ANY WARRANTY; without even the implied warranty of
+  -   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+  -   GNU Affero General Public License for more details.
+  -
+  -   You should have received a copy of the GNU Affero General Public License
+  -   along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<script lang="ts">
+    import type {ExtendedEvent} from "@type/event.ts";
+    import {Button} from "flowbite-svelte";
+    import {PlusSolid} from "flowbite-svelte-icons";
+    import SWModal from "@components/styled/SWModal.svelte";
+    import SWButton from "@components/styled/SWButton.svelte";
+    import TypeAheadSearch from "@components/admin/components/TypeAheadSearch.svelte";
+    import {players} from "@stores/stores.ts";
+    import {eventRepo} from "@repo/event.ts";
+
+    export let data: ExtendedEvent;
+
+    let searchValue = "";
+    let selectedPlayer: string | null = null;
+
+    let referees = data.event.referees;
+
+    let showAdd = false;
+
+    async function addReferee() {
+        if (selectedPlayer) {
+            referees = (await $eventRepo.updateEvent(data.event.id.toString(), {
+                addReferee: [parseInt(selectedPlayer)]
+            })).referees;
+        }
+
+        reset();
+    }
+
+    function removeReferee(id: number) {
+        return async () => {
+            referees = (await $eventRepo.updateEvent(data.event.id.toString(), {
+                removeReferee: [id]
+            })).referees;
+        }
+    }
+
+    function reset() {
+        selectedPlayer = null;
+        searchValue = "";
+    }
+</script>
+
+<ul class="mx-4 my-2 divide-y divide-neutral-600">
+    {#each referees as referee}
+        <li class="flex flex-grow justify-between">
+            {referee.name}
+            <SWButton on:click={removeReferee(referee.id)}>
+                Entfernen
+            </SWButton>
+        </li>
+    {/each}
+
+    {#if referees.length === 0}
+        <li>Keine Schiedsrichter</li>
+    {/if}
+</ul>
+
+<Button class="fixed bottom-6 right-6 !p-4 z-10 shadow-lg" on:click={() => showAdd = true}>
+    <PlusSolid/>
+</Button>
+
+<SWModal title="Schiedsrichter hinzufügen" bind:open={showAdd}>
+    <div class="flex flex-grow justify-center h-80">
+        <div>
+            <TypeAheadSearch bind:searchValue bind:selected={selectedPlayer}
+                             items={$players.map(v => ({ name: v.name, value: v.id.toString() }))}/>
+        </div>
+    </div>
+    <div slot="footer" class="flex flex-grow justify-end">
+        <SWButton on:click={reset} type="gray">Abbrechen</SWButton>
+        <SWButton on:click={addReferee}>Hinzufügen</SWButton>
+    </div>
+</SWModal>
+
+<style>
+    li {
+        @apply py-2;
+    }
+</style>