feat(catalog) : add description textarea to piece and component forms

Add description field (textarea) between name and reference/fournisseur
on create and edit pages for both pieces and components.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/components/sites/SiteEditModal.vue

@@ -116,7 +116,7 @@
 </template>
 
 <script setup>
-import { computed, toRefs } from 'vue'
+import { computed } from 'vue'
 import { isImageDocument } from '~/utils/documentPreview'
 import DocumentUpload from '~/components/DocumentUpload.vue'
 import SiteContactFormFields from '~/components/sites/SiteContactFormFields.vue'
@@ -173,8 +173,6 @@ const emit = defineEmits([
   'update:selectedFiles'
 ])
 
-const form = toRefs(props.form)
-
 const selectedFilesModel = computed({
   get: () => props.selectedFiles,
   set: value => emit('update:selectedFiles', value)

app/pages/component/[id]/edit.vue

@@ -79,6 +79,19 @@
           </div>
         </div>
 
+        <div class="form-control">
+          <label class="label">
+            <span class="label-text">Description</span>
+          </label>
+          <textarea
+            v-model="editionForm.description"
+            class="textarea textarea-bordered textarea-sm md:textarea-md"
+            :disabled="!canEdit || saving"
+            placeholder="Description du composant (optionnel)"
+            rows="3"
+          />
+        </div>
+
         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
           <div class="form-control">
             <label class="label">
@@ -625,6 +638,7 @@ const historyDiffEntries = (entry: ComponentHistoryEntry) =>
 const selectedTypeId = ref<string>('')
 const editionForm = reactive({
   name: '' as string,
+  description: '' as string,
   reference: '' as string,
   constructeurIds: [] as string[],
   prix: '' as string,
@@ -805,6 +819,7 @@ watch(
     selectedTypeId.value = resolvedTypeId
 
     editionForm.name = currentComponent.name || ''
+    editionForm.description = currentComponent.description || ''
     editionForm.reference = currentComponent.reference || ''
     editionForm.constructeurIds = uniqueConstructeurIds(
       currentComponent,
@@ -845,6 +860,7 @@ const submitEdition = async () => {
 
   const payload: Record<string, any> = {
     name: editionForm.name.trim(),
+    description: editionForm.description.trim() || null,
   }
 
   const reference = editionForm.reference.trim()

app/pages/component/create.vue

@@ -52,6 +52,19 @@
           </div>
         </div>
 
+        <div class="form-control">
+          <label class="label">
+            <span class="label-text">Description</span>
+          </label>
+          <textarea
+            v-model="creationForm.description"
+            class="textarea textarea-bordered textarea-sm md:textarea-md"
+            :disabled="!canEdit || submitting || !selectedType"
+            placeholder="Description du composant (optionnel)"
+            rows="3"
+          />
+        </div>
+
         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
           <div class="form-control">
             <label class="label">
@@ -408,6 +421,7 @@ const selectedTypeId = ref<string>(initialTypeId.value)
 const submitting = ref(false)
 const creationForm = reactive({
   name: '' as string,
+  description: '' as string,
   reference: '' as string,
   constructeurIds: [] as string[],
   prix: '' as string,
@@ -889,6 +903,7 @@ const resolveSubcomponentLabel = (node: Record<string, any>) => {
 
 const clearCreationForm = () => {
   creationForm.name = ''
+  creationForm.description = ''
   creationForm.reference = ''
   creationForm.constructeurIds = []
   creationForm.prix = ''
@@ -906,6 +921,11 @@ const submitCreation = async () => {
     typeComposantId: selectedType.value.id,
   }
 
+  const description = creationForm.description.trim()
+  if (description) {
+    payload.description = description
+  }
+
   const reference = creationForm.reference.trim()
   if (reference) {
     payload.reference = reference

app/pages/pieces/[id]/edit.vue

@@ -79,6 +79,19 @@
           </div>
         </div>
 
+        <div class="form-control">
+          <label class="label">
+            <span class="label-text">Description</span>
+          </label>
+          <textarea
+            v-model="editionForm.description"
+            class="textarea textarea-bordered textarea-sm md:textarea-md"
+            :disabled="!canEdit || saving"
+            placeholder="Description de la pièce (optionnel)"
+            rows="3"
+          />
+        </div>
+
         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
           <div class="form-control">
             <label class="label">
@@ -568,6 +581,7 @@ const selectedTypeId = ref<string>('')
 const pieceTypeDetails = ref<any | null>(null)
 const editionForm = reactive({
   name: '' as string,
+  description: '' as string,
   reference: '' as string,
   constructeurIds: [] as string[],
   prix: '' as string,
@@ -823,6 +837,7 @@ watch(
     selectedTypeId.value = resolvedTypeId
 
     editionForm.name = currentPiece.name || ''
+    editionForm.description = currentPiece.description || ''
     editionForm.reference = currentPiece.reference || ''
     editionForm.constructeurIds = uniqueConstructeurIds(
       currentPiece,
@@ -895,6 +910,7 @@ const submitEdition = async () => {
 
   const payload: Record<string, any> = {
     name: editionForm.name.trim(),
+    description: editionForm.description.trim() || null,
     constructeurIds,
   }
 

app/pages/pieces/create.vue

@@ -52,6 +52,19 @@
           </div>
         </div>
 
+        <div class="form-control">
+          <label class="label">
+            <span class="label-text">Description</span>
+          </label>
+          <textarea
+            v-model="creationForm.description"
+            class="textarea textarea-bordered textarea-sm md:textarea-md"
+            :disabled="!canEdit || submitting || !selectedType"
+            placeholder="Description de la pièce (optionnel)"
+            rows="3"
+          />
+        </div>
+
         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
           <div class="form-control">
             <label class="label">
@@ -336,6 +349,7 @@ const selectedTypeId = ref<string>(initialTypeId.value)
 const submitting = ref(false)
 const creationForm = reactive({
   name: '' as string,
+  description: '' as string,
   reference: '' as string,
   constructeurIds: [] as string[],
   prix: '' as string,
@@ -490,6 +504,7 @@ const canSubmit = computed(() =>
 
 const clearCreationForm = () => {
   creationForm.name = ''
+  creationForm.description = ''
   creationForm.reference = ''
   creationForm.constructeurIds = []
   creationForm.prix = ''
@@ -513,6 +528,11 @@ const submitCreation = async () => {
     typePieceId: selectedType.value.id,
   }
 
+  const description = creationForm.description.trim()
+  if (description) {
+    payload.description = description
+  }
+
   const reference = creationForm.reference.trim()
   if (reference) {
     payload.reference = reference