From 87377dab067fe5d6a866f52ae762579b109e78d0 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Wed, 19 Jun 2024 21:33:59 +0200
Subject: [PATCH] Add toggle

---
 resources/js/views/group/Index.vue | 31 ++++++++++++++++--------------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/resources/js/views/group/Index.vue b/resources/js/views/group/Index.vue
index 5b199282..c039cf04 100644
--- a/resources/js/views/group/Index.vue
+++ b/resources/js/views/group/Index.vue
@@ -47,8 +47,8 @@
                     <tr>
                         <td>
                             <div class="flex space-x-2">
-                                <a v-if="!isOpen(child.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="open(child)"><ui-sprite src="plus"></ui-sprite></a>
-                                <a v-if="isOpen(child.id)" v-tooltip="`Schließen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="close(child)"
+                                <a v-if="!isOpen(child.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="toggle(child)"><ui-sprite src="plus"></ui-sprite></a>
+                                <a v-if="isOpen(child.id)" v-tooltip="`Schließen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="toggle(child)"
                                     ><ui-sprite src="close"></ui-sprite
                                 ></a>
                                 <span v-text="child.name"></span>
@@ -63,10 +63,15 @@
                     <template v-for="subchild in childrenOf(child.id)" :key="subchild.id">
                         <tr>
                             <div class="pl-12 flex space-x-2">
-                                <a v-if="subchild.children_count !== 0 && !isOpen(subchild.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="open(subchild)"
+                                <a v-if="subchild.children_count !== 0 && !isOpen(subchild.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="toggle(subchild)"
                                     ><ui-sprite src="plus"></ui-sprite
                                 ></a>
-                                <a v-if="subchild.children_count !== 0 && isOpen(subchild.id)" v-tooltip="`Schließen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="close(subchild)"
+                                <a
+                                    v-if="subchild.children_count !== 0 && isOpen(subchild.id)"
+                                    v-tooltip="`Schließen`"
+                                    href="#"
+                                    class="inline-flex btn btn-info btn-sm"
+                                    @click.prevent="toggle(subchild)"
                                     ><ui-sprite src="close"></ui-sprite
                                 ></a>
                                 <span v-text="subchild.name"></span>
@@ -87,7 +92,7 @@
                                         v-tooltip="`Öffnen`"
                                         href="#"
                                         class="inline-flex btn btn-info btn-sm"
-                                        @click.prevent="open(subsubchild)"
+                                        @click.prevent="toggle(subsubchild)"
                                         ><ui-sprite src="plus"></ui-sprite
                                     ></a>
                                     <a
@@ -95,7 +100,7 @@
                                         v-tooltip="`Schließen`"
                                         href="#"
                                         class="inline-flex btn btn-info btn-sm"
-                                        @click.prevent="close(subsubchild)"
+                                        @click.prevent="toggle(subsubchild)"
                                         ><ui-sprite src="close"></ui-sprite
                                     ></a>
                                     <span v-text="subsubchild.name"></span>
@@ -128,10 +133,12 @@ const children = reactive({
 
 var editing = ref(null);
 
-async function open(parent) {
-    const result = (await axios.get(parent.links.children)).data;
-
-    children[parent.id] = result.data;
+async function toggle(parent) {
+    if (isOpen(parent.id)) {
+        delete children[parent.id];
+    } else {
+        children[parent.id] = (await axios.get(parent.links.children)).data.data;
+    }
 }
 
 async function edit(parent) {
@@ -141,10 +148,6 @@ async function edit(parent) {
     };
 }
 
-function close(parent) {
-    delete children[parent.id];
-}
-
 function isOpen(child) {
     return child in children;
 }