automngr/resources/js/Pages/Contracts/Create.vue

88 lines
3.1 KiB
Vue

<template>
<layout>
<template #header>
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
<bread-crumb v-if="!car.id && !contact.id" text="Verträge" :href="route('dashboard')" />
<bread-crumb v-if="car.id && !contact.id" text="Autos" :href="route('cars')" />
<bread-crumb v-if="car.id && !contact.id" :text="car.name" :href="route('cars.show', car.id)" />
<bread-crumb v-if="!car.id && contact.id" text="Kontakte" :href="route('contacts')" />
<bread-crumb v-if="!car.id && contact.id" :text="contact.name" :href="route('contacts.show', contact.id)" />
Neuen {{ contractType }} erstellen
</h2>
</template>
<div>
<contact-create-or-select v-if="contact.id" class="mb-5" @contact-id-change="updateContactId" :existing_contact="contact" :contacts="contacts" :type="data.type" />
<car-create-or-select @car-id-change="updateCarId" :existing_car="car" :cars="cars" :brands="brands" :type="data.type" />
<contact-create-or-select v-if="!contact.id" class="mt-5" @contact-id-change="updateContactId" :existing_contact="contact" :contacts="contacts" :type="data.type" />
<contract-form class="mt-5" :data="data" :meta="meta" :insurance_types="insurance_types">
<template #title>Vertragsinformationen erfassen</template>
<template #description>Der Vertrag kann anschliessend gespeichert werden.</template>
</contract-form>
</div>
</layout>
</template>
<script>
import Layout from '@/Layouts/Layout';
import BreadCrumb from '@/Components/BreadCrumb.vue';
import ContactCreateOrSelect from '@/Components/Contacts/CreateOrSelect.vue';
import CarCreateOrSelect from '@/Components/Cars/CreateOrSelect.vue';
import ContractForm from './Components/ContractForm.vue';
export default {
components: {
Layout,
BreadCrumb,
ContractForm,
ContactCreateOrSelect,
CarCreateOrSelect,
},
props: {
car: Object,
contact: Object,
type: String,
insurance_types: Array,
contacts: Array,
cars: Array,
brands: Array,
},
data() {
return {
meta: {
form_name: 'CreateContract',
route: this.route('contracts.store'),
method: 'post',
button_text: 'Vertrag speichern',
on_success: 'Vertrag gespeichert',
},
data: {
id: null,
date: new Date().toJSON().slice(0,10).split('-').reverse().join('.'),
delivery_date: new Date().toJSON().slice(0,10).split('-').reverse().join('.'),
price: null,
notes: null,
type: this.type,
insurance_type: '1',
car_id: this.car?.id ?? null,
contact_id: this.contact?.id ?? null,
amount: null,
payment_type: '1',
},
};
},
computed: {
contractType() {
return this.data.type === '1' ? 'Verkaufsvertrag' : 'Ankaufsvertrag';
},
},
methods: {
updateContactId(val) {
this.data.contact_id = parseInt(val);
},
updateCarId(val) {
this.data.car_id = parseInt(val);
},
},
};
</script>