Lots of changes
This commit is contained in:
Simon Pocrnjič
@@ -0,0 +1,175 @@
|
||||
<script setup>
|
||||
import PersonInfoGrid from '@/Components/PersonInfoGrid.vue';
|
||||
import SectionTitle from '@/Components/SectionTitle.vue';
|
||||
import AppLayout from '@/Layouts/AppLayout.vue';
|
||||
import { Link, useForm } from '@inertiajs/vue3';
|
||||
import { FwbA, FwbButton } from 'flowbite-vue';
|
||||
import { ref } from 'vue';
|
||||
import ContractDrawer from './Partials/ContractDrawer.vue';
|
||||
import ContractTable from './Partials/ContractTable.vue';
|
||||
import ActivityDrawer from './Partials/ActivityDrawer.vue';
|
||||
import ActivityTable from './Partials/ActivityTable.vue';
|
||||
|
||||
const props = defineProps({
|
||||
client: Object,
|
||||
client_case: Object,
|
||||
contracts: Array,
|
||||
activities: Object,
|
||||
contract_types: Array,
|
||||
actions: Array
|
||||
});
|
||||
|
||||
console.log(props.actions);
|
||||
|
||||
//Client and case person info card
|
||||
const clientMainAddress = props.client.person.addresses.filter( a => a.type.id === 1 )[0] ?? '';
|
||||
const personMainAddress = props.client_case.person.addresses.filter( a => a.type.id === 1 )[0] ?? '';
|
||||
|
||||
const clientInfo = new Object({
|
||||
nu: props.client.person.nu,
|
||||
full_name: props.client.person.full_name,
|
||||
main_address: (clientMainAddress.country !== '') ? `${clientMainAddress.address} - ${clientMainAddress.country}` : clientMainAddress.address,
|
||||
tax_number: props.client.person.tax_number,
|
||||
social_security_number: props.client.person.social_security_number,
|
||||
description: props.client.person.description
|
||||
});
|
||||
|
||||
const casePersonInfo = new Object({
|
||||
nu: props.client_case.person.nu,
|
||||
full_name: props.client_case.person.full_name,
|
||||
main_address: (personMainAddress.country !== '') ? `${personMainAddress.address} - ${personMainAddress.country}` : personMainAddress.address,
|
||||
tax_number: props.client_case.person.tax_number,
|
||||
social_security_number: props.client_case.person.social_security_number,
|
||||
description: props.client_case.person.description
|
||||
});
|
||||
|
||||
//Drawer add new contract
|
||||
|
||||
const drawerCreateContract = ref(false);
|
||||
|
||||
const openDrawerCreateContract = () => {
|
||||
drawerCreateContract.value = true;
|
||||
}
|
||||
|
||||
//Drawer add new activity
|
||||
|
||||
const drawerAddActivity = ref(false);
|
||||
|
||||
const openDrawerAddActivity = () => {
|
||||
drawerAddActivity.value = true;
|
||||
}
|
||||
|
||||
//Close drawer (all)
|
||||
const closeDrawer = () => {
|
||||
drawerCreateContract.value = false;
|
||||
drawerAddActivity.value = false;
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<AppLayout title="Client case">
|
||||
<template #header></template>
|
||||
<div class="pt-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg border-l-4 border-blue-400">
|
||||
<div class="mx-auto max-w-4x1 p-3">
|
||||
<SectionTitle>
|
||||
<template #title>
|
||||
<FwbA class= "hover:text-blue-500" :href="route('client.show', client)">
|
||||
Client
|
||||
</FwbA>
|
||||
</template>
|
||||
|
||||
</SectionTitle>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-1">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg border-l-4 border-blue-400">
|
||||
<div class="mx-auto max-w-4x1 p-3">
|
||||
<PersonInfoGrid :person="clientInfo" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg border-l-4 border-red-400">
|
||||
<div class="mx-auto max-w-4x1 p-3">
|
||||
<SectionTitle>
|
||||
<template #title>
|
||||
Case
|
||||
</template>
|
||||
|
||||
</SectionTitle>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-1">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg border-l-4 border-red-400">
|
||||
<div class="mx-auto max-w-4x1 p-3">
|
||||
<PersonInfoGrid :person="casePersonInfo" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg border-l-4">
|
||||
<div class="mx-auto max-w-4x1">
|
||||
<div class="flex justify-between p-3">
|
||||
<SectionTitle>
|
||||
<template #title>
|
||||
Contracts
|
||||
</template>
|
||||
</SectionTitle>
|
||||
<FwbButton @click="openDrawerCreateContract">Add new</FwbButton>
|
||||
</div>
|
||||
<ContractTable
|
||||
:client_case="client_case"
|
||||
:contracts="contracts"
|
||||
:contract_types="contract_types"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-12 pb-6">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg border-l-4">
|
||||
<div class="mx-auto max-w-4x1">
|
||||
<div class="flex justify-between p-3">
|
||||
<SectionTitle>
|
||||
<template #title>
|
||||
Activities
|
||||
</template>
|
||||
</SectionTitle>
|
||||
<FwbButton @click="openDrawerAddActivity">Add new</FwbButton>
|
||||
</div>
|
||||
<ActivityTable
|
||||
:client_case="client_case"
|
||||
:activities="activities"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppLayout>
|
||||
<ContractDrawer
|
||||
:show="drawerCreateContract"
|
||||
@close="closeDrawer"
|
||||
:types="contract_types"
|
||||
:client_case="client_case"
|
||||
/>
|
||||
<ActivityDrawer
|
||||
:show="drawerAddActivity"
|
||||
@close="closeDrawer"
|
||||
:client_case="client_case"
|
||||
:actions="actions"
|
||||
/>
|
||||
</template>
|
||||
Reference in New Issue
Block a user