Add actions slot and fullwidth to popup

app/Activity/Resources/ActivityResource.php

@@ -55,6 +55,7 @@ class ActivityResource extends JsonResource
             'links' => [
                 'index' => route('activity.index'),
                 'create' => route('activity.create'),
+                'membership_masslist' => route('membership.masslist.index'),
             ],
         ];
     }

app/Group.php

@@ -2,19 +2,25 @@
 
 namespace App;
 
+use App\Group\Enums\Level;
 use App\Nami\HasNamiField;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
+use Illuminate\Database\Eloquent\Relations\HasMany;
 
 class Group extends Model
 {
     use HasFactory;
     use HasNamiField;
 
-    public $fillable = ['nami_id', 'name', 'parent_id'];
+    public $fillable = ['nami_id', 'name', 'inner_name', 'level', 'parent_id'];
     public $timestamps = false;
 
+    public $casts = [
+        'level' => Level::class
+    ];
+
     /**
      * @return BelongsTo<static, self>
      */
@@ -22,4 +28,21 @@ class Group extends Model
     {
         return $this->belongsTo(static::class, 'parent_id');
     }
+
+    /**
+     * @return HasMany<self>
+     */
+    public function children(): HasMany
+    {
+        return $this->hasMany(static::class, 'parent_id');
+    }
+
+    public static function booted(): void
+    {
+        static::creating(function (self $group) {
+            if (!$group->getAttribute('inner_name') && $group->getAttribute('name')) {
+                $group->setAttribute('inner_name', $group->getAttribute('name'));
+            }
+        });
+    }
 }

app/Group/Actions/GroupApiIndexAction.php

@@ -0,0 +1,29 @@
+<?php
+
+namespace App\Group\Actions;
+
+use App\Group;
+use App\Group\Resources\GroupResource;
+use Illuminate\Database\Eloquent\Collection;
+use Illuminate\Http\Resources\Json\AnonymousResourceCollection;
+use Inertia\Inertia;
+use Inertia\Response;
+use Lorisleiva\Actions\Concerns\AsAction;
+
+class GroupApiIndexAction
+{
+    use AsAction;
+
+    /**
+     * @return Collection<int, Group>
+     */
+    public function handle(): Collection
+    {
+        return Group::get();
+    }
+
+    public function asController(?Group $group = null): AnonymousResourceCollection
+    {
+        return GroupResource::collection($group ? $group->children()->withCount('children')->get() : Group::where('parent_id', null)->withCount('children')->get());
+    }
+}

app/Group/Actions/GroupBulkstoreAction.php

@@ -0,0 +1,44 @@
+<?php
+
+namespace App\Group\Actions;
+
+use App\Group;
+use App\Group\Enums\Level;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Validation\Rule;
+use Lorisleiva\Actions\ActionRequest;
+use Lorisleiva\Actions\Concerns\AsAction;
+
+class GroupBulkstoreAction
+{
+    use AsAction;
+
+    /**
+     * @return array<string, string|array<int, string|Rule>>
+     */
+    public function rules(): array
+    {
+        return [
+            '*.id' => 'required|integer|exists:groups,id',
+            '*.inner_name' => 'required|string|max:255',
+            '*.level' => ['required', 'string', Rule::in(Level::values())],
+        ];
+    }
+
+    /**
+     * @param array<int, array{id: int, inner_name: string, level: string}> $groups
+     */
+    public function handle(array $groups): void
+    {
+        foreach ($groups as $payload) {
+            Group::find($payload['id'])->update(['level' => $payload['level'], 'inner_name' => $payload['inner_name']]);
+        }
+    }
+
+    public function asController(ActionRequest $request): JsonResponse
+    {
+        $this->handle($request->validated());
+
+        return response()->json([]);
+    }
+}

app/Group/Actions/GroupIndexAction.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Group\Actions;
+
+use App\Group;
+use App\Group\Resources\GroupResource;
+use Illuminate\Database\Eloquent\Collection;
+use Inertia\Inertia;
+use Inertia\Response;
+use Lorisleiva\Actions\Concerns\AsAction;
+
+class GroupIndexAction
+{
+    use AsAction;
+
+    /**
+     * @return Collection<int, Group>
+     */
+    public function handle(): Collection
+    {
+        return Group::get();
+    }
+
+    public function asController(): Response
+    {
+        session()->put('menu', 'group');
+        session()->put('title', 'Gruppierungen');
+
+        return Inertia::render('group/Index', [
+            'data' => GroupResource::collection(Group::where('parent_id', null)->withCount('children')->get()),
+        ]);
+    }
+}

app/Group/Enums/Level.php

@@ -0,0 +1,29 @@
+<?php
+
+namespace App\Group\Enums;
+
+use Illuminate\Support\Collection;
+
+enum Level: string
+{
+
+    case FEDERATION = 'Diözese';
+    case REGION = 'Bezirk';
+    case GROUP = 'Stamm';
+
+    /**
+     * @return Collection<int, string>
+     */
+    public static function values(): Collection
+    {
+        return collect(static::cases())->map(fn ($case) => $case->value);
+    }
+
+    /**
+     * @return array<int, array{id: string, name: string}>
+     */
+    public static function forSelect(): array
+    {
+        return array_map(fn ($case) => ['id' => $case->value, 'name' => $case->value], static::cases());
+    }
+}

app/Group/Resources/GroupResource.php

@@ -0,0 +1,52 @@
+<?php
+
+namespace App\Group\Resources;
+
+use App\Group;
+use App\Group\Enums\Level;
+use App\Lib\HasMeta;
+use Illuminate\Http\Resources\Json\JsonResource;
+
+/**
+ * @mixin Group
+ */
+class GroupResource extends JsonResource
+{
+
+    use HasMeta;
+
+    /**
+     * Transform the resource into an array.
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @return array<string, mixed>
+     */
+    public function toArray($request)
+    {
+        return [
+            'name' => $this->name,
+            'inner_name' => $this->inner_name,
+            'parent_id' => $this->parent_id,
+            'id' => $this->id,
+            'level' => $this->level?->value,
+            'children_count' => $this->children_count,
+            'links' => [
+                'children' => route('api.group', ['group' => $this->id]),
+            ]
+        ];
+    }
+
+    /**
+     * @return array<string, mixed>
+     */
+    public static function meta(): array
+    {
+        return [
+            'links' => [
+                'bulkstore' => route('group.bulkstore'),
+                'root_path' => route('api.group'),
+            ],
+            'levels' => Level::forSelect(),
+        ];
+    }
+}

app/Membership/Actions/MassListAction.php

@@ -1,6 +1,6 @@
 <?php
 
-namespace App\Group\Actions;
+namespace App\Membership\Actions;
 
 use App\Activity;
 use App\Group;
@@ -8,17 +8,17 @@ use Inertia\Inertia;
 use Inertia\Response;
 use Lorisleiva\Actions\Concerns\AsAction;
 
-class ListAction
+class MassListAction
 {
     use AsAction;
 
     public function asController(): Response
     {
-        session()->put('menu', 'group');
+        session()->put('menu', 'activity');
-        session()->put('title', 'Gruppen');
+        session()->put('title', 'Mitgliedschaften zuweisen');
         $activities = Activity::with('subactivities')->get();
 
-        return Inertia::render('group/Index', [
+        return Inertia::render('activity/Masslist', [
             'activities' => $activities->pluck('name', 'id'),
             'subactivities' => $activities->mapWithKeys(fn (Activity $activity) => [$activity->id => $activity->subactivities()->pluck('name', 'id')]),
             'groups' => Group::pluck('name', 'id'),

app/Membership/Actions/MassStoreAction.php

@@ -14,7 +14,7 @@ use Illuminate\Support\Facades\DB;
 use Lorisleiva\Actions\ActionRequest;
 use Lorisleiva\Actions\Concerns\AsAction;
 
-class StoreForGroupAction
+class MassStoreAction
 {
     use AsAction;
     use TracksJob;

database/factories/GroupFactory.php

@@ -3,6 +3,7 @@
 namespace Database\Factories;
 
 use App\Group;
+use App\Group\Enums\Level;
 use Illuminate\Database\Eloquent\Factories\Factory;
 
 /**
@@ -22,6 +23,8 @@ class GroupFactory extends Factory
         return [
             'name' => $this->faker->words(5, true),
             'nami_id' => $this->faker->randomNumber(),
+            'inner_name' => $this->faker->words(5, true),
+            'level' => $this->faker->randomElement(Level::cases()),
         ];
     }
 

database/migrations/2023_12_30_012316_create_groups_inner_name_column.php

@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('groups', function (Blueprint $table) {
+            $table->string('inner_name');
+            $table->string('level')->nullable();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('groups', function (Blueprint $table) {
+            $table->dropColumn('inner_name');
+            $table->dropColumn('level');
+        });
+    }
+};

resources/js/components/form/Text.vue

@@ -5,18 +5,8 @@
             <span v-show="required" class="text-red-800">&nbsp;*</span>
         </span>
         <div class="real-field-wrap size-sm" :class="sizes[size].field">
-            <input
+            <input :name="name" :type="type" :value="transformedValue" :disabled="disabled" :placeholder="placeholder"
-                @keypress="$emit('keypress', $event)"
+                @keypress="$emit('keypress', $event)" @input="onInput" @change="onChange" @focus="onFocus" @blur="onBlur" />
-                :name="name"
-                :type="type"
-                :value="transformedValue"
-                @input="onInput"
-                @change="onChange"
-                :disabled="disabled"
-                :placeholder="placeholder"
-                @focus="onFocus"
-                @blur="onBlur"
-            />
             <div v-if="hint" class="info-wrap">
                 <div v-tooltip="hint">
                     <ui-sprite src="info-button" class="info-button"></ui-sprite>
@@ -242,25 +232,6 @@ var transformers = {
 };
 
 export default {
-    data: function () {
-        return {
-            focus: false,
-            sizes: {
-                sm: {
-                    wrap: 'field-wrap-sm',
-                    field: 'size-sm',
-                },
-                base: {
-                    wrap: 'field-wrap-base',
-                    field: 'size-base',
-                },
-                lg: {
-                    wrap: 'field-wrap-lg',
-                    field: 'size-lg',
-                },
-            },
-        };
-    },
     props: {
         placeholder: {
             default: function () {
@@ -312,23 +283,24 @@ export default {
         },
         name: {},
     },
-    methods: {
+    data: function () {
-        onFocus() {
+        return {
-            this.focus = true;
+            focus: false,
-        },
+            sizes: {
-        onBlur() {
+                sm: {
-            this.focus = false;
+                    wrap: 'field-wrap-sm',
-        },
+                    field: 'size-sm',
-        onChange(v) {
+                },
-            if (this.mode !== 'none') {
+                base: {
-                this.transformedValue = v.target.value;
+                    wrap: 'field-wrap-base',
-            }
+                    field: 'size-base',
-        },
+                },
-        onInput(v) {
+                lg: {
-            if (this.mode === 'none') {
+                    wrap: 'field-wrap-lg',
-                this.transformedValue = v.target.value;
+                    field: 'size-lg',
-            }
+                },
-        },
+            },
+        };
     },
     computed: {
         transformedValue: {
@@ -355,6 +327,25 @@ export default {
             this.$emit('input', this.default === undefined ? '' : this.default);
         }
     },
+    methods: {
+        onFocus() {
+            this.focus = true;
+        },
+        onBlur() {
+            this.focus = false;
+        },
+        onChange(v) {
+            if (this.mode !== 'none') {
+                this.transformedValue = v.target.value;
+            }
+        },
+        onInput(v) {
+            console.log(this.modelModifiers);
+            if (this.mode === 'none') {
+                this.transformedValue = v.target.value;
+            }
+        },
+    },
 };
 </script>
 

resources/js/components/ui/Popup.vue

@@ -1,9 +1,12 @@
 <template>
     <div class="fixed z-40 top-0 left-0 w-full h-full flex items-center justify-center p-6">
-        <div class="relative rounded-lg p-8 bg-zinc-800 shadow-2xl shadow-black border border-zinc-700 border-solid w-full" :class="innerWidth">
+        <div class="relative rounded-lg p-8 bg-zinc-800 shadow-2xl shadow-black border border-zinc-700 border-solid w-full" :class="full ? 'h-full' : innerWidth">
-            <a href="#" class="absolute top-0 right-0 mt-6 mr-6" @click.prevent="$emit('close')">
+            <div class="absolute top-0 right-0 mt-6 mr-6 flex space-x-6">
-                <ui-sprite src="close" class="text-zinc-400 w-6 h-6"></ui-sprite>
+                <slot name="actions"></slot>
-            </a>
+                <a href="#" @click.prevent="$emit('close')">
+                    <ui-sprite src="close" class="text-zinc-400 w-6 h-6"></ui-sprite>
+                </a>
+            </div>
             <h3 v-if="heading" class="font-semibold text-primary-200 text-xl" v-html="heading"></h3>
             <div class="text-primary-100 group is-popup">
                 <slot></slot>
@@ -23,6 +26,10 @@ export default {
             default: () => 'max-w-xl',
             type: String,
         },
+        full: {
+            type: Boolean,
+            default: () => false,
+        },
     },
 };
 </script>

resources/js/layouts/AppLayout.vue

@@ -2,11 +2,13 @@
     <v-notification class="fixed z-40 right-0 bottom-0 mb-3 mr-3"></v-notification>
 
     <!-- ******************************** Sidebar ******************************** -->
-    <div class="fixed z-40 bg-gray-800 p-6 w-56 top-0 h-screen border-r border-gray-600 border-solid flex flex-col justify-between transition-all"
+    <div
+        class="fixed z-40 bg-gray-800 p-6 w-56 top-0 h-screen border-r border-gray-600 border-solid flex flex-col justify-between transition-all"
         :class="{
             '-left-[14rem]': !menuStore.isShifted,
             'left-0': menuStore.isShifted,
-        }">
+        }"
+    >
         <div class="grid gap-2">
             <v-link href="/" menu="dashboard" icon="loss">Dashboard</v-link>
             <v-link href="/member" menu="member" icon="user">Mitglieder</v-link>
@@ -14,7 +16,7 @@
             <v-link v-show="hasModule('bill')" href="/invoice" menu="invoice" icon="moneypaper">Rechnungen</v-link>
             <v-link href="/contribution" menu="contribution" icon="contribution">Zuschüsse</v-link>
             <v-link href="/activity" menu="activity" icon="activity">Tätigkeiten</v-link>
-            <v-link href="/group" menu="group" icon="group">Gruppen</v-link>
+            <v-link href="/group" menu="group" icon="group">Gruppierungen</v-link>
             <v-link href="/maildispatcher" menu="maildispatcher" icon="at">Mail-Verteiler</v-link>
         </div>
         <div class="grid gap-2">
@@ -31,7 +33,7 @@
 
 <script>
 import VLink from './_VLink.vue';
-import { menuStore } from '../stores/menuStore.js';
+import {menuStore} from '../stores/menuStore.js';
 import VNotification from '../components/VNotification.vue';
 
 export default {

resources/js/lib/echo.js

@@ -28,5 +28,6 @@ echo.channel('jobs')
     .listen('\\App\\Lib\\Events\\JobStarted', (e) => handleJobEvent(e, 'success'))
     .listen('\\App\\Lib\\Events\\JobFinished', (e) => handleJobEvent(e, 'success'))
     .listen('\\App\\Lib\\Events\\JobFailed', (e) => handleJobEvent(e, 'error'));
+    .listen('\\App\\Lib\\Events\\Succeeded', (e) => handleJobEvent(e, 'success'));
 
 export default echo;

resources/js/views/activity/Masslist.vue

@@ -0,0 +1,94 @@
+<template>
+    <page-layout>
+        <template #right>
+            <f-save-button form="actionform"></f-save-button>
+        </template>
+        <form id="actionform" class="grow p-3" @submit.prevent="submit">
+            <div class="flex space-x-3">
+                <f-select :model-value="meta.activity_id" :options="props.activities" label="Tätigkeit" size="sm" name="activity_id" @update:model-value="setActivityId"></f-select>
+                <f-select
+                    :model-value="meta.subactivity_id"
+                    :options="props.subactivities[meta.activity_id]"
+                    name="subactivity_id"
+                    label="Untertätigkeit"
+                    size="sm"
+                    @update:model-value="reload('subactivity_id', $event)"
+                ></f-select>
+                <f-select :model-value="meta.group_id" :options="props.groups" label="Gruppierung" size="sm" name="group_id" @update:model-value="reload('group_id', $event)"></f-select>
+            </div>
+            <div class="grid gap-2 grid-cols-6 mt-4">
+                <f-switch v-for="member in members.data" :id="`member-${member.id}`" :key="member.id" v-model="selected" :value="member.id" :label="member.fullname" size="sm"></f-switch>
+            </div>
+            <div v-if="members.meta.last_page" class="px-6">
+                <ui-pagination class="mt-4" :value="members.meta" :only="['data']" @reload="reloadReal($event, false)"></ui-pagination>
+            </div>
+        </form>
+    </page-layout>
+</template>
+
+<script lang="js" setup>
+import { onBeforeUnmount, ref, defineProps, reactive, inject } from 'vue';
+import useQueueEvents from '../../composables/useQueueEvents.js';
+const { startListener, stopListener } = useQueueEvents('group', () => null);
+const axios = inject('axios');
+
+startListener();
+onBeforeUnmount(() => stopListener());
+
+const meta = reactive({
+    activity_id: null,
+    subactivity_id: null,
+    group_id: null,
+});
+
+const props = defineProps({
+    activities: {
+        type: Object,
+        default: () => { },
+    },
+    subactivities: {
+        type: Object,
+        default: () => { },
+    },
+    groups: {
+        type: Object,
+        default: () => { },
+    },
+});
+
+const members = ref({ meta: {}, data: [] });
+const selected = ref([]);
+
+async function reload(key, v) {
+    meta[key] = v;
+
+    reloadReal(1, true);
+}
+
+async function reloadReal(page, update) {
+    if (meta.activity_id && meta.subactivity_id && meta.group_id) {
+        const memberResponse = await axios.post('/api/member/search', {
+            page: page,
+            per_page: 80,
+        });
+        members.value = memberResponse.data;
+
+        if (update) {
+            const membershipResponse = await axios.post('/api/membership/member-list', meta);
+            selected.value = membershipResponse.data;
+        }
+    }
+}
+
+async function setActivityId(id) {
+    meta.subactivity_id = null;
+    await reload('activity_id', id);
+}
+
+async function submit() {
+    await axios.post('/api/membership/masslist', {
+        ...meta,
+        members: selected.value,
+    });
+}
+</script>

resources/js/views/activity/VIndex.vue

@@ -1,8 +1,8 @@
 <template>
     <page-layout page-class="pb-6">
         <template #toolbar>
-            <page-toolbar-button :href="meta.links.create" color="primary" icon="plus">Tätigkeit
+            <page-toolbar-button :href="meta.links.create" color="primary" icon="plus">Tätigkeit erstellen</page-toolbar-button>
-                erstellen</page-toolbar-button>
+            <page-toolbar-button :href="meta.links.membership_masslist" color="primary" icon="pencil">Mitgliedschaften zuweisen</page-toolbar-button>
         </template>
         <ui-popup v-if="deleting !== null" heading="Bitte bestätigen" @close="deleting = null">
             <div>
@@ -23,10 +23,8 @@
                 <td v-text="activity.name"></td>
                 <td>
                     <div class="flex space-x-1">
-                        <i-link v-tooltip="`Bearbeiten`" :href="activity.links.edit"
+                        <i-link v-tooltip="`Bearbeiten`" :href="activity.links.edit" class="inline-flex btn btn-warning btn-sm"><ui-sprite src="pencil"></ui-sprite></i-link>
-                            class="inline-flex btn btn-warning btn-sm"><ui-sprite src="pencil"></ui-sprite></i-link>
+                        <a v-tooltip="`Entfernen`" href="#" class="inline-flex btn btn-danger btn-sm" @click.prevent="deleting = activity"><ui-sprite src="trash"></ui-sprite></a>
-                        <a v-tooltip="`Entfernen`" href="#" class="inline-flex btn btn-danger btn-sm"
-                            @click.prevent="deleting = activity"><ui-sprite src="trash"></ui-sprite></a>
                     </div>
                 </td>
             </tr>
@@ -39,11 +37,11 @@
 </template>
 
 <script setup>
-import { ref, defineProps } from 'vue';
+import {ref, defineProps} from 'vue';
-import { indexProps, useIndex } from '../../composables/useIndex.js';
+import {indexProps, useIndex} from '../../composables/useIndex.js';
 
 const props = defineProps(indexProps);
-const { router, data, meta } = useIndex(props.data, 'activity');
+const {router, data, meta} = useIndex(props.data, 'activity');
 const deleting = ref(null);
 
 function remove() {

resources/js/views/group/Index.vue

@@ -1,94 +1,161 @@
 <template>
     <page-layout>
         <template #right>
-            <f-save-button form="actionform"></f-save-button>
+            <f-save-button form="groupform"></f-save-button>
         </template>
-        <form id="actionform" class="grow p-3" @submit.prevent="submit">
+        <ui-popup v-if="editing !== null" heading="Untergruppen bearbeiten" inner-width="max-w-5xl" @close="editing = null">
+            <template #actions>
+                <a href="#" @click.prevent="store">
+                    <ui-sprite src="save" class="text-zinc-400 w-6 h-6"></ui-sprite>
+                </a>
+            </template>
             <div class="flex space-x-3">
-                <f-select :model-value="meta.activity_id" :options="props.activities" label="Tätigkeit" size="sm" name="activity_id" @update:model-value="setActivityId"></f-select>
+                <f-text id="parent-inner_name" v-model="editing.parent.inner_name" label="Interner Name" name="parent-inner_name"></f-text>
-                <f-select
+                <f-select id="parent-level" v-model="editing.parent.level" label="Ebene" name="parent-level" :options="meta.levels"></f-select>
-                    :model-value="meta.subactivity_id"
-                    :options="props.subactivities[meta.activity_id]"
-                    name="subactivity_id"
-                    label="Untertätigkeit"
-                    size="sm"
-                    @update:model-value="reload('subactivity_id', $event)"
-                ></f-select>
-                <f-select :model-value="meta.group_id" :options="props.groups" label="Gruppierung" size="sm" name="group_id" @update:model-value="reload('group_id', $event)"></f-select>
             </div>
-            <div class="grid gap-2 grid-cols-6 mt-4">
+            <div>
-                <f-switch v-for="member in members.data" :id="`member-${member.id}`" :key="member.id" v-model="selected" :value="member.id" :label="member.fullname" size="sm"></f-switch>
+                <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm table">
-            </div>
+                    <thead>
-            <div v-if="members.meta.last_page" class="px-6">
+                        <th>NaMi-Name</th>
-                <ui-pagination class="mt-4" :value="members.meta" :only="['data']" @reload="reloadReal($event, false)"></ui-pagination>
+                        <th>Interner Name</th>
+                        <th>Ebene</th>
+                    </thead>
+                    <tr v-for="child in editing.children" :key="child.id">
+                        <td>
+                            <span v-text="child.name"></span>
+                        </td>
+                        <td>
+                            <f-text :id="`inner_name-${child.id}`" v-model="child.inner_name" label="" size="sm" :name="`inner_name-${child.id}`"></f-text>
+                        </td>
+                        <td>
+                            <f-select :id="`level-${child.id}`" v-model="child.level" label="" size="sm" :name="`level-${child.id}`" :options="meta.levels"></f-select>
+                        </td>
+                    </tr>
+                </table>
             </div>
+        </ui-popup>
+        <form id="groupform" class="grow p-3" @submit.prevent="submit">
+            <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm table">
+                <thead>
+                    <th>NaMi-Name</th>
+                    <th>Interner Name</th>
+                    <th>Ebene</th>
+                    <th></th>
+                </thead>
+
+                <template v-for="child in childrenOf('null')" :key="child.id">
+                    <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)"
+                                    ><ui-sprite src="close"></ui-sprite
+                                ></a>
+                                <span v-text="child.name"></span>
+                            </div>
+                        </td>
+                        <td v-text="child.inner_name"></td>
+                        <td v-text="child.level"></td>
+                        <td>
+                            <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(child)"><ui-sprite src="pencil"></ui-sprite></a>
+                        </td>
+                    </tr>
+                    <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)"
+                                    ><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)"
+                                    ><ui-sprite src="close"></ui-sprite
+                                ></a>
+                                <span v-text="subchild.name"></span>
+                            </div>
+                            <td v-text="subchild.inner_name"></td>
+                            <td v-text="subchild.level"></td>
+                            <td>
+                                <a v-if="subchild.children_count" v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(subchild)"
+                                    ><ui-sprite src="pencil"></ui-sprite
+                                ></a>
+                            </td>
+                        </tr>
+                        <template v-for="subsubchild in childrenOf(subchild.id)" :key="subchild.id">
+                            <tr>
+                                <div class="pl-24 flex space-x-2">
+                                    <a
+                                        v-if="subsubchild.children_count !== 0 && !isOpen(subsubchild.id)"
+                                        v-tooltip="`Öffnen`"
+                                        href="#"
+                                        class="inline-flex btn btn-info btn-sm"
+                                        @click.prevent="open(subsubchild)"
+                                        ><ui-sprite src="plus"></ui-sprite
+                                    ></a>
+                                    <a
+                                        v-if="subsubchild.children_count !== 0 && isOpen(subsubchild.id)"
+                                        v-tooltip="`Schließen`"
+                                        href="#"
+                                        class="inline-flex btn btn-info btn-sm"
+                                        @click.prevent="close(subsubchild)"
+                                        ><ui-sprite src="close"></ui-sprite
+                                    ></a>
+                                    <span v-text="subsubchild.name"></span>
+                                </div>
+                                <td v-text="subchild.inner_name"></td>
+                                <td v-text="subchild.level"></td>
+                                <td>
+                                    <a v-if="subsubchild.children_count" v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(subsubchild)"
+                                        ><ui-sprite src="pencil"></ui-sprite
+                                    ></a>
+                                </td>
+                            </tr>
+                        </template>
+                    </template>
+                </template>
+            </table>
         </form>
     </page-layout>
 </template>
 
-<script lang="js" setup>
+<script setup>
-import { onBeforeUnmount, ref, defineProps, reactive, inject } from 'vue';
+import {computed, ref, reactive} from 'vue';
-import useQueueEvents from '../../composables/useQueueEvents.js';
+import {indexProps, useIndex} from '../../composables/useInertiaApiIndex.js';
-const {startListener, stopListener} = useQueueEvents('group', () => null);
+const props = defineProps(indexProps);
-const axios = inject('axios');
+var {axios, meta, data} = useIndex(props.data, 'invoice');
 
-startListener();
+const children = reactive({
-onBeforeUnmount(() => stopListener());
+    null: data.value,
-
-const meta = reactive({
-    activity_id: null,
-    subactivity_id: null,
-    group_id: null,
 });
 
-const props = defineProps({
+var editing = ref(null);
-    activities: {
-        type: Object,
-        default: () => { },
-    },
-    subactivities: {
-        type: Object,
-        default: () => { },
-    },
-    groups: {
-        type: Object,
-        default: () => { },
-    },
-});
 
-const members = ref({ meta: {}, data: [] });
+async function open(parent) {
-const selected = ref([]);
+    const result = (await axios.get(parent.links.children)).data;
 
-async function reload(key, v) {
+    children[parent.id] = result.data;
-    meta[key] = v;
-
-    reloadReal(1, true);
 }
 
-async function reloadReal(page, update) {
+async function edit(parent) {
-    if (meta.activity_id && meta.subactivity_id && meta.group_id) {
+    editing.value = {
-        const memberResponse = await axios.post('/api/member/search', {
+        parent: parent,
-            page: page,
+        children: (await axios.get(parent.links.children)).data.data,
-            per_page: 80,
+    };
-        });
-        members.value = memberResponse.data;
-
-        if (update) {
-            const membershipResponse = await axios.post('/api/membership/member-list', meta);
-            selected.value = membershipResponse.data;
-        }
-    }
 }
 
-async function setActivityId(id) {
+function close(parent) {
-    meta.subactivity_id = null;
+    delete children[parent.id];
-    await reload('activity_id', id);
 }
 
-async function submit() {
+function isOpen(child) {
-    await axios.post('/api/membership/sync', {
+    return child in children;
-        ...meta,
+}
-        members: selected.value,
+
-    });
+function childrenOf(parent) {
+    return children[parent] ? children[parent] : [];
+}
+
+async function store() {
+    await axios.post(meta.value.links.bulkstore, [editing.value.parent, ...editing.value.children]);
+    children[editing.value.parent.id] = (await axios.get(editing.value.parent.links.children)).data.data;
+    editing.value = null;
 }
 </script>

routes/web.php

@@ -19,7 +19,9 @@ use App\Invoice\Actions\InvoiceStoreAction;
 use App\Course\Actions\CourseUpdateAction;
 use App\Dashboard\Actions\IndexAction as DashboardIndexAction;
 use App\Efz\ShowEfzDocumentAction;
-use App\Group\Actions\ListAction;
+use App\Group\Actions\GroupApiIndexAction;
+use App\Group\Actions\GroupBulkstoreAction;
+use App\Group\Actions\GroupIndexAction;
 use App\Initialize\Actions\InitializeAction;
 use App\Initialize\Actions\InitializeFormAction;
 use App\Initialize\Actions\NamiGetSearchLayerAction;
@@ -31,7 +33,7 @@ use App\Invoice\Actions\InvoiceDestroyAction;
 use App\Invoice\Actions\InvoiceIndexAction;
 use App\Invoice\Actions\InvoiceUpdateAction;
 use App\Invoice\Actions\MassPostPdfAction;
-use App\Invoice\Actions\MassStoreAction;
+use App\Invoice\Actions\MassStoreAction as InvoiceMassStoreAction;
 use App\Invoice\Actions\PaymentPositionIndexAction;
 use App\Maildispatcher\Actions\CreateAction;
 use App\Maildispatcher\Actions\DestroyAction;
@@ -49,10 +51,11 @@ use App\Member\Actions\SearchAction;
 use App\Member\MemberController;
 use App\Membership\Actions\IndexAction as MembershipIndexAction;
 use App\Membership\Actions\ListForGroupAction;
+use App\Membership\Actions\MassListAction;
+use App\Membership\Actions\MassStoreAction;
 use App\Membership\Actions\MembershipDestroyAction;
 use App\Membership\Actions\MembershipStoreAction;
 use App\Membership\Actions\MembershipUpdateAction;
-use App\Membership\Actions\StoreForGroupAction;
 use App\Payment\SubscriptionController;
 
 Route::group(['namespace' => 'App\\Http\\Controllers'], function (): void {
@@ -99,11 +102,9 @@ Route::group(['middleware' => 'auth:web'], function (): void {
     Route::post('/maildispatcher', MaildispatcherStoreAction::class)->name('maildispatcher.store');
     Route::delete('/maildispatcher/{maildispatcher}', DestroyAction::class)->name('maildispatcher.destroy');
 
-    // ----------------------------------- group -----------------------------------
-    Route::get('/group', ListAction::class)->name('group.index');
 
     // -------------------------------- allpayment ---------------------------------
-    Route::post('/invoice/mass-store', MassStoreAction::class)->name('invoice.mass-store');
+    Route::post('/invoice/mass-store', InvoiceMassStoreAction::class)->name('invoice.mass-store');
 
     // ---------------------------------- invoice ----------------------------------
     Route::get('/invoice', InvoiceIndexAction::class)->name('invoice.index');
@@ -124,7 +125,13 @@ Route::group(['middleware' => 'auth:web'], function (): void {
     Route::patch('/membership/{membership}', MembershipUpdateAction::class)->name('membership.update');
     Route::delete('/membership/{membership}', MembershipDestroyAction::class)->name('membership.destroy');
     Route::post('/api/membership/member-list', ListForGroupAction::class)->name('membership.member-list');
-    Route::post('/api/membership/sync', StoreForGroupAction::class)->name('membership.sync');
+    Route::post('/api/membership/masslist', MassStoreAction::class)->name('membership.masslist.store');
+    Route::get('/membership/masslist', MassListAction::class)->name('membership.masslist.index');
+
+    // ----------------------------------- group ----------------------------------
+    Route::get('/group', GroupIndexAction::class)->name('group.index');
+    Route::get('/api/group/{group?}', GroupApiIndexAction::class)->name('api.group');
+    Route::post('/group/bulkstore', GroupBulkstoreAction::class)->name('group.bulkstore');
 
     // ----------------------------------- course ----------------------------------
     Route::get('/member/{member}/course', CourseIndexAction::class)->name('member.course.index');

tests/EndToEnd/MassstoreActionTest.php

@@ -7,9 +7,9 @@ use App\Group;
 use App\Maildispatcher\Actions\ResyncAction;
 use App\Member\Member;
 use App\Member\Membership;
+use App\Membership\Actions\MassStoreAction;
 use App\Membership\Actions\MembershipDestroyAction;
 use App\Membership\Actions\MembershipStoreAction;
-use App\Membership\Actions\StoreForGroupAction;
 use App\Subactivity;
 use Illuminate\Foundation\Testing\DatabaseMigrations;
 use Illuminate\Support\Facades\Queue;
@@ -17,7 +17,7 @@ use Tests\TestCase;
 use Throwable;
 use Zoomyboy\LaravelNami\Fakes\MembershipFake;
 
-class SyncActionTest extends TestCase
+class MassstoreActionTest extends TestCase
 {
 
     use DatabaseMigrations;
@@ -31,13 +31,13 @@ class SyncActionTest extends TestCase
         $subactivity = Subactivity::factory()->create();
         $group = Group::factory()->create();
 
-        $this->postJson('/api/membership/sync', [
+        $this->postJson(route('membership.masslist.store'), [
             'members' => [$member->id],
             'activity_id' => $activity->id,
             'subactivity_id' => $subactivity->id,
             'group_id' => $group->id,
         ]);
-        StoreForGroupAction::assertPushed(fn ($action, $params) => $params[0]->is($group) && $params[1]->is($activity) && $params[2]->is($subactivity) && $params[3][0] === $member->id);
+        MassStoreAction::assertPushed(fn ($action, $params) => $params[0]->is($group) && $params[1]->is($activity) && $params[2]->is($subactivity) && $params[3][0] === $member->id);
     }
 
     public function testItCreatesAMembership(): void
@@ -49,7 +49,7 @@ class SyncActionTest extends TestCase
         $subactivity = Subactivity::factory()->create();
         $group = Group::factory()->create();
 
-        StoreForGroupAction::run($group, $activity, $subactivity, [$member->id]);
+        MassStoreAction::run($group, $activity, $subactivity, [$member->id]);
     }
 
     public function testItDeletesAMembership(): void
@@ -60,7 +60,7 @@ class SyncActionTest extends TestCase
 
         $member = Member::factory()->defaults()->has(Membership::factory()->inLocal('Leiter*in', 'Rover'))->create();
 
-        StoreForGroupAction::run($member->memberships->first()->group, $member->memberships->first()->activity, $member->memberships->first()->subactivity, []);
+        MassStoreAction::run($member->memberships->first()->group, $member->memberships->first()->activity, $member->memberships->first()->subactivity, []);
     }
 
     public function testItRollsbackWhenDeletionFails(): void
@@ -78,7 +78,7 @@ class SyncActionTest extends TestCase
             ->create();
 
         try {
-            StoreForGroupAction::run($member->memberships->first()->group, $member->memberships->first()->activity, $member->memberships->first()->subactivity, []);
+            MassStoreAction::run($member->memberships->first()->group, $member->memberships->first()->activity, $member->memberships->first()->subactivity, []);
         } catch (Throwable $e) {
         }
         $this->assertDatabaseCount('memberships', 2);

tests/Feature/Activity/IndexTest.php

@@ -22,6 +22,7 @@ class IndexTest extends TestCase
         $this->assertInertiaHas('Local', $response, 'data.data.0.name');
         $this->assertInertiaHas(route('activity.update', ['activity' => $first]), $response, 'data.data.0.links.update');
         $this->assertInertiaHas(route('activity.destroy', ['activity' => $first]), $response, 'data.data.0.links.destroy');
+        $this->assertInertiaHas(route('membership.masslist.index'), $response, 'data.meta.links.membership_masslist');
         $this->assertCount(2, $this->inertia($response, 'data.data'));
     }
 

tests/Feature/Group/BulkstoreTest.php

@@ -0,0 +1,30 @@
+<?php
+
+namespace Tests\Feature\Group;
+
+use App\Group;
+use App\Group\Enums\Level;
+use Illuminate\Foundation\Testing\DatabaseTransactions;
+use Tests\TestCase;
+
+class BulkstoreTest extends TestCase
+{
+    use DatabaseTransactions;
+
+    public function testItSavesGroupsLevelAndParent(): void
+    {
+        $this->login()->loginNami()->withoutExceptionHandling();
+
+        $group = Group::factory()->for(Group::first(), 'parent')->create(['inner_name' => 'Gruppe', 'level' => Level::REGION]);
+
+        $this->postJson(route('group.bulkstore'), [
+            ['id' => $group->id, 'inner_name' => 'Abc', 'level' => Level::FEDERATION->value]
+        ])->assertOk();
+
+        $this->assertDatabaseHas('groups', [
+            'id' => $group->id,
+            'inner_name' => 'Abc',
+            'level' => 'Diözese',
+        ]);
+    }
+}

tests/Feature/Group/IndexTest.php

@@ -2,9 +2,8 @@
 
 namespace Tests\Feature\Group;
 
-use App\Activity;
 use App\Group;
-use App\Subactivity;
+use App\Group\Enums\Level;
 use Illuminate\Foundation\Testing\DatabaseTransactions;
 use Tests\TestCase;
 
@@ -12,20 +11,55 @@ class IndexTest extends TestCase
 {
     use DatabaseTransactions;
 
-    public function testItDisplaysAllActivitiesAndSubactivities(): void
+    public function testItDisplaysGroupPage(): void
     {
-        $this->login()->loginNami();
+        $this->login()->loginNami()->withoutExceptionHandling();
 
-        $leiter = Activity::factory()->name('Leiter*in')->hasAttached(Subactivity::factory()->name('Rover'))->create();
+        $this->get('/group')
-        $intern = Activity::factory()->name('Intern')->hasAttached(Subactivity::factory()->name('Lager'))->create();
+            ->assertOk()
-        $group = Group::factory()->create();
+            ->assertInertiaPath('data.meta.links.root_path', route('api.group'));
+    }
 
-        $response = $this->get('/group');
+    public function testItDisplaysParentGroup(): void
+    {
+        $this->login()->loginNami()->withoutExceptionHandling();
 
-        $this->assertInertiaHas('Leiter*in', $response, "activities.{$leiter->id}");
+        $group = Group::factory()->create(['name' => 'Afff', 'inner_name' => 'Gruppe', 'level' => Level::REGION]);
-        $this->assertInertiaHas('Intern', $response, "activities.{$intern->id}");
+
-        $this->assertInertiaHas('Rover', $response, "subactivities.{$leiter->id}.{$leiter->subactivities->first()->id}");
+        $this->get('/api/group')
-        $this->assertInertiaHas('Lager', $response, "subactivities.{$intern->id}.{$intern->subactivities->first()->id}");
+            ->assertJsonCount(2, 'data')
-        $this->assertInertiaHas($group->name, $response, "groups.{$group->id}");
+            ->assertJsonPath('data.1.name', 'Afff')
+            ->assertJsonPath('data.1.inner_name', 'Gruppe')
+            ->assertJsonPath('data.1.id', $group->id)
+            ->assertJsonPath('data.1.level', 'Bezirk')
+            ->assertJsonPath('data.1.parent_id', null)
+            ->assertJsonPath('meta.links.bulkstore', route('group.bulkstore'));
+    }
+
+    public function testItDisplaysGroupsForParent(): void
+    {
+        $this->login()->loginNami()->withoutExceptionHandling();
+
+        $group = Group::factory()->for(Group::first(), 'parent')->create(['name' => 'Afff', 'inner_name' => 'Gruppe', 'level' => Level::REGION]);
+        Group::factory()->for(Group::first(), 'parent')->create(['name' => 'Afff', 'inner_name' => 'Gruppe', 'level' => Level::REGION]);
+
+        $this->get('/api/group/' . Group::first()->id)
+            ->assertJsonCount(2, 'data')
+            ->assertJsonPath('data.0.name', 'Afff')
+            ->assertJsonPath('data.0.inner_name', 'Gruppe')
+            ->assertJsonPath('data.0.id', $group->id)
+            ->assertJsonPath('data.0.level', 'Bezirk')
+            ->assertJsonPath('data.0.parent_id', Group::first()->id)
+            ->assertJsonPath('data.0.links.children', route('api.group', ['group' => $group->id]))
+            ->assertJsonPath('meta.links.bulkstore', route('group.bulkstore'));
+    }
+
+    public function testLevelCanBeNull(): void
+    {
+        $this->login()->loginNami()->withoutExceptionHandling();
+
+        $group = Group::factory()->for(Group::first(), 'parent')->create(['level' => null]);
+
+        $this->get('/api/group/' . Group::first()->id)->assertJsonPath('data.0.id', $group->id);
     }
 }

tests/Feature/Initialize/InitializeGroupsTest.php

@@ -40,7 +40,7 @@ class InitializeGroupsTest extends TestCase
 
         (new InitializeGroups(app(NamiSettings::class)->login()))->handle();
 
-        $this->assertDatabaseHas('groups', ['nami_id' => 1000, 'name' => 'testgroup']);
+        $this->assertDatabaseHas('groups', ['nami_id' => 1000, 'name' => 'testgroup', 'inner_name' => 'testgroup', 'level' => null]);
         $this->assertDatabaseHas('groups', ['nami_id' => 1001, 'name' => 'subgroup1']);
         $this->assertDatabaseHas('groups', ['nami_id' => 1002, 'name' => 'subgroup2']);
     }

tests/Feature/Member/PullMemberActionTest.php

@@ -53,7 +53,6 @@ class PullMemberActionTest extends TestCase
 
         $member = app(PullMemberAction::class)->handle(1000, 1001);
 
-        Group::firstWhere('nami_id', 1000);
         $this->assertDatabaseHas('members', [
             'firstname' => '::firstname::',
             'lastname' => '::lastname::',
@@ -76,6 +75,7 @@ class PullMemberActionTest extends TestCase
         $this->assertDatabaseHas('groups', [
             'name' => 'SG Wald',
             'nami_id' => 1000,
+            'inner_name' => 'SG Wald',
         ]);
         $this->assertEquals(1001, $member->nami_id);
     }

tests/Unit/InitializeGroupsTest.php

@@ -46,13 +46,14 @@ class InitializeGroupsTest extends TestCase
         $this->assertDatabaseHas('groups', [
             'nami_id' => 150,
             'name' => 'lorem',
+            'inner_name' => 'lorem',
             'parent_id' => null,
         ]);
     }
 
     public function testItDoesntCreateAGroupTwiceWithTheSameNamiId(): void
     {
-        GroupModel::factory()->create(['nami_id' => 150]);
+        $existingGroup = GroupModel::factory()->create(['nami_id' => 150, 'inner_name' => 'Def']);
         $parentGroup = Group::from(['id' => 150, 'name' => 'lorem', 'parentId' => null]);
         $this->api->method('groups')->will($this->returnValueMap([
             [null, collect([$parentGroup])],
@@ -62,6 +63,12 @@ class InitializeGroupsTest extends TestCase
         (new InitializeGroups($this->api))->handle();
 
         $this->assertDatabaseCount('groups', 1);
+        $this->assertDatabaseHas('groups', [
+            'id' => $existingGroup->id,
+            'name' => 'lorem',
+            'inner_name' => 'Def',
+            'nami_id' => 150
+        ]);
     }
 
     public function testItSynchsSubgroups(): void
@@ -101,7 +108,7 @@ class InitializeGroupsTest extends TestCase
 
     public function testItAssignsIdAndParentToAnExistingSubgroup(): void
     {
-        GroupModel::factory()->create(['nami_id' => 200]);
+        $existingSubgroup = GroupModel::factory()->create(['name' => 'Abc', 'inner_name' => 'Def', 'nami_id' => 200]);
         $parentGroup = Group::from(['id' => 150, 'name' => 'root', 'parentId' => null]);
         $subgroup = Group::from(['id' => 200, 'name' => 'child', 'parentId' => 150]);
         $this->api->method('groups')->will($this->returnValueMap([
@@ -114,8 +121,10 @@ class InitializeGroupsTest extends TestCase
 
         $this->assertDatabaseCount('groups', 2);
         $this->assertDatabaseHas('groups', [
+            'id' => $existingSubgroup->id,
             'nami_id' => 200,
             'name' => 'child',
+            'inner_name' => 'Def',
             'parent_id' => GroupModel::firstWhere('nami_id', 150)->id,
         ]);
     }

tests/stub/phpstan/TestResponse.stub

@@ -5,7 +5,7 @@ namespace Illuminate\Testing;
 use Symfony\Component\HttpFoundation\File\File;
 
 /**
- * @method self assertInertiaPath(string $path, string|array<string, mixed>|int $value)
+ * @method self assertInertiaPath(string $path, string|array<string, mixed>|int|null $value)
  * @method self assertPdfPageCount(int $count)
  * @method self assertPdfName(string $filename)
  * @method File getFile()