54 lines
1.8 KiB
Vue
54 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
const isOrg = ref(true)
|
|
const data = ref([] as RootObject[])
|
|
data.value = await apiCall<RootObject[]>(`stat/?type=location`, 'get')
|
|
|
|
interface RootObject {
|
|
location: Location | Location[];
|
|
inv_count: number;
|
|
tmc: Tmc[];
|
|
}
|
|
interface Tmc {
|
|
tmc__name: string;
|
|
count: number;
|
|
}
|
|
interface Location {
|
|
id: number;
|
|
name: string;
|
|
}
|
|
|
|
const getData = async () => {
|
|
isOrg.value = !isOrg.value
|
|
data.value = []
|
|
data.value = await apiCall<RootObject[]>(`stat/${isOrg.value == true ? '?type=location' : ''}`, 'get')
|
|
}
|
|
</script>
|
|
<template>
|
|
<div class="grid grid-cols-12 gap-4">
|
|
<div class="col-span-12 page-header">
|
|
<h1>Результаты инвентаризации</h1>
|
|
</div>
|
|
<div class="col-span-12">
|
|
<UButtonGroup>
|
|
<UButton :disabled="isOrg" @click="getData">По организациям</UButton>
|
|
<UButton :disabled="!isOrg" @click="getData">По продуктам</UButton>
|
|
</UButtonGroup>
|
|
</div>
|
|
<UCard v-for="item in data" class="col-span-4" v-if="data && isOrg == true">
|
|
<template #header>
|
|
{{ item.location.name }} <UBadge>{{ item.inv_count }}</UBadge>
|
|
</template>
|
|
<UTable :rows="item.tmc" />
|
|
</UCard>
|
|
<UCard v-for="item in data" class="col-span-6" v-if="data && isOrg == false">
|
|
<template #header>
|
|
<template v-for="el in item.tmc">
|
|
{{ el.tmc__name }}
|
|
</template>
|
|
<UBadge>{{ item.inv_count }}</UBadge>
|
|
</template>
|
|
<UTable :rows="item.location"
|
|
:columns="[{ key: 'name', label: 'name' }, { key: 'count', label: 'count' }]" />
|
|
</UCard>
|
|
</div>
|
|
</template> |