<script setup>
import {NDataTable, NEllipsis} from "naive-ui"
import {h, reactive, ref} from "vue"
import {useMedicalHistory} from "../../../Composables/useMedicalHistory.js";

const { navigate } = useMedicalHistory('/')
const props = defineProps({
    data: {
        type: Array,
        default: []
    },
    meta: {
        type: Object,
        default: {}
    },
    maxHeight: {
        type: String,
        default: null
    },
    minHeight: {
        type: String,
        default: null
    }
})

const columns = ref([
    {
        title: '№ карты',
        key: 'nkarta',
        width: 100,
        render: (row) => h(NEllipsis, null, { default: () => row.nkarta })
    },
    {
        title: 'ФИО',
        key: 'fullname',
        width: 250,
        render: (row) => h(NEllipsis, null, { default: () => row.fullname })
    },
    {
        title: 'Дата рождения',
        key: 'dr',
        width: 130,
        render: (row) => h(NEllipsis, null, { default: () => row.dr })
    },
    {
        title: 'Дата поступления',
        key: 'mpostdate',
        width: 150,
        render: (row) => h(NEllipsis, null, { default: () => row.mpostdate })
    },
    {
        title: 'Дата выписки',
        key: 'menddate',
        width: 130,
        render: (row) => h(NEllipsis, null, { default: () => row.menddate })
    },
    {
        title: '№ архива',
        key: 'narhiv',
        width: 120,
        render: (row) => h(NEllipsis, null, { default: () => row.narhiv })
    },
    {
        title: 'Дата архива',
        key: 'datearhiv',
        width: 130,
        render: (row) => h(NEllipsis, null, { default: () => row.datearhiv })
    },
    {
        title: 'Статус',
        key: 'status',
        width: 100,
        render: (row) => h(NEllipsis, null, { default: () => row.status || '-' })
    }
])

const paginationReactive = reactive({
    page: props.meta.current_page,
    pageCount: props.meta.last_page,
    pageSize: props.meta.per_page,
    itemCount: props.meta.total,
    pageSizes: [15, 50, 100],
    showSizePicker: true,
    prefix({ itemCount }) {
        return `Всего карт ${itemCount}.`
    },
    onUpdatePage(page) {
        navigate(undefined, page)
    },
    onUpdatePageSize(pageSize) {
        navigate(undefined, 1, pageSize)
    }
})
</script>

<template>
    <NDataTable remote striped :columns="columns" :pagination="paginationReactive" :max-height="maxHeight" size="small" :min-height="minHeight" :data="data" />
</template>

<style scoped>

</style>
