This commit is contained in:
philipp lang 2025-06-17 16:41:33 +02:00
parent 634a13b4dd
commit 4b38296687
12 changed files with 368 additions and 394 deletions

View File

@ -1,22 +1,21 @@
<template> <template>
<div> <div>
<div class="flex flex-col group" :for="id" :class="sizeClass(size)"> <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 class="relative w-full h-full">
<div :id="id" :class="[fieldAppearance, paddingX, paddingY]"></div> <div :id="id" :class="[fieldAppearance, paddingX, paddingY]" />
<f-hint v-if="hint" :value="hint"></f-hint> <f-hint v-if="hint" :value="hint" />
</div> </div>
</div> </div>
<ui-popup <ui-popup v-if="condition !== null"
v-if="condition !== null" heading="Bedingungen"
heading="Bedingungen" @close="
@close=" condition.resolve(condition.data);
condition.resolve(condition.data); condition = null;
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> </ui-popup>
</div> </div>
</template> </template>
@ -106,10 +105,10 @@ class ConditionTune {
wrap(blockContent) { wrap(blockContent) {
this.wrapper = document.createElement('div'); this.wrapper = document.createElement('div');
var tooltip = document.createElement('div'); const tooltip = document.createElement('div');
tooltip.setAttribute('data-tooltip', ''); tooltip.setAttribute('data-tooltip', '');
var content = document.createElement('div'); const content = document.createElement('div');
content.setAttribute('data-content', ''); content.setAttribute('data-content', '');
content.appendChild(blockContent); content.appendChild(blockContent);
@ -144,7 +143,7 @@ class ConditionTune {
'Bedingung ' + 'Bedingung ' +
this.data.ifs this.data.ifs
.map((i) => { .map((i) => {
var parts = [i.field]; const parts = [i.field];
if (i.comparator === 'isEqual' || i.comparator === 'isIn') { if (i.comparator === 'isEqual' || i.comparator === 'isIn') {
parts.push('='); parts.push('=');
@ -191,7 +190,7 @@ class ConditionTune {
} }
onMounted(async () => { onMounted(async () => {
var tools = { const tools = {
paragraph: { paragraph: {
class: Paragraph, class: Paragraph,
shortcut: 'CTRL+P', shortcut: 'CTRL+P',
@ -225,7 +224,7 @@ onMounted(async () => {
}, },
}; };
var tunes = []; const tunes = [];
if (props.conditions) { if (props.conditions) {
tools.condition = { tools.condition = {

View File

@ -1,15 +1,15 @@
<template> <template>
<ui-popup v-if="selecting !== false" heading="Resource auswählen" @close="selecting = false"> <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> </ui-popup>
<label class="flex flex-col group" :for="id" :class="sizeClass(size)"> <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="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 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 v-else>Datei auswählen</div>
</div> </div>
<f-hint v-if="hint" :value="hint"></f-hint> <f-hint v-if="hint" :value="hint" />
</div> </div>
</label> </label>
</template> </template>

View File

@ -4,40 +4,38 @@
<page-toolbar-button :href="meta.links.index" color="primary" icon="undo">zurück</page-toolbar-button> <page-toolbar-button :href="meta.links.index" color="primary" icon="undo">zurück</page-toolbar-button>
</template> </template>
<template #right> <template #right>
<f-save-button form="actionform"></f-save-button> <f-save-button form="actionform" />
</template> </template>
<form id="actionform" class="grow p-3" @submit.prevent="submit"> <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"> <ui-popup v-if="mode === 'edit' && currentSubactivity !== null" heading="Neue Untertätigkeit" @close="currentSubactivity = null">
<subactivity-form class="mt-4" v-if="currentSubactivity" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity"></subactivity-form> <subactivity-form v-if="currentSubactivity" class="mt-4" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity" />
</ui-popup> </ui-popup>
<div class="flex space-x-3"> <div class="flex space-x-3">
<f-text id="name" v-model="inner.name" label="Name" required></f-text> <f-text id="name" v-model="inner.name" label="Name" required />
<f-switch v-model="inner.is_filterable" name="is_filterable" id="is_filterable" label="Filterbar"></f-switch> <f-switch id="is_filterable" v-model="inner.is_filterable" name="is_filterable" label="Filterbar" />
</div> </div>
<div class="flex space-x-3 items-center mt-6 mb-2"> <div class="flex space-x-3 items-center mt-6 mb-2">
<f-checkboxes-label>Untertätigkeiten</f-checkboxes-label> <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>
<div class="grid gap-2 sm:grid-cols-2 md:grid-cols-4"> <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"> <div v-for="option in subactivities" class="flex items-center space-x-2">
<a <a v-if="mode === 'edit'"
href="#" href="#"
v-if="mode === 'edit'" class="transition hover:bg-yellow-600 group w-5 h-5 rounded-full flex items-center justify-center flex-none"
@click.prevent="currentSubactivity = option" @click.prevent="currentSubactivity = option"
class="transition hover:bg-yellow-600 group w-5 h-5 rounded-full flex items-center justify-center flex-none"
> >
<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> </a>
<f-switch <f-switch :id="`subactivities-${option.id}`"
inline :key="option.id"
size="sm" v-model="inner.subactivities"
:key="option.id" inline
v-model="inner.subactivities" size="sm"
name="subactivities[]" name="subactivities[]"
:id="`subactivities-${option.id}`" :value="option.id"
:value="option.id" :label="option.name"
:label="option.name" />
></f-switch>
</div> </div>
</div> </div>
</form> </form>
@ -49,6 +47,11 @@ import {defineAsyncComponent} from 'vue';
import {useToast} from 'vue-toastification'; import {useToast} from 'vue-toastification';
export default { export default {
props: {
data: {},
meta: {},
},
setup() { setup() {
const toast = useToast(); const toast = useToast();
@ -63,11 +66,6 @@ export default {
}; };
}, },
props: {
data: {},
meta: {},
},
components: { components: {
'subactivity-form': defineAsyncComponent(() => import('./SubactivityForm.vue')), 'subactivity-form': defineAsyncComponent(() => import('./SubactivityForm.vue')),
}, },

View File

@ -1,16 +1,15 @@
<template> <template>
<div> <div>
<ui-popup v-if="editing !== null" heading="Mitglied bearbeiten" closeable full @close="editing = null"> <ui-popup v-if="editing !== null" heading="Mitglied bearbeiten" closeable full @close="editing = null">
<event-form <event-form :value="editing.preview"
:value="editing.preview" :base-url="meta.base_url"
: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%)"
style="--primary: hsl(181, 75%, 26%); --secondary: hsl(181, 75%, 35%); --font: hsl(181, 84%, 78%); --circle: hsl(181, 86%, 16%)" as-form
as-form @save="updateParticipant($event.detail[0])"
@save="updateParticipant($event.detail[0])" />
></event-form>
</ui-popup> </ui-popup>
<ui-popup v-if="assigning !== null" heading="Mitglied zuweisen" closeable @close="assigning = null"> <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>
<ui-popup v-if="deleting !== null" heading="Teilnehmer*in löschen?" @close="deleting = null"> <ui-popup v-if="deleting !== null" heading="Teilnehmer*in löschen?" @close="deleting = null">
<div> <div>
@ -23,62 +22,58 @@
</ui-popup> </ui-popup>
<page-filter> <page-filter>
<template #buttons> <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> <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-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"></f-multipleselect> <f-multipleselect id="active_columns" v-model="activeColumnsConfig" :options="meta.columns" label="Aktive Spalten" size="sm" />
</template> </template>
<template #fields> <template #fields>
<template v-for="(filter, index) in meta.filters"> <template v-for="(filter, index) in meta.filters">
<f-select <f-select v-if="filter.base_type === 'CheckboxField'"
v-if="filter.base_type === 'CheckboxField'" :id="`filter-field-${index}`"
:id="`filter-field-${index}`" :key="`filter-field-${index}`"
:key="`filter-field-${index}`" v-model="innerFilter.data[filter.key]"
v-model="innerFilter.data[filter.key]" :null-value="meta.default_filter_value"
:null-value="meta.default_filter_value" :name="`filter-field-${index}`"
:name="`filter-field-${index}`" :options="checkboxFilterOptions"
:options="checkboxFilterOptions" :label="filter.name"
:label="filter.name" size="sm"
size="sm" />
></f-select> <f-select v-if="filter.base_type === 'DropdownField'"
<f-select :id="`filter-field-${index}`"
v-if="filter.base_type === 'DropdownField'" :key="`filter-field-${index}`"
:id="`filter-field-${index}`" v-model="innerFilter.data[filter.key]"
:key="`filter-field-${index}`" :null-value="meta.default_filter_value"
v-model="innerFilter.data[filter.key]" :name="`filter-field-${index}`"
:null-value="meta.default_filter_value" :options="dropdownFilterOptions(filter)"
:name="`filter-field-${index}`" :label="filter.name"
:options="dropdownFilterOptions(filter)" size="sm"
:label="filter.name" />
size="sm" <f-select v-if="filter.base_type === 'RadioField'"
></f-select> :id="`filter-field-${index}`"
<f-select :key="`filter-field-${index}`"
v-if="filter.base_type === 'RadioField'" v-model="innerFilter.data[filter.key]"
:id="`filter-field-${index}`" :null-value="meta.default_filter_value"
:key="`filter-field-${index}`" :name="`filter-field-${index}`"
v-model="innerFilter.data[filter.key]" :options="dropdownFilterOptions(filter)"
:null-value="meta.default_filter_value" :label="filter.name"
:name="`filter-field-${index}`" size="sm"
:options="dropdownFilterOptions(filter)" />
:label="filter.name"
size="sm"
></f-select>
</template> </template>
</template> </template>
</page-filter> </page-filter>
<table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm"> <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
<thead> <thead>
<ui-th <ui-th v-for="column in activeColumns"
v-for="column in activeColumns" :key="column.id"
:key="column.id" :column="column.id"
:column="column.id" :label="column.name"
:label="column.name" :value="getSort"
:value="getSort" sortable
sortable @update:model-value="setSort(column.id, {filter: toFilterString(innerFilter)})"
@update:model-value="setSort(column.id, {filter: toFilterString(innerFilter)})" />
></ui-th> <th />
<th></th>
</thead> </thead>
<template v-for="(participant, index) in data" :key="index"> <template v-for="(participant, index) in data" :key="index">
@ -86,21 +81,21 @@
<td v-for="(column, columnindex) in activeColumns" :key="column.id"> <td v-for="(column, columnindex) in activeColumns" :key="column.id">
<div class="flex items-center space-x-2"> <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"> <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> </button>
<ui-table-toggle-button v-if="columnindex === 0 && groupParticipants" :value="participant" :level="0" :active="isOpen(participant.id)" @toggle="toggle(participant)"> <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> <prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items" />
<span v-else v-text="participant[column.display_attribute]"></span> <span v-else v-text="participant[column.display_attribute]" />
</ui-table-toggle-button> </ui-table-toggle-button>
<div v-else> <div v-else>
<prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items"></prevention> <prevention v-if="column.display_attribute === 'prevention_display'" :value="participant.prevention_items" />
<span v-else v-text="participant[column.display_attribute]"></span> <span v-else v-text="participant[column.display_attribute]" />
</div> </div>
</div> </div>
</td> </td>
<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="`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"></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" /></a>
</td> </td>
</tr> </tr>
<template v-for="child in childrenOf(participant.id)" :key="child.id"> <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"> <td v-for="(column, columnindex) in activeColumns" :key="column.id">
<div class="flex items-center space-x-2"> <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)"> <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> <prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items" />
<span v-else v-text="child[column.display_attribute]"></span> <span v-else v-text="child[column.display_attribute]" />
</ui-table-toggle-button> </ui-table-toggle-button>
<div v-else> <div v-else>
<prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items"></prevention> <prevention v-if="column.display_attribute === 'prevention_display'" :value="child.prevention_items" />
<span v-else v-text="child[column.display_attribute]"></span> <span v-else v-text="child[column.display_attribute]" />
</div> </div>
</div> </div>
</td> </td>
<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="`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"></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" /></a>
</td> </td>
</tr> </tr>
</template> </template>
</template> </template>
</table> </table>
<div class="px-6"> <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>
</div> </div>
</template> </template>

View File

@ -9,15 +9,13 @@
<div> <div>
<p class="mt-4">Diese Formular-Vorlage löschen?</p> <p class="mt-4">Diese Formular-Vorlage löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6"> <div class="grid grid-cols-2 gap-3 mt-6">
<a <a href="#"
href="#" class="text-center btn btn-danger"
class="text-center btn btn-danger" @click.prevent="
@click.prevent=" remove(deleting);
remove(deleting); deleting = null;
deleting = null; "
" >Formular-Vorlage löschen</a>
>Formular-Vorlage löschen</a
>
<a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a> <a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a>
</div> </div>
</div> </div>
@ -25,35 +23,35 @@
<ui-popup v-if="single !== null" :heading="`Vorlage ${single.id ? 'bearbeiten' : 'erstellen'}`" full @close="cancel"> <ui-popup v-if="single !== null" :heading="`Vorlage ${single.id ? 'bearbeiten' : 'erstellen'}`" full @close="cancel">
<div class="flex flex-col mt-3"> <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"> <form-builder v-if="activeTab === 0" v-model="single.config" :meta="meta">
<template #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> </template>
</form-builder> </form-builder>
<div v-show="activeTab === 1" class="grid gap-3"> <div v-show="activeTab === 1" class="grid gap-3">
<ui-note class="mt-2 col-span-full"> <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 /> 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 /> 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 /> Die Anrede ("Hallo Max Mustermann") wird automatisch an den Anfang gesetzt.<br>
Außerdem kannst du Dateien hochladen, die automatisch mit angehangen werden. Außerdem kannst du Dateien hochladen, die automatisch mit angehangen werden.
</ui-note> </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> <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}"> <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> </template>
</f-editor> </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> <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}"> <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> </template>
</f-editor> </f-editor>
</div> </div>
</div> </div>
<template #actions> <template #actions>
<a href="#" @click.prevent="submit"> <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> </a>
</template> </template>
</ui-popup> </ui-popup>
@ -61,21 +59,21 @@
<table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm"> <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
<thead> <thead>
<th>Name</th> <th>Name</th>
<th></th> <th />
</thead> </thead>
<tr v-for="(formtemplate, index) in data" :key="index"> <tr v-for="(formtemplate, index) in data" :key="index">
<td> <td>
<div v-text="formtemplate.name"></div> <div v-text="formtemplate.name" />
</td> </td>
<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="`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"></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" /></a>
</td> </td>
</tr> </tr>
</table> </table>
<div class="px-6"> <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> </div>
</page-layout> </page-layout>
</template> </template>
@ -93,7 +91,7 @@ const tabs = [{ title: 'Formular' }, { title: 'Bestätigungs-E-Mail' }];
const mailTabs = [{ title: 'vor Daten' }, { title: 'nach Daten' }]; const mailTabs = [{ title: 'vor Daten' }, { title: 'nach Daten' }];
const props = defineProps(indexProps); 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) { function innerSubmit(payload) {
single.value = payload; single.value = payload;

View File

@ -1,17 +1,17 @@
<template> <template>
<page-layout> <page-layout>
<template #right> <template #right>
<f-save-button form="groupform"></f-save-button> <f-save-button form="groupform" />
</template> </template>
<ui-popup v-if="editing !== null" heading="Untergruppen bearbeiten" inner-width="max-w-5xl" @close="editing = null"> <ui-popup v-if="editing !== null" heading="Untergruppen bearbeiten" inner-width="max-w-5xl" @close="editing = null">
<template #actions> <template #actions>
<a href="#" @click.prevent="store"> <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> </a>
</template> </template>
<div class="flex space-x-3"> <div class="flex space-x-3">
<f-text id="parent-inner_name" v-model="editing.parent.inner_name" label="Interner Name"></f-text> <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"></f-select> <f-select id="parent-level" v-model="editing.parent.level" label="Ebene" name="parent-level" :options="meta.levels" />
</div> </div>
<div> <div>
<table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm table"> <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm table">
@ -23,16 +23,16 @@
</thead> </thead>
<tr v-for="child in editing.children" :key="child.id"> <tr v-for="child in editing.children" :key="child.id">
<td> <td>
<span v-text="child.name"></span> <span v-text="child.name" />
</td> </td>
<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>
<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>
<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> </td>
</tr> </tr>
</table> </table>
@ -44,44 +44,40 @@
<th>NaMi-Name</th> <th>NaMi-Name</th>
<th>Interner Name</th> <th>Interner Name</th>
<th>Ebene</th> <th>Ebene</th>
<th></th> <th />
</thead> </thead>
<template v-for="child in childrenOf('null')" :key="child.id"> <template v-for="child in childrenOf('null')" :key="child.id">
<tr> <tr>
<td> <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>
<td v-text="child.inner_name"></td> <td v-text="child.inner_name" />
<td v-text="child.level"></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> <a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(child)"><ui-sprite src="pencil" /></a>
</td> </td>
</tr> </tr>
<template v-for="subchild in childrenOf(child.id)" :key="subchild.id"> <template v-for="subchild in childrenOf(child.id)" :key="subchild.id">
<tr> <tr>
<td> <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>
<td v-text="subchild.inner_name"></td> <td v-text="subchild.inner_name" />
<td v-text="subchild.level"></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)" <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>
><ui-sprite src="pencil"></ui-sprite
></a>
</td> </td>
</tr> </tr>
<template v-for="subsubchild in childrenOf(subchild.id)" :key="subchild.id"> <template v-for="subsubchild in childrenOf(subchild.id)" :key="subchild.id">
<tr> <tr>
<td> <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>
<td v-text="subsubchild.inner_name"></td> <td v-text="subsubchild.inner_name" />
<td v-text="subsubchild.level"></td> <td v-text="subsubchild.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)" <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>
><ui-sprite src="pencil"></ui-sprite
></a>
</td> </td>
</tr> </tr>
</template> </template>
@ -98,10 +94,10 @@ import { indexProps, useIndex } from '../../composables/useInertiaApiIndex.js';
import useTableToggle from '../../composables/useTableToggle.js'; import useTableToggle from '../../composables/useTableToggle.js';
const props = defineProps(indexProps); 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 }); const { isOpen, toggle, childrenOf } = useTableToggle({ null: data.value });
var editing = ref(null); const editing = ref(null);
async function edit(parent) { async function edit(parent) {
editing.value = { editing.value = {

View File

@ -9,7 +9,7 @@
<ui-popup v-if="massstore !== null" heading="Massenrechnung anlegen" @close="massstore = null"> <ui-popup v-if="massstore !== null" heading="Massenrechnung anlegen" @close="massstore = null">
<form @submit.prevent="sendMassstore"> <form @submit.prevent="sendMassstore">
<section class="grid grid-cols-2 gap-3 mt-6"> <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>
<section class="flex mt-4 space-x-2"> <section class="flex mt-4 space-x-2">
<ui-button type="submit" class="btn-danger">Speichern</ui-button> <ui-button type="submit" class="btn-danger">Speichern</ui-button>
@ -21,15 +21,13 @@
<div> <div>
<p class="mt-4">Diese Rechnung löschen?</p> <p class="mt-4">Diese Rechnung löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6"> <div class="grid grid-cols-2 gap-3 mt-6">
<a <a href="#"
href="#" class="text-center btn btn-danger"
class="text-center btn btn-danger" @click.prevent="
@click.prevent=" remove(deleting);
remove(deleting); deleting = null;
deleting = null; "
" >Rechnung löschen</a>
>Rechnung löschen</a
>
<a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a> <a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a>
</div> </div>
</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"> <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"> <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"> <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="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-select> <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"></f-text> <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-icon-button class="btn-primary self-end mb-2" icon="save" @click="saveForMember">Speichern</ui-icon-button>
</ui-box> </ui-box>
<ui-box heading=" Empfänger" container-class="grid grid-cols-2 gap-3 col-span-full"> <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_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> <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> <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> <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"></f-text> <f-text id="mail_email" v-model="single.mail_email" label="E-Mail-Adresse" class="col-span-full" />
</ui-box> </ui-box>
<ui-box heading="Status" container-class="grid gap-3"> <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="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-select> <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> <f-text id="greeting" v-model="single.greeting" label="Anrede" required />
<f-text id="usage" v-model="single.usage" label="Verwendungszweck" required></f-text> <f-text id="usage" v-model="single.usage" label="Verwendungszweck" required />
</ui-box> </ui-box>
<ui-box heading="Positionen" class="col-span-full" container-class="grid gap-3"> <ui-box heading="Positionen" class="col-span-full" container-class="grid gap-3">
<template #in-title> <template #in-title>
<ui-icon-button class="ml-3 btn-primary" icon="plus" @click="single.positions.push({...meta.default_position})">Neu</ui-icon-button> <ui-icon-button class="ml-3 btn-primary" icon="plus" @click="single.positions.push({...meta.default_position})">Neu</ui-icon-button>
</template> </template>
<div v-for="(position, index) in single.positions" :key="index" class="flex items-end space-x-3"> <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-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-text> <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></f-select> <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"></ui-sprite></button> <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> </div>
</ui-box> </ui-box>
<section class="flex mt-4 space-x-2"> <section class="flex mt-4 space-x-2">
@ -74,15 +72,14 @@
</ui-popup> </ui-popup>
<page-filter> <page-filter>
<template #buttons> <template #buttons>
<f-text id="search" :model-value="getFilter('search')" label="Suchen …" size="sm" @update:model-value="setFilter('search', $event)"></f-text> <f-text id="search" :model-value="getFilter('search')" label="Suchen …" size="sm" @update:model-value="setFilter('search', $event)" />
<f-multipleselect <f-multipleselect id="statuses"
id="statuses" :options="meta.statuses"
:options="meta.statuses" :model-value="getFilter('statuses')"
:model-value="getFilter('statuses')" label="Status"
label="Status" size="sm"
size="sm" @update:model-value="setFilter('statuses', $event)"
@update:model-value="setFilter('statuses', $event)" />
></f-multipleselect>
</template> </template>
</page-filter> </page-filter>
<table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm"> <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
@ -92,38 +89,38 @@
<th>Status</th> <th>Status</th>
<th>Gesendet am</th> <th>Gesendet am</th>
<th>Rechnungsweg</th> <th>Rechnungsweg</th>
<th></th> <th />
</thead> </thead>
<tr v-for="(invoice, index) in data" :key="index"> <tr v-for="(invoice, index) in data" :key="index">
<td> <td>
<div v-text="invoice.to.name"></div> <div v-text="invoice.to.name" />
</td> </td>
<td> <td>
<div v-text="invoice.sum_human"></div> <div v-text="invoice.sum_human" />
</td> </td>
<td> <td>
<div v-text="invoice.status"></div> <div v-text="invoice.status" />
</td> </td>
<td> <td>
<div v-text="invoice.sent_at_human"></div> <div v-text="invoice.sent_at_human" />
</td> </td>
<td> <td>
<div v-text="invoice.via"></div> <div v-text="invoice.via" />
</td> </td>
<td> <td>
<div class="flex space-x-2"> <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="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> <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> <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> <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"></ui-action-button> <ui-action-button tooltip="Löschen" class="btn-danger" icon="trash" @click.prevent="deleting = invoice" />
</div> </div>
</td> </td>
</tr> </tr>
</table> </table>
<div class="px-6"> <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> </div>
</page-layout> </page-layout>
</template> </template>
@ -132,7 +129,7 @@
import { ref } from 'vue'; import { ref } from 'vue';
import { indexProps, useIndex } from '../../composables/useInertiaApiIndex.js'; import { indexProps, useIndex } from '../../composables/useInertiaApiIndex.js';
const props = defineProps(indexProps); 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 massstore = ref(null);
const deleting = ref(null); const deleting = ref(null);
const forMember = ref({ member_id: null, subscription_id: null, year: null }); const forMember = ref({ member_id: null, subscription_id: null, year: null });

View File

@ -3,12 +3,12 @@
<template #toolbar> <template #toolbar>
<page-toolbar-button :href="data.meta.links.create" color="primary" icon="plus">Verteiler erstellen</page-toolbar-button> <page-toolbar-button :href="data.meta.links.create" color="primary" icon="plus">Verteiler erstellen</page-toolbar-button>
</template> </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> <div>
<p class="mt-4">Den Verteiler "{{ deleting.dispatcher.name }}" löschen?</p> <p class="mt-4">Den Verteiler "{{ deleting.dispatcher.name }}" löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6"> <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="#" class="text-center btn btn-danger" @click.prevent="deleting.resolve()">Löschen</a>
<a href="#" @click.prevent="deleting.reject()" class="text-center btn btn-primary">Abbrechen</a> <a href="#" class="text-center btn btn-primary" @click.prevent="deleting.reject()">Abbrechen</a>
</div> </div>
</div> </div>
</ui-popup> </ui-popup>
@ -17,22 +17,22 @@
<th>Name</th> <th>Name</th>
<th>Domain</th> <th>Domain</th>
<th>Verbindung</th> <th>Verbindung</th>
<th></th> <th />
</thead> </thead>
<tr v-for="(dispatcher, index) in data.data" :key="index"> <tr v-for="(dispatcher, index) in data.data" :key="index">
<td> <td>
<div v-text="dispatcher.name"></div> <div v-text="dispatcher.name" />
</td> </td>
<td> <td>
<div v-text="dispatcher.gateway.domain"></div> <div v-text="dispatcher.gateway.domain" />
</td> </td>
<td> <td>
<div v-text="dispatcher.gateway.name"></div> <div v-text="dispatcher.gateway.name" />
</td> </td>
<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> <i-link :href="dispatcher.links.edit" class="mr-1 inline-flex btn btn-warning btn-sm"><ui-sprite src="pencil" /></i-link>
<button @click.prevent="remove(dispatcher)" class="inline-flex btn btn-danger btn-sm"><ui-sprite src="trash"></ui-sprite></button> <button class="inline-flex btn btn-danger btn-sm" @click.prevent="remove(dispatcher)"><ui-sprite src="trash" /></button>
</td> </td>
</tr> </tr>
</table> </table>
@ -41,6 +41,9 @@
<script> <script>
export default { export default {
props: {
data: {},
},
data: function () { data: function () {
return { return {
deleting: null, deleting: null,
@ -60,8 +63,5 @@ export default {
}); });
}, },
}, },
props: {
data: {},
},
}; };
</script> </script>

View File

@ -5,7 +5,7 @@
<page-toolbar-button v-if="mode === 'edit'" :href="data.links.show" color="primary" icon="eye">anschauen</page-toolbar-button> <page-toolbar-button v-if="mode === 'edit'" :href="data.links.show" color="primary" icon="eye">anschauen</page-toolbar-button>
</template> </template>
<template #right> <template #right>
<f-save-button form="memberedit"></f-save-button> <f-save-button form="memberedit" />
</template> </template>
<form id="memberedit" class="flex grow relative" @submit.prevent="submit"> <form id="memberedit" class="flex grow relative" @submit.prevent="submit">
<ui-popup v-if="conflict === true" heading="Ein Konflikt ist aufgetreten"> <ui-popup v-if="conflict === true" heading="Ein Konflikt ist aufgetreten">
@ -24,107 +24,104 @@
<ui-box heading="Stammdaten"> <ui-box heading="Stammdaten">
<div class="grid sm:grid-cols-2 gap-3"> <div class="grid sm:grid-cols-2 gap-3">
<div class="grid 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-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"></f-text> <f-text id="salutation" v-model="inner.salutation" size="sm" label="Anrede" />
</div> </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-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> <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> <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> <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> <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> <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> <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-text> <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> <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-select> <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"></f-text> <f-text id="other_country" v-model="inner.other_country" label="Andere Staatsangehörigkeit" size="sm" />
</div> </div>
</ui-box> </ui-box>
<ui-box heading="Kontakt"> <ui-box heading="Kontakt">
<div class="grid gap-3 sm:grid-cols-2"> <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="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> <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> <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> <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> <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> <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-text> <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"></f-textarea> <f-textarea id="letter_address" v-model="inner.letter_address" class="sm:col-span-2" :rows="3" label="Brief-Adresse" size="sm" />
</div> </div>
</ui-box> </ui-box>
<ui-box heading="System"> <ui-box heading="System">
<div class="grid gap-3"> <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="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-select> <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> <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> <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-switch> <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-text> <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"></f-textarea> <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"> <div v-if="mode === 'create' || (original.has_nami === false && inner.has_nami === true)" class="contents">
<f-select <f-select id="first_activity_id"
id="first_activity_id" v-model="inner.first_activity_id"
v-model="inner.first_activity_id" :options="meta.formCreateActivities"
:options="meta.formCreateActivities" label="Erste Tätigkeit"
label="Erste Tätigkeit" name="first_activity_id"
name="first_activity_id" size="sm"
size="sm" required
required />
></f-select> <f-select v-if="inner.first_activity_id"
<f-select id="first_subactivity_id"
v-if="inner.first_activity_id" v-model="inner.first_subactivity_id"
id="first_subactivity_id" :options="meta.formCreateSubactivities[inner.first_activity_id]"
v-model="inner.first_subactivity_id" label="Erste Untertätigkeit"
:options="meta.formCreateSubactivities[inner.first_activity_id]" name="first_subactivity_id"
label="Erste Untertätigkeit" size="sm"
name="first_subactivity_id" required
size="sm" />
required
></f-select>
</div> </div>
</div> </div>
</ui-box> </ui-box>
<ui-box heading="Prävention"> <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 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"> <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> <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> </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> <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> </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> <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> </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> <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> </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> <div>
<f-text <f-text v-if="inner.without_education_at !== null"
v-if="inner.without_education_at !== null" id="without_education_at"
id="without_education_at" v-model="inner.without_education_at"
v-model="inner.without_education_at" name="without_education_at"
name="without_education_at" type="date"
type="date" label="am"
label="am" size="sm"
size="sm" />
></f-text>
</div> </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> <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> </div>
<div class="grid gap-1"> <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_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> <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> <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"></f-switch> <f-switch id="multiply_more_pv" v-model="inner.multiply_more_pv" name="multiply_more_pv" label="Multiplikator*in Vertiefungsschulung" size="sm" />
</div> </div>
</div> </div>
</ui-box> </ui-box>
@ -162,7 +159,7 @@ export default {
methods: { methods: {
submit() { 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() { resync() {
this.$inertia.get(`/member/${this.inner.id}/resync`); this.$inertia.get(`/member/${this.inner.id}/resync`);

View File

@ -22,9 +22,9 @@
<member-filter-fields :model-value="filter" @update:model-value="setFilterObject($event)" /> <member-filter-fields :model-value="filter" @update:model-value="setFilterObject($event)" />
</template> </template>
<template #buttons> <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"> <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> <span class="hidden xl:inline">Exportieren</span>
</button> </button>
</template> </template>
@ -32,7 +32,7 @@
<table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm hidden md:table"> <table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm hidden md:table">
<thead> <thead>
<th></th> <th />
<th>Nachname</th> <th>Nachname</th>
<th>Vorname</th> <th>Vorname</th>
<th class="!hidden 2xl:!table-cell">Ort</th> <th class="!hidden 2xl:!table-cell">Ort</th>
@ -40,26 +40,26 @@
<th class="!hidden xl:!table-cell">Alter</th> <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')" class="!hidden xl:!table-cell">Rechnung</th>
<th v-if="hasModule('bill')">Ausstand</th> <th v-if="hasModule('bill')">Ausstand</th>
<th></th> <th />
</thead> </thead>
<tr v-for="(member, index) in data" :key="index"> <tr v-for="(member, index) in data" :key="index">
<td><ui-age-groups :member="member"></ui-age-groups></td> <td><ui-age-groups :member="member" /></td>
<td v-text="member.lastname"></td> <td v-text="member.lastname" />
<td v-text="member.firstname"></td> <td v-text="member.firstname" />
<td class="!hidden 2xl:!table-cell" v-text="member.full_address"></td> <td class="!hidden 2xl:!table-cell" v-text="member.full_address" />
<td> <td>
<tags :member="member"></tags> <tags :member="member" />
</td> </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"> <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>
<td v-if="hasModule('bill')"> <td v-if="hasModule('bill')">
<ui-label :value="member.pending_payment" fallback="---"></ui-label> <ui-label :value="member.pending_payment" fallback="---" />
</td> </td>
<td> <td>
<actions :member="member" @sidebar="openSidebar($event, member)" @remove="remove(member)"></actions> <actions :member="member" @sidebar="openSidebar($event, member)" @remove="remove(member)" />
</td> </td>
</tr> </tr>
</table> </table>
@ -67,28 +67,28 @@
<div class="md:hidden p-3 grid gap-3"> <div class="md:hidden p-3 grid gap-3">
<ui-box v-for="(member, index) in data" :key="index" class="relative" :heading="member.fullname"> <ui-box v-for="(member, index) in data" :key="index" class="relative" :heading="member.fullname">
<template #in-title> <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> </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"> <div class="flex items-center mt-1 space-x-4">
<tags :member="member"></tags> <tags :member="member" />
<ui-label v-show="hasModule('bill')" class="text-gray-100 block" :value="member.pending_payment" fallback=""></ui-label> <ui-label v-show="hasModule('bill')" class="text-gray-100 block" :value="member.pending_payment" fallback="" />
</div> </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"> <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> </div>
</ui-box> </ui-box>
</div> </div>
<div class="px-6"> <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> </div>
<ui-sidebar v-if="single !== null" @close="closeSidebar"> <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-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-memberships> <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"></member-courses> <member-courses v-if="single.type === 'courses'" :url="single.model.links.course_index" @close="closeSidebar" />
</ui-sidebar> </ui-sidebar>
</page-layout> </page-layout>
</template> </template>
@ -107,7 +107,7 @@ const single = ref(null);
const deleting = ref(null); const deleting = ref(null);
const props = defineProps(indexProps); 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() { function exportMembers() {
window.open(`/member-export?filter=${filterString.value}`); window.open(`/member-export?filter=${filterString.value}`);

View File

@ -6,33 +6,31 @@
<ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel"> <ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel">
<form @submit.prevent="submit"> <form @submit.prevent="submit">
<section class="grid grid-cols-2 gap-3 mt-6"> <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-text id="name" v-model="single.name" name="name" label="Bezeichnung" required />
<f-select <f-select id="type"
id="type" :model-value="single.type"
:model-value="single.type" label="Typ"
label="Typ" name="type"
name="type" :options="meta.types"
:options="meta.types" required
required @update:model-value="
@update:model-value=" single = {
single = { ...single,
...single, type: $event,
type: $event, config: {...getType($event).defaults},
config: {...getType($event).defaults}, }
} "
" />
></f-select>
<template v-for="(field, index) in getType(single.type).fields"> <template v-for="(field, index) in getType(single.type).fields">
<f-text <f-text v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'"
v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'" :id="field.key"
:id="field.key" :key="index"
:key="index" v-model="single.config[field.key]"
v-model="single.config[field.key]" :label="field.label"
:label="field.label" :type="field.type"
:type="field.type" :name="field.key"
:name="field.key" required
required />
></f-text>
</template> </template>
</section> </section>
<section class="flex mt-4 space-x-2"> <section class="flex mt-4 space-x-2">
@ -52,23 +50,22 @@
</thead> </thead>
<tr v-for="(connection, index) in data" :key="index"> <tr v-for="(connection, index) in data" :key="index">
<td v-text="connection.name"></td> <td v-text="connection.name" />
<td v-text="connection.type_human"></td> <td v-text="connection.type_human" />
<td> <td>
<ui-boolean-display <ui-boolean-display :value="connection.is_active"
:value="connection.is_active" long-label="Verbindungsstatus"
long-label="Verbindungsstatus" :label="connection.is_active ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'"
:label="connection.is_active ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'" />
></ui-boolean-display>
</td> </td>
<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> </td>
</tr> </tr>
</table> </table>
<div class="px-6"> <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>
</div> </div>
</setting-layout> </setting-layout>

View File

@ -6,33 +6,31 @@
<ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel"> <ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel">
<form @submit.prevent="submit"> <form @submit.prevent="submit">
<section class="grid grid-cols-2 gap-3 mt-6"> <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="name" v-model="single.name" label="Bezeichnung" required />
<f-text id="domain" v-model="single.domain" label="Domain" required></f-text> <f-text id="domain" v-model="single.domain" label="Domain" required />
<f-select <f-select id="type"
id="type" :model-value="single.type.cls"
:model-value="single.type.cls" label="Typ"
label="Typ" name="type"
name="type" :options="meta.types"
:options="meta.types" :placeholder="''"
:placeholder="''" required
required @update:model-value="
@update:model-value=" single.type = {
single.type = { cls: $event,
cls: $event, params: {...getType($event).defaults},
params: {...getType($event).defaults}, }
} "
" />
></f-select>
<template v-for="(field, index) in getType(single.type.cls).fields"> <template v-for="(field, index) in getType(single.type.cls).fields">
<f-text <f-text v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'"
v-if="field.type === 'text' || field.type === 'password' || field.type === 'email'" :id="field.name"
:id="field.name" :key="index"
:key="index" v-model="single.type.params[field.name]"
v-model="single.type.params[field.name]" :label="field.label"
:label="field.label" :type="field.type"
:type="field.type" :required="field.is_required"
:required="field.is_required" />
></f-text>
</template> </template>
</section> </section>
<section class="flex mt-4 space-x-2"> <section class="flex mt-4 space-x-2">
@ -53,24 +51,23 @@
</thead> </thead>
<tr v-for="(gateway, index) in data" :key="index"> <tr v-for="(gateway, index) in data" :key="index">
<td v-text="gateway.name"></td> <td v-text="gateway.name" />
<td v-text="gateway.domain"></td> <td v-text="gateway.domain" />
<td v-text="gateway.type_human"></td> <td v-text="gateway.type_human" />
<td> <td>
<ui-boolean-display <ui-boolean-display :value="gateway.works"
:value="gateway.works" long-label="Verbindungsstatus"
long-label="Verbindungsstatus" :label="gateway.works ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'"
:label="gateway.works ? 'Verbindung erfolgreich' : 'Verbindung fehlgeschlagen'" />
></ui-boolean-display>
</td> </td>
<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> </td>
</tr> </tr>
</table> </table>
<div class="px-6"> <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>
</div> </div>
</setting-layout> </setting-layout>