139 lines
4.8 KiB
Vue
139 lines
4.8 KiB
Vue
<script setup>
|
|
import DialogModal from '@/Components/DialogModal.vue';
|
|
import InputLabel from '@/Components/InputLabel.vue';
|
|
import PrimaryButton from '@/Components/PrimaryButton.vue';
|
|
import SectionTitle from '@/Components/SectionTitle.vue';
|
|
import TextInput from '@/Components/TextInput.vue';
|
|
import axios from 'axios';
|
|
import { inject, onMounted, ref } from 'vue';
|
|
import InputError from './InputError.vue';
|
|
|
|
const props = defineProps({
|
|
show: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
person: Object
|
|
});
|
|
|
|
const processingUpdate = ref(false);
|
|
const errors = ref({});
|
|
|
|
const emit = defineEmits(['close']);
|
|
|
|
const close = () => {
|
|
emit('close');
|
|
|
|
setTimeout(() => {
|
|
errors.value = {};
|
|
}, 500);
|
|
}
|
|
|
|
const form = ref({
|
|
full_name: props.person.full_name,
|
|
tax_number: props.person.tax_number,
|
|
social_security_number: props.person.social_security_number,
|
|
description: props.person.description
|
|
});
|
|
|
|
const updatePerson = () => {
|
|
processingUpdate.value = true;
|
|
errors.value = {};
|
|
|
|
axios({
|
|
method: 'put',
|
|
url: route('person.update', props.person ),
|
|
data: form.value
|
|
}).then((response) => {
|
|
|
|
props.person.full_name = response.data.person.full_name;
|
|
props.person.tax_number = response.data.person.tax_number;
|
|
props.person.social_security_number = response.data.person.social_security_number;
|
|
props.person.description = response.data.person.description;
|
|
|
|
processingUpdate.value = false;
|
|
close();
|
|
}).catch((reason) => {
|
|
console.log(reason.response.data);
|
|
errors.value = reason.response.data.errors;
|
|
processingUpdate.value = false;
|
|
});
|
|
}
|
|
|
|
</script>
|
|
<template>
|
|
<DialogModal
|
|
:show="show"
|
|
@close="close"
|
|
>
|
|
<template #title>Posodobi {{ person.full_name }}</template>
|
|
<template #content>
|
|
<form @submit.prevent="updatePerson">
|
|
<SectionTitle class="border-b mb-4">
|
|
<template #title>
|
|
Oseba
|
|
</template>
|
|
</SectionTitle>
|
|
|
|
<div class="col-span-6 sm:col-span-4">
|
|
<InputLabel for="cfulname" value="Naziv" />
|
|
<TextInput
|
|
id="cfullname"
|
|
ref="cfullnameInput"
|
|
v-model="form.full_name"
|
|
type="text"
|
|
class="mt-1 block w-full"
|
|
autocomplete="full-name"
|
|
/>
|
|
<InputError v-if="errors.full_name !== undefined" v-for="err in errors.full_name" :message="err" />
|
|
</div>
|
|
|
|
<div class="col-span-6 sm:col-span-4">
|
|
<InputLabel for="ctaxnumber" value="Davčna" />
|
|
<TextInput
|
|
id="ctaxnumber"
|
|
ref="ctaxnumberInput"
|
|
v-model="form.tax_number"
|
|
type="text"
|
|
class="mt-1 block w-full"
|
|
autocomplete="tax-number"
|
|
/>
|
|
<InputError v-if="errors.tax_number !== undefined" v-for="err in errors.tax_number" :message="err" />
|
|
</div>
|
|
|
|
<div class="col-span-6 sm:col-span-4">
|
|
<InputLabel for="csocialSecurityNumber" value="Matična / Emšo" />
|
|
<TextInput
|
|
id="csocialSecurityNumber"
|
|
ref="csocialSecurityNumberInput"
|
|
v-model="form.social_security_number"
|
|
type="text"
|
|
class="mt-1 block w-full"
|
|
autocomplete="social-security-number"
|
|
/>
|
|
<InputError v-if="errors.social_security_number !== undefined" v-for="err in errors.social_security_number" :message="err" />
|
|
</div>
|
|
|
|
<div class="col-span-6 sm:col-span-4">
|
|
<InputLabel for="cdescription" value="Opis"/>
|
|
<TextInput
|
|
id="cdescription"
|
|
ref="cdescriptionInput"
|
|
v-model="form.description"
|
|
type="text"
|
|
class="mt-1 block w-full"
|
|
autocomplete="description"
|
|
/>
|
|
<InputError v-if="errors.description !== undefined" v-for="err in errors.description" :message="err" />
|
|
</div>
|
|
|
|
<div class="flex justify-end mt-4">
|
|
|
|
<PrimaryButton :class="{ 'opacity-25': processingUpdate }" :disabled="processingUpdate">
|
|
Shrani
|
|
</PrimaryButton>
|
|
</div>
|
|
</form>
|
|
</template>
|
|
</DialogModal>
|
|
</template> |