From 4b3829668719704e402190af1d76acc391700710 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Tue, 17 Jun 2025 16:41:33 +0200
Subject: [PATCH] Lint

---
 resources/js/components/form/Editor.vue       |  31 ++--
 resources/js/components/ui/RemoteResource.vue |   8 +-
 resources/js/views/activity/VForm.vue         |  52 +++----
 resources/js/views/form/Participants.vue      | 131 ++++++++--------
 resources/js/views/formtemplate/Index.vue     |  46 +++---
 resources/js/views/group/Index.vue            |  50 +++---
 resources/js/views/invoice/Index.vue          |  93 ++++++------
 .../maildispatcher/MaildispatcherIndex.vue    |  24 +--
 resources/js/views/member/VForm.vue           | 143 +++++++++---------
 resources/js/views/member/VIndex.vue          |  48 +++---
 resources/js/views/setting/Fileshare.vue      |  67 ++++----
 resources/js/views/setting/Mailgateway.vue    |  69 ++++-----
 12 files changed, 368 insertions(+), 394 deletions(-)

diff --git a/resources/js/components/form/Editor.vue b/resources/js/components/form/Editor.vue
index 1a430eb3..092d7156 100644
--- a/resources/js/components/form/Editor.vue
+++ b/resources/js/components/form/Editor.vue
@@ -1,22 +1,21 @@
 <template>
     <div>
         <div class="flex flex-col group" :for="id" :class="sizeClass(size)">
-            <f-label v-if="label" :required="required" :value="label"></f-label>
+            <f-label v-if="label" :required="required" :value="label" />
             <div class="relative w-full h-full">
-                <div :id="id" :class="[fieldAppearance, paddingX, paddingY]"></div>
-                <f-hint v-if="hint" :value="hint"></f-hint>
+                <div :id="id" :class="[fieldAppearance, paddingX, paddingY]" />
+                <f-hint v-if="hint" :value="hint" />
             </div>
         </div>
 
-        <ui-popup
-            v-if="condition !== null"
-            heading="Bedingungen"
-            @close="
-                condition.resolve(condition.data);
-                condition = null;
-            "
+        <ui-popup v-if="condition !== null"
+                  heading="Bedingungen"
+                  @close="
+                      condition.resolve(condition.data);
+                      condition = null;
+                  "
         >
-            <slot name="conditions" :data="condition.data" :resolve="condition.resolve" :reject="condition.reject"></slot>
+            <slot name="conditions" :data="condition.data" :resolve="condition.resolve" :reject="condition.reject" />
         </ui-popup>
     </div>
 </template>
@@ -106,10 +105,10 @@ class ConditionTune {
     wrap(blockContent) {
         this.wrapper = document.createElement('div');
 
-        var tooltip = document.createElement('div');
+        const tooltip = document.createElement('div');
         tooltip.setAttribute('data-tooltip', '');
 
-        var content = document.createElement('div');
+        const content = document.createElement('div');
         content.setAttribute('data-content', '');
 
         content.appendChild(blockContent);
@@ -144,7 +143,7 @@ class ConditionTune {
             'Bedingung ' +
             this.data.ifs
                 .map((i) => {
-                    var parts = [i.field];
+                    const parts = [i.field];
 
                     if (i.comparator === 'isEqual' || i.comparator === 'isIn') {
                         parts.push('=');
@@ -191,7 +190,7 @@ class ConditionTune {
 }
 
 onMounted(async () => {
-    var tools = {
+    const tools = {
         paragraph: {
             class: Paragraph,
             shortcut: 'CTRL+P',
@@ -225,7 +224,7 @@ onMounted(async () => {
         },
     };
 
-    var tunes = [];
+    const tunes = [];
 
     if (props.conditions) {
         tools.condition = {
diff --git a/resources/js/components/ui/RemoteResource.vue b/resources/js/components/ui/RemoteResource.vue
index a82d2e6a..ae83e6b2 100644
--- a/resources/js/components/ui/RemoteResource.vue
+++ b/resources/js/components/ui/RemoteResource.vue
@@ -1,15 +1,15 @@
 <template>
     <ui-popup v-if="selecting !== false" heading="Resource auswählen" @close="selecting = false">
-        <ui-remote-selector :value="selecting" @input="set"></ui-remote-selector>
+        <ui-remote-selector :value="selecting" @input="set" />
     </ui-popup>
     <label class="flex flex-col group" :for="id" :class="sizeClass(size)">
-        <f-label v-if="label" :required="false" :value="label"></f-label>
+        <f-label v-if="label" :required="false" :value="label" />
         <div class="relative flex-none flex">
             <div class="w-full flex flex-col justify-center" :class="[fieldHeight, fieldAppearance, paddingX]" @click.prevent="selecting = modelValue === null ? null : {...modelValue}">
-                <div v-if="modelValue !== null" v-text="modelValue.resource"></div>
+                <div v-if="modelValue !== null" v-text="modelValue.resource" />
                 <div v-else>Datei auswählen</div>
             </div>
-            <f-hint v-if="hint" :value="hint"></f-hint>
+            <f-hint v-if="hint" :value="hint" />
         </div>
     </label>
 </template>
diff --git a/resources/js/views/activity/VForm.vue b/resources/js/views/activity/VForm.vue
index fc2f42ce..73259972 100644
--- a/resources/js/views/activity/VForm.vue
+++ b/resources/js/views/activity/VForm.vue
@@ -4,40 +4,38 @@
             <page-toolbar-button :href="meta.links.index" color="primary" icon="undo">zurück</page-toolbar-button>
         </template>
         <template #right>
-            <f-save-button form="actionform"></f-save-button>
+            <f-save-button form="actionform" />
         </template>
         <form id="actionform" class="grow p-3" @submit.prevent="submit">
-            <ui-popup heading="Neue Untertätigkeit" v-if="mode === 'edit' && currentSubactivity !== null" @close="currentSubactivity = null">
-                <subactivity-form class="mt-4" v-if="currentSubactivity" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity"></subactivity-form>
+            <ui-popup v-if="mode === 'edit' && currentSubactivity !== null" heading="Neue Untertätigkeit" @close="currentSubactivity = null">
+                <subactivity-form v-if="currentSubactivity" class="mt-4" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity" />
             </ui-popup>
             <div class="flex space-x-3">
-                <f-text id="name" v-model="inner.name" label="Name" required></f-text>
-                <f-switch v-model="inner.is_filterable" name="is_filterable" id="is_filterable" label="Filterbar"></f-switch>
+                <f-text id="name" v-model="inner.name" label="Name" required />
+                <f-switch id="is_filterable" v-model="inner.is_filterable" name="is_filterable" label="Filterbar" />
             </div>
             <div class="flex space-x-3 items-center mt-6 mb-2">
                 <f-checkboxes-label>Untertätigkeiten</f-checkboxes-label>
-                <ui-icon-button icon="plus" v-if="mode === 'edit'" @click.prevent="currentSubactivity = inner.subactivity_model">Neu</ui-icon-button>
+                <ui-icon-button v-if="mode === 'edit'" icon="plus" @click.prevent="currentSubactivity = inner.subactivity_model">Neu</ui-icon-button>
             </div>
             <div class="grid gap-2 sm:grid-cols-2 md:grid-cols-4">
                 <div v-for="option in subactivities" class="flex items-center space-x-2">
-                    <a
-                        href="#"
-                        v-if="mode === 'edit'"
-                        @click.prevent="currentSubactivity = option"
-                        class="transition hover:bg-yellow-600 group w-5 h-5 rounded-full flex items-center justify-center flex-none"
+                    <a v-if="mode === 'edit'"
+                       href="#"
+                       class="transition hover:bg-yellow-600 group w-5 h-5 rounded-full flex items-center justify-center flex-none"
+                       @click.prevent="currentSubactivity = option"
                     >
-                        <ui-sprite src="pencil" class="text-yellow-800 w-3 h-3 group-hover:text-yellow-200 transition"></ui-sprite>
+                        <ui-sprite src="pencil" class="text-yellow-800 w-3 h-3 group-hover:text-yellow-200 transition" />
                     </a>
-                    <f-switch
-                        inline
-                        size="sm"
-                        :key="option.id"
-                        v-model="inner.subactivities"
-                        name="subactivities[]"
-                        :id="`subactivities-${option.id}`"
-                        :value="option.id"
-                        :label="option.name"
-                    ></f-switch>
+                    <f-switch :id="`subactivities-${option.id}`"
+                              :key="option.id"
+                              v-model="inner.subactivities"
+                              inline
+                              size="sm"
+                              name="subactivities[]"
+                              :value="option.id"
+                              :label="option.name"
+                    />
                 </div>
             </div>
         </form>
@@ -49,6 +47,11 @@ import {defineAsyncComponent} from 'vue';
 import {useToast} from 'vue-toastification';
 
 export default {
+
+    props: {
+        data: {},
+        meta: {},
+    },
     setup() {
         const toast = useToast();
 
@@ -63,11 +66,6 @@ export default {
         };
     },
 
-    props: {
-        data: {},
-        meta: {},
-    },
-
     components: {
         'subactivity-form': defineAsyncComponent(() => import('./SubactivityForm.vue')),
     },
diff --git a/resources/js/views/form/Participants.vue b/resources/js/views/form/Participants.vue
index 3b8f3868..28a53ba0 100644
--- a/resources/js/views/form/Participants.vue
+++ b/resources/js/views/form/Participants.vue
@@ -1,16 +1,15 @@
 <template>
     <div>
         <ui-popup v-if="editing !== null" heading="Mitglied bearbeiten" closeable full @close="editing = null">
-            <event-form
-                :value="editing.preview"
-                :base-url="meta.base_url"
-                style="--primary: hsl(181, 75%, 26%); --secondary: hsl(181, 75%, 35%); --font: hsl(181, 84%, 78%); --circle: hsl(181, 86%, 16%)"
-                as-form
-                @save="updateParticipant($event.detail[0])"
-            ></event-form>
+            <event-form :value="editing.preview"
+                        :base-url="meta.base_url"
+                        style="--primary: hsl(181, 75%, 26%); --secondary: hsl(181, 75%, 35%); --font: hsl(181, 84%, 78%); --circle: hsl(181, 86%, 16%)"
+                        as-form
+                        @save="updateParticipant($event.detail[0])"
+            />
         </ui-popup>
         <ui-popup v-if="assigning !== null" heading="Mitglied zuweisen" closeable @close="assigning = null">
-            <member-assign @assign="assign"></member-assign>
+            <member-assign @assign="assign" />
         </ui-popup>
         <ui-popup v-if="deleting !== null" heading="Teilnehmer*in löschen?" @close="deleting = null">
             <div>
@@ -23,62 +22,58 @@
         </ui-popup>
         <page-filter>
             <template #buttons>
-                <f-text id="search" v-model="innerFilter.search" name="search" label="Suchen" size="sm"></f-text>
+                <f-text id="search" v-model="innerFilter.search" name="search" label="Suchen" size="sm" />
                 <ui-icon-button icon="plus" @click="editing = {participant: null, preview: JSON.stringify(meta.form_config)}">Hinzufügen</ui-icon-button>
-                <f-switch v-if="meta.has_nami_field" id="group_participants" v-model="groupParticipants" label="Gruppieren" size="sm" name="group_participants"></f-switch>
-                <f-multipleselect id="active_columns" v-model="activeColumnsConfig" :options="meta.columns" label="Aktive Spalten" size="sm"></f-multipleselect>
+                <f-switch v-if="meta.has_nami_field" id="group_participants" v-model="groupParticipants" label="Gruppieren" size="sm" name="group_participants" />
+                <f-multipleselect id="active_columns" v-model="activeColumnsConfig" :options="meta.columns" label="Aktive Spalten" size="sm" />
             </template>
 
             <template #fields>
                 <template v-for="(filter, index) in meta.filters">
-                    <f-select
-                        v-if="filter.base_type === 'CheckboxField'"
-                        :id="`filter-field-${index}`"
-                        :key="`filter-field-${index}`"
-                        v-model="innerFilter.data[filter.key]"
-                        :null-value="meta.default_filter_value"
-                        :name="`filter-field-${index}`"
-                        :options="checkboxFilterOptions"
-                        :label="filter.name"
-                        size="sm"
-                    ></f-select>
-                    <f-select
-                        v-if="filter.base_type === 'DropdownField'"
-                        :id="`filter-field-${index}`"
-                        :key="`filter-field-${index}`"
-                        v-model="innerFilter.data[filter.key]"
-                        :null-value="meta.default_filter_value"
-                        :name="`filter-field-${index}`"
-                        :options="dropdownFilterOptions(filter)"
-                        :label="filter.name"
-                        size="sm"
-                    ></f-select>
-                    <f-select
-                        v-if="filter.base_type === 'RadioField'"
-                        :id="`filter-field-${index}`"
-                        :key="`filter-field-${index}`"
-                        v-model="innerFilter.data[filter.key]"
-                        :null-value="meta.default_filter_value"
-                        :name="`filter-field-${index}`"
-                        :options="dropdownFilterOptions(filter)"
-                        :label="filter.name"
-                        size="sm"
-                    ></f-select>
+                    <f-select v-if="filter.base_type === 'CheckboxField'"
+                              :id="`filter-field-${index}`"
+                              :key="`filter-field-${index}`"
+                              v-model="innerFilter.data[filter.key]"
+                              :null-value="meta.default_filter_value"
+                              :name="`filter-field-${index}`"
+                              :options="checkboxFilterOptions"
+                              :label="filter.name"
+                              size="sm"
+                    />
+                    <f-select v-if="filter.base_type === 'DropdownField'"
+                              :id="`filter-field-${index}`"
+                              :key="`filter-field-${index}`"
+                              v-model="innerFilter.data[filter.key]"
+                              :null-value="meta.default_filter_value"
+                              :name="`filter-field-${index}`"
+                              :options="dropdownFilterOptions(filter)"
+                              :label="filter.name"
+                              size="sm"
+                    />
+                    <f-select v-if="filter.base_type === 'RadioField'"
+                              :id="`filter-field-${index}`"
+                              :key="`filter-field-${index}`"
+                              v-model="innerFilter.data[filter.key]"
+                              :null-value="meta.default_filter_value"
+                              :name="`filter-field-${index}`"
+                              :options="dropdownFilterOptions(filter)"
+                              :label="filter.name"
+                              size="sm"
+                    />
                 </template>
             </template>
         </page-filter>
         <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
             <thead>
-                <ui-th
-                    v-for="column in activeColumns"
-                    :key="column.id"
-                    :column="column.id"
-                    :label="column.name"
-                    :value="getSort"
-                    sortable
-                    @update:model-value="setSort(column.id, {filter: toFilterString(innerFilter)})"
-                ></ui-th>
-                <th></th>
+                <ui-th v-for="column in activeColumns"
+                       :key="column.id"
+                       :column="column.id"
+                       :label="column.name"
+                       :value="getSort"
+                       sortable
+                       @update:model-value="setSort(column.id, {filter: toFilterString(innerFilter)})"
+                />
+                <th />
             </thead>
 
             <template v-for="(participant, index) in data" :key="index">
@@ -86,21 +81,21 @@
                     <td v-for="(column, columnindex) in activeColumns" :key="column.id">
                         <div class="flex items-center space-x-2">
                             <button v-if="columnindex === 0 && participant.member_id === null" v-tooltip="`kein Mitglied zugewiesen. Per Klick zuweisen`" @click.prevent="assigning = participant">
-                                <ui-sprite src="warning-triangle" class="text-yellow-400 w-5 h-5"></ui-sprite>
+                                <ui-sprite src="warning-triangle" class="text-yellow-400 w-5 h-5" />
                             </button>
                             <ui-table-toggle-button v-if="columnindex === 0 && groupParticipants" :value="participant" :level="0" :active="isOpen(participant.id)" @toggle="toggle(participant)">
-                                <prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items"></prevention>
-                                <span v-else v-text="participant[column.display_attribute]"></span>
+                                <prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items" />
+                                <span v-else v-text="participant[column.display_attribute]" />
                             </ui-table-toggle-button>
                             <div v-else>
-                                <prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items"></prevention>
-                                <span v-else v-text="participant[column.display_attribute]"></span>
+                                <prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items" />
+                                <span v-else v-text="participant[column.display_attribute]" />
                             </div>
                         </div>
                     </td>
                     <td>
-                        <a v-tooltip="`Bearbeiten`" href="#" class="ml-2 inline-flex btn btn-warning btn-sm" @click.prevent="editReal(participant)"><ui-sprite src="pencil"></ui-sprite></a>
-                        <a v-tooltip="`Löschen`" href="#" class="ml-2 inline-flex btn btn-danger btn-sm" @click.prevent="deleting = participant"><ui-sprite src="trash"></ui-sprite></a>
+                        <a v-tooltip="`Bearbeiten`" href="#" class="ml-2 inline-flex btn btn-warning btn-sm" @click.prevent="editReal(participant)"><ui-sprite src="pencil" /></a>
+                        <a v-tooltip="`Löschen`" href="#" class="ml-2 inline-flex btn btn-danger btn-sm" @click.prevent="deleting = participant"><ui-sprite src="trash" /></a>
                     </td>
                 </tr>
                 <template v-for="child in childrenOf(participant.id)" :key="child.id">
@@ -108,25 +103,25 @@
                         <td v-for="(column, columnindex) in activeColumns" :key="column.id">
                             <div class="flex items-center space-x-2">
                                 <ui-table-toggle-button v-if="columnindex === 0 && groupParticipants" :value="child" :level="1" :active="isOpen(child.id)" @toggle="toggle(child)">
-                                    <prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items"></prevention>
-                                    <span v-else v-text="child[column.display_attribute]"></span>
+                                    <prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items" />
+                                    <span v-else v-text="child[column.display_attribute]" />
                                 </ui-table-toggle-button>
                                 <div v-else>
-                                    <prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items"></prevention>
-                                    <span v-else v-text="child[column.display_attribute]"></span>
+                                    <prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items" />
+                                    <span v-else v-text="child[column.display_attribute]" />
                                 </div>
                             </div>
                         </td>
                         <td>
-                            <a v-tooltip="`Bearbeiten`" href="#" class="ml-2 inline-flex btn btn-warning btn-sm" @click.prevent="editReal(child)"><ui-sprite src="pencil"></ui-sprite></a>
-                            <a v-tooltip="`Löschen`" href="#" class="ml-2 inline-flex btn btn-danger btn-sm" @click.prevent="deleting = child"><ui-sprite src="trash"></ui-sprite></a>
+                            <a v-tooltip="`Bearbeiten`" href="#" class="ml-2 inline-flex btn btn-warning btn-sm" @click.prevent="editReal(child)"><ui-sprite src="pencil" /></a>
+                            <a v-tooltip="`Löschen`" href="#" class="ml-2 inline-flex btn btn-danger btn-sm" @click.prevent="deleting = child"><ui-sprite src="trash" /></a>
                         </td>
                     </tr>
                 </template>
             </template>
         </table>
         <div class="px-6">
-            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage($event, {filter: toFilterString(innerFilter)})"></ui-pagination>
+            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage($event, {filter: toFilterString(innerFilter)})" />
         </div>
     </div>
 </template>
diff --git a/resources/js/views/formtemplate/Index.vue b/resources/js/views/formtemplate/Index.vue
index 16f90a19..2e205c87 100644
--- a/resources/js/views/formtemplate/Index.vue
+++ b/resources/js/views/formtemplate/Index.vue
@@ -9,15 +9,13 @@
             <div>
                 <p class="mt-4">Diese Formular-Vorlage löschen?</p>
                 <div class="grid grid-cols-2 gap-3 mt-6">
-                    <a
-                        href="#"
-                        class="text-center btn btn-danger"
-                        @click.prevent="
-                            remove(deleting);
-                            deleting = null;
-                        "
-                        >Formular-Vorlage löschen</a
-                    >
+                    <a href="#"
+                       class="text-center btn btn-danger"
+                       @click.prevent="
+                           remove(deleting);
+                           deleting = null;
+                       "
+                    >Formular-Vorlage löschen</a>
                     <a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a>
                 </div>
             </div>
@@ -25,35 +23,35 @@
 
         <ui-popup v-if="single !== null" :heading="`Vorlage ${single.id ? 'bearbeiten' : 'erstellen'}`" full @close="cancel">
             <div class="flex flex-col mt-3">
-                <ui-tabs v-model="activeTab" :entries="tabs"></ui-tabs>
+                <ui-tabs v-model="activeTab" :entries="tabs" />
                 <form-builder v-if="activeTab === 0" v-model="single.config" :meta="meta">
                     <template #meta>
-                        <f-text id="name" v-model="single.name" label="Name" required></f-text>
+                        <f-text id="name" v-model="single.name" label="Name" required />
                     </template>
                 </form-builder>
                 <div v-show="activeTab === 1" class="grid gap-3">
                     <ui-note class="mt-2 col-span-full">
-                        Hier kannst du die E-Mail anpassen, die nach der Anmeldung an den Teilnehmer verschickt wird.<br />
-                        Es gibt dafür einen ersten E-Mail-Teil und einen zweiten E-Mail-Teil. Dazwischen werden die Daten des Teilnehmers aufgelistet.<br />
-                        Die Anrede ("Hallo Max Mustermann") wird automatisch an den Anfang gesetzt.<br />
+                        Hier kannst du die E-Mail anpassen, die nach der Anmeldung an den Teilnehmer verschickt wird.<br>
+                        Es gibt dafür einen ersten E-Mail-Teil und einen zweiten E-Mail-Teil. Dazwischen werden die Daten des Teilnehmers aufgelistet.<br>
+                        Die Anrede ("Hallo Max Mustermann") wird automatisch an den Anfang gesetzt.<br>
                         Außerdem kannst du Dateien hochladen, die automatisch mit angehangen werden.
                     </ui-note>
-                    <ui-tabs v-model="activeMailTab" :entries="mailTabs"></ui-tabs>
+                    <ui-tabs v-model="activeMailTab" :entries="mailTabs" />
                     <f-editor v-if="activeMailTab === 0" id="mail_top" v-model="single.mail_top" name="mail_top" label="E-Mail-Teil 1" :rows="8" conditions required>
                         <template #conditions="{data, resolve}">
-                            <conditions-form id="mail_top_conditions" :single="single" :value="data" @save="resolve"> </conditions-form>
+                            <conditions-form id="mail_top_conditions" :single="single" :value="data" @save="resolve" />
                         </template>
                     </f-editor>
                     <f-editor v-if="activeMailTab === 1" id="mail_bottom" v-model="single.mail_bottom" name="mail_bottom" label="E-Mail-Teil 2" :rows="8" conditions required>
                         <template #conditions="{data, resolve}">
-                            <conditions-form id="mail_bottom_conditions" :single="single" :value="data" @save="resolve"> </conditions-form>
+                            <conditions-form id="mail_bottom_conditions" :single="single" :value="data" @save="resolve" />
                         </template>
                     </f-editor>
                 </div>
             </div>
             <template #actions>
                 <a href="#" @click.prevent="submit">
-                    <ui-sprite src="save" class="text-zinc-400 w-6 h-6"></ui-sprite>
+                    <ui-sprite src="save" class="text-zinc-400 w-6 h-6" />
                 </a>
             </template>
         </ui-popup>
@@ -61,21 +59,21 @@
         <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
             <thead>
                 <th>Name</th>
-                <th></th>
+                <th />
             </thead>
 
             <tr v-for="(formtemplate, index) in data" :key="index">
                 <td>
-                    <div v-text="formtemplate.name"></div>
+                    <div v-text="formtemplate.name" />
                 </td>
                 <td>
-                    <a v-tooltip="`Bearbeiten`" href="#" class="ml-2 inline-flex btn btn-warning btn-sm" @click.prevent="edit(formtemplate)"><ui-sprite src="pencil"></ui-sprite></a>
-                    <a v-tooltip="`Löschen`" href="#" class="ml-2 inline-flex btn btn-danger btn-sm" @click.prevent="deleting = formtemplate"><ui-sprite src="trash"></ui-sprite></a>
+                    <a v-tooltip="`Bearbeiten`" href="#" class="ml-2 inline-flex btn btn-warning btn-sm" @click.prevent="edit(formtemplate)"><ui-sprite src="pencil" /></a>
+                    <a v-tooltip="`Löschen`" href="#" class="ml-2 inline-flex btn btn-danger btn-sm" @click.prevent="deleting = formtemplate"><ui-sprite src="trash" /></a>
                 </td>
             </tr>
         </table>
         <div class="px-6">
-            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage"></ui-pagination>
+            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage" />
         </div>
     </page-layout>
 </template>
@@ -93,7 +91,7 @@ const tabs = [{ title: 'Formular' }, { title: 'Bestätigungs-E-Mail' }];
 const mailTabs = [{ title: 'vor Daten' }, { title: 'nach Daten' }];
 
 const props = defineProps(indexProps);
-var { meta, data, reloadPage, create, remove, single, edit, cancel, submit } = useIndex(props.data, 'invoice');
+const { meta, data, reloadPage, create, remove, single, edit, cancel, submit } = useIndex(props.data, 'invoice');
 
 function innerSubmit(payload) {
     single.value = payload;
diff --git a/resources/js/views/group/Index.vue b/resources/js/views/group/Index.vue
index ce8edc3f..88e4234f 100644
--- a/resources/js/views/group/Index.vue
+++ b/resources/js/views/group/Index.vue
@@ -1,17 +1,17 @@
 <template>
     <page-layout>
         <template #right>
-            <f-save-button form="groupform"></f-save-button>
+            <f-save-button form="groupform" />
         </template>
         <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>
+                    <ui-sprite src="save" class="text-zinc-400 w-6 h-6" />
                 </a>
             </template>
             <div class="flex space-x-3">
-                <f-text id="parent-inner_name" v-model="editing.parent.inner_name" label="Interner Name"></f-text>
-                <f-select id="parent-level" v-model="editing.parent.level" label="Ebene" name="parent-level" :options="meta.levels"></f-select>
+                <f-text id="parent-inner_name" v-model="editing.parent.inner_name" label="Interner Name" />
+                <f-select id="parent-level" v-model="editing.parent.level" label="Ebene" name="parent-level" :options="meta.levels" />
             </div>
             <div>
                 <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm table">
@@ -23,16 +23,16 @@
                     </thead>
                     <tr v-for="child in editing.children" :key="child.id">
                         <td>
-                            <span v-text="child.name"></span>
+                            <span v-text="child.name" />
                         </td>
                         <td>
-                            <f-text :id="`inner_name-${child.id}`" v-model="child.inner_name" label="" size="sm"></f-text>
+                            <f-text :id="`inner_name-${child.id}`" v-model="child.inner_name" label="" size="sm" />
                         </td>
                         <td>
-                            <f-select :id="`level-${child.id}`" v-model="child.level" label="" size="sm" :name="`level-${child.id}`" :options="meta.levels"></f-select>
+                            <f-select :id="`level-${child.id}`" v-model="child.level" label="" size="sm" :name="`level-${child.id}`" :options="meta.levels" />
                         </td>
                         <td>
-                            <ui-remote-resource :id="`fileshare-${child.id}`" v-model="child.fileshare" size="sm" label=""></ui-remote-resource>
+                            <ui-remote-resource :id="`fileshare-${child.id}`" v-model="child.fileshare" size="sm" label="" />
                         </td>
                     </tr>
                 </table>
@@ -44,44 +44,40 @@
                     <th>NaMi-Name</th>
                     <th>Interner Name</th>
                     <th>Ebene</th>
-                    <th></th>
+                    <th />
                 </thead>
 
                 <template v-for="child in childrenOf('null')" :key="child.id">
                     <tr>
                         <td>
-                            <ui-table-toggle-button :value="child" :text="child.name" :level="0" :active="isOpen(child.id)" @toggle="toggle(child)"></ui-table-toggle-button>
+                            <ui-table-toggle-button :value="child" :text="child.name" :level="0" :active="isOpen(child.id)" @toggle="toggle(child)" />
                         </td>
-                        <td v-text="child.inner_name"></td>
-                        <td v-text="child.level"></td>
+                        <td v-text="child.inner_name" />
+                        <td v-text="child.level" />
                         <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>
+                            <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(child)"><ui-sprite src="pencil" /></a>
                         </td>
                     </tr>
                     <template v-for="subchild in childrenOf(child.id)" :key="subchild.id">
                         <tr>
                             <td>
-                                <ui-table-toggle-button :value="subchild" :text="subchild.name" :level="1" :active="isOpen(subchild.id)" @toggle="toggle(subchild)"></ui-table-toggle-button>
+                                <ui-table-toggle-button :value="subchild" :text="subchild.name" :level="1" :active="isOpen(subchild.id)" @toggle="toggle(subchild)" />
                             </td>
-                            <td v-text="subchild.inner_name"></td>
-                            <td v-text="subchild.level"></td>
+                            <td v-text="subchild.inner_name" />
+                            <td v-text="subchild.level" />
                             <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>
+                                <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" /></a>
                             </td>
                         </tr>
                         <template v-for="subsubchild in childrenOf(subchild.id)" :key="subchild.id">
                             <tr>
                                 <td>
-                                    <ui-table-toggle-button :value="subsubchild" :text="subsubchild.name" :level="2" :active="isOpen(subsubchild.id)"></ui-table-toggle-button>
+                                    <ui-table-toggle-button :value="subsubchild" :text="subsubchild.name" :level="2" :active="isOpen(subsubchild.id)" />
                                 </td>
-                                <td v-text="subsubchild.inner_name"></td>
-                                <td v-text="subsubchild.level"></td>
+                                <td v-text="subsubchild.inner_name" />
+                                <td v-text="subsubchild.level" />
                                 <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>
+                                    <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" /></a>
                                 </td>
                             </tr>
                         </template>
@@ -98,10 +94,10 @@ import { indexProps, useIndex } from '../../composables/useInertiaApiIndex.js';
 import useTableToggle from '../../composables/useTableToggle.js';
 
 const props = defineProps(indexProps);
-var { axios, meta, data } = useIndex(props.data, 'invoice');
+const { axios, meta, data } = useIndex(props.data, 'invoice');
 const { isOpen, toggle, childrenOf } = useTableToggle({ null: data.value });
 
-var editing = ref(null);
+const editing = ref(null);
 
 async function edit(parent) {
     editing.value = {
diff --git a/resources/js/views/invoice/Index.vue b/resources/js/views/invoice/Index.vue
index e7d73c82..7882ce2c 100644
--- a/resources/js/views/invoice/Index.vue
+++ b/resources/js/views/invoice/Index.vue
@@ -9,7 +9,7 @@
         <ui-popup v-if="massstore !== null" heading="Massenrechnung anlegen" @close="massstore = null">
             <form @submit.prevent="sendMassstore">
                 <section class="grid grid-cols-2 gap-3 mt-6">
-                    <f-text id="year" v-model="massstore.year" label="Jahr" required></f-text>
+                    <f-text id="year" v-model="massstore.year" label="Jahr" required />
                 </section>
                 <section class="flex mt-4 space-x-2">
                     <ui-button type="submit" class="btn-danger">Speichern</ui-button>
@@ -21,15 +21,13 @@
             <div>
                 <p class="mt-4">Diese Rechnung löschen?</p>
                 <div class="grid grid-cols-2 gap-3 mt-6">
-                    <a
-                        href="#"
-                        class="text-center btn btn-danger"
-                        @click.prevent="
-                            remove(deleting);
-                            deleting = null;
-                        "
-                        >Rechnung löschen</a
-                    >
+                    <a href="#"
+                       class="text-center btn btn-danger"
+                       @click.prevent="
+                           remove(deleting);
+                           deleting = null;
+                       "
+                    >Rechnung löschen</a>
                     <a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a>
                 </div>
             </div>
@@ -37,33 +35,33 @@
         <ui-popup v-if="single !== null" :heading="`Rechnung ${single.id ? 'bearbeiten' : 'erstellen'}`" inner-width="max-w-4xl" @close="cancel">
             <form class="grid grid-cols-2 gap-3 mt-4" @submit.prevent="submit">
                 <ui-box heading="Für Mitglied anlegen" container-class="flex space-x-3" class="col-span-full">
-                    <f-select id="forMemberMember" v-model="forMember.member_id" name="forMemberMember" :options="meta.members" label="Mitglied"></f-select>
-                    <f-select id="forMemberSubscription" v-model="forMember.subscription_id" name="forMemberSubscription" :options="meta.subscriptions" label="Beitrag"></f-select>
-                    <f-text id="forMemberYear" v-model="forMember.year" label="Jahr"></f-text>
+                    <f-select id="forMemberMember" v-model="forMember.member_id" name="forMemberMember" :options="meta.members" label="Mitglied" />
+                    <f-select id="forMemberSubscription" v-model="forMember.subscription_id" name="forMemberSubscription" :options="meta.subscriptions" label="Beitrag" />
+                    <f-text id="forMemberYear" v-model="forMember.year" label="Jahr" />
                     <ui-icon-button class="btn-primary self-end mb-2" icon="save" @click="saveForMember">Speichern</ui-icon-button>
                 </ui-box>
                 <ui-box heading=" Empfänger" container-class="grid grid-cols-2 gap-3 col-span-full">
-                    <f-text id="to_name" v-model="single.to.name" label="Name" class="col-span-full" required></f-text>
-                    <f-text id="to_address" v-model="single.to.address" label="Adresse" class="col-span-full" required></f-text>
-                    <f-text id="to_zip" v-model="single.to.zip" label="PLZ" required></f-text>
-                    <f-text id="to_location" v-model="single.to.location" label="Ort" required></f-text>
-                    <f-text id="mail_email" v-model="single.mail_email" label="E-Mail-Adresse" class="col-span-full"></f-text>
+                    <f-text id="to_name" v-model="single.to.name" label="Name" class="col-span-full" required />
+                    <f-text id="to_address" v-model="single.to.address" label="Adresse" class="col-span-full" required />
+                    <f-text id="to_zip" v-model="single.to.zip" label="PLZ" required />
+                    <f-text id="to_location" v-model="single.to.location" label="Ort" required />
+                    <f-text id="mail_email" v-model="single.mail_email" label="E-Mail-Adresse" class="col-span-full" />
                 </ui-box>
                 <ui-box heading="Status" container-class="grid gap-3">
-                    <f-select id="status" v-model="single.status" :options="meta.statuses" name="status" label="Status" required></f-select>
-                    <f-select id="via" v-model="single.via" :options="meta.vias" name="via" label="Rechnungsweg" required></f-select>
-                    <f-text id="greeting" v-model="single.greeting" label="Anrede" required></f-text>
-                    <f-text id="usage" v-model="single.usage" label="Verwendungszweck" required></f-text>
+                    <f-select id="status" v-model="single.status" :options="meta.statuses" name="status" label="Status" required />
+                    <f-select id="via" v-model="single.via" :options="meta.vias" name="via" label="Rechnungsweg" required />
+                    <f-text id="greeting" v-model="single.greeting" label="Anrede" required />
+                    <f-text id="usage" v-model="single.usage" label="Verwendungszweck" required />
                 </ui-box>
                 <ui-box heading="Positionen" class="col-span-full" container-class="grid gap-3">
                     <template #in-title>
                         <ui-icon-button class="ml-3 btn-primary" icon="plus" @click="single.positions.push({...meta.default_position})">Neu</ui-icon-button>
                     </template>
                     <div v-for="(position, index) in single.positions" :key="index" class="flex items-end space-x-3">
-                        <f-text :id="`position-description-${index}`" v-model="position.description" class="grow" label="Beschreibung" required></f-text>
-                        <f-text :id="`position-price-${index}`" v-model="position.price" mode="area" label="Preis" required></f-text>
-                        <f-select :id="`position-member-${index}`" v-model="position.member_id" :options="meta.members" :name="`position-member-${index}`" label="Mitglied" required></f-select>
-                        <button type="button" class="btn btn-danger btn-sm h-[35px]" icon="trash" @click="single.positions.splice(index, 1)"><ui-sprite src="trash"></ui-sprite></button>
+                        <f-text :id="`position-description-${index}`" v-model="position.description" class="grow" label="Beschreibung" required />
+                        <f-text :id="`position-price-${index}`" v-model="position.price" mode="area" label="Preis" required />
+                        <f-select :id="`position-member-${index}`" v-model="position.member_id" :options="meta.members" :name="`position-member-${index}`" label="Mitglied" required />
+                        <button type="button" class="btn btn-danger btn-sm h-[35px]" icon="trash" @click="single.positions.splice(index, 1)"><ui-sprite src="trash" /></button>
                     </div>
                 </ui-box>
                 <section class="flex mt-4 space-x-2">
@@ -74,15 +72,14 @@
         </ui-popup>
         <page-filter>
             <template #buttons>
-                <f-text id="search" :model-value="getFilter('search')" label="Suchen …" size="sm" @update:model-value="setFilter('search', $event)"></f-text>
-                <f-multipleselect
-                    id="statuses"
-                    :options="meta.statuses"
-                    :model-value="getFilter('statuses')"
-                    label="Status"
-                    size="sm"
-                    @update:model-value="setFilter('statuses', $event)"
-                ></f-multipleselect>
+                <f-text id="search" :model-value="getFilter('search')" label="Suchen …" size="sm" @update:model-value="setFilter('search', $event)" />
+                <f-multipleselect id="statuses"
+                                  :options="meta.statuses"
+                                  :model-value="getFilter('statuses')"
+                                  label="Status"
+                                  size="sm"
+                                  @update:model-value="setFilter('statuses', $event)"
+                />
             </template>
         </page-filter>
         <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
@@ -92,38 +89,38 @@
                 <th>Status</th>
                 <th>Gesendet am</th>
                 <th>Rechnungsweg</th>
-                <th></th>
+                <th />
             </thead>
 
             <tr v-for="(invoice, index) in data" :key="index">
                 <td>
-                    <div v-text="invoice.to.name"></div>
+                    <div v-text="invoice.to.name" />
                 </td>
                 <td>
-                    <div v-text="invoice.sum_human"></div>
+                    <div v-text="invoice.sum_human" />
                 </td>
                 <td>
-                    <div v-text="invoice.status"></div>
+                    <div v-text="invoice.status" />
                 </td>
                 <td>
-                    <div v-text="invoice.sent_at_human"></div>
+                    <div v-text="invoice.sent_at_human" />
                 </td>
                 <td>
-                    <div v-text="invoice.via"></div>
+                    <div v-text="invoice.via" />
                 </td>
                 <td>
                     <div class="flex space-x-2">
-                        <ui-action-button tooltip="Anschauen" :href="invoice.links.pdf" class="btn-info" icon="eye" blank></ui-action-button>
-                        <ui-action-button tooltip="Erinnerung anschauen" :href="invoice.links.rememberpdf" class="btn-info" icon="document" blank></ui-action-button>
-                        <ui-action-button tooltip="Als Bezahlt markieren" class="btn-warning" icon="money" blank @click.prevent="markAsPaid(invoice)"></ui-action-button>
-                        <ui-action-button :data-cy="`edit-button-${invoice.id}`" tooltip="Bearbeiten" class="btn-warning" icon="pencil" @click.prevent="edit(invoice)"></ui-action-button>
-                        <ui-action-button tooltip="Löschen" class="btn-danger" icon="trash" @click.prevent="deleting = invoice"></ui-action-button>
+                        <ui-action-button tooltip="Anschauen" :href="invoice.links.pdf" class="btn-info" icon="eye" blank />
+                        <ui-action-button tooltip="Erinnerung anschauen" :href="invoice.links.rememberpdf" class="btn-info" icon="document" blank />
+                        <ui-action-button tooltip="Als Bezahlt markieren" class="btn-warning" icon="money" blank @click.prevent="markAsPaid(invoice)" />
+                        <ui-action-button :data-cy="`edit-button-${invoice.id}`" tooltip="Bearbeiten" class="btn-warning" icon="pencil" @click.prevent="edit(invoice)" />
+                        <ui-action-button tooltip="Löschen" class="btn-danger" icon="trash" @click.prevent="deleting = invoice" />
                     </div>
                 </td>
             </tr>
         </table>
         <div class="px-6">
-            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage"></ui-pagination>
+            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage" />
         </div>
     </page-layout>
 </template>
@@ -132,7 +129,7 @@
 import { ref } from 'vue';
 import { indexProps, useIndex } from '../../composables/useInertiaApiIndex.js';
 const props = defineProps(indexProps);
-var { axios, meta, data, reloadPage, create, single, edit, cancel, submit, remove, getFilter, setFilter } = useIndex(props.data, 'invoice');
+const { axios, meta, data, reloadPage, create, single, edit, cancel, submit, remove, getFilter, setFilter } = useIndex(props.data, 'invoice');
 const massstore = ref(null);
 const deleting = ref(null);
 const forMember = ref({ member_id: null, subscription_id: null, year: null });
diff --git a/resources/js/views/maildispatcher/MaildispatcherIndex.vue b/resources/js/views/maildispatcher/MaildispatcherIndex.vue
index 6d3be77d..97873a22 100644
--- a/resources/js/views/maildispatcher/MaildispatcherIndex.vue
+++ b/resources/js/views/maildispatcher/MaildispatcherIndex.vue
@@ -3,12 +3,12 @@
         <template #toolbar>
             <page-toolbar-button :href="data.meta.links.create" color="primary" icon="plus">Verteiler erstellen</page-toolbar-button>
         </template>
-        <ui-popup heading="Verteiler löschen?" v-if="deleting !== null" @close="deleting.reject()">
+        <ui-popup v-if="deleting !== null" heading="Verteiler löschen?" @close="deleting.reject()">
             <div>
                 <p class="mt-4">Den Verteiler "{{ deleting.dispatcher.name }}" löschen?</p>
                 <div class="grid grid-cols-2 gap-3 mt-6">
-                    <a href="#" @click.prevent="deleting.resolve()" class="text-center btn btn-danger">Löschen</a>
-                    <a href="#" @click.prevent="deleting.reject()" class="text-center btn btn-primary">Abbrechen</a>
+                    <a href="#" class="text-center btn btn-danger" @click.prevent="deleting.resolve()">Löschen</a>
+                    <a href="#" class="text-center btn btn-primary" @click.prevent="deleting.reject()">Abbrechen</a>
                 </div>
             </div>
         </ui-popup>
@@ -17,22 +17,22 @@
                 <th>Name</th>
                 <th>Domain</th>
                 <th>Verbindung</th>
-                <th></th>
+                <th />
             </thead>
 
             <tr v-for="(dispatcher, index) in data.data" :key="index">
                 <td>
-                    <div v-text="dispatcher.name"></div>
+                    <div v-text="dispatcher.name" />
                 </td>
                 <td>
-                    <div v-text="dispatcher.gateway.domain"></div>
+                    <div v-text="dispatcher.gateway.domain" />
                 </td>
                 <td>
-                    <div v-text="dispatcher.gateway.name"></div>
+                    <div v-text="dispatcher.gateway.name" />
                 </td>
                 <td>
-                    <i-link :href="dispatcher.links.edit" class="mr-1 inline-flex btn btn-warning btn-sm"><ui-sprite src="pencil"></ui-sprite></i-link>
-                    <button @click.prevent="remove(dispatcher)" class="inline-flex btn btn-danger btn-sm"><ui-sprite src="trash"></ui-sprite></button>
+                    <i-link :href="dispatcher.links.edit" class="mr-1 inline-flex btn btn-warning btn-sm"><ui-sprite src="pencil" /></i-link>
+                    <button class="inline-flex btn btn-danger btn-sm" @click.prevent="remove(dispatcher)"><ui-sprite src="trash" /></button>
                 </td>
             </tr>
         </table>
@@ -41,6 +41,9 @@
 
 <script>
 export default {
+    props: {
+        data: {},
+    },
     data: function () {
         return {
             deleting: null,
@@ -60,8 +63,5 @@ export default {
                 });
         },
     },
-    props: {
-        data: {},
-    },
 };
 </script>
diff --git a/resources/js/views/member/VForm.vue b/resources/js/views/member/VForm.vue
index 34ead47e..f4c8ea86 100644
--- a/resources/js/views/member/VForm.vue
+++ b/resources/js/views/member/VForm.vue
@@ -5,7 +5,7 @@
             <page-toolbar-button v-if="mode === 'edit'" :href="data.links.show" color="primary" icon="eye">anschauen</page-toolbar-button>
         </template>
         <template #right>
-            <f-save-button form="memberedit"></f-save-button>
+            <f-save-button form="memberedit" />
         </template>
         <form id="memberedit" class="flex grow relative" @submit.prevent="submit">
             <ui-popup v-if="conflict === true" heading="Ein Konflikt ist aufgetreten">
@@ -24,107 +24,104 @@
                 <ui-box heading="Stammdaten">
                     <div class="grid sm:grid-cols-2 gap-3">
                         <div class="grid grid-cols-2 gap-3">
-                            <f-select id="gender_id" v-model="inner.gender_id" name="gender_id" :options="meta.genders" label="Geschlecht" size="sm"></f-select>
-                            <f-text id="salutation" v-model="inner.salutation" size="sm" label="Anrede"></f-text>
+                            <f-select id="gender_id" v-model="inner.gender_id" name="gender_id" :options="meta.genders" label="Geschlecht" size="sm" />
+                            <f-text id="salutation" v-model="inner.salutation" size="sm" label="Anrede" />
                         </div>
-                        <f-select id="nationality_id" v-model="inner.nationality_id" :options="meta.nationalities" label="Staatsangehörigkeit" name="nationality_id" size="sm"></f-select>
-                        <f-text id="firstname" v-model="inner.firstname" size="sm" label="Vorname" required></f-text>
-                        <f-text id="lastname" v-model="inner.lastname" size="sm" label="Nachname" required></f-text>
-                        <f-text id="address" v-model="inner.address" size="sm" label="Adresse"></f-text>
-                        <f-text id="further_address" v-model="inner.further_address" size="sm" label="Adresszusatz"></f-text>
-                        <f-text id="zip" v-model="inner.zip" size="sm" label="PLZ"></f-text>
-                        <f-text id="location" v-model="inner.location" size="sm" label="Ort"></f-text>
-                        <f-text id="birthday" v-model="inner.birthday" type="date" size="sm" label="Geburtsdatum"></f-text>
-                        <f-select id="region_id" v-model="inner.region_id" :options="meta.regions" name="region_id" label="Bundesland" size="sm"></f-select>
-                        <f-select id="country_id" v-model="inner.country_id" :options="meta.countries" label="Land" name="country_id" size="sm" required></f-select>
-                        <f-text id="other_country" v-model="inner.other_country" label="Andere Staatsangehörigkeit" size="sm"></f-text>
+                        <f-select id="nationality_id" v-model="inner.nationality_id" :options="meta.nationalities" label="Staatsangehörigkeit" name="nationality_id" size="sm" />
+                        <f-text id="firstname" v-model="inner.firstname" size="sm" label="Vorname" required />
+                        <f-text id="lastname" v-model="inner.lastname" size="sm" label="Nachname" required />
+                        <f-text id="address" v-model="inner.address" size="sm" label="Adresse" />
+                        <f-text id="further_address" v-model="inner.further_address" size="sm" label="Adresszusatz" />
+                        <f-text id="zip" v-model="inner.zip" size="sm" label="PLZ" />
+                        <f-text id="location" v-model="inner.location" size="sm" label="Ort" />
+                        <f-text id="birthday" v-model="inner.birthday" type="date" size="sm" label="Geburtsdatum" />
+                        <f-select id="region_id" v-model="inner.region_id" :options="meta.regions" name="region_id" label="Bundesland" size="sm" />
+                        <f-select id="country_id" v-model="inner.country_id" :options="meta.countries" label="Land" name="country_id" size="sm" required />
+                        <f-text id="other_country" v-model="inner.other_country" label="Andere Staatsangehörigkeit" size="sm" />
                     </div>
                 </ui-box>
                 <ui-box heading="Kontakt">
                     <div class="grid gap-3 sm:grid-cols-2">
-                        <f-text id="main_phone" v-model="inner.main_phone" size="sm" label="Telefon (Eltern)"></f-text>
-                        <f-text id="mobile_phone" v-model="inner.mobile_phone" size="sm" label="Handy (Eltern)"></f-text>
-                        <f-text id="work_phone" v-model="inner.work_phone" size="sm" label="Tel geschäftlich (Eltern)"></f-text>
-                        <f-text id="children_phone" v-model="inner.children_phone" size="sm" label="Telefon (Kind)"></f-text>
-                        <f-text id="email" v-model="inner.email" size="sm" label="E-Mail"></f-text>
-                        <f-text id="email_parents" v-model="inner.email_parents" size="sm" label="E-Mail eltern"></f-text>
-                        <f-text id="fax" v-model="inner.fax" size="sm" label="Fax"></f-text>
-                        <f-textarea id="letter_address" v-model="inner.letter_address" class="sm:col-span-2" :rows="3" label="Brief-Adresse" size="sm"></f-textarea>
+                        <f-text id="main_phone" v-model="inner.main_phone" size="sm" label="Telefon (Eltern)" />
+                        <f-text id="mobile_phone" v-model="inner.mobile_phone" size="sm" label="Handy (Eltern)" />
+                        <f-text id="work_phone" v-model="inner.work_phone" size="sm" label="Tel geschäftlich (Eltern)" />
+                        <f-text id="children_phone" v-model="inner.children_phone" size="sm" label="Telefon (Kind)" />
+                        <f-text id="email" v-model="inner.email" size="sm" label="E-Mail" />
+                        <f-text id="email_parents" v-model="inner.email_parents" size="sm" label="E-Mail eltern" />
+                        <f-text id="fax" v-model="inner.fax" size="sm" label="Fax" />
+                        <f-textarea id="letter_address" v-model="inner.letter_address" class="sm:col-span-2" :rows="3" label="Brief-Adresse" size="sm" />
                     </div>
                 </ui-box>
                 <ui-box heading="System">
                     <div class="grid gap-3">
-                        <f-select id="bill_kind" v-model="inner.bill_kind" :options="meta.billKinds" label="Rechnung versenden über" name="bill_kind" size="sm"></f-select>
-                        <f-select id="subscription_id" v-model="inner.subscription_id" :options="meta.subscriptions" label="Beitrag" name="subscription_id" size="sm"></f-select>
-                        <f-switch id="has_nami" v-model="inner.has_nami" name="has_nami" size="sm" label="In Nami eintragen"></f-switch>
-                        <f-switch id="send_newspaper" v-model="inner.send_newspaper" name="send_newspaper" label="Mittendrin versenden" size="sm"></f-switch>
-                        <f-switch id="keepdata" v-model="inner.keepdata" name="keepdata" label="Datenweiterverwendung" size="sm"></f-switch>
-                        <f-text id="joined_at" v-model="inner.joined_at" type="date" label="Eintrittsdatum" size="sm" required></f-text>
-                        <f-textarea id="comment" v-model="inner.comment" :rows="3" class="col-span-2" label="Kommentar" size="sm"></f-textarea>
+                        <f-select id="bill_kind" v-model="inner.bill_kind" :options="meta.billKinds" label="Rechnung versenden über" name="bill_kind" size="sm" />
+                        <f-select id="subscription_id" v-model="inner.subscription_id" :options="meta.subscriptions" label="Beitrag" name="subscription_id" size="sm" />
+                        <f-switch id="has_nami" v-model="inner.has_nami" name="has_nami" size="sm" label="In Nami eintragen" />
+                        <f-switch id="send_newspaper" v-model="inner.send_newspaper" name="send_newspaper" label="Mittendrin versenden" size="sm" />
+                        <f-switch id="keepdata" v-model="inner.keepdata" name="keepdata" label="Datenweiterverwendung" size="sm" />
+                        <f-text id="joined_at" v-model="inner.joined_at" type="date" label="Eintrittsdatum" size="sm" required />
+                        <f-textarea id="comment" v-model="inner.comment" :rows="3" class="col-span-2" label="Kommentar" size="sm" />
                         <div v-if="mode === 'create' || (original.has_nami === false && inner.has_nami === true)" class="contents">
-                            <f-select
-                                id="first_activity_id"
-                                v-model="inner.first_activity_id"
-                                :options="meta.formCreateActivities"
-                                label="Erste Tätigkeit"
-                                name="first_activity_id"
-                                size="sm"
-                                required
-                            ></f-select>
-                            <f-select
-                                v-if="inner.first_activity_id"
-                                id="first_subactivity_id"
-                                v-model="inner.first_subactivity_id"
-                                :options="meta.formCreateSubactivities[inner.first_activity_id]"
-                                label="Erste Untertätigkeit"
-                                name="first_subactivity_id"
-                                size="sm"
-                                required
-                            ></f-select>
+                            <f-select id="first_activity_id"
+                                      v-model="inner.first_activity_id"
+                                      :options="meta.formCreateActivities"
+                                      label="Erste Tätigkeit"
+                                      name="first_activity_id"
+                                      size="sm"
+                                      required
+                            />
+                            <f-select v-if="inner.first_activity_id"
+                                      id="first_subactivity_id"
+                                      v-model="inner.first_subactivity_id"
+                                      :options="meta.formCreateSubactivities[inner.first_activity_id]"
+                                      label="Erste Untertätigkeit"
+                                      name="first_subactivity_id"
+                                      size="sm"
+                                      required
+                            />
                         </div>
                     </div>
                 </ui-box>
                 <ui-box heading="Prävention">
                     <div class="grid sm:grid-cols-[minmax(min-content,max-content)_minmax(min-content,max-content)] gap-2">
                         <div class="grid grid-cols-[minmax(min-content,max-content)_8rem] gap-1">
-                            <f-switch id="has_efz" v-model="hasEfz" name="has_efz" size="sm" label="Führungszeugnis eingesehen"></f-switch>
+                            <f-switch id="has_efz" v-model="hasEfz" name="has_efz" size="sm" label="Führungszeugnis eingesehen" />
                             <div>
-                                <f-text v-if="inner.efz !== null" id="efz" v-model="inner.efz" type="date" label="am" size="sm"></f-text>
+                                <f-text v-if="inner.efz !== null" id="efz" v-model="inner.efz" type="date" label="am" size="sm" />
                             </div>
-                            <f-switch id="has_ps" v-model="hasPs" name="has_ps" size="sm" label="Hat Präventionsschulung"></f-switch>
+                            <f-switch id="has_ps" v-model="hasPs" name="has_ps" size="sm" label="Hat Präventionsschulung" />
                             <div>
-                                <f-text v-if="inner.ps_at !== null" id="ps_at" v-model="inner.ps_at" type="date" label="am" size="sm"></f-text>
+                                <f-text v-if="inner.ps_at !== null" id="ps_at" v-model="inner.ps_at" type="date" label="am" size="sm" />
                             </div>
-                            <f-switch id="has_more_ps" v-model="hasMorePs" name="has_more_ps" size="sm" label="Hat Vertiefungsschulung"></f-switch>
+                            <f-switch id="has_more_ps" v-model="hasMorePs" name="has_more_ps" size="sm" label="Hat Vertiefungsschulung" />
                             <div>
-                                <f-text v-if="inner.more_ps_at !== null" id="more_ps_at" v-model="inner.more_ps_at" type="date" label="am" size="sm"></f-text>
+                                <f-text v-if="inner.more_ps_at !== null" id="more_ps_at" v-model="inner.more_ps_at" type="date" label="am" size="sm" />
                             </div>
-                            <f-switch id="is_recertified" v-model="isRecertified" name="is_recertified" size="sm" label="Hat Rezertifizierung"></f-switch>
+                            <f-switch id="is_recertified" v-model="isRecertified" name="is_recertified" size="sm" label="Hat Rezertifizierung" />
                             <div>
-                                <f-text v-if="inner.recertified_at !== null" id="recertified_at" v-model="inner.recertified_at" type="date" label="am" size="sm"></f-text>
+                                <f-text v-if="inner.recertified_at !== null" id="recertified_at" v-model="inner.recertified_at" type="date" label="am" size="sm" />
                             </div>
-                            <f-switch id="has_without_education" v-model="hasWithoutEducation" name="has_without_education" label="Einsatz ohne Schulung" size="sm"></f-switch>
+                            <f-switch id="has_without_education" v-model="hasWithoutEducation" name="has_without_education" label="Einsatz ohne Schulung" size="sm" />
                             <div>
-                                <f-text
-                                    v-if="inner.without_education_at !== null"
-                                    id="without_education_at"
-                                    v-model="inner.without_education_at"
-                                    name="without_education_at"
-                                    type="date"
-                                    label="am"
-                                    size="sm"
-                                ></f-text>
+                                <f-text v-if="inner.without_education_at !== null"
+                                        id="without_education_at"
+                                        v-model="inner.without_education_at"
+                                        name="without_education_at"
+                                        type="date"
+                                        label="am"
+                                        size="sm"
+                                />
                             </div>
-                            <f-switch id="has_without_efz" v-model="hasWithoutEfz" name="has_without_efz" size="sm" label="Einsatz ohne EFZ"></f-switch>
+                            <f-switch id="has_without_efz" v-model="hasWithoutEfz" name="has_without_efz" size="sm" label="Einsatz ohne EFZ" />
                             <div>
-                                <f-text v-if="inner.without_efz_at !== null" id="without_efz_at" v-model="inner.without_efz_at" type="date" label="am" size="sm"></f-text>
+                                <f-text v-if="inner.without_efz_at !== null" id="without_efz_at" v-model="inner.without_efz_at" type="date" label="am" size="sm" />
                             </div>
                         </div>
                         <div class="grid gap-1">
-                            <f-switch id="has_svk" v-model="inner.has_svk" name="has_svk" size="sm" label="SVK unterschrieben"></f-switch>
-                            <f-switch id="has_vk" v-model="inner.has_vk" name="has_vk" size="sm" label="Verhaltenskodex unterschrieben"></f-switch>
-                            <f-switch id="multiply_pv" v-model="inner.multiply_pv" name="multiply_pv" label="Multiplikator*in Präventionsschulung" size="sm"></f-switch>
-                            <f-switch id="multiply_more_pv" v-model="inner.multiply_more_pv" name="multiply_more_pv" label="Multiplikator*in Vertiefungsschulung" size="sm"></f-switch>
+                            <f-switch id="has_svk" v-model="inner.has_svk" name="has_svk" size="sm" label="SVK unterschrieben" />
+                            <f-switch id="has_vk" v-model="inner.has_vk" name="has_vk" size="sm" label="Verhaltenskodex unterschrieben" />
+                            <f-switch id="multiply_pv" v-model="inner.multiply_pv" name="multiply_pv" label="Multiplikator*in Präventionsschulung" size="sm" />
+                            <f-switch id="multiply_more_pv" v-model="inner.multiply_more_pv" name="multiply_more_pv" label="Multiplikator*in Vertiefungsschulung" size="sm" />
                         </div>
                     </div>
                 </ui-box>
@@ -162,7 +159,7 @@ export default {
 
     methods: {
         submit() {
-            this.mode === 'create' ? this.$inertia.post(`/member`, this.inner) : this.$inertia.patch(`/member/${this.inner.id}`, this.inner);
+            this.mode === 'create' ? this.$inertia.post('/member', this.inner) : this.$inertia.patch(`/member/${this.inner.id}`, this.inner);
         },
         resync() {
             this.$inertia.get(`/member/${this.inner.id}/resync`);
diff --git a/resources/js/views/member/VIndex.vue b/resources/js/views/member/VIndex.vue
index 8faab25f..4de501bd 100644
--- a/resources/js/views/member/VIndex.vue
+++ b/resources/js/views/member/VIndex.vue
@@ -22,9 +22,9 @@
                 <member-filter-fields :model-value="filter" @update:model-value="setFilterObject($event)" />
             </template>
             <template #buttons>
-                <f-text id="search" :model-value="filter.search" label="Suchen …" size="sm" @update:model-value="setFilterObject({...filter, search: $event})"></f-text>
+                <f-text id="search" :model-value="filter.search" label="Suchen …" size="sm" @update:model-value="setFilterObject({...filter, search: $event})" />
                 <button class="btn btn-primary label mr-2" @click.prevent="exportMembers">
-                    <ui-sprite class="w-3 h-3 xl:mr-2" src="save"></ui-sprite>
+                    <ui-sprite class="w-3 h-3 xl:mr-2" src="save" />
                     <span class="hidden xl:inline">Exportieren</span>
                 </button>
             </template>
@@ -32,7 +32,7 @@
 
         <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm hidden md:table">
             <thead>
-                <th></th>
+                <th />
                 <th>Nachname</th>
                 <th>Vorname</th>
                 <th class="!hidden 2xl:!table-cell">Ort</th>
@@ -40,26 +40,26 @@
                 <th class="!hidden xl:!table-cell">Alter</th>
                 <th v-if="hasModule('bill')" class="!hidden xl:!table-cell">Rechnung</th>
                 <th v-if="hasModule('bill')">Ausstand</th>
-                <th></th>
+                <th />
             </thead>
 
             <tr v-for="(member, index) in data" :key="index">
-                <td><ui-age-groups :member="member"></ui-age-groups></td>
-                <td v-text="member.lastname"></td>
-                <td v-text="member.firstname"></td>
-                <td class="!hidden 2xl:!table-cell" v-text="member.full_address"></td>
+                <td><ui-age-groups :member="member" /></td>
+                <td v-text="member.lastname" />
+                <td v-text="member.firstname" />
+                <td class="!hidden 2xl:!table-cell" v-text="member.full_address" />
                 <td>
-                    <tags :member="member"></tags>
+                    <tags :member="member" />
                 </td>
-                <td class="!hidden xl:!table-cell" v-text="member.age"></td>
+                <td class="!hidden xl:!table-cell" v-text="member.age" />
                 <td v-if="hasModule('bill')" class="!hidden xl:!table-cell">
-                    <ui-label :value="member.bill_kind_name" fallback="kein"></ui-label>
+                    <ui-label :value="member.bill_kind_name" fallback="kein" />
                 </td>
                 <td v-if="hasModule('bill')">
-                    <ui-label :value="member.pending_payment" fallback="---"></ui-label>
+                    <ui-label :value="member.pending_payment" fallback="---" />
                 </td>
                 <td>
-                    <actions :member="member" @sidebar="openSidebar($event, member)" @remove="remove(member)"></actions>
+                    <actions :member="member" @sidebar="openSidebar($event, member)" @remove="remove(member)" />
                 </td>
             </tr>
         </table>
@@ -67,28 +67,28 @@
         <div class="md:hidden p-3 grid gap-3">
             <ui-box v-for="(member, index) in data" :key="index" class="relative" :heading="member.fullname">
                 <template #in-title>
-                    <ui-age-groups class="ml-2" :member="member" icon-class="w-4 h-4"></ui-age-groups>
+                    <ui-age-groups class="ml-2" :member="member" icon-class="w-4 h-4" />
                 </template>
-                <div class="text-xs text-gray-200" v-text="member.full_address"></div>
+                <div class="text-xs text-gray-200" v-text="member.full_address" />
                 <div class="flex items-center mt-1 space-x-4">
-                    <tags :member="member"></tags>
-                    <ui-label v-show="hasModule('bill')" class="text-gray-100 block" :value="member.pending_payment" fallback=""></ui-label>
+                    <tags :member="member" />
+                    <ui-label v-show="hasModule('bill')" class="text-gray-100 block" :value="member.pending_payment" fallback="" />
                 </div>
-                <actions class="mt-2" :member="member" @sidebar="openSidebar($event, member)" @remove="remove(member)"> </actions>
+                <actions class="mt-2" :member="member" @sidebar="openSidebar($event, member)" @remove="remove(member)" />
                 <div class="absolute right-0 top-0 h-full flex items-center mr-2">
-                    <i-link v-tooltip="`Details`" :href="member.links.show"><ui-sprite src="chevron" class="w-6 h-6 text-teal-100 -rotate-90"></ui-sprite></i-link>
+                    <i-link v-tooltip="`Details`" :href="member.links.show"><ui-sprite src="chevron" class="w-6 h-6 text-teal-100 -rotate-90" /></i-link>
                 </div>
             </ui-box>
         </div>
 
         <div class="px-6">
-            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage"></ui-pagination>
+            <ui-pagination class="mt-4" :value="meta" @reload="reloadPage" />
         </div>
 
         <ui-sidebar v-if="single !== null" @close="closeSidebar">
-            <member-invoice-positions v-if="single.type === 'invoicePosition'" :url="single.model.links.invoiceposition_index" @close="closeSidebar"></member-invoice-positions>
-            <member-memberships v-if="single.type === 'membership'" :url="single.model.links.membership_index" @close="closeSidebar"></member-memberships>
-            <member-courses v-if="single.type === 'courses'" :url="single.model.links.course_index" @close="closeSidebar"></member-courses>
+            <member-invoice-positions v-if="single.type === 'invoicePosition'" :url="single.model.links.invoiceposition_index" @close="closeSidebar" />
+            <member-memberships v-if="single.type === 'membership'" :url="single.model.links.membership_index" @close="closeSidebar" />
+            <member-courses v-if="single.type === 'courses'" :url="single.model.links.course_index" @close="closeSidebar" />
         </ui-sidebar>
     </page-layout>
 </template>
@@ -107,7 +107,7 @@ const single = ref(null);
 const deleting = ref(null);
 
 const props = defineProps(indexProps);
-var {router, data, meta, filter, setFilterObject, filterString, reloadPage} = useIndex(props.data, 'member');
+const {router, data, meta, filter, setFilterObject, filterString, reloadPage} = useIndex(props.data, 'member');
 
 function exportMembers() {
     window.open(`/member-export?filter=${filterString.value}`);
diff --git a/resources/js/views/setting/Fileshare.vue b/resources/js/views/setting/Fileshare.vue
index 89340fd4..f6719af5 100644
--- a/resources/js/views/setting/Fileshare.vue
+++ b/resources/js/views/setting/Fileshare.vue
@@ -6,33 +6,31 @@
         <ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel">
             <form @submit.prevent="submit">
                 <section class="grid grid-cols-2 gap-3 mt-6">
-                    <f-text id="name" v-model="single.name" name="name" label="Bezeichnung" required></f-text>
-                    <f-select
-                        id="type"
-                        :model-value="single.type"
-                        label="Typ"
-                        name="type"
-                        :options="meta.types"
-                        required
-                        @update:model-value="
-                            single = {
-                                ...single,
-                                type: $event,
-                                config: {...getType($event).defaults},
-                            }
-                        "
-                    ></f-select>
+                    <f-text id="name" v-model="single.name" name="name" label="Bezeichnung" required />
+                    <f-select id="type"
+                              :model-value="single.type"
+                              label="Typ"
+                              name="type"
+                              :options="meta.types"
+                              required
+                              @update:model-value="
+                                  single = {
+                                      ...single,
+                                      type: $event,
+                                      config: {...getType($event).defaults},
+                                  }
+                              "
+                    />
                     <template v-for="(field, index) in getType(single.type).fields">
-                        <f-text
-                            v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'"
-                            :id="field.key"
-                            :key="index"
-                            v-model="single.config[field.key]"
-                            :label="field.label"
-                            :type="field.type"
-                            :name="field.key"
-                            required
-                        ></f-text>
+                        <f-text v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'"
+                                :id="field.key"
+                                :key="index"
+                                v-model="single.config[field.key]"
+                                :label="field.label"
+                                :type="field.type"
+                                :name="field.key"
+                                required
+                        />
                     </template>
                 </section>
                 <section class="flex mt-4 space-x-2">
@@ -52,23 +50,22 @@
                     </thead>
 
                     <tr v-for="(connection, index) in data" :key="index">
-                        <td v-text="connection.name"></td>
-                        <td v-text="connection.type_human"></td>
+                        <td v-text="connection.name" />
+                        <td v-text="connection.type_human" />
                         <td>
-                            <ui-boolean-display
-                                :value="connection.is_active"
-                                long-label="Verbindungsstatus"
-                                :label="connection.is_active ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'"
-                            ></ui-boolean-display>
+                            <ui-boolean-display :value="connection.is_active"
+                                                long-label="Verbindungsstatus"
+                                                :label="connection.is_active ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'"
+                            />
                         </td>
                         <td>
-                            <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(connection)"><ui-sprite src="pencil"></ui-sprite></a>
+                            <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(connection)"><ui-sprite src="pencil" /></a>
                         </td>
                     </tr>
                 </table>
 
                 <div class="px-6">
-                    <ui-pagination class="mt-4" :value="meta" :only="['data']"></ui-pagination>
+                    <ui-pagination class="mt-4" :value="meta" :only="['data']" />
                 </div>
             </div>
         </setting-layout>
diff --git a/resources/js/views/setting/Mailgateway.vue b/resources/js/views/setting/Mailgateway.vue
index b723a6e8..7799459d 100644
--- a/resources/js/views/setting/Mailgateway.vue
+++ b/resources/js/views/setting/Mailgateway.vue
@@ -6,33 +6,31 @@
         <ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel">
             <form @submit.prevent="submit">
                 <section class="grid grid-cols-2 gap-3 mt-6">
-                    <f-text id="name" v-model="single.name" label="Bezeichnung" required></f-text>
-                    <f-text id="domain" v-model="single.domain" label="Domain" required></f-text>
-                    <f-select
-                        id="type"
-                        :model-value="single.type.cls"
-                        label="Typ"
-                        name="type"
-                        :options="meta.types"
-                        :placeholder="''"
-                        required
-                        @update:model-value="
-                            single.type = {
-                                cls: $event,
-                                params: {...getType($event).defaults},
-                            }
-                        "
-                    ></f-select>
+                    <f-text id="name" v-model="single.name" label="Bezeichnung" required />
+                    <f-text id="domain" v-model="single.domain" label="Domain" required />
+                    <f-select id="type"
+                              :model-value="single.type.cls"
+                              label="Typ"
+                              name="type"
+                              :options="meta.types"
+                              :placeholder="''"
+                              required
+                              @update:model-value="
+                                  single.type = {
+                                      cls: $event,
+                                      params: {...getType($event).defaults},
+                                  }
+                              "
+                    />
                     <template v-for="(field, index) in getType(single.type.cls).fields">
-                        <f-text
-                            v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'"
-                            :id="field.name"
-                            :key="index"
-                            v-model="single.type.params[field.name]"
-                            :label="field.label"
-                            :type="field.type"
-                            :required="field.is_required"
-                        ></f-text>
+                        <f-text v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'"
+                                :id="field.name"
+                                :key="index"
+                                v-model="single.type.params[field.name]"
+                                :label="field.label"
+                                :type="field.type"
+                                :required="field.is_required"
+                        />
                     </template>
                 </section>
                 <section class="flex mt-4 space-x-2">
@@ -53,24 +51,23 @@
                     </thead>
 
                     <tr v-for="(gateway, index) in data" :key="index">
-                        <td v-text="gateway.name"></td>
-                        <td v-text="gateway.domain"></td>
-                        <td v-text="gateway.type_human"></td>
+                        <td v-text="gateway.name" />
+                        <td v-text="gateway.domain" />
+                        <td v-text="gateway.type_human" />
                         <td>
-                            <ui-boolean-display
-                                :value="gateway.works"
-                                long-label="Verbindungsstatus"
-                                :label="gateway.works ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'"
-                            ></ui-boolean-display>
+                            <ui-boolean-display :value="gateway.works"
+                                                long-label="Verbindungsstatus"
+                                                :label="gateway.works ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'"
+                            />
                         </td>
                         <td>
-                            <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(gateway)"><ui-sprite src="pencil"></ui-sprite></a>
+                            <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(gateway)"><ui-sprite src="pencil" /></a>
                         </td>
                     </tr>
                 </table>
 
                 <div class="px-6">
-                    <ui-pagination class="mt-4" :value="meta" :only="['data']"></ui-pagination>
+                    <ui-pagination class="mt-4" :value="meta" :only="['data']" />
                 </div>
             </div>
         </setting-layout>