feat: drag & drop des champs personnalisés

app/components/PieceModelStructureEditor.vue

@@ -108,7 +108,7 @@ const extractRest = (structure = {}) => {
   )
 }
 
-const toEditorField = (input = {}) => ({
+const toEditorField = (input = {}, index = 0) => ({
   name: typeof input.name === 'string' ? input.name : '',
   type: typeof input.type === 'string' && input.type ? input.type : 'text',
   required: Boolean(input.required),
@@ -116,10 +116,14 @@ const toEditorField = (input = {}) => ({
     ? input.options.join('\n')
     : typeof input.optionsText === 'string'
       ? input.optionsText
-      : ''
+      : '',
+  orderIndex: typeof input.orderIndex === 'number' ? input.orderIndex : index,
 })
 
-const hydrateFields = (structure = {}) => ensureArray(structure.customFields).map(toEditorField)
+const hydrateFields = (structure = {}) =>
+  ensureArray(structure.customFields)
+    .map((field, index) => toEditorField(field, index))
+    .sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
 
 const localState = reactive({
   fields: hydrateFields(props.modelValue)
@@ -138,7 +142,7 @@ const localFields = computed({
 
 const normalizeFields = (fields) => {
   return ensureArray(fields)
-    .map((field) => {
+    .map((field, index) => {
       const name = typeof field.name === 'string' ? field.name.trim() : ''
       if (!name) {
         return null
@@ -156,7 +160,7 @@ const normalizeFields = (fields) => {
         options = parsed.length > 0 ? parsed : undefined
       }
 
-      const normalized = { name, type, required }
+      const normalized = { name, type, required, orderIndex: index }
       if (options) {
         normalized.options = options
       }
@@ -199,7 +203,8 @@ watch(
 watch(localFields, emitUpdate, { deep: true })
 
 const addField = () => {
-  localFields.value = [...localFields.value, toEditorField()]
+  const index = localFields.value.length
+  localFields.value = [...localFields.value, toEditorField({}, index)]
 }
 
 const removeField = (index) => {