Changes

resources/js/Components/PersonInfo/PhoneCreateForm.vue

@@ -6,12 +6,7 @@ import * as z from "zod";
 import { router } from "@inertiajs/vue3";
 import CreateDialog from "../Dialogs/CreateDialog.vue";
 import SectionTitle from "../SectionTitle.vue";
-import {
-  FormControl,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from "@/Components/ui/form";
+import { FormControl, FormItem, FormLabel, FormMessage } from "@/Components/ui/form";
 import { Input } from "@/Components/ui/input";
 import {
   Select,
@@ -101,29 +96,25 @@ const create = async () => {
   processing.value = true;
   const { values } = form;
 
-  router.post(
-    route("person.phone.create", props.person),
-    values,
-    {
-      preserveScroll: true,
-      onSuccess: () => {
-        close();
-        resetForm();
-      },
-      onError: (errors) => {
-        Object.keys(errors).forEach((field) => {
-          const errorMessages = Array.isArray(errors[field])
-            ? errors[field]
-            : [errors[field]];
-          form.setFieldError(field, errorMessages[0]);
-        });
-        processing.value = false;
-      },
-      onFinish: () => {
-        processing.value = false;
-      },
-    }
-  );
+  router.post(route("person.phone.create", props.person), values, {
+    preserveScroll: true,
+    onSuccess: () => {
+      close();
+      resetForm();
+    },
+    onError: (errors) => {
+      Object.keys(errors).forEach((field) => {
+        const errorMessages = Array.isArray(errors[field])
+          ? errors[field]
+          : [errors[field]];
+        form.setFieldError(field, errorMessages[0]);
+      });
+      processing.value = false;
+    },
+    onFinish: () => {
+      processing.value = false;
+    },
+  });
 };
 
 const onSubmit = form.handleSubmit(() => {
@@ -150,7 +141,12 @@ const onSubmit = form.handleSubmit(() => {
           <FormItem>
             <FormLabel>Številka</FormLabel>
             <FormControl>
-              <Input type="text" placeholder="Številka telefona" autocomplete="tel" v-bind="componentField" />
+              <Input
+                type="text"
+                placeholder="Številka telefona"
+                autocomplete="tel"
+                v-bind="componentField"
+              />
             </FormControl>
             <FormMessage />
           </FormItem>
@@ -166,7 +162,11 @@ const onSubmit = form.handleSubmit(() => {
                 </SelectTrigger>
               </FormControl>
               <SelectContent>
-                <SelectItem v-for="option in countryOptions" :key="option.value" :value="option.value">
+                <SelectItem
+                  v-for="option in countryOptions"
+                  :key="option.value"
+                  :value="option.value"
+                >
                   {{ option.label }}
                 </SelectItem>
               </SelectContent>
@@ -204,7 +204,11 @@ const onSubmit = form.handleSubmit(() => {
                 </SelectTrigger>
               </FormControl>
               <SelectContent>
-                <SelectItem v-for="option in phoneTypeOptions" :key="option.value" :value="option.value">
+                <SelectItem
+                  v-for="option in phoneTypeOptions"
+                  :key="option.value"
+                  :value="option.value"
+                >
                   {{ option.label }}
                 </SelectItem>
               </SelectContent>
@@ -213,6 +217,16 @@ const onSubmit = form.handleSubmit(() => {
           </FormItem>
         </FormField>
 
+        <FormField v-slot="{ componentField }" name="description">
+          <FormItem>
+            <FormLabel>Opis</FormLabel>
+            <FormControl>
+              <Input type="text" placeholder="Opis" v-bind="componentField" />
+            </FormControl>
+            <FormMessage />
+          </FormItem>
+        </FormField>
+
         <FormField v-slot="{ value, handleChange }" name="validated">
           <FormItem class="flex flex-row items-start space-x-3 space-y-0">
             <FormControl>