<script setup lang="ts">
const data = await apiCall<RootObject[]>(`stat/`, 'get')
interface RootObject {
    location: Location;
    inv_count: number;
    tmc: Tmc[];
}
interface Tmc {
    tmc__name: string;
    count: number;
}
interface Location {
    id: number;
    name: string;
}
</script>
<template>
    <div class="grid grid-cols-12 gap-4">
        <div class="col-span-12 page-header">
            <h1>Результаты инвентаризации</h1>
        </div>
        <UCard v-for="item in data" class="col-span-4">
            <template #header>
                {{ item.location.name }} <UBadge>{{ item.inv_count }}</UBadge>
            </template>
            <UTable :rows="item.tmc" />
        </UCard>
    </div>
</template>