Add edit functionality for ThirdParty in OnTheFly.vue and refactor ThirdPartyEdit for consistency.

- Implemented dynamic component rendering in `OnTheFly.vue` for `thirdparty` type based on the `action` (`show`, `edit`, etc.).
- Added `ThirdPartyEdit` component with API integration for editing third parties.
- Introduced `thirdpartyToWriteThirdParty` function in the API for mapping `Thirdparty` to `ThirdPartyWrite` structure.
- Centralized validation handling in `ThirdPartyEdit.vue` using `useViolationList` composable and enhanced template conditions.
- Updated and extended API functions (`patchThirdparty`, etc.) and types to support third-party editing.

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

@@ -54,7 +54,7 @@
           ></PersonEdit>
       </template>
 
-      <template #body v-else-if="type === 'thirdparty'">
+      <template #body v-else-if="type === 'thirdparty' && action === 'show'">
         <on-the-fly-thirdparty
           :id="id"
           :type="type"
@@ -69,6 +69,10 @@
         </div>
       </template>
 
+      <template #body v-else-if="type === 'thirdparty' && action === 'edit'">
+        <ThirdPartyEdit ref="castEditThirdParty" action="edit" :id="id"></ThirdPartyEdit>
+      </template>
+
       <template #body v-else-if="parent">
         <on-the-fly-thirdparty
           :parent="parent"
@@ -131,6 +135,8 @@ import {
   THIRDPARTY_ADDCONTACT_TITLE,
 } from "translator";
 import PersonEdit from "ChillPersonAssets/vuejs/_components/OnTheFly/PersonEdit.vue";
+import ThirdPartyEdit from "ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdPartyEdit.vue";
+import ThirdParty from "ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdParty.vue";
 
 // Types
 type EntityType = "person" | "thirdparty";
@@ -169,7 +175,9 @@ const emit = defineEmits<{
 }>();
 
 type castEditPersonType = InstanceType<typeof PersonEdit>;
+type castEditThirdPartyType = InstanceType<typeof ThirdParty>;
 const castEditPerson = useTemplateRef<castEditPersonType>('castEditPerson')
+const castEditThirdParty = useTemplateRef<castEditThirdPartyType>('castEditThirdParty');
 
 const modal = ref<{ showModal: boolean; modalDialogClass: string }>({
   showModal: false,
@@ -311,9 +319,15 @@ async function saveAction() {
     if (null !== person) {
       emit("saveFormOnTheFly", {type: props.type, data: person})
     }
+  } else if (props.type === 'thirdparty') {
+    const thirdParty = await castEditThirdParty.value?.postThirdParty();
+    if (null !== thirdParty) {
+      emit("saveFormOnTheFly", {type: props.type, data: thirdParty })
+    }
   }
 }
 
+
 defineExpose({
   openModal,
   closeModal,

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/PersonEdit.vue

@@ -637,12 +637,12 @@ async function postPerson(): Promise<Person> {
       const createdPerson = await createPerson(person);
       emit("onPersonCreated", { person: createdPerson });
 
-      return createdPerson;
+      return Promise.resolve(createdPerson);
     } else if (props.id !== null) {
       const updatedPerson = await editPerson(person, props.id);
       emit("onPersonCreated", { person: updatedPerson });
 
-      return updatedPerson;
+      return Promise.resolve(updatedPerson);
     }
   } catch (e: unknown) {
     if (isValidationException<WritePersonViolationMap>(e)) {
@@ -651,7 +651,7 @@ async function postPerson(): Promise<Person> {
       toast.error(trans(PERSON_EDIT_ERROR_WHILE_SAVING));
     }
   }
-  throw "impossible case might happen...";
+  throw "'action' is not create, or edit with a not-null id";
 }
 
 onMounted(() => {

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_api/OnTheFly.ts

@@ -1,7 +1,7 @@
 /*
  * GET a thirdparty by id
  */
-import {Thirdparty, ThirdPartyWrite} from '../../types';
+import {isThirdpartyChild, isThirdpartyCompany, isThirdpartyContact, Thirdparty, ThirdPartyWrite} from '../../types';
 import {makeFetch} from "ChillMainAssets/lib/api/apiMethods";
 
 export const getThirdparty = async (id: number) : Promise<Thirdparty> => {
@@ -14,6 +14,33 @@ export const getThirdparty = async (id: number) : Promise<Thirdparty> => {
   });
 };
 
+export const thirdpartyToWriteThirdParty = (t: Thirdparty): ThirdPartyWrite => {
+  // Determine kind-specific fields using available type guards
+  const isCompany = isThirdpartyCompany(t);
+  const isContact = isThirdpartyContact(t);
+  const isChild = isThirdpartyChild(t);
+
+  return {
+    type: 'thirdparty',
+    kind: t.kind,
+    civility:
+      (isContact || isChild) && t.civility
+        ? { type: 'chill_main_civility', id: t.civility.id }
+        : null,
+    profession: (isContact || isChild) ? (t.profession ?? '') : '',
+    firstname: isCompany ? '' : (t.firstname ?? ''),
+    name: isCompany
+      ? (t.nameCompany ?? '')
+      : (t.name ?? ''),
+    email: t.email ?? '',
+    telephone: t.telephone ?? '',
+    telephone2: t.telephone2 ?? '',
+    address: null,
+    comment: isChild ? (t.comment ?? '') : '',
+    parent: isChild && t.parent ? { type: 'thirdparty', id: t.parent.id } : null,
+  };
+};
+
 export interface WriteThirdPartyViolationMap
 extends Record<string, Record<string, string>> {
   email: {
@@ -42,7 +69,7 @@ export const createThirdParty = async (body: ThirdPartyWrite) => {
 /*
  * PATCH an existing thirdparty
  */
-export const patchThirdparty = async (id: number, body: ThirdPartyWrite) => {
+export const patchThirdparty = async (id: number, body: ThirdPartyWrite): Promise<Thirdparty> => {
   const url = `/api/1.0/thirdparty/thirdparty/${id}.json`;
   return makeFetch('PATCH', url, body);
 };

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_components/OnTheFly/ThirdPartyEdit.vue

@@ -1,13 +1,13 @@
 <template>
   <div>
-    <div v-if="parent">
+    <div v-if="resolvedParent">
       <div class="parent-info">
         <i class="fa fa-li fa-hand-o-right"/>
         <b class="me-2">{{ trans(THIRDPARTY_MESSAGES_CHILD_OF) }}</b>
-        <span class="chill-entity badge-thirdparty">{{ parent.text }}</span>
+        <span class="chill-entity badge-thirdparty">{{ resolvedParent.text }}</span>
       </div>
     </div>
-    <div class="form-floating mb-3" v-else-if="props.action !== 'addContact'">
+    <div class="form-floating mb-3" v-else-if="props.action === 'create'">
       <div class="form-check">
         <input
           class="form-check-input mt-0"
@@ -39,10 +39,10 @@
         </label>
       </div>
     </div>
-    <div v-else>
+    <div v-else-if="resolvedParent">
       <p>Contact de&nbsp;:</p>
       <third-party-render-box
-        :thirdparty="props.parent"
+        :thirdparty="resolvedParent"
         :options="{
           addInfo: true,
           addEntity: false,
@@ -304,7 +304,12 @@
 import {ref, reactive, computed, onMounted, getCurrentInstance} from 'vue'
 import ThirdPartyRenderBox from '../Entity/ThirdPartyRenderBox.vue'
 import AddAddress from "ChillMainAssets/vuejs/Address/components/AddAddress.vue";
-import {createThirdParty, getThirdparty, WriteThirdPartyViolationMap} from '../../_api/OnTheFly'
+import {
+  createThirdParty,
+  getThirdparty, patchThirdparty,
+  thirdpartyToWriteThirdParty,
+  WriteThirdPartyViolationMap
+} from '../../_api/OnTheFly'
 import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue'
 import {localizeString as _localizeString} from 'ChillMainAssets/lib/localizationHelper/localizationHelper'
 import {
@@ -324,7 +329,14 @@ import {
   createPerson,
   getCivilities, WritePersonViolationMap,
 } from "ChillPersonAssets/vuejs/_api/OnTheFly";
-import {Thirdparty, ThirdpartyCompany, ThirdPartyKind, ThirdPartyWrite} from "../../../types";
+import {
+  isThirdpartyChild,
+  isThirdpartyCompany,
+  Thirdparty,
+  ThirdpartyCompany,
+  ThirdPartyKind,
+  ThirdPartyWrite
+} from "../../../types";
 import {Civility, SetCivility} from "ChillMainAssets/types";
 import {isValidationException} from "ChillMainAssets/lib/api/apiMethods";
 import {useViolationList} from "ChillMainAssets/vuejs/_composables/violationList";
@@ -373,6 +385,8 @@ const thirdParty = ref<ThirdPartyWrite>({
   parent: null,
 });
 
+const originalThirdParty = ref<Thirdparty|null>(null);
+
 const civility = computed<number | null>({
   get: () => {
     if (thirdParty.value.civility !== null) {
@@ -425,6 +439,14 @@ const context = computed(() => {
   return ctx
 })
 
+const resolvedParent = computed<null|ThirdpartyCompany>(() => {
+  if (null !== originalThirdParty.value && isThirdpartyChild(originalThirdParty.value)) {
+    return originalThirdParty.value.parent;
+  }
+
+  return props.parent ?? null;
+})
+
 /**
  * Find the query items to display for suggestion
  */
@@ -465,7 +487,10 @@ onMounted(() => {
 });
 
 async function loadData(): Promise<void> {
-  if (!props.id) return Promise.resolve()
+  if (!props.id) return Promise.resolve();
+  const t = await getThirdparty(props.id);
+  originalThirdParty.value = t;
+  thirdParty.value = thirdpartyToWriteThirdParty(t);
 }
 
 function submitAddress(payload: { addressId: number }) {
@@ -494,19 +519,25 @@ function addQuery(query: string) {
 
 const violations = useViolationList<WriteThirdPartyViolationMap>();
 
-async function postThirdParty(): Promise<void> {
+async function postThirdParty(): Promise<Thirdparty> {
   try {
-    const tp = await createThirdParty(thirdParty.value);
+    if (props.action === 'edit' && props.id) {
-
+      const tp = await patchThirdparty(props.id, thirdParty.value);
-    emit('onThirdPartyCreated', {thirdParty: tp});
+      return Promise.resolve(tp);
+    } else if (props.action === 'addContact' || props.action === 'create') {
+      const tp = await createThirdParty(thirdParty.value);
+      emit('onThirdPartyCreated', {thirdParty: tp});
+      return Promise.resolve(tp);
+    }
   } catch (e: unknown) {
     if (isValidationException<WriteThirdPartyViolationMap>(e)) {
       violations.setValidationException(e);
     } else {
       toast.error("An error occurred while creating the third party");
-      throw e;
     }
+    throw e;
   }
+  throw "'action' is not edit with and id, or addContact or create";
 }
 
 </script>