feat(machine) : allow site editing on machine detail page and align card buttons
- Add site select field in MachineInfoCard (edit mode) - Include siteId in machine PATCH payload - Align action buttons (Modifier/Supprimer/Détails) consistently at card bottom - Use mt-auto + flex-col to push buttons to bottom across all machine cards Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -26,8 +26,8 @@
|
||||
<!-- Filters -->
|
||||
<div class="card bg-base-100 shadow-sm mb-8">
|
||||
<div class="card-body py-4">
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div class="form-control">
|
||||
<div class="flex flex-col md:flex-row md:items-end gap-4">
|
||||
<div class="form-control flex-1">
|
||||
<label class="label">
|
||||
<span class="label-text text-xs font-semibold uppercase tracking-wide text-base-content/50">Rechercher</span>
|
||||
</label>
|
||||
@@ -41,11 +41,11 @@
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-control">
|
||||
<div class="form-control md:w-64">
|
||||
<label class="label">
|
||||
<span class="label-text text-xs font-semibold uppercase tracking-wide text-base-content/50">Site</span>
|
||||
</label>
|
||||
<select v-model="selectedSiteFilter" class="select select-bordered">
|
||||
<select v-model="selectedSiteFilter" class="select select-bordered w-full">
|
||||
<option value="">
|
||||
Tous les sites
|
||||
</option>
|
||||
@@ -163,7 +163,7 @@
|
||||
<div
|
||||
v-for="machine in site.machines"
|
||||
:key="machine.id"
|
||||
class="group rounded-xl border border-base-300/40 bg-base-200/30 hover:bg-base-200/60 hover:border-primary/20 transition-all cursor-pointer p-4"
|
||||
class="group flex flex-col rounded-xl border border-base-300/40 bg-base-200/30 hover:bg-base-200/60 hover:border-primary/20 transition-all cursor-pointer p-4"
|
||||
@click="viewMachineDetails(machine)"
|
||||
>
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
@@ -172,29 +172,29 @@
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<div v-if="machine.reference" class="flex items-center gap-1.5 text-xs text-base-content/40 mb-3">
|
||||
<div v-if="machine.reference" class="flex items-center gap-1.5 text-xs text-base-content/40">
|
||||
<IconLucideTag class="w-3 h-3" aria-hidden="true" />
|
||||
<span>{{ machine.reference }}</span>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-1.5 justify-end">
|
||||
<div class="mt-auto pt-3 flex items-center justify-end gap-2">
|
||||
<button
|
||||
v-if="canEdit"
|
||||
class="btn btn-xs btn-ghost text-base-content/40 hover:text-base-content opacity-0 group-hover:opacity-100 transition-opacity"
|
||||
class="btn btn-ghost btn-xs"
|
||||
@click.stop="editMachine(machine)"
|
||||
>
|
||||
Modifier
|
||||
</button>
|
||||
<button
|
||||
v-if="canEdit"
|
||||
class="btn btn-xs btn-ghost text-error/50 hover:text-error opacity-0 group-hover:opacity-100 transition-opacity"
|
||||
class="btn btn-ghost btn-xs text-error"
|
||||
@click.stop="confirmDeleteMachine(machine)"
|
||||
>
|
||||
Supprimer
|
||||
</button>
|
||||
<NuxtLink
|
||||
:to="`/machine/${machine.id}`"
|
||||
class="btn btn-xs btn-primary btn-outline opacity-0 group-hover:opacity-100 transition-opacity"
|
||||
class="btn btn-primary btn-xs"
|
||||
@click.stop
|
||||
>
|
||||
Détails
|
||||
|
||||
@@ -53,6 +53,9 @@
|
||||
:is-edit-mode="d.isEditMode.value"
|
||||
:machine-name="d.machineName.value"
|
||||
:machine-reference="d.machineReference.value"
|
||||
:machine-site-id="d.machineSiteId.value"
|
||||
:machine-site-name="d.machine.value?.site?.name ?? ''"
|
||||
:sites="d.sites.value"
|
||||
:machine-constructeur-ids="d.machineConstructeurIds.value"
|
||||
:machine-constructeurs-display="d.machineConstructeursDisplay.value"
|
||||
:has-machine-constructeur="d.hasMachineConstructeur.value"
|
||||
@@ -62,6 +65,7 @@
|
||||
:machine-custom-field-defs="d.machine.value?.customFields ?? []"
|
||||
@update:machine-name="d.machineName.value = $event"
|
||||
@update:machine-reference="d.machineReference.value = $event"
|
||||
@update:machine-site-id="d.machineSiteId.value = $event"
|
||||
@update:constructeur-ids="d.handleMachineConstructeurChange"
|
||||
@blur-field="d.updateMachineInfo"
|
||||
@set-custom-field-value="d.setMachineCustomFieldValue"
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
class="card bg-base-100 shadow-sm hover:shadow-xl transition-shadow cursor-pointer"
|
||||
@click="viewMachineDetails(machine)"
|
||||
>
|
||||
<div class="card-body">
|
||||
<div class="card-body flex flex-col">
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<h3 class="card-title text-lg">
|
||||
{{ machine.name }}
|
||||
@@ -87,15 +87,15 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-actions justify-end mt-4">
|
||||
<button class="btn btn-sm btn-outline" @click.stop="editMachine(machine)">
|
||||
<div class="mt-auto pt-3 flex items-center justify-end gap-2">
|
||||
<button v-if="canEdit" class="btn btn-ghost btn-xs" @click.stop="editMachine(machine)">
|
||||
Modifier
|
||||
</button>
|
||||
<button v-if="canEdit" class="btn btn-sm btn-error" @click.stop="confirmDeleteMachine(machine)">
|
||||
<button v-if="canEdit" class="btn btn-ghost btn-xs text-error" @click.stop="confirmDeleteMachine(machine)">
|
||||
Supprimer
|
||||
</button>
|
||||
<NuxtLink :to="`/machine/${machine.id}`" class="btn btn-sm btn-primary">
|
||||
Voir détails
|
||||
<NuxtLink :to="`/machine/${machine.id}`" class="btn btn-primary btn-xs">
|
||||
Détails
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user