From aa507acf0f86603cf71f12a9e2a1b54a97ada68b Mon Sep 17 00:00:00 2001
From: Julian Krauser <jkrauser209@gmail.com>
Date: Thu, 13 Mar 2025 11:22:04 +0100
Subject: [PATCH] base settings structure

---
 .../admin/management/settings/AuthForm.vue    | 24 ++++++++++++
 .../admin/management/settings/BackupForm.vue  | 24 ++++++++++++
 .../admin/management/settings/ClubForm.vue    | 23 +++++++++++
 .../admin/management/settings/MailForm.vue    | 26 +++++++++++++
 .../management/settings/SecurityForm.vue      | 27 +++++++++++++
 .../admin/management/settings/WebapiForm.vue  | 24 ++++++++++++
 src/router/index.ts                           |  7 ++++
 src/stores/admin/navigation.ts                |  1 +
 .../admin/management/settings/Settings.vue    | 39 +++++++++++++++++++
 9 files changed, 195 insertions(+)
 create mode 100644 src/components/admin/management/settings/AuthForm.vue
 create mode 100644 src/components/admin/management/settings/BackupForm.vue
 create mode 100644 src/components/admin/management/settings/ClubForm.vue
 create mode 100644 src/components/admin/management/settings/MailForm.vue
 create mode 100644 src/components/admin/management/settings/SecurityForm.vue
 create mode 100644 src/components/admin/management/settings/WebapiForm.vue
 create mode 100644 src/views/admin/management/settings/Settings.vue

diff --git a/src/components/admin/management/settings/AuthForm.vue b/src/components/admin/management/settings/AuthForm.vue
new file mode 100644
index 0000000..fdac33d
--- /dev/null
+++ b/src/components/admin/management/settings/AuthForm.vue
@@ -0,0 +1,24 @@
+<template>
+  <div class="flex flex-col h-fit w-full border border-primary rounded-md">
+    <div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
+      <p>Anmeldung</p>
+    </div>
+    <div class="flex flex-col gap-1 p-2">
+      <input type="text" placeholder="Gültigkeitsdauer des Tokens nach Ablauf" />
+      <input type="text" placeholder="Gültigkeitsdauer Zugangs-Token" />
+      <input type="text" placeholder="Gültigkeitsdauer Zugangs-Token in der App" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapState, mapActions } from "pinia";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {},
+  methods: {},
+});
+</script>
diff --git a/src/components/admin/management/settings/BackupForm.vue b/src/components/admin/management/settings/BackupForm.vue
new file mode 100644
index 0000000..3022a6d
--- /dev/null
+++ b/src/components/admin/management/settings/BackupForm.vue
@@ -0,0 +1,24 @@
+<template>
+  <div class="flex flex-col h-fit w-full border border-primary rounded-md">
+    <div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
+      <p>Backups</p>
+    </div>
+    <div class="flex flex-col gap-1 p-2">
+      <input type="number" placeholder="Intervall in Tagen" min="0" />
+      <input type="number" placeholder="Anzahl paralleler Kopien" min="1" />
+      <input type="checkbox" placeholder="Automatische Wiederherstellung" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapState, mapActions } from "pinia";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {},
+  methods: {},
+});
+</script>
diff --git a/src/components/admin/management/settings/ClubForm.vue b/src/components/admin/management/settings/ClubForm.vue
new file mode 100644
index 0000000..6afa821
--- /dev/null
+++ b/src/components/admin/management/settings/ClubForm.vue
@@ -0,0 +1,23 @@
+<template>
+  <div class="flex flex-col h-fit w-full border border-primary rounded-md">
+    <div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
+      <p>Verein</p>
+    </div>
+    <div class="flex flex-col gap-1 p-2">
+      <input type="text" placeholder="Vereinsname" />
+      <input type="url" placeholder="Vereins-Webseite" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapState, mapActions } from "pinia";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {},
+  methods: {},
+});
+</script>
diff --git a/src/components/admin/management/settings/MailForm.vue b/src/components/admin/management/settings/MailForm.vue
new file mode 100644
index 0000000..cf9aadd
--- /dev/null
+++ b/src/components/admin/management/settings/MailForm.vue
@@ -0,0 +1,26 @@
+<template>
+  <div class="flex flex-col h-fit w-full border border-primary rounded-md">
+    <div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
+      <p>E-Mail</p>
+    </div>
+    <div class="flex flex-col gap-1 p-2">
+      <input type="text" placeholder="Nutzername" />
+      <input type="text" placeholder="Passwort" />
+      <input type="text" placeholder="Serveradresse" />
+      <input type="number" placeholder="Serverport" />
+      <input type="checkbox" placeholder="Sicher" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapState, mapActions } from "pinia";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {},
+  methods: {},
+});
+</script>
diff --git a/src/components/admin/management/settings/SecurityForm.vue b/src/components/admin/management/settings/SecurityForm.vue
new file mode 100644
index 0000000..89c669e
--- /dev/null
+++ b/src/components/admin/management/settings/SecurityForm.vue
@@ -0,0 +1,27 @@
+<template>
+  <div class="flex flex-col h-fit w-full border border-primary rounded-md">
+    <div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
+      <p>Sicherheit</p>
+    </div>
+    <div class="flex flex-col gap-1 p-2">
+      <p>Limit für öffentliche Routen</p>
+      <input type="text" placeholder="Dauer des Zeitfensters" />
+      <input type="text" placeholder="Anfrage-Limit im Zeitfenster" />
+      <p>Limit für intere Routen (nur bei fehlerhaften Anfragen)</p>
+      <input type="text" placeholder="Dauer des Zeitfensters" />
+      <input type="text" placeholder="Anfrage-Limit im Zeitfenster" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapState, mapActions } from "pinia";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {},
+  methods: {},
+});
+</script>
diff --git a/src/components/admin/management/settings/WebapiForm.vue b/src/components/admin/management/settings/WebapiForm.vue
new file mode 100644
index 0000000..d782251
--- /dev/null
+++ b/src/components/admin/management/settings/WebapiForm.vue
@@ -0,0 +1,24 @@
+<template>
+  <div class="flex flex-col h-fit w-full border border-primary rounded-md">
+    <div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
+      <p>WebApi</p>
+    </div>
+    <div class="flex flex-col gap-1 p-2">
+      <p>FF Admin</p>
+      <input type="url" placeholder="Server-URL" />
+      <input type="text" placeholder="WebApi-Token" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapState, mapActions } from "pinia";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {},
+  methods: {},
+});
+</script>
diff --git a/src/router/index.ts b/src/router/index.ts
index fb1471c..0cb9895 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -277,6 +277,13 @@ const router = createRouter({
               meta: { admin: true },
               beforeEnter: [abilityAndNavUpdate],
             },
+            {
+              path: "settings",
+              name: "admin-management-settings",
+              component: () => import("@/views/admin/management/settings/Settings.vue"),
+              meta: { admin: true },
+              beforeEnter: [abilityAndNavUpdate],
+            },
           ],
         },
         {
diff --git a/src/stores/admin/navigation.ts b/src/stores/admin/navigation.ts
index db31e1b..48f8ac4 100644
--- a/src/stores/admin/navigation.ts
+++ b/src/stores/admin/navigation.ts
@@ -107,6 +107,7 @@ export const useNavigationStore = defineStore("navigation", {
             ...(abilityStore.can("read", "management", "role") ? [{ key: "role", title: "Rollen" }] : []),
             ...(abilityStore.can("read", "management", "backup") ? [{ key: "backup", title: "Backups" }] : []),
             ...(abilityStore.isAdmin() ? [{ key: "version", title: "Version" }] : []),
+            ...(abilityStore.isAdmin() ? [{ key: "settings", title: "Einstellungen" }] : []),
           ],
         },
       } as navigationModel;
diff --git a/src/views/admin/management/settings/Settings.vue b/src/views/admin/management/settings/Settings.vue
new file mode 100644
index 0000000..1e1065c
--- /dev/null
+++ b/src/views/admin/management/settings/Settings.vue
@@ -0,0 +1,39 @@
+<template>
+  <MainTemplate :useStagedOverviewLink="false">
+    <template #topBar>
+      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
+        <h1 class="font-bold text-xl h-8">Einstellungen</h1>
+      </div>
+    </template>
+    <template #main>
+      <ClubForm />
+      <MailForm />
+      <BackupForm />
+      <!-- <AuthForm />
+      <SecurityForm /> -->
+      <WebapiForm />
+    </template>
+  </MainTemplate>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import MainTemplate from "@/templates/Main.vue";
+import MailForm from "@/components/admin/management/settings/MailForm.vue";
+import ClubForm from "@/components/admin/management/settings/ClubForm.vue";
+import BackupForm from "@/components/admin/management/settings/BackupForm.vue";
+import AuthForm from "@/components/admin/management/settings/AuthForm.vue";
+import SecurityForm from "@/components/admin/management/settings/SecurityForm.vue";
+import WebapiForm from "@/components/admin/management/settings/WebapiForm.vue";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  data() {
+    return {};
+  },
+  computed: {},
+  mounted() {},
+  methods: {},
+});
+</script>