Teren-app/resources/js/Pages/Cases/Partials/ContractTable.vue
2024-11-13 22:11:07 +01:00

87 lines
2.5 KiB
Vue

<script setup>
import BasicTable from '@/Components/BasicTable.vue';
import { LinkOptions as C_LINK, TableColumn as C_TD, TableRow as C_TR} from '@/Shared/AppObjects';
const props = defineProps({
client_case: Object,
contract_types: Array,
contracts: Array
});
//Contract table
let tableContractHeader = [
C_TD.make('Ref.', 'header'),
C_TD.make('Start date', 'header'),
C_TD.make('Type', 'header')
];
const tableOptions = {
editor_data: {
form: {
route: {name: 'clientCase.contract.update', params: {uuid: props.client_case.uuid}},
route_remove: {name: 'clientCase.contract.delete', params: {uuid: props.client_case.uuid}},
values: {
uuid: null,
reference: '',
type_id: 1
},
key: 'uuid',
index: {uuid: null},
el: [
{
id: 'contractRefU',
ref: 'contractRefUInput',
bind: 'reference',
type: 'text',
label: 'Reference',
autocomplete: 'contract-reference'
},
{
id: 'contractTypeU',
ref: 'contractTypeSelectU',
bind: 'type_id',
type: 'select',
label: 'Type',
selectOptions: props.contract_types.map(item => new Object({val: item.id, desc: item.name}))
}
]
},
title: 'contract'
}
}
const createContractTableBody = (data) => {
let tableContractBody = [];
data.forEach((p) => {
let startDate = new Date(p.start_date).toLocaleDateString('de');
const cols = [
C_TD.make(p.reference, 'body' ),
C_TD.make(startDate, 'body' ),
C_TD.make(p.type.name, 'body' ),
];
tableContractBody.push(
C_TR.make(
cols,
{
class: '',
title: p.reference,
edit: true,
ref: {key: 'uuid', val: p.uuid},
editable: {
reference: p.reference,
type_id: p.type.id
}
}
)
)
});
return tableContractBody;
}
</script>
<template>
<BasicTable :options="tableOptions" :header="tableContractHeader" :editor="true" :body="createContractTableBody(contracts)" />
</template>