frontend: fix create-site form refs

app/components/sites/SiteCreateModal.vue

@@ -8,7 +8,7 @@
             <span class="label-text">Nom du site</span>
           </label>
           <input
-            v-model="form.name"
+            v-model="siteName"
             type="text"
             placeholder="Ex: Usine principale"
             class="input input-bordered"
@@ -16,7 +16,7 @@
           />
         </div>
 
-        <SiteContactFormFields :form="props.site" />
+        <SiteContactFormFields :form="siteRef" />
 
         <div class="modal-action">
           <button type="button" class="btn" @click="emit('close')">
@@ -31,22 +31,39 @@
   </div>
 </template>
 
-<script setup>
+<script setup lang="ts">
-import { toRefs } from 'vue'
+import { computed, toRef } from 'vue'
+import type { PropType } from 'vue'
 import SiteContactFormFields from '~/components/sites/SiteContactFormFields.vue'
 
+type SiteForm = {
+  name: string
+  contactName: string
+  contactPhone: string
+  contactAddress: string
+  contactPostalCode: string
+  contactCity: string
+}
+
 const props = defineProps({
   visible: {
     type: Boolean,
     default: false
   },
   site: {
-    type: Object,
+    type: Object as PropType<SiteForm>,
     required: true
   }
 })
 
 const emit = defineEmits(['close', 'submit'])
 
-const form = toRefs(props.site)
+const siteRef = toRef(props, 'site')
+
+const siteName = computed({
+  get: () => siteRef.value.name,
+  set: (value: string) => {
+    siteRef.value.name = value
+  }
+})
 </script>