Adjust more translations in mainbundle create component

src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/Create.vue

@@ -4,7 +4,7 @@
          <a class="nav-link" :class="{ active: isActive('person') }">
             <label for="person">
                <input type="radio" name="person" id="person" v-model="radioType" value="person">
-               {{ $t('onthefly.create.person') }}
+               {{ $trans('ONTHEFLY_CREATE_PERSON') }}
             </label>
          </a>
       </li>
@@ -37,59 +37,61 @@
    </div>
 </template>
 
-<script>
+<script setup>
+import { ref, computed, onMounted } from 'vue';
 import OnTheFlyPerson from 'ChillPersonAssets/vuejs/_components/OnTheFly/Person.vue';
 import OnTheFlyThirdparty from 'ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdParty.vue';
 
-export default {
+// Define props
-   name: "OnTheFlyCreate",
+const props = defineProps(['action', 'allowedTypes', 'query']);
-   props: ['action', 'allowedTypes', 'query'],
+
-   components: {
+// Create a ref for type
-      OnTheFlyPerson,
+const type = ref(null);
-      OnTheFlyThirdparty
+
-   },
+// Computed
-   data() {
+const radioType = computed({
-      return {
+    get: () => type.value,
-         type: null
+    set(value) {
+        type.value = value;
+        console.log('## type:', value, ', action:', props.action);
     }
-   },
+});
-   computed: {
+
-      radioType: {
+// Mounted
-         set(type) {
+onMounted(() => {
-            this.type = type;
+    type.value = (props.allowedTypes.length === 1 && props.allowedTypes.includes('thirdparty'))
-            console.log('## type:', type, ', action:', this.action);
+        ? 'thirdparty'
-         },
+        : 'person';
-         get() {
+});
-            return this.type;
+
-         }
+// Methods
-      },
+const isActive = (tab) => {
-   },
+    return type.value === tab;
-   mounted() {
+};
-      this.type = (this.allowedTypes.length === 1 && this.allowedTypes.includes('thirdparty')) ? 'thirdparty' : 'person'
+
-   },
+const castDataByType = () => {
-   methods: {
+    switch (radioType.value) {
-      isActive(tab) {
-         return (this.type === tab) ? true : false;
-      },
-      castDataByType() {
-         switch (this.radioType) {
         case 'person':
-               return this.$refs.castPerson.$data.person;
+            return $refs.castPerson.$data.person;
         case 'thirdparty':
-               let data = this.$refs.castThirdparty.$data.thirdparty;
+            let data = $refs.castThirdparty.$data.thirdparty;
             if (data.address !== undefined && data.address !== null) {
-                   data.address = { id: data.address.address_id }
+                data.address = { id: data.address.address_id };
             } else {
                 data.address = null;
             }
-
             return data;
         default:
-               throw Error('Invalid type of entity')
+            throw Error('Invalid type of entity');
-         }
-      }
-   }
     }
+};
+
+// Register components
+defineExpose({
+    isActive,
+    castDataByType
+});
+
 </script>
 
 <style lang="css" scoped>

src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/index.js

@@ -2,6 +2,7 @@ import { createApp } from "vue";
 import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n';
 import { ontheflyMessages } from './i18n.js';
 import App from "./App.vue";
+import TranslatorPlugin from '../translatorPlugin'
 
 const i18n = _createI18n( ontheflyMessages );
 
@@ -30,6 +31,7 @@ containers.forEach((container) => {
         }
     })
     .use(i18n)
+    .use(TranslatorPlugin)
     .component('app', App)
     .mount(container);
 

src/Bundle/ChillMainBundle/translations/messages.fr.yml

@@ -765,4 +765,23 @@ wopi:
     invalid_title: Format incompatible
     invalid_message: Désolé, ce format de document n'est pas éditable en ligne.
 
-
+onthefly:
+    show:
+        person: Détails de l'usager
+        thirdparty: Détails du tiers
+        file_person: Ouvrir la fiche de l'usager
+        file_thirdparty: Voir le Tiers
+    edit:
+        person: Modifier un usager
+        thirdparty: Modifier un tiers
+    create:
+        button: Créer {q}
+        title:
+            default: Création d'un nouvel usager ou d'un tiers professionnel
+            person: Création d'un nouvel usager
+            thirdparty: Création d'un nouveau tiers professionnel
+        person: un nouvel usager
+        thirdparty: un nouveau tiers professionnel
+    addContact:
+        title: Créer un contact pour {q}
+    resource_comment_title: Un commentaire est associé à cet interlocuteur