feat: Ansprechpartner im OrganisationsMap Detail-Panel
Marker-Klick zeigt jetzt zusätzlich Name, Rolle, Email und Telefon der Kontaktpersonen pro Organisation. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -316,6 +316,7 @@ export interface OrganisationEntry {
|
|||||||
whatsapp?: string;
|
whatsapp?: string;
|
||||||
youtube?: string;
|
youtube?: string;
|
||||||
location?: { text?: string; lat?: number; lng?: number };
|
location?: { text?: string; lat?: number; lng?: number };
|
||||||
|
contacts?: (string | ContactEntry)[];
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Organisations-Block (_type: "organisations"). */
|
/** Organisations-Block (_type: "organisations"). */
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
import "leaflet/dist/leaflet.css";
|
import "leaflet/dist/leaflet.css";
|
||||||
import { onMount, onDestroy } from "svelte";
|
import { onMount, onDestroy } from "svelte";
|
||||||
import { getBlockLayoutClasses } from "$lib/block-layout";
|
import { getBlockLayoutClasses } from "$lib/block-layout";
|
||||||
import type { OrganisationsMapBlockData, OrganisationEntry } from "$lib/block-types";
|
import type { OrganisationsMapBlockData, OrganisationEntry, ContactEntry } from "$lib/block-types";
|
||||||
import Icon from "@iconify/svelte";
|
import Icon from "@iconify/svelte";
|
||||||
import "$lib/iconify-offline";
|
import "$lib/iconify-offline";
|
||||||
import { marked } from "$lib/markdown-safe";
|
import { marked } from "$lib/markdown-safe";
|
||||||
@@ -33,6 +33,12 @@
|
|||||||
: "",
|
: "",
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const contacts = $derived(
|
||||||
|
(selectedOrg?.contacts ?? []).filter(
|
||||||
|
(c): c is ContactEntry => typeof c === "object" && c !== null && !!c.name,
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
function getLink(org: OrganisationEntry): string | null {
|
function getLink(org: OrganisationEntry): string | null {
|
||||||
if (!org.link || typeof org.link === "string") return null;
|
if (!org.link || typeof org.link === "string") return null;
|
||||||
return org.link.url ?? null;
|
return org.link.url ?? null;
|
||||||
@@ -156,6 +162,35 @@
|
|||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
{#if contacts.length > 0}
|
||||||
|
<div class="mb-3 space-y-2 border-t border-stein-100 pt-3">
|
||||||
|
<p class="text-[0.65rem] font-semibold uppercase tracking-wider text-stein-500">Ansprechpartner</p>
|
||||||
|
{#each contacts as c}
|
||||||
|
<div class="text-xs">
|
||||||
|
<p class="font-semibold text-stein-800">{c.name}</p>
|
||||||
|
{#if c.role}
|
||||||
|
<p class="text-stein-500">{c.role}</p>
|
||||||
|
{/if}
|
||||||
|
{#if c.email}
|
||||||
|
<a href="mailto:{c.email}" class="mt-0.5 flex items-center gap-1 text-wald-700 hover:underline">
|
||||||
|
<Icon icon="mdi:email-outline" class="size-3 shrink-0" />
|
||||||
|
<span class="truncate">{c.email}</span>
|
||||||
|
</a>
|
||||||
|
{/if}
|
||||||
|
{#if c.phone}
|
||||||
|
<a href="tel:{c.phone.replace(/\s+/g, '')}" class="mt-0.5 flex items-center gap-1 text-wald-700 hover:underline">
|
||||||
|
<Icon icon="mdi:phone" class="size-3 shrink-0" />
|
||||||
|
{c.phone}
|
||||||
|
</a>
|
||||||
|
{/if}
|
||||||
|
{#if c.note}
|
||||||
|
<p class="mt-0.5 italic text-stein-500">{c.note}</p>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
{#if getLink(selectedOrg)}
|
{#if getLink(selectedOrg)}
|
||||||
<a
|
<a
|
||||||
href={getLink(selectedOrg)}
|
href={getLink(selectedOrg)}
|
||||||
|
|||||||
Reference in New Issue
Block a user