From eed6633ad576ccb872e17c54480e7298cd88fbfa Mon Sep 17 00:00:00 2001
From: Barry Brands <barrybrands02@hotmail.com>
Date: Fri, 23 Feb 2024 15:17:47 +0100
Subject: [PATCH 1/5] Makes the afdeling field required and get the right
 afdeling value

---
 src/views/AfhandelingView.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/AfhandelingView.vue b/src/views/AfhandelingView.vue
index 8740a9d..f671d02 100644
--- a/src/views/AfhandelingView.vue
+++ b/src/views/AfhandelingView.vue
@@ -389,7 +389,7 @@
             <div v-if="afdelingen.success && afdelingen.data.length">
               <select
                 v-model="vraag.contactverzoek.afdeling"
-                class="utrecht-select utrecht-select--html-select"
+                class="utrecht-select utrecht-select--html-select required"
                 :id="'verzoek-afdeling' + idx"
               >
                 <option
@@ -561,7 +561,7 @@ const saveVraag = async (vraag: Vraag, gespreksId?: string) => {
       },
       primaireVraagWeergave: vraag.primaireVraag?.title,
       afwijkendOnderwerp: vraag.afwijkendOnderwerp || undefined,
-      afdeling: vraag.afdeling,
+      afdeling: vraag.contactverzoek.afdeling,
     });
 
     await koppelKlanten(vraag, contactverzoek.id);

From e749aa134088b399a70de0d3e4290489ab7fc623 Mon Sep 17 00:00:00 2001
From: Remko <remko@conduction.nl>
Date: Fri, 23 Feb 2024 15:37:16 +0100
Subject: [PATCH 2/5] refactor

---
 src/views/AfhandelingView.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/views/AfhandelingView.vue b/src/views/AfhandelingView.vue
index f671d02..abc50cd 100644
--- a/src/views/AfhandelingView.vue
+++ b/src/views/AfhandelingView.vue
@@ -382,15 +382,16 @@
               v-model="vraag.afwijkendOnderwerp"
             />
 
-            <label class="utrecht-form-label" :for="'verzoek-afdeling' + idx"
+            <label class="utrecht-form-label required" :for="'verzoek-afdeling' + idx"
               >Afdeling</label
             >
 
             <div v-if="afdelingen.success && afdelingen.data.length">
               <select
                 v-model="vraag.contactverzoek.afdeling"
-                class="utrecht-select utrecht-select--html-select required"
+                class="utrecht-select utrecht-select--html-select"
                 :id="'verzoek-afdeling' + idx"
+                required
               >
                 <option
                   v-for="afdeling in afdelingen.data"

From 1bb6fbad988197ad509feec4c32b8746044655ad Mon Sep 17 00:00:00 2001
From: Remko <remko@conduction.nl>
Date: Tue, 5 Mar 2024 10:03:33 +0100
Subject: [PATCH 3/5] Updated contact form

---
 src/components/ApplicationMessage.vue         |  9 ++-
 src/components/SearchCombobox.vue             |  1 -
 src/features/contactmoment/service.ts         | 35 ++++++-----
 .../ContactverzoekFormulier.vue               | 23 +++++--
 src/features/klant/bedrijf/BedrijfZoeker.vue  | 33 ++++++++--
 .../klant/bedrijf/HandelsregisterGegevens.vue | 11 ++--
 src/features/klant/bedrijf/service.ts         |  3 +-
 src/features/klant/persoon/PersoonZoeker.vue  | 22 +++++--
 src/features/klant/persoon/service.ts         | 13 ++--
 src/features/login/service.ts                 |  8 ++-
 src/features/search/MedewerkerSearch.vue      |  1 -
 .../shared/get-contactmomenten-service.ts     |  8 ++-
 src/features/werkbericht/WerkBerichten.vue    |  9 ++-
 src/features/werkbericht/service.ts           | 33 ++++------
 src/features/zaaksysteem/ZaakZoeker.vue       | 11 +++-
 src/features/zaaksysteem/service.ts           | 10 ++-
 src/services/fetch-logged-in.ts               |  8 ++-
 src/services/gateway.ts                       | 28 +++------
 src/services/index.ts                         |  3 +-
 src/views/AfhandelingView.vue                 | 23 ++++---
 src/views/BedrijfDetailView.vue               | 61 +++++++++++++++----
 src/views/ContactmomentenHistorieView.vue     | 28 +++++++--
 src/views/LoginView.vue                       |  2 +-
 src/views/PersoonDetailView.vue               | 53 ++++++++++++----
 24 files changed, 290 insertions(+), 146 deletions(-)

diff --git a/src/components/ApplicationMessage.vue b/src/components/ApplicationMessage.vue
index 980dcae..a8e0dd9 100644
--- a/src/components/ApplicationMessage.vue
+++ b/src/components/ApplicationMessage.vue
@@ -12,7 +12,12 @@ const props = defineProps({
   messageType: {
     type: String as PropType<"error" | "confirm" | "warning" | "info">,
     validator: (value) => {
-      return value == "error" || value == "confirm" || value == "warning" || value == "info";
+      return (
+        value == "error" ||
+        value == "confirm" ||
+        value == "warning" ||
+        value == "info"
+      );
     },
     default: "confirm",
   },
@@ -50,7 +55,7 @@ article {
 
 .info {
   background-color: var(--color-info);
-  color: black
+  color: black;
 }
 
 .fade {
diff --git a/src/components/SearchCombobox.vue b/src/components/SearchCombobox.vue
index d0ecd62..cdf360b 100644
--- a/src/components/SearchCombobox.vue
+++ b/src/components/SearchCombobox.vue
@@ -2,7 +2,6 @@
   <input
     v-bind="$attrs"
     :id="inputId"
-    :required="required"
     type="search"
     autocomplete="off"
     role="combobox"
diff --git a/src/features/contactmoment/service.ts b/src/features/contactmoment/service.ts
index a1acc86..f830d7f 100644
--- a/src/features/contactmoment/service.ts
+++ b/src/features/contactmoment/service.ts
@@ -79,17 +79,20 @@ export async function koppelKlant({
     _klantId = await getAnonymousUserId(); // we're setting the "klant" to an anonymous one which is readily available in the data set
   }
 
-  return fetchLoggedIn(window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten", {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-    },
-    body: JSON.stringify({
-      klant: _klantId,
-      contactmoment: contactmomentId,
-      rol: "gesprekspartner",
-    }),
-  }).then(throwIfNotOk) as Promise<void>;
+  return fetchLoggedIn(
+    window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten",
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        klant: _klantId,
+        contactmoment: contactmomentId,
+        rol: "gesprekspartner",
+      }),
+    }
+  ).then(throwIfNotOk) as Promise<void>;
 }
 
 export function useContactverzoekenByKlantId(
@@ -97,7 +100,9 @@ export function useContactverzoekenByKlantId(
   page: Ref<number>
 ) {
   function getUrl() {
-    const url = new URL(window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten");
+    const url = new URL(
+      window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten"
+    );
     url.searchParams.set(
       "_order[embedded.contactmoment.registratiedatum]",
       "desc"
@@ -110,7 +115,6 @@ export function useContactverzoekenByKlantId(
     url.searchParams.set("_page", page.value.toString());
     url.searchParams.set("embedded.klant._self.id", id.value);
     url.searchParams.set("embedded.contactmoment.todo", "IS NOT NULL");
-    url.searchParams.set("klant", "IS NOT NULL");
     url.searchParams.set("contactmoment", "IS NOT NULL");
     return url.toString();
   }
@@ -127,7 +131,9 @@ export function useContactverzoekenByUserId(
   page: Ref<number>
 ) {
   function getUrl() {
-    const url = new URL(window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten");
+    const url = new URL(
+      window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten"
+    );
     url.searchParams.set(
       "_order[embedded.contactmoment.registratiedatum]",
       "desc"
@@ -140,7 +146,6 @@ export function useContactverzoekenByUserId(
     url.searchParams.set("_page", page.value.toString());
     url.searchParams.set("_self.owner.id", id.value);
     url.searchParams.set("embedded.contactmoment.todo", "IS NOT NULL");
-    url.searchParams.set("klant", "IS NOT NULL");
     url.searchParams.set("contactmoment", "IS NOT NULL");
     return url.toString();
   }
diff --git a/src/features/contactverzoek/ContactverzoekFormulier.vue b/src/features/contactverzoek/ContactverzoekFormulier.vue
index a7cef6d..c4041d8 100644
--- a/src/features/contactverzoek/ContactverzoekFormulier.vue
+++ b/src/features/contactverzoek/ContactverzoekFormulier.vue
@@ -6,16 +6,18 @@
       class="utrecht-form-label"
       v-if="afdelingen.success && afdelingen.data.length"
     >
-      Afdeling
+      <span class="required"> Contactverzoek versturen naar afdeling </span>
       <select
         v-model="afdeling"
         name="afdeling"
         class="utrecht-select utrecht-select--html-select"
+        :required="true"
       >
         <option
           v-for="afdeling in afdelingen.data"
           :key="afdeling.id"
           :value="afdeling.id"
+          :required="true"
         >
           {{ afdeling.name }}
         </option>
@@ -23,11 +25,10 @@
     </label>
 
     <label class="utrecht-form-label">
-      <span class="required">Contactverzoek versturen naar</span>
+      <span>Bevestiging mail versturen naar medewerker</span>
       <medewerker-search
         class="utrecht-textbox utrecht-textbox--html-input"
         v-model="medewerker"
-        :defaultValue="medewerker"
       />
     </label>
 
@@ -55,6 +56,7 @@ import MedewerkerSearch from "@/features/search/MedewerkerSearch.vue";
 import { computed } from "@vue/reactivity";
 import { useAfdelingen } from "./service";
 import SimpleSpinner from "@/components/SimpleSpinner.vue";
+import { useCurrentUser } from "@/features/login/service.ts";
 
 const props = defineProps<{
   huidigeVraag: Vraag;
@@ -62,8 +64,21 @@ const props = defineProps<{
 
 const contactmomentStore = useContactmomentStore();
 
+const user = JSON.parse(JSON.stringify(useCurrentUser()));
+
+function medewerkerInit() {
+  if (window.sessionStorage.getItem("medewerkerInit" === "true")) return;
+  window.sessionStorage.setItem("medewerkerInit", "true");
+  contactmomentStore.updateContactverzoek({
+    ...props.huidigeVraag.contactverzoek,
+    medewerker: user.data.email,
+  });
+}
+
+const callMedewerkerInit = medewerkerInit();
+
 const medewerker = computed({
-  get: () => props.huidigeVraag.contactverzoek.medewerker,
+  get: () => props.huidigeVraag.contactverzoek.medewerker || user.data.email,
   set(medewerker) {
     if (!medewerker) return;
 
diff --git a/src/features/klant/bedrijf/BedrijfZoeker.vue b/src/features/klant/bedrijf/BedrijfZoeker.vue
index fa63387..c8bdcf8 100644
--- a/src/features/klant/bedrijf/BedrijfZoeker.vue
+++ b/src/features/klant/bedrijf/BedrijfZoeker.vue
@@ -3,8 +3,26 @@
     <fieldset class="radio-group">
       <legend>Waar wil je op zoeken?</legend>
       <label v-for="(label, field) in labels" :key="field">
-        <input type="radio" :value="field" v-model="state.field" required :disabled="label === 'E-mailadres' || label === 'Telefoonnummer' || label === 'Postcode + Huisnummer' "  />
-        <span :class="{disabled: label === 'E-mailadres' || label === 'Telefoonnummer' || label === 'Postcode + Huisnummer'}">{{ label }}</span>
+        <input
+          type="radio"
+          :value="field"
+          v-model="state.field"
+          required
+          :disabled="
+            label === 'E-mailadres' ||
+            label === 'Telefoonnummer' ||
+            label === 'Postcode + Huisnummer'
+          "
+        />
+        <span
+          :class="{
+            disabled:
+              label === 'E-mailadres' ||
+              label === 'Telefoonnummer' ||
+              label === 'Postcode + Huisnummer',
+          }"
+          >{{ label }}</span
+        >
       </label>
     </fieldset>
     <fieldset class="search-bar">
@@ -39,12 +57,19 @@
       />
     </template>
     <application-message
-      v-if="bedrijven.error && bedrijven.error.message === 'Empty Results' || bedrijven.error.message === '404'"
+      v-if="
+        (bedrijven.error && bedrijven.error.message === 'Empty Results') ||
+        bedrijven.error.message === '404'
+      "
       messageType="info"
       message="Geen resultaten gevonden"
     />
     <application-message
-      v-if="bedrijven.error && bedrijven.error.message !== 'Empty Results' && bedrijven.error.message !== '404'"
+      v-if="
+        bedrijven.error &&
+        bedrijven.error.message !== 'Empty Results' &&
+        bedrijven.error.message !== '404'
+      "
       messageType="error"
       message="Er is een fout opgetreden"
     />
diff --git a/src/features/klant/bedrijf/HandelsregisterGegevens.vue b/src/features/klant/bedrijf/HandelsregisterGegevens.vue
index f9d1248..2afca28 100644
--- a/src/features/klant/bedrijf/HandelsregisterGegevens.vue
+++ b/src/features/klant/bedrijf/HandelsregisterGegevens.vue
@@ -1,9 +1,9 @@
 <template>
   <article class="details-block">
     <utrecht-heading :level="2"> Gegevens Handelsregister</utrecht-heading>
-    
+
     <div v-for="(bedrijf, index) in bedrijven.page">
-      <dl  >
+      <dl>
         <dt>Bedrijfsnaam</dt>
         <dd>{{ bedrijf.bedrijfsnaam }}</dd>
         <dt>KvK-nummer</dt>
@@ -34,7 +34,10 @@
         <dt>Plaats</dt>
         <dd>{{ bedrijf.woonplaats }}</dd>
       </dl>
-      <hr v-if="index + 1 !== bedrijven?.page?.length" class="utrecht-separator separator"/>
+      <hr
+        v-if="index + 1 !== bedrijven?.page?.length"
+        class="utrecht-separator separator"
+      />
     </div>
   </article>
 </template>
@@ -47,10 +50,8 @@ defineProps<{ bedrijven: Bedrijf }>();
 </script>
 
 <style scoped lang="scss">
-
 .separator {
   margin-block-start: 15px;
   margin-block-end: 15px;
 }
-   
 </style>
diff --git a/src/features/klant/bedrijf/service.ts b/src/features/klant/bedrijf/service.ts
index b5eeb55..665c3c5 100644
--- a/src/features/klant/bedrijf/service.ts
+++ b/src/features/klant/bedrijf/service.ts
@@ -124,8 +124,7 @@ export const useBedrijfByVestigingsnummer = (
     return url && url + "_single";
   };
 
-  const fetcher = (url: string) =>
-    searchBedrijvenInHandelsRegister(url);
+  const fetcher = (url: string) => searchBedrijvenInHandelsRegister(url);
 
   return ServiceResult.fromFetcher(getUrl, fetcher, {
     getUniqueId,
diff --git a/src/features/klant/persoon/PersoonZoeker.vue b/src/features/klant/persoon/PersoonZoeker.vue
index c0ffc7f..e4cd8e7 100644
--- a/src/features/klant/persoon/PersoonZoeker.vue
+++ b/src/features/klant/persoon/PersoonZoeker.vue
@@ -56,12 +56,19 @@
         />
       </template>
       <application-message
-        v-if="klanten.error && klanten.error.message === `Empty Results` || klanten.error.message === `404`"
+        v-if="
+          (klanten.error && klanten.error.message === `Empty Results`) ||
+          klanten.error.message === `404`
+        "
         messageType="info"
         message="Geen resultaten gevonden"
       />
       <application-message
-        v-if="klanten.error && klanten.error.message !== `Empty Results` && klanten.error.message !== '404'"
+        v-if="
+          klanten.error &&
+          klanten.error.message !== `Empty Results` &&
+          klanten.error.message !== '404'
+        "
         messageType="error"
         message="Er is een fout opgetreden"
       />
@@ -82,12 +89,19 @@
         />
       </template>
       <application-message
-        v-if="personen.error && personen.error.message === `Empty Results` || personen.error.message === `404`"
+        v-if="
+          (personen.error && personen.error.message === `Empty Results`) ||
+          personen.error.message === `404`
+        "
         messageType="info"
         message="Geen resultaten gevonden"
       />
       <application-message
-        v-if="personen.error && personen.error.message !== `Empty Results` && personen.error.message !== `404`"
+        v-if="
+          personen.error &&
+          personen.error.message !== `Empty Results` &&
+          personen.error.message !== `404`
+        "
         messageType="error"
         message="Er is een fout opgetreden"
       />
diff --git a/src/features/klant/persoon/service.ts b/src/features/klant/persoon/service.ts
index dd24f2c..a8996c8 100644
--- a/src/features/klant/persoon/service.ts
+++ b/src/features/klant/persoon/service.ts
@@ -16,7 +16,8 @@ import { mutate } from "swrv";
 import type { Ref } from "vue";
 import type { Persoon } from "./types";
 
-const personenRootUrl = window.gatewayBaseUri + "/api/brp_proxy/ingeschrevenpersonen";
+const personenRootUrl =
+  window.gatewayBaseUri + "/api/brp_proxy/ingeschrevenpersonen";
 
 type QueryParam = [string, string][];
 
@@ -48,17 +49,11 @@ export function persoonQuery<K extends PersoonSearchField>(
 const queryDictionary: PersoonQueryParams = {
   bsn: (search) => [["burgerservicenummer", search]],
   geboortedatumAchternaam: (search) => [
-    [
-      "geboorte__datum",
-      formatIsoDate(search.geboortedatum),
-    ],
+    ["geboorte__datum", formatIsoDate(search.geboortedatum)],
     ["naam__geslachtsnaam", search.achternaam],
   ],
   postcodeHuisnummer: ({ postcode, huisnummer }) => [
-    [
-      "verblijfplaats__postcode",
-      `${postcode.numbers}${postcode.digits}`,
-    ],
+    ["verblijfplaats__postcode", `${postcode.numbers}${postcode.digits}`],
 
     ["verblijfplaats__huisnummer", huisnummer],
   ],
diff --git a/src/features/login/service.ts b/src/features/login/service.ts
index 90006e4..58ba4d0 100644
--- a/src/features/login/service.ts
+++ b/src/features/login/service.ts
@@ -7,10 +7,12 @@ const anonymousUser = Object.freeze({
   isLoggedIn: false,
 });
 
-async function fetchUser(url: string): Promise<User> {
+export async function fetchUser(url: string): Promise<User> {
   const response = await fetch(url, {
     headers: {
-      Authorization: `Bearer ${Cookies.get("jwt") ?? window.sessionStorage.getItem("jwt")}`,
+      Authorization: `Bearer ${
+        Cookies.get("jwt") ?? window.sessionStorage.getItem("jwt")
+      }`,
     },
   });
 
@@ -45,6 +47,6 @@ export const logOut = () =>
     } else {
       Cookies.remove("jwt");
       Cookies.remove("userId");
-      window.sessionStorage.removeItem("jwt")
+      window.sessionStorage.removeItem("jwt");
     }
   });
diff --git a/src/features/search/MedewerkerSearch.vue b/src/features/search/MedewerkerSearch.vue
index b7837c8..7cdf9ec 100644
--- a/src/features/search/MedewerkerSearch.vue
+++ b/src/features/search/MedewerkerSearch.vue
@@ -7,7 +7,6 @@
       :result="result"
       :list-items="datalistItems"
       :exact-match="true"
-      :required="true"
     />
   </div>
 </template>
diff --git a/src/features/shared/get-contactmomenten-service.ts b/src/features/shared/get-contactmomenten-service.ts
index 23ae84f..b84cde5 100644
--- a/src/features/shared/get-contactmomenten-service.ts
+++ b/src/features/shared/get-contactmomenten-service.ts
@@ -110,7 +110,9 @@ export function useContactmomentenByKlantId(
   page: Ref<number>
 ) {
   function getUrl() {
-    const url = new URL(window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten");
+    const url = new URL(
+      window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten"
+    );
     url.searchParams.set(
       "_order[embedded.contactmoment.registratiedatum]",
       "desc"
@@ -135,7 +137,9 @@ export function useContactmomentenByKlantId(
 
 export function useContactmomentenByUserId(id: Ref<string>, page: Ref<number>) {
   function getUrl() {
-    const url = new URL(window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten");
+    const url = new URL(
+      window.gatewayBaseUri + "/api/kic/v1/klantcontactmomenten"
+    );
 
     url.searchParams.set(
       "_order[embedded.contactmoment.registratiedatum]",
diff --git a/src/features/werkbericht/WerkBerichten.vue b/src/features/werkbericht/WerkBerichten.vue
index 07f99e2..f27b646 100644
--- a/src/features/werkbericht/WerkBerichten.vue
+++ b/src/features/werkbericht/WerkBerichten.vue
@@ -2,8 +2,13 @@
   <section>
     <utrecht-heading :level="level">{{ header }}</utrecht-heading>
 
-    <paragraph v-if="berichten.state === 'error'">{{
-      berichten.error.message === 'Empty Results' || berichten.error.message === '404' ? getEmptyErrorMessage(berichten.error) : getErrorMessage(berichten.error)}}
+    <paragraph v-if="berichten.state === 'error'"
+      >{{
+        berichten.error.message === "Empty Results" ||
+        berichten.error.message === "404"
+          ? getEmptyErrorMessage(berichten.error)
+          : getErrorMessage(berichten.error)
+      }}
     </paragraph>
 
     <template v-else-if="berichten.state === 'success'">
diff --git a/src/features/werkbericht/service.ts b/src/features/werkbericht/service.ts
index 09c31af..69a6255 100644
--- a/src/features/werkbericht/service.ts
+++ b/src/features/werkbericht/service.ts
@@ -42,9 +42,7 @@ function maxDate(dates: Date[]) {
  * @param jsonObject a json object
  * @param getBerichtTypeNameById a function to get the name of a berichttype from it's id
  */
-function parseWerkbericht(
-  jsonObject: any,
-): Werkbericht {
+function parseWerkbericht(jsonObject: any): Werkbericht {
   if (
     typeof jsonObject?.embedded?.title?.rendered !== "string" ||
     typeof jsonObject?.embedded?.acf?.publicationContent !== "string" ||
@@ -61,9 +59,7 @@ function parseWerkbericht(
 
   const skillIds = jsonObject?.embedded?.acf?.publicationSkill;
   const skillNames = Array.isArray(skillIds)
-    ? skillIds.map(
-      (skill) => skill.name || "onbekend"
-    )
+    ? skillIds.map((skill) => skill.name || "onbekend")
     : ["onbekend"];
 
   const dateCreated = parseDateStrWithTimezone(jsonObject.date);
@@ -183,15 +179,14 @@ export function useWerkberichten(
     params.push(["extend[]", "acf"]);
 
     if (typeId) {
-      const typeData = typesResult.data.entries.find((entry) => entry[0] === typeId)
-      if (!typeData) return ""
+      const typeData = typesResult.data.entries.find(
+        (entry) => entry[0] === typeId
+      );
+      if (!typeData) return "";
 
-      const typeName = typeData[1] === "nieuws" ? "nieuwsbericht" : typeData[1]
+      const typeName = typeData[1] === "nieuws" ? "nieuwsbericht" : typeData[1];
 
-      params.push([
-        "openpub-type",
-        _.upperFirst(typeName),
-      ]);
+      params.push(["openpub-type", _.upperFirst(typeName)]);
     }
 
     if (search) {
@@ -207,9 +202,10 @@ export function useWerkberichten(
 
     if (skillIds?.length) {
       skillIds.forEach((skillId) => {
-
-        const skillName = skillsResult.data.entries.find((entry) => entry[0] === skillId)
-        if (!skillName) return ""
+        const skillName = skillsResult.data.entries.find(
+          (entry) => entry[0] === skillId
+        );
+        if (!skillName) return "";
 
         params.push([
           "openpub-audience[]",
@@ -257,10 +253,7 @@ export function useWerkberichten(
         page: parameters?.value.page,
         results: sortedBerichten,
       },
-      (bericht: any) =>
-        parseWerkbericht(
-          bericht,
-        )
+      (bericht: any) => parseWerkbericht(bericht)
     );
   }
 
diff --git a/src/features/zaaksysteem/ZaakZoeker.vue b/src/features/zaaksysteem/ZaakZoeker.vue
index c3811da..5ec785f 100644
--- a/src/features/zaaksysteem/ZaakZoeker.vue
+++ b/src/features/zaaksysteem/ZaakZoeker.vue
@@ -16,12 +16,19 @@
 
     <template v-if="store.currentSearch">
       <application-message
-        v-if="zaken.error && zaken.error.message === `Empty Results` || zaken.error.message === `404`"
+        v-if="
+          (zaken.error && zaken.error.message === `Empty Results`) ||
+          zaken.error.message === `404`
+        "
         messageType="info"
         message="Geen resultaten gevonden"
       />
       <application-message
-        v-if="zaken.error && zaken.error.message !== `Empty Results` && zaken.error.message !== `404`"
+        v-if="
+          zaken.error &&
+          zaken.error.message !== `Empty Results` &&
+          zaken.error.message !== `404`
+        "
         messageType="error"
         message="Er is een probleem opgetreden."
       />
diff --git a/src/features/zaaksysteem/service.ts b/src/features/zaaksysteem/service.ts
index 918653c..1eeb58b 100644
--- a/src/features/zaaksysteem/service.ts
+++ b/src/features/zaaksysteem/service.ts
@@ -34,17 +34,15 @@ const getNamePerRoltype = (zaak: any, roletype: Roltype) => {
   return name || ONBEKEND;
 };
 
-
 const IsoAndIntConverter = (date: any) => {
   if (Number.isNaN(parseInt(date, 10))) {
-    return moment.duration(date).asDays()
+    return moment.duration(date).asDays();
   }
   if (!Number.isNaN(parseInt(date, 10))) {
-    return parseInt(date, 10)
+    return parseInt(date, 10);
   }
-  return 0
-}
-
+  return 0;
+};
 
 const mapZaakDetails = (zaak: any) => {
   const startdatum = zaak.startdatum ? new Date(zaak.startdatum) : undefined;
diff --git a/src/services/fetch-logged-in.ts b/src/services/fetch-logged-in.ts
index e87400d..3bb7d09 100644
--- a/src/services/fetch-logged-in.ts
+++ b/src/services/fetch-logged-in.ts
@@ -6,7 +6,7 @@ type FetchArgs = Parameters<typeof fetch>;
 type FetchReturn = ReturnType<typeof fetch>;
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
-const empty = () => { };
+const empty = () => {};
 
 const waitForLogin = {
   promise: Promise.resolve(),
@@ -33,7 +33,7 @@ export function fetchLoggedIn(...args: FetchArgs): FetchReturn {
   if (!validateSession()) {
     Cookies.remove("jwt");
     Cookies.remove("userId");
-    window.sessionStorage.removeItem("jwt")
+    window.sessionStorage.removeItem("jwt");
   }
 
   const init = args[1] || {};
@@ -49,7 +49,9 @@ export function fetchLoggedIn(...args: FetchArgs): FetchReturn {
     ...options,
     headers: {
       ...options?.headers,
-      Authorization: `Bearer ${Cookies.get("jwt") ?? window.sessionStorage.getItem("jwt")}`,
+      Authorization: `Bearer ${
+        Cookies.get("jwt") ?? window.sessionStorage.getItem("jwt")
+      }`,
     },
   };
 
diff --git a/src/services/gateway.ts b/src/services/gateway.ts
index e945a17..bdf400a 100644
--- a/src/services/gateway.ts
+++ b/src/services/gateway.ts
@@ -1,5 +1,5 @@
 import type { Paginated } from "./pagination";
-import _ from "lodash"
+import _ from "lodash";
 
 export async function parsePagination<T>(
   json: unknown,
@@ -8,13 +8,8 @@ export async function parsePagination<T>(
   const { results, limit, total, page, pages } = json as {
     [key: string]: unknown;
   };
-  
-  if (
-    results === "" || _.isEmpty(results)
-  )
-    throw new Error(
-      "Empty Results"
-    );
+
+  if (results === "" || _.isEmpty(results)) throw new Error("Empty Results");
 
   if (
     !Array.isArray(results) ||
@@ -78,23 +73,18 @@ export async function parseWithoutPagination<T>(
     [key: string]: any;
   };
 
-  if (
-    _embedded === "" || _.isEmpty(_embedded)
-  )
-    throw new Error(
-      "Empty Results"
-    );
-
-  if (
-    !Array.isArray(_embedded?.ingeschrevenpersonen)
+  if (_embedded === "" || _.isEmpty(_embedded))
+    throw new Error("Empty Results");
 
-  )
+  if (!Array.isArray(_embedded?.ingeschrevenpersonen))
     throw new Error(
       "unexpected in gateway json. expected pagination: " + JSON.stringify(json)
     );
 
   // just in case the mapper is async, we wrap the result in a Promise
-  const promises = _embedded?.ingeschrevenpersonen.map((x: any) => Promise.resolve(map(x)));
+  const promises = _embedded?.ingeschrevenpersonen.map((x: any) =>
+    Promise.resolve(map(x))
+  );
 
   return {
     page: await Promise.all(promises),
diff --git a/src/services/index.ts b/src/services/index.ts
index a24b599..f7342f9 100644
--- a/src/services/index.ts
+++ b/src/services/index.ts
@@ -44,7 +44,8 @@ export function createLookupList<K, V>(entries: [K, V][]): LookupList<K, V> {
 }
 
 export function throwIfNotOk(response: Response) {
-  if (!response.ok) throw new Error(response.status === 404 ? "404" : response.statusText);
+  if (!response.ok)
+    throw new Error(response.status === 404 ? "404" : response.statusText);
   return response as Response & { ok: true };
 }
 
diff --git a/src/views/AfhandelingView.vue b/src/views/AfhandelingView.vue
index abc50cd..c7cef91 100644
--- a/src/views/AfhandelingView.vue
+++ b/src/views/AfhandelingView.vue
@@ -303,15 +303,14 @@
               <div class="contactverzoek-container">
                 <div>
                   <label
-                    class="utrecht-form-label required"
+                    class="utrecht-form-label"
                     :for="'verzoek-medewerker' + idx"
-                    >Contactverzoek versturen naar</label
+                    >Bevestiging mail versturen naar medewerker</label
                   >
                   <medewerker-search
                     v-model="vraag.contactverzoek.medewerker"
                     :id="'verzoek-medewerker' + idx"
                     class="utrecht-textbox utrecht-textbox--html-input medewerker-search"
-                    required
                   />
                 </div>
 
@@ -381,9 +380,16 @@
               :id="'afwijkendOnderwerp' + idx"
               v-model="vraag.afwijkendOnderwerp"
             />
-
-            <label class="utrecht-form-label required" :for="'verzoek-afdeling' + idx"
-              >Afdeling</label
+            <br v-if="vraag.resultaat == 'Contactverzoek gemaakt'" />
+            <span v-if="vraag.resultaat == 'Contactverzoek gemaakt'">
+              Let op! Er wordt een e-mail verstuurd naar de gekozen
+              afdeling</span
+            >
+            <label
+              class="utrecht-form-label"
+              :class="{ required: vraag.resultaat == 'Contactverzoek gemaakt' }"
+              :for="'verzoek-afdeling' + idx"
+              >Contactverzoek versturen naar afdeling</label
             >
 
             <div v-if="afdelingen.success && afdelingen.data.length">
@@ -391,14 +397,15 @@
                 v-model="vraag.contactverzoek.afdeling"
                 class="utrecht-select utrecht-select--html-select"
                 :id="'verzoek-afdeling' + idx"
-                required
+                :required="vraag.resultaat == 'Contactverzoek gemaakt'"
               >
                 <option
                   v-for="afdeling in afdelingen.data"
                   :key="idx + afdeling.id"
                   :value="afdeling.id"
+                  :required="true"
                 >
-                  {{ afdeling.name }}
+                  {{ afdeling.email }} | {{ afdeling.name }}
                 </option>
               </select>
             </div>
diff --git a/src/views/BedrijfDetailView.vue b/src/views/BedrijfDetailView.vue
index bb0f93a..d1ef1b4 100644
--- a/src/views/BedrijfDetailView.vue
+++ b/src/views/BedrijfDetailView.vue
@@ -13,13 +13,20 @@
     <simple-spinner v-if="klant.loading" />
     <bedrijf-details v-else-if="klant.success" :klant="klant.data" />
     <application-message
-      v-if="klant.error && klant.error.message === 'Empty Results' || klant.error.message === '404'"
+      v-if="
+        (klant.error && klant.error.message === 'Empty Results') ||
+        klant.error.message === '404'
+      "
       message="Geen klant gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="klant.error && klant.error.message !== `Empty Results` && klant.error.message !== `404`"
+      v-if="
+        klant.error &&
+        klant.error.message !== `Empty Results` &&
+        klant.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de klant. Probeer het later nog eens."
       messageType="error"
     />
@@ -30,27 +37,41 @@
       :bedrijven="bedrijf.data"
     />
     <application-message
-      v-if="bedrijf.error && bedrijf.error.message === 'Empty Results' || bedrijf.error.message === '404'"
+      v-if="
+        (bedrijf.error && bedrijf.error.message === 'Empty Results') ||
+        bedrijf.error.message === '404'
+      "
       message="Geen bedrijf gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="bedrijf.error && bedrijf.error.message !== `Empty Results` && bedrijf.error.message !== `404`"
+      v-if="
+        bedrijf.error &&
+        bedrijf.error.message !== `Empty Results` &&
+        bedrijf.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de Handelsregister gegevens. Probeer het later nog eens."
       messageType="error"
     />
 
-
     <simple-spinner v-if="contactverzoeken.loading" />
     <application-message
-      v-if="contactverzoeken.error && contactverzoeken.error.message === 'Empty Results' || contactverzoeken.error.message === '404'"
+      v-if="
+        (contactverzoeken.error &&
+          contactverzoeken.error.message === 'Empty Results') ||
+        contactverzoeken.error.message === '404'
+      "
       message="Geen contactverzoeken gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="contactverzoeken.error && contactverzoeken.error.message !== `Empty Results` && contactverzoeken.error.message !== `404`"
+      v-if="
+        contactverzoeken.error &&
+        contactverzoeken.error.message !== `Empty Results` &&
+        contactverzoeken.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de contactverzoeken. Probeer het later nog eens."
       messageType="error"
     />
@@ -69,17 +90,23 @@
     <simple-spinner v-if="zaken.loading" />
 
     <application-message
-      v-if="zaken.error && zaken.error.message === 'Empty Results' || zaken.error.message === '404'"
+      v-if="
+        (zaken.error && zaken.error.message === 'Empty Results') ||
+        zaken.error.message === '404'
+      "
       message="Geen zaken gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="zaken.error && zaken.error.message !== `Empty Results` && zaken.error.message !== `404`"
+      v-if="
+        zaken.error &&
+        zaken.error.message !== `Empty Results` &&
+        zaken.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de zaken. Probeer het later nog eens."
       messageType="error"
     />
-    
 
     <template v-if="zaken.success && zaken.data.page.length">
       <utrecht-heading :level="2"> Zaken </utrecht-heading>
@@ -95,16 +122,24 @@
     <simple-spinner v-if="contactmomenten.loading" />
 
     <application-message
-      v-if="contactmomenten.error && contactmomenten.error.message === 'Empty Results' || contactmomenten.error.message === '404'"
+      v-if="
+        (contactmomenten.error &&
+          contactmomenten.error.message === 'Empty Results') ||
+        contactmomenten.error.message === '404'
+      "
       message="Geen contactmomenten gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="contactmomenten.error && contactmomenten.error.message !== `Empty Results` && contactmomenten.error.message !== `404`"
+      v-if="
+        contactmomenten.error &&
+        contactmomenten.error.message !== `Empty Results` &&
+        contactmomenten.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de contactmomenten. Probeer het later nog eens."
       messageType="error"
-    />   
+    />
 
     <template
       v-if="contactmomenten.success && contactmomenten.data.page.length"
diff --git a/src/views/ContactmomentenHistorieView.vue b/src/views/ContactmomentenHistorieView.vue
index a0d53bd..866e843 100644
--- a/src/views/ContactmomentenHistorieView.vue
+++ b/src/views/ContactmomentenHistorieView.vue
@@ -6,16 +6,24 @@
       <simple-spinner v-if="contactmomenten.loading" />
 
       <application-message
-        v-if="contactmomenten.error && contactmomenten.error.message === 'Empty Results' || contactmomenten.error.message === '404'"
+        v-if="
+          (contactmomenten.error &&
+            contactmomenten.error.message === 'Empty Results') ||
+          contactmomenten.error.message === '404'
+        "
         message="Geen contactmomenten gevonden."
         messageType="info"
       />
 
       <application-message
-        v-if="contactmomenten.error && contactmomenten.error.message !== `Empty Results` && contactmomenten.error.message !== `404`"
+        v-if="
+          contactmomenten.error &&
+          contactmomenten.error.message !== `Empty Results` &&
+          contactmomenten.error.message !== `404`
+        "
         message="Er ging iets mis bij het ophalen van de contactmomenten. Probeer het later nog eens."
         messageType="error"
-      /> 
+      />
 
       <utrecht-heading
         v-if="contactmomenten.success && !contactmomenten.data.page.length"
@@ -44,16 +52,24 @@
       <simple-spinner v-if="contactverzoeken.loading" />
 
       <application-message
-        v-if="contactverzoeken.error && contactverzoeken.error.message === 'Empty Results' || contactverzoeken.error.message === '404'"
+        v-if="
+          (contactverzoeken.error &&
+            contactverzoeken.error.message === 'Empty Results') ||
+          contactverzoeken.error.message === '404'
+        "
         message="Geen contactverzoeken gevonden."
         messageType="info"
       />
 
       <application-message
-        v-if="contactverzoeken.error && contactverzoeken.error.message !== `Empty Results` && contactverzoeken.error.message !== `404`"
+        v-if="
+          contactverzoeken.error &&
+          contactverzoeken.error.message !== `Empty Results` &&
+          contactverzoeken.error.message !== `404`
+        "
         message="Er ging iets mis bij het ophalen van de contactverzoeken. Probeer het later nog eens."
         messageType="error"
-      /> 
+      />
 
       <utrecht-heading
         v-if="contactverzoeken.success && !contactverzoeken.data.page.length"
diff --git a/src/views/LoginView.vue b/src/views/LoginView.vue
index 8c04506..8251e27 100644
--- a/src/views/LoginView.vue
+++ b/src/views/LoginView.vue
@@ -71,7 +71,7 @@ async function handleSubmit() {
 
     Cookies.set("userId", data.id);
     Cookies.set("jwt", data.jwtToken);
-    window.sessionStorage.setItem("jwt", data.jwtToken)
+    window.sessionStorage.setItem("jwt", data.jwtToken);
 
     router.push("/");
   }
diff --git a/src/views/PersoonDetailView.vue b/src/views/PersoonDetailView.vue
index 804c04b..fc286f7 100644
--- a/src/views/PersoonDetailView.vue
+++ b/src/views/PersoonDetailView.vue
@@ -24,34 +24,46 @@
       v-if="persoon.success && persoon.data"
       :persoon="persoon.data"
     />
-  <application-message
-      v-if="persoon.error && persoon.error.message === 'Empty Results' || persoon.error.message === '404'"
+    <application-message
+      v-if="
+        (persoon.error && persoon.error.message === 'Empty Results') ||
+        persoon.error.message === '404'
+      "
       message="Geen persoon gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="persoon.error && persoon.error.message !== `Empty Results` && persoon.error.message !== `404`"
+      v-if="
+        persoon.error &&
+        persoon.error.message !== `Empty Results` &&
+        persoon.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de BRP gegevens. Probeer het later nog eens."
       messageType="error"
     />
 
-    
-
     <simple-spinner v-if="contactverzoeken.loading" />
     <application-message
-      v-if="contactverzoeken.error && contactverzoeken.error.message === 'Empty Results' || contactverzoeken.error.message === '404'"
+      v-if="
+        (contactverzoeken.error &&
+          contactverzoeken.error.message === 'Empty Results') ||
+        contactverzoeken.error.message === '404'
+      "
       message="Geen contactverzoeken gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="contactverzoeken.error && contactverzoeken.error.message !== `Empty Results` && contactverzoeken.error.message !== `404`"
+      v-if="
+        contactverzoeken.error &&
+        contactverzoeken.error.message !== `Empty Results` &&
+        contactverzoeken.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de contactverzoeken. Probeer het later nog eens."
       messageType="error"
     />
 
-
     <template
       v-if="contactverzoeken.success && contactverzoeken.data.page.length"
     >
@@ -64,15 +76,22 @@
 
     <!-- Zaken -->
 
-    <simple-spinner v-if="zaken.loading" /> 
+    <simple-spinner v-if="zaken.loading" />
     <application-message
-      v-if="zaken.error && zaken.error.message === 'Empty Results' || zaken.error.message === '404'"
+      v-if="
+        (zaken.error && zaken.error.message === 'Empty Results') ||
+        zaken.error.message === '404'
+      "
       message="Geen zaken gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="zaken.error && zaken.error.message !== `Empty Results` && zaken.error.message !== `404`"
+      v-if="
+        zaken.error &&
+        zaken.error.message !== `Empty Results` &&
+        zaken.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de zaken. Probeer het later nog eens."
       messageType="error"
     />
@@ -90,13 +109,21 @@
 
     <simple-spinner v-if="contactmomenten.loading" />
     <application-message
-      v-if="contactmomenten.error && contactmomenten.error.message === 'Empty Results' || contactmomenten.error.message === '404'"
+      v-if="
+        (contactmomenten.error &&
+          contactmomenten.error.message === 'Empty Results') ||
+        contactmomenten.error.message === '404'
+      "
       message="Geen contactmomenten gevonden."
       messageType="info"
     />
 
     <application-message
-      v-if="contactmomenten.error && contactmomenten.error.message !== `Empty Results` && contactmomenten.error.message !== `404`"
+      v-if="
+        contactmomenten.error &&
+        contactmomenten.error.message !== `Empty Results` &&
+        contactmomenten.error.message !== `404`
+      "
       message="Er ging iets mis bij het ophalen van de contactmomenten. Probeer het later nog eens."
       messageType="error"
     />

From 9325151868d3a10d7f24df57fce2843b228a84c2 Mon Sep 17 00:00:00 2001
From: Remko <remko@conduction.nl>
Date: Tue, 5 Mar 2024 10:04:39 +0100
Subject: [PATCH 4/5] Added email

---
 src/features/contactverzoek/ContactverzoekFormulier.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/features/contactverzoek/ContactverzoekFormulier.vue b/src/features/contactverzoek/ContactverzoekFormulier.vue
index c4041d8..e1e6d4c 100644
--- a/src/features/contactverzoek/ContactverzoekFormulier.vue
+++ b/src/features/contactverzoek/ContactverzoekFormulier.vue
@@ -19,7 +19,7 @@
           :value="afdeling.id"
           :required="true"
         >
-          {{ afdeling.name }}
+          {{ afdeling.email }} | {{ afdeling.name }}
         </option>
       </select>
     </label>

From 79ba5df2046e00c4156471bb2a722b02a09373fe Mon Sep 17 00:00:00 2001
From: Remko <remko@conduction.nl>
Date: Tue, 5 Mar 2024 11:34:19 +0100
Subject: [PATCH 5/5] cleanup

---
 src/views/AfhandelingView.vue | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/views/AfhandelingView.vue b/src/views/AfhandelingView.vue
index c7cef91..623fcc7 100644
--- a/src/views/AfhandelingView.vue
+++ b/src/views/AfhandelingView.vue
@@ -389,7 +389,11 @@
               class="utrecht-form-label"
               :class="{ required: vraag.resultaat == 'Contactverzoek gemaakt' }"
               :for="'verzoek-afdeling' + idx"
-              >Contactverzoek versturen naar afdeling</label
+              >{{
+                vraag.resultaat == "Contactverzoek gemaakt"
+                  ? "Contactverzoek versturen naar afdeling"
+                  : "Afdeling"
+              }}</label
             >
 
             <div v-if="afdelingen.success && afdelingen.data.length">
@@ -405,7 +409,11 @@
                   :value="afdeling.id"
                   :required="true"
                 >
-                  {{ afdeling.email }} | {{ afdeling.name }}
+                  {{
+                    vraag.resultaat == "Contactverzoek gemaakt"
+                      ? `${afdeling.email} | ${afdeling.name}`
+                      : afdeling.name
+                  }}
                 </option>
               </select>
             </div>