to_inventory/front/pages/table/index.vue

57 lines
1.5 KiB
Vue

<script setup lang="ts">
const items = ref()
onMounted(async () => {
const items_data = await apiCall<ApiPaged<TgItem>>(`tgbot/`)
items.value = items_data.results
})
const columns = [
{
key: 'name',
label: 'Название'
},
{
key: 'date',
label: 'Дата'
},
{
key: 'tmc',
label: 'ТМЦ'
},
{
key: 'user_id',
label: 'ID автора'
}
]
</script>
<template>
<div class="col-span-12 page-header">
<h1>Проведенные инвентаризации</h1>
</div>
<div class="col-span-12">
<UTable :rows="items" :columns="columns" :ui="{ td: { base: 'whitespace-normal max-w-sm' } }">
<template #date-data="{ row }">
Создано: {{ new Date(row.created_at).toLocaleString('ru-RU') }}<br />
Обновлено: {{ new Date(row.updated_at).toLocaleString('ru-RU') }}
</template>
<template #tmc-data="{ row }">
<template v-for="item in row.tmc">
<strong>{{ item.tmc.name }}</strong>
<ul>
<li v-for="el in item.field">
{{ el.field.name }}
<GetImage :file_id="el.id" />
</li>
</ul>
</template>
</template>
</UTable>
</div>
</template>
<style scoped>
table {
max-width: 100%;
}
</style>