Update to laravel 12, other changes.

resources/js/Pages/Cases/Partials/ActivityDrawer.vue

@@ -1,10 +1,12 @@
 <script setup>
 import ActionMessage from '@/Components/ActionMessage.vue';
+import BasicButton from '@/Components/buttons/BasicButton.vue';
 import Drawer from '@/Components/Drawer.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 { PlusIcon } from '@/Utilities/Icons';
 import { useForm } from '@inertiajs/vue3';
 import { FwbTextarea } from 'flowbite-vue';
 import { ref, watch } from 'vue';
@@ -45,6 +47,17 @@ watch(
     }
 );
 
+watch(
+    () => form.due_date,
+    (due_date) => {
+        if (due_date) {
+            let date = new Date(form.due_date).toISOString().split('T')[0];
+            console.table({old: due_date, new: date});
+        }
+        
+    }
+);
+
 const store = () => {
     console.table({ 
         due_date: form.due_date,
@@ -55,13 +68,19 @@ const store = () => {
     });
     form.post(route('clientCase.activity.store', props.client_case), {
         onBefore: () => {
-            if(form.due_date !== null || form.due_date !== '') {
-                form.due_date = new Date(form.due_date).toISOString();
+            if(form.due_date) {
+                form.due_date = new Date(form.due_date).toISOString().split('T')[0];
             }
-        },
+        }, 
         onSuccess: () => {
             close();
             form.reset();
+        },
+        onError: (errors) => {
+            console.log('Validation or server error:', errors);
+        },
+        onFinish: () => {
+            console.log('Request finished processing.')
         }
     });
 }
@@ -75,32 +94,6 @@ const store = () => {
         <template #title>Dodaj aktivnost</template>
         <template #content>
             <form @submit.prevent="store">
-                <SectionTitle class="mt-4 border-b mb-4">
-                    <template #title>
-                        Aktivnost
-                    </template>
-                </SectionTitle>
-                <div class="col-span-6 sm:col-span-4">
-                    <InputLabel for="activityDueDate" value="Datum zapadlosti"/>
-                    <vue-date-picker 
-                        id="activityDueDate" 
-                        :enable-time-picker="false" 
-                        format="dd.MM.yyyy" 
-                        class="mt-1 block w-full" 
-                        v-model="form.due_date" 
-                    />
-                </div>
-                <div class="col-span-6 sm:col-span-4">
-                    <InputLabel for="activityAmount" value="Znesek"/>
-                    <TextInput
-                        id="activityAmount"
-                        ref="activityAmountinput"
-                        v-model="form.amount"
-                        type="number"
-                        class="mt-1 block w-full"
-                        autocomplete="0.00"
-                    />
-                </div>
                 <div class="col-span-6 sm:col-span-4">
                     <InputLabel for="activityAction" value="Akcija"/>
                     <select 
@@ -134,14 +127,37 @@ const store = () => {
                         class="block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm"
                     />
                 </div>
+                <div class="col-span-6 sm:col-span-4">
+                    <InputLabel for="activityDueDate" value="Datum zapadlosti"/>
+                    <vue-date-picker 
+                        id="activityDueDate" 
+                        :enable-time-picker="false" 
+                        format="dd.MM.yyyy" 
+                        class="mt-1 block w-full" 
+                        v-model="form.due_date" 
+                    />
+                </div>
+                <div class="col-span-6 sm:col-span-4">
+                    <InputLabel for="activityAmount" value="Znesek"/>
+                    <TextInput
+                        id="activityAmount"
+                        ref="activityAmountinput"
+                        v-model="form.amount"
+                        type="number"
+                        class="mt-1 block w-full"
+                        autocomplete="0.00"
+                    />
+                </div>
                 <div class="flex justify-end mt-4">
                     <ActionMessage :on="form.recentlySuccessful" class="me-3">
-                        Saved.
+                        Shranjuje.
                     </ActionMessage>
-
-                    <PrimaryButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
-                        Save
-                    </PrimaryButton>
+                    <BasicButton 
+                        :class="{ 'opacity-25': form.processing }"
+                        :disabled="form.processing"
+                    >
+                        Shrani
+                    </BasicButton>
                 </div>
             </form>
         </template>

resources/js/Pages/Cases/Partials/ActivityTable.vue

@@ -23,7 +23,7 @@ const createBody = (data) => {
 
     data.forEach((p) => {
         const createdDate =  new Date(p.created_at).toLocaleDateString('de');
-        const dueDate = (p.due_date === null) ? new Date().toLocaleDateString('de') : null;
+        const dueDate = (p.due_date) ? new Date().toLocaleDateString('de') : null;
 
         const cols = [
             C_TD.make(createdDate, 'body' ),