feat(donoroverview): Added datatable formatters

src/components/donors/DonorAddress.svelte

@@ -0,0 +1,14 @@
+<script>
+  import { _ } from "svelte-i18n";
+  export let address;
+</script>
+
+{#if !address || !address.address1}
+  {$_("no-address")}
+{:else}
+  {address.address1}<br />
+  <!-- {address.address2 || ''}<br /> -->
+  {address.postalcode}
+  {address.city}
+  {address.country}
+{/if}

src/components/donors/DonorDonations.svelte

@@ -0,0 +1,29 @@
+<script>
+  import { _ } from "svelte-i18n";
+  export let donations;
+</script>
+
+{#if !donations || donations.length == 0}
+  {$_('donor-has-no-associated-donations')}
+{:else}
+  {#each donations as donation}
+    {#if donation.responseType === "DISTANCEDONATION"}
+      <a
+        href="../donations/{donation.id}"
+        class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-600 text-white mr-1"
+        >{donation.runner.firstname}
+        {donation.runner.middlename || ""}
+        {donation.runner.lastname}</a
+      >
+    {:else}
+      <a
+        href="../donations/{d.id}"
+        class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-700 text-white mr-1"
+        >{$_("fixed-donation")}:
+        {(d.amount / 100)
+          .toFixed(2)
+          .toLocaleString("de-DE", { valute: "EUR" })}€</a
+      >
+    {/if}
+  {/each}
+{/if}

src/components/donors/DonorsOverview.svelte

@@ -20,6 +20,8 @@
   import InputElement from "../shared/InputElement.svelte";
   import TableHeader from "../shared/TableHeader.svelte";
   import TableActions from "../shared/TableActions.svelte";
+  import DonorAddress from "./DonorAddress.svelte";
+  import DonorDonations from "./DonorDonations.svelte";
   $: searchvalue = "";
   $: active_deletes = [];
   $: current_donations = [];
@@ -39,16 +41,18 @@
     {
       accessorKey: "id",
       header: () => "id",
-      cell: (info) => {
-        return "TODO:";
-      },
       filterFn: `equalsString`,
     },
     {
       accessorKey: "name",
       header: () => $_("name"),
       cell: (info) => {
-        return "TODO:";
+        const d = info.row.original;
+        if (d.middlename) {
+          return `${d.firstname} ${d.middlename} ${d.lastname}`;
+        } else {
+          return `${d.firstname} ${d.lastname}`;
+        }
       },
       filterFn: `includesString`,
     },
@@ -56,7 +60,7 @@
       accessorKey: "address",
       header: () => $_("contact-information"),
       cell: (info) => {
-        return "TODO:";
+        return renderComponent(DonorAddress, { address: info.getValue() });
       },
       filterFn: `includesString`,
     },
@@ -64,23 +68,30 @@
       accessorKey: "sponsorings",
       header: () => $_("sponsorings"),
       cell: (info) => {
-        return "TODO:";
+        const donations = current_donations.filter(
+          (d) => d?.donor?.id == info.row.original.id
+        );
+        return renderComponent(DonorDonations, { donations });
       },
       filterFn: `includesString`,
     },
     {
-      accessorKey: "sponsorings",
+      accessorKey: "donationAmount",
       header: () => $_("total-donation-amount"),
       cell: (info) => {
-        return "TODO:";
+        return `${(info.getValue() / 100)
+          .toFixed(2)
+          .toLocaleString("de-DE", { valute: "EUR" })}€`;
       },
       filterFn: `group`,
     },
     {
-      accessorKey: "sponsorings",
+      accessorKey: "paidDonationAmount",
       header: () => $_("total-paid-amount"),
       cell: (info) => {
-        return "TODO:";
+        return `${(info.getValue() / 100)
+          .toFixed(2)
+          .toLocaleString("de-DE", { valute: "EUR" })}€`;
       },
       enableColumnFilter: false,
     },

src/locales/de.json

@@ -493,5 +493,6 @@
   "you-have-to-provide-an-organization": "Du musst eine Organisation angeben",
   "you-have-to-save-your-changes-to-generate-a-link": "Du musst deine Änderungen speichern, um einen Link zu generieren.",
   "you-must-create-at-least-one-card-or-cancel": "Du musst mindestens eine Blankokarte erstellen (oder abbrechen).",
-    "zip-postal-code": "Postleitzahl"
+  "zip-postal-code": "Postleitzahl",
+  "no-address": "Keine Adresse hinterlegt"
 }

src/locales/en.json

@@ -493,5 +493,6 @@
   "you-have-to-provide-an-organization": "You have to provide an organization",
   "you-have-to-save-your-changes-to-generate-a-link": "You have to save your changes to generate a link.",
   "you-must-create-at-least-one-card-or-cancel": "You must create at least one card (or cancel).",
-    "zip-postal-code": "ZIP/ postal code"
+  "zip-postal-code": "ZIP/ postal code",
+  "no-address": "no address"
 }