Last commit before showcase.

This commit is contained in:
Simon Pocrnjič
2024-11-14 21:02:10 +01:00
parent 953ff38d64
commit ad8b3c07e1
16 changed files with 302 additions and 143 deletions
+87 -36
View File
@@ -23,11 +23,21 @@ const Address = {
type_id: 1
};
const Phone = {
nu: '',
country_code: '00386',
type_id: 1
}
const formClient = useForm({
first_name: '',
last_name: '',
full_name: '',
address: Address
tax_number: '',
social_security_number: '',
description: '',
address: Address,
phone: Phone
});
//Create client drawer
@@ -72,7 +82,7 @@ const storeClient = () => {
<AppLayout title="Client">
<template #header>
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
Clients
Naročniki
</h2>
</template>
<div class="py-12">
@@ -80,7 +90,7 @@ const storeClient = () => {
<div class="px-3 bg-white overflow-hidden shadow-xl sm:rounded-lg">
<div class="mx-auto max-w-4x1 py-3">
<div class="flex justify-between">
<PrimaryButton @click="openDrawerCreateClient" class="bg-blue-400">Add client</PrimaryButton>
<PrimaryButton @click="openDrawerCreateClient" class="bg-blue-400">Dodaj</PrimaryButton>
<SearchInput :options="search" />
</div>
<List class="mt-2">
@@ -95,7 +105,7 @@ const storeClient = () => {
<div class="hidden shrink-0 sm:flex sm:flex-col sm:items-end">
<p class="text-sm leading-6 text-gray-900">{{ client.person.tax_number }}</p>
<div class="mt-1 flex items-center gap-x-1.5">
<p class="text-xs leading-5 text-gray-500">Client</p>
<p class="text-xs leading-5 text-gray-500">Naročnik</p>
</div>
</div>
</div>
@@ -111,36 +121,13 @@ const storeClient = () => {
:show="drawerCreateClient"
@close="drawerCreateClient = false"
>
<template #title>Add client</template>
<template #title>Novi naročnik</template>
<template #content>
<form @submit.prevent="storeClient">
<div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="firstname" value="First name"/>
<TextInput
id="firstname"
ref="firstnameInput"
v-model="formClient.first_name"
type="text"
class="mt-1 block w-full"
autocomplete="first-name"
/>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="lastname" value="Last name"/>
<TextInput
id="lastname"
ref="lastnameInput"
v-model="formClient.last_name"
type="text"
class="mt-1 block w-full"
autocomplete="last-name"
/>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="fullname" value="Full name"/>
<InputLabel for="fullname" value="Naziv"/>
<TextInput
id="fullname"
ref="fullnameInput"
@@ -152,7 +139,31 @@ const storeClient = () => {
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="address" value="Address"/>
<InputLabel for="taxnumber" value="Davčna"/>
<TextInput
id="taxnumber"
ref="taxnumberInput"
v-model="formClient.tax_number"
type="text"
class="mt-1 block w-full"
autocomplete="tax-number"
/>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="socialSecurityNumber" value="Matična / Emšo"/>
<TextInput
id="socialSecurityNumber"
ref="socialSecurityNumberInput"
v-model="formClient.social_security_number"
type="text"
class="mt-1 block w-full"
autocomplete="social-security-number"
/>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="address" value="Naslov"/>
<TextInput
id="address"
ref="addressInput"
@@ -164,7 +175,7 @@ const storeClient = () => {
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="addressCountry" value="Country"/>
<InputLabel for="addressCountry" value="Država"/>
<TextInput
id="addressCountry"
ref="addressCountryInput"
@@ -176,25 +187,65 @@ const storeClient = () => {
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="addressType" value="Address type"/>
<InputLabel for="addressType" value="Vrsta naslova"/>
<select
class="block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm"
id="addressType"
v-model="formClient.address.type_id"
>
<option value="1">Permanent</option>
<option value="2">Temporary</option>
<option value="1">Stalni</option>
<option value="2">Začasni</option>
<!-- ... -->
</select>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="phoneCountyCode" value="Koda države tel."/>
<select
class="block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm"
id="phoneCountyCode"
v-model="formClient.phone.country_code"
>
<option value="00386">+386 (Slovenija)</option>
<option value="00385">+385 (Hrvaška)</option>
<option value="0039">+39 (Italija)</option>
<option value="0036">+39 (Madžarska)</option>
<option value="0043">+43 (Avstrija)</option>
<option value="00381">+381 (Srbija)</option>
<option value="00387">+387 (Bosna in Hercegovina)</option>
<option value="00382">+382 (Črna gora)</option>
<!-- ... -->
</select>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="phoneNu" value="Telefonska št."/>
<TextInput
id="phoneNu"
ref="phoneNuInput"
v-model="formClient.phone.nu"
type="text"
class="mt-1 block w-full"
autocomplete="phone-nu"
/>
</div>
<div class="col-span-6 sm:col-span-4">
<InputLabel for="description" value="Opis"/>
<TextInput
id="description"
ref="descriptionInput"
v-model="formClient.description"
type="text"
class="mt-1 block w-full"
autocomplete="description"
/>
</div>
</div>
<div class="flex justify-end mt-4">
<ActionMessage :on="formClient.recentlySuccessful" class="me-3">
Saved.
Shranjeno.
</ActionMessage>
<PrimaryButton :class="{ 'opacity-25': formClient.processing }" :disabled="formClient.processing">
Save
Shrani
</PrimaryButton>
</div>
</form>