Files
Inventory_frontend/app/components/MachinePrintSelectionModal.vue
2025-09-17 23:11:13 +02:00

137 lines
4.8 KiB
Vue

<template>
<dialog class="modal" :class="{ 'modal-open': open }">
<div class="modal-box max-w-3xl">
<form method="dialog" class="modal-close" @submit.prevent></form>
<h3 class="font-bold text-lg mb-2">Préparer l'impression</h3>
<p class="text-sm text-base-content/70 mb-4">
Choisissez les sections à inclure avant de lancer l'impression.
</p>
<div class="flex flex-wrap gap-2 mb-4">
<button type="button" class="btn btn-xs btn-outline" @click="emit('select-all')">
Tout sélectionner
</button>
<button type="button" class="btn btn-xs btn-outline" @click="emit('deselect-all')">
Tout désélectionner
</button>
</div>
<div class="max-h-[420px] overflow-y-auto pr-2 space-y-6">
<section class="bg-base-200/50 rounded-xl p-4 space-y-3">
<h4 class="font-semibold text-sm uppercase tracking-wide text-base-content/70">
Machine
</h4>
<label class="flex items-start gap-3">
<input
type="checkbox"
class="checkbox checkbox-primary mt-1"
v-model="selection.machine.info"
/>
<div>
<p class="font-medium">Informations générales</p>
<p class="text-xs text-base-content/60">
Nom, emplacement, site et constructeur de la machine.
</p>
</div>
</label>
<label class="flex items-start gap-3">
<input
type="checkbox"
class="checkbox checkbox-primary mt-1"
v-model="selection.machine.customFields"
/>
<div>
<p class="font-medium">Champs personnalisés</p>
<p class="text-xs text-base-content/60">
Valeurs spécifiques configurées pour cette machine.
</p>
</div>
</label>
<label class="flex items-start gap-3">
<input
type="checkbox"
class="checkbox checkbox-primary mt-1"
v-model="selection.machine.documents"
/>
<div>
<p class="font-medium">Documents</p>
<p class="text-xs text-base-content/60">
Pièces jointes liées directement à la machine.
</p>
</div>
</label>
</section>
<section class="bg-base-200/30 rounded-xl p-4 space-y-3" v-if="hasComponents">
<h4 class="font-semibold text-sm uppercase tracking-wide text-base-content/70">
Composants & pièces
</h4>
<div class="space-y-3">
<MachinePrintSelectionNode
v-for="component in componentsList"
:key="component.id"
:component="component"
:selection="selection"
/>
</div>
</section>
<section class="bg-base-200/30 rounded-xl p-4 space-y-3" v-if="hasPieces">
<h4 class="font-semibold text-sm uppercase tracking-wide text-base-content/70">
Pièces indépendantes
</h4>
<div class="space-y-2">
<label
v-for="piece in piecesList"
:key="piece.id"
class="flex items-start gap-3"
>
<input
type="checkbox"
class="checkbox checkbox-secondary mt-1"
v-model="selection.pieces[piece.id]"
/>
<div>
<p class="font-medium">{{ piece.name }}</p>
<p class="text-xs text-base-content/60">
{{ piece.reference || 'Référence inconnue' }}
</p>
</div>
</label>
</div>
</section>
</div>
<div class="modal-action">
<button type="button" class="btn btn-ghost" @click="emit('close')">
Annuler
</button>
<button type="button" class="btn btn-primary" @click="emit('confirm')">
Imprimer
</button>
</div>
</div>
</dialog>
</template>
<script setup>
import { computed, toRef } from 'vue'
import MachinePrintSelectionNode from '~/components/MachinePrintSelectionNode.vue'
const props = defineProps({
open: { type: Boolean, default: false },
selection: { type: Object, required: true },
components: { type: Array, default: () => [] },
pieces: { type: Array, default: () => [] },
})
const emit = defineEmits(['close', 'confirm', 'select-all', 'deselect-all'])
const selection = toRef(props, 'selection')
const componentsList = computed(() => props.components || [])
const piecesList = computed(() => props.pieces || [])
const hasComponents = computed(() => componentsList.value.length > 0)
const hasPieces = computed(() => piecesList.value.length > 0)
</script>