adrema/resources/js/views/member/VForm.vue

335 lines
14 KiB
Vue

<template>
<form class="flex grow relative" id="memberedit" @submit.prevent="submit">
<save-button form="memberedit"></save-button>
<popup heading="Ein Konflikt ist aufgetreten" v-if="conflict === true">
<div>
<p class="mt-4">
Dieses Mitglied wurde vorher bereits aktualisiert. Daher könnte ein Update zu Datenverlust führen.
</p>
<p class="mt-2">
Wir empfehlen, die Daten aus NaMi zunächst neu zu synchronisieren und dann die Änderungen hier in
der Adrema erneut vorzunehmen.
</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a href="#" @click.prevent="resync" class="text-center btn btn-primary">Neu synchronisieren</a>
<a href="#" @click.prevent="forceWrite" class="text-center btn btn-danger">Änderungen schreiben</a>
</div>
</div>
</popup>
<!-- ***************************** Hauptbereich ****************************** -->
<div class="grow grid md:grid-cols-2 gap-3 p-3">
<box heading="Stammdaten">
<div class="grid sm:grid-cols-2 gap-3">
<f-select
id="gender_id"
name="gender_id"
:options="genders"
v-model="inner.gender_id"
label="Geschlecht"
size="sm"
></f-select>
<f-select
:options="nationalities"
id="nationality_id"
v-model="inner.nationality_id"
label="Staatsangehörigkeit"
name="nationality_id"
size="sm"
required
></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" required></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" required></f-text>
<f-text id="location" v-model="inner.location" size="sm" label="Ort" required></f-text>
<f-text
type="date"
id="birthday"
v-model="inner.birthday"
size="sm"
label="Geburtsdatum"
required
></f-text>
<f-select
:options="regions"
name="region_id"
id="region_id"
v-model="inner.region_id"
label="Bundesland"
size="sm"
></f-select>
<f-select
:options="countries"
id="country_id"
v-model="inner.country_id"
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>
</div>
</box>
<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
class="sm:col-span-2"
rows="3"
id="letter_address"
v-model="inner.letter_address"
label="Brief-Adresse"
size="sm"
></f-textarea>
</div>
</box>
<box heading="System">
<div class="grid gap-3">
<f-select
:options="billKinds"
id="bill_kind_id"
v-model="inner.bill_kind_id"
label="Rechnung versenden über"
name="bill_kind_id"
size="sm"
></f-select>
<f-select
:options="subscriptions"
id="subscription_id"
v-model="inner.subscription_id"
label="Beitrag"
name="subscription_id"
size="sm"
></f-select>
<f-switch id="has_nami" size="sm" v-model="inner.has_nami" label="In Nami eintragen"></f-switch>
<f-switch
id="send_newspaper"
v-model="inner.send_newspaper"
label="Mittendrin versenden"
size="sm"
></f-switch>
<f-text
class="sm:col-span-2"
type="date"
id="joined_at"
v-model="inner.joined_at"
label="Eintrittsdatum"
size="sm"
></f-text>
<div class="contents" v-if="mode === 'create'">
<f-select
:options="activities"
id="first_activity_id"
v-model="inner.first_activity_id"
label="Erste Tätigkeit"
name="first_activity_id"
size="sm"
required
></f-select>
<f-select
v-if="inner.first_activity_id"
:options="subactivities[inner.first_activity_id]"
id="first_subactivity_id"
v-model="inner.first_subactivity_id"
label="Erste Untertätigkeit"
name="first_subactivity_id"
size="sm"
required
></f-select>
</div>
</div>
</box>
<box heading="Prävention">
<div class="grid sm:grid-cols-[max-content_1fr] gap-2">
<div class="grid grid-cols-[max-content_5rem] gap-1">
<f-switch id="has_efz" v-model="hasEfz" size="sm" label="Führungszeugnis eingesehen"></f-switch>
<div>
<f-text
v-if="inner.efz !== null"
type="date"
id="efz"
v-model="inner.efz"
label="am"
size="sm"
></f-text>
</div>
<f-switch id="has_ps" v-model="hasPs" size="sm" label="Hat Präventionsschulung"></f-switch>
<div>
<f-text
v-if="inner.ps_at !== null"
type="date"
id="ps_at"
v-model="inner.ps_at"
label="am"
size="sm"
></f-text>
</div>
<f-switch
id="has_more_ps"
v-model="hasMorePs"
size="sm"
label="Hat Vertierungsschulung"
></f-switch>
<div>
<f-text
v-if="inner.more_ps_at !== null"
type="date"
id="more_ps_at"
v-model="inner.more_ps_at"
label="am"
size="sm"
></f-text>
</div>
<f-switch
id="has_without_education"
v-model="hasWithoutEducation"
label="Einsatz ohne Schulung"
size="sm"
></f-switch>
<div>
<f-text
v-if="inner.without_education_at !== null"
type="date"
id="without_education_at"
v-model="inner.without_education_at"
label="am"
size="sm"
></f-text>
</div>
<f-switch
id="has_without_efz"
size="sm"
v-model="hasWithoutEfz"
label="Einsatz ohne EFZ"
></f-switch>
<div>
<f-text
v-if="inner.without_efz_at !== null"
type="date"
id="without_efz_at"
v-model="inner.without_efz_at"
label="am"
size="sm"
></f-text>
</div>
</div>
<div class="grid gap-1">
<f-switch id="has_svk" size="sm" v-model="inner.has_svk" label="SVK unterschrieben"></f-switch>
<f-switch
id="has_vk"
size="sm"
v-model="inner.has_vk"
label="Verhaltenskodex unterschrieben"
></f-switch>
<f-switch
id="multiply_pv"
v-model="inner.multiply_pv"
label="Multiplikator*in Präventionsschulung"
size="sm"
></f-switch>
<f-switch
id="multiply_more_pv"
v-model="inner.multiply_more_pv"
label="Multiplikator*in Vertierungsschulung"
size="sm"
></f-switch>
</div>
</div>
</box>
</div>
</form>
</template>
<script>
function issetComputed(val) {
return {
set(v) {
this.inner[val] = v ? '' : null;
},
get() {
return this.inner[val] !== null;
},
};
}
export default {
data: function () {
return {
inner: {},
active: 0,
};
},
props: {
subactivities: {},
activities: {},
mode: {},
genders: {},
subscriptions: {},
data: {},
regions: {},
countries: {},
nationalities: {},
confessions: {},
billKinds: {},
conflict: {},
},
methods: {
submit() {
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`);
},
forceWrite() {},
},
components: {
popup: () => import('../../components/Popup.vue'),
},
computed: {
hasEfz: issetComputed('efz'),
hasPs: issetComputed('ps_at'),
hasMorePs: issetComputed('more_ps_at'),
hasWithoutEfz: issetComputed('without_efz_at'),
hasWithoutEducation: issetComputed('without_education_at'),
},
created() {
this.inner = this.data;
},
};
</script>