<script setup>
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';

import { toCurrency, toDate } from 'src/filters';

import VnTable from 'src/components/VnTable/VnTable.vue';

const { t } = useI18n();
const route = useRoute();

const filter = {
    where: {
        creditClassificationFk: `${route.params.creditId}`,
    },
    limit: 20,
};
const columns = computed(() => [
    {
        align: 'left',
        field: 'created',
        format: ({ created }) => toDate(created),
        label: t('Created'),
        name: 'created',
    },
    {
        align: 'left',
        field: 'grade',
        label: t('Grade'),
        name: 'grade',
    },
    {
        align: 'left',
        format: ({ credit }) => toCurrency(credit),
        label: t('Credit'),
        name: 'credit',
    },
]);
</script>

<template>
    <VnTable
        url="CreditInsurances"
        ref="tableRef"
        data-key="creditInsurances"
        :filter="filter"
        :columns="columns"
        :right-search="false"
        :is-editable="false"
        :use-model="true"
        :column-search="false"
        :disable-option="{ card: true }"
        auto-load
    ></VnTable>
</template>

<i18n>
es:
    Created: Fecha creación
    Grade: Grade
    Credit: Crédito
</i18n>
