feat(admin) : move clients into admin page, remove standalone page
This commit is contained in:
@@ -19,6 +19,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mt-6">
|
<div class="mt-6">
|
||||||
|
<AdminClientTab v-if="activeTab === 'clients'" />
|
||||||
<AdminEffortTab v-if="activeTab === 'efforts'" />
|
<AdminEffortTab v-if="activeTab === 'efforts'" />
|
||||||
<AdminPriorityTab v-if="activeTab === 'priorities'" />
|
<AdminPriorityTab v-if="activeTab === 'priorities'" />
|
||||||
<AdminTypeTab v-if="activeTab === 'types'" />
|
<AdminTypeTab v-if="activeTab === 'types'" />
|
||||||
@@ -31,6 +32,7 @@
|
|||||||
useHead({ title: 'Administration' })
|
useHead({ title: 'Administration' })
|
||||||
|
|
||||||
const tabs = [
|
const tabs = [
|
||||||
|
{ key: 'clients', label: 'Clients' },
|
||||||
{ key: 'efforts', label: 'Efforts' },
|
{ key: 'efforts', label: 'Efforts' },
|
||||||
{ key: 'priorities', label: 'Priorités' },
|
{ key: 'priorities', label: 'Priorités' },
|
||||||
{ key: 'types', label: 'Types' },
|
{ key: 'types', label: 'Types' },
|
||||||
@@ -39,5 +41,5 @@ const tabs = [
|
|||||||
|
|
||||||
type TabKey = typeof tabs[number]['key']
|
type TabKey = typeof tabs[number]['key']
|
||||||
|
|
||||||
const activeTab = ref<TabKey>('efforts')
|
const activeTab = ref<TabKey>('clients')
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,99 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="flex items-center justify-between">
|
|
||||||
<h1 class="text-2xl font-bold text-primary-500">Clients</h1>
|
|
||||||
<button
|
|
||||||
class="rounded-md bg-primary-500 px-4 py-2 text-sm font-semibold text-white hover:bg-secondary-500"
|
|
||||||
@click="openCreate"
|
|
||||||
>
|
|
||||||
+ Ajouter un client
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<DataTable
|
|
||||||
:columns="columns"
|
|
||||||
:items="clients"
|
|
||||||
:loading="isLoading"
|
|
||||||
empty-message="Aucun client trouvé."
|
|
||||||
deletable
|
|
||||||
@row-click="openEdit"
|
|
||||||
@delete="(item) => handleDelete(item.id)"
|
|
||||||
>
|
|
||||||
<template #cell-email="{ item }">
|
|
||||||
{{ item.email ?? '-' }}
|
|
||||||
</template>
|
|
||||||
<template #cell-address="{ item }">
|
|
||||||
{{ formatAddress(item) }}
|
|
||||||
</template>
|
|
||||||
<template #cell-phone="{ item }">
|
|
||||||
{{ item.phone ?? '-' }}
|
|
||||||
</template>
|
|
||||||
</DataTable>
|
|
||||||
|
|
||||||
<ClientDrawer
|
|
||||||
v-model="drawerOpen"
|
|
||||||
:client="selectedClient"
|
|
||||||
@saved="onSaved"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
import type { Client } from '~/services/dto/client'
|
|
||||||
import { useClientService } from '~/services/clients'
|
|
||||||
|
|
||||||
useHead({ title: 'Clients' })
|
|
||||||
|
|
||||||
import type { DataTableColumn } from '~/components/ui/DataTable.vue'
|
|
||||||
|
|
||||||
const columns: DataTableColumn[] = [
|
|
||||||
{ key: 'name', label: 'Nom', primary: true },
|
|
||||||
{ key: 'email', label: 'Email', class: 'text-primary-500' },
|
|
||||||
{ key: 'address', label: 'Adresse', class: 'text-neutral-700' },
|
|
||||||
{ key: 'phone', label: 'Téléphone', class: 'text-primary-500' },
|
|
||||||
]
|
|
||||||
|
|
||||||
const { getAll, remove } = useClientService()
|
|
||||||
const clients = ref<Client[]>([])
|
|
||||||
const isLoading = ref(true)
|
|
||||||
const drawerOpen = ref(false)
|
|
||||||
const selectedClient = ref<Client | null>(null)
|
|
||||||
|
|
||||||
async function loadClients() {
|
|
||||||
isLoading.value = true
|
|
||||||
try {
|
|
||||||
clients.value = await getAll()
|
|
||||||
} finally {
|
|
||||||
isLoading.value = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function openCreate() {
|
|
||||||
selectedClient.value = null
|
|
||||||
drawerOpen.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
function openEdit(client: Client) {
|
|
||||||
selectedClient.value = client
|
|
||||||
drawerOpen.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatAddress(client: Client): string {
|
|
||||||
return [client.street, client.postalCode, client.city]
|
|
||||||
.filter(Boolean)
|
|
||||||
.join(', ') || '-'
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleDelete(id: number) {
|
|
||||||
await remove(id)
|
|
||||||
await loadClients()
|
|
||||||
}
|
|
||||||
|
|
||||||
async function onSaved() {
|
|
||||||
await loadClients()
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
loadClients()
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
Reference in New Issue
Block a user