✨ OrgDetail - edit contact

ref #50

src/components/OrgDetail.svelte

@@ -1,5 +1,8 @@
 <script>
-  import { RunnerOrganizationService } from "@odit/lfk-client-js";
+  import {
+    GroupContactService,
+    RunnerOrganizationService,
+  } from "@odit/lfk-client-js";
   import { _ } from "svelte-i18n";
   import Toastify from "toastify-js";
   import store from "../store";
@@ -11,15 +14,24 @@
   export let params;
   let orgdata = {};
   let original = {};
+  let contacts = [];
   $: data_loaded = false;
   $: data_changed = JSON.stringify(orgdata) === JSON.stringify(original);
   const promise = RunnerOrganizationService.runnerOrganizationControllerGetOne(
     params.orgid
   ).then((value) => {
     data_loaded = true;
+    if (value.contact) {
+      if (value.contact !== "null") {
+        value.contact = value.contact.id;
+      }
+    }
     orgdata = Object.assign(orgdata, value);
     original = Object.assign(original, value);
   });
+  GroupContactService.groupContactControllerGetAll().then((val) => {
+    contacts = val;
+  });
   let modal_open = false;
   let delete_org = {};
   function deleteOrganization() {
@@ -46,9 +58,11 @@
         text: "updating organization",
         duration: 2500,
       }).showToast();
+      let postdata = orgdata;
+      postdata.contact = postdata.contact === "null" ? null : postdata.contact;
       RunnerOrganizationService.runnerOrganizationControllerPut(
         original.id,
-        orgdata
+        postdata
       )
         .then((resp) => {
           Object.assign(original, orgdata);
@@ -209,13 +223,19 @@
       <label
         for="contact"
         class="font-medium text-gray-700">{$_('contact')}</label>
-      <input
+      <select
-        autocomplete="off"
-        placeholder={$_('contact')}
-        type="text"
-        bind:value={orgdata.contact}
         name="contact"
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
+        bind:value={orgdata.contact}
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2">
+        <option value="null">no contact</option>
+        {#each contacts as c}
+          <option value={c.id}>
+            {c.firstname}
+            {c.middlename || ''}
+            {c.lastname}
+          </option>
+        {/each}
+      </select>
     </div>
     <div class="text-sm w-full">
       <label

src/components/TeamDetail.svelte

@@ -228,7 +228,7 @@
         for="contact"
         class="font-medium text-gray-700">{$_('contact')}</label>
       <select
-        name="org"
+        name="contact"
         bind:value={teamdata.contact}
         class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2">
         <option value="null">no contact</option>