fix validation errors with UiForm

components/Ui/Form.vue

@@ -11,11 +11,13 @@ de quitter si des données ont été modifiées.
   <main>
     <v-form
       ref="form"
-      lazy-validation
       :readonly="readonly"
+      validate-on="lazy input"
       @submit.prevent=""
-      @update:entity="onFormChange"
+      @update:model-value="onValidationChange"
     >
+<!--      @update:entity="onFormChange"-->
+
       <!-- Top action bar -->
       <v-container :fluid="true" class="container btnActions">
         <v-row>
@@ -319,8 +321,6 @@ const actions = computed(()=>{
  *  Update store when form is changed (if valid)
  */
 const onFormChange = async () => {
-  await validate()
-
   if (isValid.value) {
     em.save(props.model, props.entity)
     setIsDirty(true)
@@ -333,14 +333,17 @@ const onFormChange = async () => {
   }
 }
 
+const onValidationChange = (event: boolean | null) => {
+  isValid.value = event || false
+}
+
 /**
  * Utilise la méthode validate() de v-form pour valider le formulaire et mettre à jour les variables isValid et errors
  *
  * @see https://vuetifyjs.com/en/api/v-form/#functions-validate
  */
 const validate = async function () {
-  const validation = await form.value.validate()
-
+  const validation = form.value.validate()
   isValid.value = validation.valid
   errors.value = validation.errors
 }

components/Ui/Input/Autocomplete.vue

@@ -29,6 +29,8 @@ Liste déroulante avec autocompletion, à placer dans un composant `UiForm`
         :no-data-text="isLoading ? $t('please_wait') : $t('no_result_matching_your_request')"
         @update:model-value="onUpdate"
         @update:search="emit('update:search', $event)"
+        @update:menu="emit('update:menu', $event)"
+        @update:focused="emit('update:focused', $event)"
     >
       <template v-if="slotText" #item="data">
 <!--        <v-list-item-content v-text="data.item.slotTextDisplay"></v-list-item-content>-->
@@ -219,7 +221,7 @@ const fieldLabel: string = props.label ?? props.field
 
 const {fieldViolations, updateViolationState} = useFieldViolation(props.field)
 
-const emit = defineEmits(['update:model-value', 'update:search'])
+const emit = defineEmits(['update:model-value', 'update:search', 'update:focused', 'update:menu'])
 
 const onUpdate = (event: string) => {
   updateViolationState(event)

components/Ui/Input/Autocomplete/Accesses.vue

@@ -127,10 +127,6 @@ const accessToItem = (access: Access): AccessListItem => {
   }
 }
 
-const getFromStore = (id: number) => {
-  return em.find(Access, id)
-}
-
 const initialized: Ref<boolean> = ref(false)
 
 /**
@@ -169,9 +165,12 @@ const { data: collection, pending, refresh } = await fetchCollection(
     query
 )
 initialized.value = true
-// On relance une requête pour récupérer la première page
+
+// On a déjà récupéré les access actifs, on relance une requête pour récupérer la première page
+// des accesses suivants
 refresh()
 
+
 /**
  * Contenu de la liste autocomplete
  */

components/Ui/Input/Text.vue

@@ -6,6 +6,7 @@ Champs de saisie de texte, à placer dans un composant `UiForm`
 
 <template>
   <v-text-field
+    ref="input"
     :model-value="modelValue"
     :label="(label || field) ? $t(label ?? field) : undefined"
     :rules="rules"
@@ -26,9 +27,7 @@ Champs de saisie de texte, à placer dans un composant `UiForm`
 <script setup lang="ts">
 import {ref} from "@vue/reactivity";
 import {useFieldViolation} from "~/composables/form/useFieldViolation";
-import {useNuxtApp} from "#app";
-import {useI18n} from "vue-i18n";
-import {mask} from "vue-the-mask";
+import {PropType} from "@vue/runtime-core";
 
 const props = defineProps({
   /**
@@ -80,7 +79,7 @@ const props = defineProps({
    * @see https://vuetify.cn/en/components/forms/#validation-with-submit-clear
    */
   rules: {
-    type: Array,
+    type: Array as PropType<any[]>,
     required: false,
     default: () => []
   },
@@ -111,8 +110,7 @@ const props = defineProps({
   }
 })
 
-const { app } = useNuxtApp()
-const i18n = useI18n()
+const input = ref(null)
 
 const { fieldViolations, updateViolationState } = useFieldViolation(props.field)
 
@@ -121,18 +119,13 @@ const show = ref(false)
 const emit = defineEmits(['update:model-value', 'change'])
 
 const onUpdate = (event: string) => {
-    emit('update:model-value', event)
+  emit('update:model-value', event)
 }
 
 const onChange = (event: Event | undefined) => {
-    updateViolationState(event)
-    emit('change', event)
+  updateViolationState(event)
+  emit('change', event)
 }
-
-// const label = computed(() => {
-//   if (props.label)
-// })
-
 </script>
 
 <style scoped lang="scss">