75 lines
2.5 KiB
Vue
75 lines
2.5 KiB
Vue
<template>
|
|
<div class="flex items-center justify-between">
|
|
<h1 class="text-3xl font-bold uppercase"> Fournisseurs </h1>
|
|
<NuxtLink to="/admin/supplier"
|
|
class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
|
|
>
|
|
Ajouter
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="mt-6 border border-slate-200 mb-16">
|
|
<div class="max-h-96 overflow-y-auto">
|
|
<div
|
|
class="sticky top-0 z-10 grid grid-cols-6 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
|
|
>
|
|
<div>Nom</div>
|
|
<div>Mail</div>
|
|
<div>Rue</div>
|
|
<div>Complément</div>
|
|
<div>Code Postal</div>
|
|
<div>Ville</div>
|
|
</div>
|
|
|
|
<div v-for="supplier in supplierList" :key="supplier.id">
|
|
<template v-if="supplier.addresses?.length">
|
|
<div
|
|
v-for="addr in supplier.addresses"
|
|
:key="addr.id"
|
|
class="grid grid-cols-6 hover:bg-slate-50 border-t gap-4 px-4 py-2"
|
|
@click="goToSupplier(supplier.id)"
|
|
>
|
|
<div class="truncate">
|
|
{{ supplier.name }}
|
|
</div>
|
|
<div class="truncate">
|
|
{{ supplier.email }}
|
|
</div>
|
|
<div class="truncate">
|
|
{{ addr.street }}
|
|
</div>
|
|
<div class="truncate">
|
|
{{ addr.street2 }}
|
|
</div>
|
|
<div>{{ addr.postalCode }}</div>
|
|
<div class="uppercase truncate">
|
|
{{ addr.city }}
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type {SupplierData} from "~/services/dto/supplier-data"
|
|
import {getSupplierList} from "~/services/supplier"
|
|
|
|
definePageMeta({layout: "admin"})
|
|
|
|
const supplierList = ref<SupplierData[]>([])
|
|
const router = useRouter()
|
|
|
|
|
|
const goToSupplier = (id: number) => {
|
|
router.push(`/admin/supplier/${id}`)
|
|
}
|
|
|
|
onMounted(async () => {
|
|
supplierList.value = (await getSupplierList(false)) ?? []
|
|
})
|
|
|
|
</script>
|
|
|
|
|