Lots of changes

2024-11-13 22:11:07 +01:00
parent 90a5858320
commit 953ff38d64
76 changed files with 2822 additions and 427 deletions
@@ -0,0 +1,102 @@
+<script setup>
+import ActionMessage from '@/Components/ActionMessage.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 { useForm } from '@inertiajs/vue3';
+
+const props = defineProps({
+    client_case: Object,
+    show: {
+        type: Boolean,
+        default: false
+    },
+    types: Array
+});
+
+console.log(props.types);
+
+const emit = defineEmits(['close']);
+
+const close = () => {
+    emit('close');
+}
+
+//store contract
+const formContract = useForm({
+    client_case_uuid: props.client_case.uuid,
+    reference: '',
+    start_date: new Date().toISOString(),
+    type_id: props.types[0].id
+});
+
+const storeContract = () => {
+    formContract.post(route('clientCase.contract.store', props.client_case), {
+        onBefore: () => {
+            formContract.start_date = formContract.start_date;
+        },
+        onSuccess: () => {
+            close();
+            formContract.reset();
+        },
+        preserveScroll: true
+    });
+}
+
+</script>
+
+<template>
+    <Drawer
+        :show="show"
+        @close="close"
+    >
+        <template #title>Add contract</template>
+        <template #content>
+            <form @submit.prevent="storeContract">
+                <SectionTitle class="mt-4 border-b mb-4">
+                    <template #title>
+                        Contract
+                    </template>
+                </SectionTitle>
+                <div class="col-span-6 sm:col-span-4">
+                    <InputLabel for="contractRef" value="Reference"/>
+                    <TextInput
+                        id="contractRef"
+                        ref="contractRefInput"
+                        v-model="formContract.reference"
+                        type="text"
+                        class="mt-1 block w-full"
+                        autocomplete="contract-reference"
+                    />
+                </div>
+                <div class="col-span-6 sm:col-span-4">
+                    <InputLabel for="contractStartDate" value="Start date"/>
+                    <vue-date-picker id="contractStartDate" :enable-time-picker="false" format="dd.MM.yyyy" class="mt-1 block w-full" v-model="formContract.start_date"></vue-date-picker>
+                </div>
+                <div class="col-span-6 sm:col-span-4">
+                    <InputLabel for="contractTypeSelect" value="Contract type"/>
+                    <select 
+                        class="block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm"
+                        id="contractTypeSelect"
+                        v-model="formContract.type_id"
+                    >
+                        <option v-for="t in types" :value="t.id">{{ t.name }}</option>
+                    <!-- ... -->
+                    </select>
+                </div>
+                <div class="flex justify-end mt-4">
+                    <ActionMessage :on="formContract.recentlySuccessful" class="me-3">
+                        Saved.
+                    </ActionMessage>
+
+                    <PrimaryButton :class="{ 'opacity-25': formContract.processing }" :disabled="formContract.processing">
+                        Save
+                    </PrimaryButton>
+                </div>
+            </form>
+        </template>
+    </Drawer>
+    
+</template>