From 94f91cbda7bf40eb2cbcce77af58523ba9ee81c2 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Tue, 27 May 2025 19:14:34 +0200
Subject: [PATCH] --wip-- [skip ci]

---
 resources/js/components/page/Filter.vue       |  9 +--
 .../js/components/page/FilterSidebar.vue      | 16 ++++++
 resources/js/views/member/Filter.vue          |  3 +
 resources/js/views/member/VIndex.vue          | 56 ++++---------------
 4 files changed, 33 insertions(+), 51 deletions(-)
 create mode 100644 resources/js/components/page/FilterSidebar.vue
 create mode 100644 resources/js/views/member/Filter.vue

diff --git a/resources/js/components/page/Filter.vue b/resources/js/components/page/Filter.vue
index 5ef06f81..a58791cb 100644
--- a/resources/js/components/page/Filter.vue
+++ b/resources/js/components/page/Filter.vue
@@ -1,10 +1,7 @@
 <template>
-    <ui-sidebar v-if="visible === true" @close="visible = false" :max="0">
-        <page-header title="Filtern" @close="visible = false"></page-header>
-        <div class="grid gap-6 p-6">
-            <slot name="fields"></slot>
-        </div>
-    </ui-sidebar>
+    <page-filter-sidebar v-if="visible === true" @close="visible = false">
+        <slot name="fields"></slot>
+    </page-filter-sidebar>
     <div class="px-6 py-2 border-b border-gray-600 items-center space-x-3">
         <div class="flex flex-col sm:flex-row items-stretch sm:items-end space-y-1 sm:space-y-0 sm:space-x-3">
             <slot name="buttons"></slot>
diff --git a/resources/js/components/page/FilterSidebar.vue b/resources/js/components/page/FilterSidebar.vue
new file mode 100644
index 00000000..30b227e8
--- /dev/null
+++ b/resources/js/components/page/FilterSidebar.vue
@@ -0,0 +1,16 @@
+<template>
+    <ui-sidebar :max="0" @close="$emit('close')">
+        <page-header title="Filtern" @close="$emit('close')"></page-header>
+        <div class="grid gap-6 p-6">
+            <slot></slot>
+        </div>
+    </ui-sidebar>
+</template>
+
+<script setup>
+import {ref} from 'vue';
+
+const visible = ref(false);
+
+defineEmits(['close']);
+</script>
diff --git a/resources/js/views/member/Filter.vue b/resources/js/views/member/Filter.vue
new file mode 100644
index 00000000..0dedff7e
--- /dev/null
+++ b/resources/js/views/member/Filter.vue
@@ -0,0 +1,3 @@
+<template></template>
+
+<script setup></script>
diff --git a/resources/js/views/member/VIndex.vue b/resources/js/views/member/VIndex.vue
index 8c4c2948..9d368d5b 100644
--- a/resources/js/views/member/VIndex.vue
+++ b/resources/js/views/member/VIndex.vue
@@ -37,53 +37,14 @@
                 <span class="hidden xl:inline">Anwenden</span>
             </button>
         </ui-popup>
+
         <page-filter>
             <template #fields>
-                <f-switch
-                    v-show="hasModule('bill')"
-                    id="ausstand"
-                    name="ausstand"
-                    :model-value="getFilter('ausstand')"
-                    label="Nur Ausstände"
-                    size="sm"
-                    @update:model-value="setFilter('ausstand', $event)"
-                ></f-switch>
-                <f-select
-                    id="has_vk"
-                    name="has_vk"
-                    :model-value="getFilter('has_vk')"
-                    label="Verhaltenskodex unterschrieben"
-                    size="sm"
-                    :options="meta.boolean_filter"
-                    @update:model-value="setFilter('has_vk', $event)"
-                ></f-select>
-                <f-select
-                    id="has_svk"
-                    name="has_svk"
-                    :model-value="getFilter('has_svk')"
-                    label="SVK unterschrieben"
-                    size="sm"
-                    :options="meta.boolean_filter"
-                    @update:model-value="setFilter('has_svk', $event)"
-                ></f-select>
-                <f-multipleselect
-                    id="group_ids"
-                    :options="meta.groups"
-                    :model-value="getFilter('group_ids')"
-                    label="Gruppierungen"
-                    size="sm"
-                    @update:model-value="setFilter('group_ids', $event)"
-                ></f-multipleselect>
-                <f-select
-                    v-show="hasModule('bill')"
-                    id="billKinds"
-                    name="billKinds"
-                    :options="meta.billKinds"
-                    :model-value="getFilter('bill_kind')"
-                    label="Rechnung"
-                    size="sm"
-                    @update:model-value="setFilter('bill_kind', $event)"
-                ></f-select>
+                <f-switch v-show="hasModule('bill')" id="ausstand" name="ausstand" v-model="filter.ausstand" label="Nur Ausstände" size="sm"></f-switch>
+                <f-select id="has_vk" name="has_vk" v-model="filter.has_vk" label="Verhaltenskodex unterschrieben" size="sm" :options="meta.boolean_filter"></f-select>
+                <f-select id="has_svk" name="has_svk" v-model="filter.has_svk" label="SVK unterschrieben" size="sm" :options="meta.boolean_filter"></f-select>
+                <f-multipleselect id="group_ids" :options="meta.groups" v-model="filter.group_ids" label="Gruppierungen" size="sm"></f-multipleselect>
+                <f-select v-show="hasModule('bill')" id="billKinds" name="billKinds" :options="meta.billKinds" v-model="filter.bill_kind" label="Rechnung" size="sm"></f-select>
                 <button class="btn btn-primary label mr-2" @click.prevent="membershipFilters = getFilter('memberships')">
                     <ui-sprite class="w-3 h-3 xl:mr-2" src="filter"></ui-sprite>
                     <span class="hidden xl:inline">Mitgliedschaften</span>
@@ -174,6 +135,11 @@ const single = ref(null);
 const deleting = ref(null);
 const membershipFilters = ref(null);
 
+var filter = ref({
+    ausstand: false,
+});
+
+
 const props = defineProps(indexProps);
 var { router, data, meta, getFilter, setFilter, filterString, reloadPage } = useIndex(props.data, 'member');