0
0
Fork 0
salix-front-mindshore-fork2/src/pages/Worker/Card/WorkerBalance.vue

116 lines
3.0 KiB
Vue

<script setup>
import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import VnTable from 'components/VnTable/VnTable.vue';
import FetchData from 'src/components/FetchData.vue';
const tableRef = ref();
const payrollComponents = ref([]);
const { t } = useI18n();
const route = useRoute();
const entityId = computed(() => route.params.id);
const columns = computed(() => [
{
align: 'left',
name: 'paymentDate',
label: t('worker.balance.tableVisibleColumns.paymentDate'),
create: true,
component: 'date',
field: 'paymentDate',
cardVisible: true,
},
{
align: 'left',
name: 'incomeTypeFk',
label: t('worker.balance.tableVisibleColumns.incomeType'),
create: true,
component: 'select',
attrs: {
options: payrollComponents,
optionLabel: 'name',
optionValue: 'id',
},
cardVisible: true,
},
{
align: 'left',
name: 'debit',
label: t('worker.balance.tableVisibleColumns.debit'),
create: true,
component: 'input',
field: 'debit',
cardVisible: true,
},
{
align: 'left',
name: 'credit',
label: t('worker.balance.tableVisibleColumns.credit'),
create: true,
component: 'input',
field: 'credit',
cardVisible: true,
},
{
align: 'left',
name: 'concept',
label: t('worker.balance.tableVisibleColumns.concept'),
create: true,
component: 'input',
field: 'concept',
cardVisible: true,
},
{
align: 'right',
name: 'tableActions',
style: 'max-width: 20px; text-align: initial;',
actions: [
{
title: t('delete'),
icon: 'delete',
action: async (row) => await tableRef.value.CrudModelRef.remove([row]),
isPrimary: true,
},
],
},
]);
</script>
<template>
<FetchData
url="PayrollComponents"
:filter="{
fields: ['id', 'name'],
where: { name: { neq: '' } },
order: 'name ASC',
}"
@on-fetch="(data) => (payrollComponents = data)"
auto-load
/>
<VnTable
ref="tableRef"
data-key="WorkerBalance"
:url="`Workers/${entityId}/incomes`"
:url-create="`Workers/${entityId}/incomes`"
save-url="WorkerIncomes/crud"
:create="{
urlCreate: 'workerIncomes',
title: t('Create balance'),
onDataSaved: () => tableRef.reload(),
formInitialData: {
workerFk: entityId,
},
}"
order="paymentDate DESC"
:columns="columns"
auto-load
:right-search="false"
:is-editable="true"
:use-model="true"
:default-remove="false"
search-url="balance"
/>
</template>
<i18n>
es:
Create balance: Crear balance
</i18n>