|
|
|
<template>
|
|
|
|
<ClientOnly>
|
|
|
|
<Card style="margin-top: 78px; min-height: 200px;">
|
|
|
|
<template #content>
|
|
|
|
<Panel header="Bought, but not evaluated clothes" class="rounded-4 bg-white" >
|
|
|
|
<DataView :value="itemsb" paginator :rows="5">
|
|
|
|
<template #list="slotProps">
|
|
|
|
<div class="col-12">
|
|
|
|
<div class="flex flex-column xl:flex-row xl:align-items-start p-4 gap-4">
|
|
|
|
<img class="w-9 sm:w-16rem xl:w-10rem shadow-2 block xl:block mx-auto border-round" :src="`/photos/16266842344a52797c13c72c9c769e2c6b52e827b0.webp`" :alt="slotProps.data.bezeichnung" />
|
|
|
|
<div class="flex flex-column sm:flex-row justify-content-between align-items-center xl:align-items-start flex-1 gap-4">
|
|
|
|
<div class="flex flex-column align-items-center sm:align-items-start gap-3">
|
|
|
|
<div class="text-2xl font-bold text-900">{{ slotProps.data.bezeichnung }}</div>
|
|
|
|
<div class="flex align-items-center gap-3">
|
|
|
|
<span class="flex align-items-center gap-2">
|
|
|
|
<i class="pi pi-tag"></i>
|
|
|
|
<span class="font-semibold">{{ slotProps.data.typid }}</span>
|
|
|
|
</span>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<div class="col-12 gap-3 flex">
|
|
|
|
<Button severity="info" @click="openDetail(slotProps.data.type.id)" target="_blank" label=" Details " icon="pi pi-list" />
|
|
|
|
<Button severity="success" @click="openEval(slotProps.data.typid)" label=" Evaluation " icon="pi pi-eye" />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</DataView>
|
|
|
|
</Panel>
|
|
|
|
</template>
|
|
|
|
</Card>
|
|
|
|
</ClientOnly>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
import { ref } from "vue";
|
|
|
|
|
|
|
|
//const itemsb = ref();
|
|
|
|
const {data: itemsb } = await useFetch('http://ubodroid-2:8081/api/v1/itb');
|
|
|
|
|
|
|
|
async function openDetail(id) {
|
|
|
|
await navigateTo({
|
|
|
|
path: '/itembdetail',
|
|
|
|
query: {
|
|
|
|
id: id,
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
)
|
|
|
|
};
|
|
|
|
|
|
|
|
async function openEval(id) {
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
</script>
|