Theodor-Springmann-Stiftung/musenalm
1
0
Fork 0
mirror of https://github.com/Theodor-Springmann-Stiftung/musenalm.git synced 2026-02-04 10:35:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

+Reihen relations, small UX stuff

Browse Source
This commit is contained in:
Simon Martens
2026-01-08 14:36:18 +01:00
parent 53eab6a779
commit 1656f60ac4
12 changed files with 1732 additions and 643 deletions
Download Patch File Download Diff File Expand all files Collapse all files

603
views/routes/almanach/edit/body.gohtml
View File

@@ -17,9 +17,7 @@ type AlmanachResult struct {
}
-->
<script type="module">
FormLoad(document.getElementById("changealmanachform"));
</script>
<almanach-edit-page>
<div class="flex container-normal bg-slate-100 mx-auto px-8">
<div class="flex flex-row w-full justify-between">
@@ -279,11 +277,276 @@ type AlmanachResult struct {
<i class="ri-links-line"></i>
<span>Normdaten &amp; Verknüpfungen</span>
</div>
<button type="button" id="agents-add-toggle" class="text-gray-700 hover:text-gray-900">
<i class="ri-add-line"></i> Akteur hinzufügen
</button>
<div class="flex items-center gap-3">
<button type="button" id="series-add-toggle" class="text-gray-700 hover:text-gray-900">
<i class="ri-add-line"></i> Reihe hinzufügen
</button>
<button type="button" id="agents-add-toggle" class="text-gray-700 hover:text-gray-900">
<i class="ri-add-line"></i> Akteur hinzufügen
</button>
</div>
</div>
<hr class="border-slate-400 mt-2 mb-3" />
<div class="mt-3">
<relations-editor data-prefix="entries_series" data-link-base="/reihe/" data-new-label="(Neu)" data-add-toggle-id="series-add-toggle">
<div class="inputwrapper">
<label class="inputlabel" for="series-section">Reihen</label>
<div id="series-section" class="flex flex-col gap-2 mt-2">
{{- if $model.result.Series -}}
{{- range $i, $s := $model.result.Series -}}
{{- $rel := index $model.result.EntriesSeries $s.Id -}}
{{- if $rel -}}
<div data-rel-row class="entries-series-row border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div data-rel-strike class="relation-strike flex flex-col min-w-0">
<a data-rel-link href="/reihe/{{ $s.MusenalmID }}" class="text-base font-bold text-gray-800 no-underline hover:text-slate-900 truncate">
<span data-rel-name>{{- $s.Title -}}</span>
</a>
{{- if $s.Pseudonyms -}}
<div data-rel-detail-container class="text-xs text-gray-600 truncate"><span data-rel-detail>{{- $s.Pseudonyms -}}</span></div>
{{- end -}}
</div>
<div data-rel-strike class="relation-strike">
<select name="entries_series_type[{{ $rel.Id }}]" id="entries_series_type_{{ $rel.Id }}" autocomplete="off" class="inputselect font-bold w-full">
{{- range $t := $model.series_relations -}}
<option value="{{- $t -}}" {{ if eq $rel.Type $t }}selected{{ end }}>{{- $t -}}</option>
{{- end -}}
</select>
</div>
<div data-rel-strike class="relation-strike flex items-center gap-2">
<input
type="checkbox"
name="entries_series_uncertain[{{ $rel.Id }}]"
id="entries_series_uncertain_{{ $rel.Id }}"
{{ if $rel.Uncertain }}checked{{ end }} />
<label for="entries_series_uncertain_{{ $rel.Id }}" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<button
type="button"
class="text-sm text-red-700 hover:text-red-900"
data-delete-toggle="entries_series_delete_{{ $rel.Id }}">
<i class="ri-delete-bin-line mr-1"></i>
<span class="no-underline" data-delete-label data-delete-default="Entfernen" data-delete-active="Wird entfernt" data-delete-hover="Rückgängig">Entfernen</span>
</button>
<input type="checkbox" class="hidden" name="entries_series_delete[{{ $rel.Id }}]" id="entries_series_delete_{{ $rel.Id }}" />
</div>
</div>
<input type="hidden" name="entries_series_id[{{ $rel.Id }}]" value="{{ $rel.Id }}" />
<input type="hidden" name="entries_series_series[{{ $rel.Id }}]" value="{{ $rel.Series }}" />
</div>
{{- end -}}
{{- end -}}
{{- else -}}
<div class="text-sm text-gray-600">Keine Reihen verknüpft.</div>
{{- end -}}
</div>
<div data-role="relation-add-row" class="mt-2"></div>
<div data-role="relation-add-panel" class="mt-2 hidden">
<div class="border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div class="min-w-0">
<label for="series-add-select" class="sr-only">Reihe suchen</label>
<single-select-remote
id="series-add-select"
data-role="relation-add-select"
name="entries_series_new_id"
placeholder="Reihe suchen..."
data-endpoint="/api/series/search"
data-result-key="series"
data-minchars="1"
data-limit="15">
</single-select-remote>
</div>
<div>
<label for="entries_series_new_type" class="sr-only">Beziehung</label>
<select data-role="relation-type-select" name="entries_series_new_type" id="entries_series_new_type" autocomplete="off" class="inputselect font-bold w-full">
{{- range $t := $model.series_relations -}}
<option value="{{- $t -}}">{{- $t -}}</option>
{{- end -}}
</select>
</div>
<div class="flex items-center gap-2">
<input data-role="relation-uncertain" type="checkbox" name="entries_series_new_uncertain" id="entries_series_new_uncertain" />
<label for="entries_series_new_uncertain" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<div class="flex items-center gap-3 text-lg">
<button type="button" data-role="relation-add-apply" class="text-gray-700 hover:text-gray-900" id="series-add-apply" aria-label="Reihe hinzufügen">
<i class="ri-check-line"></i>
</button>
<button type="button" data-role="relation-add-close" class="text-gray-700 hover:text-gray-900" id="series-add-close" aria-label="Ausblenden">
<i class="ri-close-line"></i>
</button>
</div>
</div>
</div>
<div data-role="relation-add-error" class="text-xs text-red-700 mt-2 hidden">Bitte Reihe auswählen.</div>
</div>
</div>
<template data-role="relation-new-template">
<div data-rel-row class="border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div data-rel-strike class="relation-strike flex flex-col min-w-0">
<div class="text-base font-bold text-gray-800 truncate">
<a data-rel-link class="no-underline hover:text-slate-900">
<span data-rel-name></span>
</a>
<em data-rel-new class="text-sm text-gray-600 ml-1"></em>
</div>
<div data-rel-detail-container class="text-xs text-gray-600 truncate"><span data-rel-detail></span></div>
</div>
<div data-rel-strike class="relation-strike">
<select data-rel-input="type" class="inputselect font-bold w-full"></select>
</div>
<div data-rel-strike class="relation-strike flex items-center gap-2">
<input data-rel-input="uncertain" type="checkbox" />
<label data-rel-uncertain-label class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<button type="button" class="text-sm text-red-700 hover:text-red-900" data-role="relation-new-delete">
<i class="ri-delete-bin-line mr-1"></i> Entfernen
</button>
</div>
</div>
<input type="hidden" data-rel-input="id" />
</div>
</template>
</div>
</relations-editor>
</div>
<div class="mt-3">
<relations-editor data-prefix="entries_agents" data-link-base="/person/" data-new-label="(Neu)" data-add-toggle-id="agents-add-toggle">
<div class="inputwrapper">
<label class="inputlabel" for="agents-section">Personen &amp; Körperschaften</label>
<div id="agents-section" class="flex flex-col gap-2 mt-2">
{{- if $model.result.EntriesAgents -}}
{{- range $i, $r := $model.result.EntriesAgents -}}
{{- $a := index $model.result.Agents $r.Agent -}}
<div data-rel-row class="entries-agent-row border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div data-rel-strike class="relation-strike flex flex-col min-w-0">
{{- if $a -}}
<a data-rel-link href="/person/{{ $a.Id }}" class="text-base font-bold text-gray-800 no-underline hover:text-slate-900 truncate">
<span data-rel-name>{{- $a.Name -}}</span>
</a>
{{- if $a.BiographicalData -}}
<div data-rel-detail-container class="text-xs text-gray-600 truncate"><span data-rel-detail>{{- $a.BiographicalData -}}</span></div>
{{- end -}}
{{- else -}}
<div class="text-base font-bold text-gray-800">Unbekannte Person</div>
{{- end -}}
</div>
<div data-rel-strike class="relation-strike">
<select name="entries_agents_type[{{ $r.Id }}]" id="entries_agents_type_{{ $r.Id }}" autocomplete="off" class="inputselect font-bold w-full">
{{- range $t := $model.agent_relations -}}
<option value="{{- $t -}}" {{ if eq $r.Type $t }}selected{{ end }}>{{- $t -}}</option>
{{- end -}}
</select>
</div>
<div data-rel-strike class="relation-strike flex items-center gap-2">
<input
type="checkbox"
name="entries_agents_uncertain[{{ $r.Id }}]"
id="entries_agents_uncertain_{{ $r.Id }}"
{{ if $r.Uncertain }}checked{{ end }} />
<label for="entries_agents_uncertain_{{ $r.Id }}" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<button
type="button"
class="text-sm text-red-700 hover:text-red-900"
data-delete-toggle="entries_agents_delete_{{ $r.Id }}">
<i class="ri-delete-bin-line mr-1"></i>
<span class="no-underline" data-delete-label data-delete-default="Entfernen" data-delete-active="Wird entfernt" data-delete-hover="Rückgängig">Entfernen</span>
</button>
<input type="checkbox" class="hidden" name="entries_agents_delete[{{ $r.Id }}]" id="entries_agents_delete_{{ $r.Id }}" />
</div>
</div>
<input type="hidden" name="entries_agents_id[{{ $r.Id }}]" value="{{ $r.Id }}" />
<input type="hidden" name="entries_agents_agent[{{ $r.Id }}]" value="{{ $r.Agent }}" />
</div>
{{- end -}}
{{- else -}}
<div class="text-sm text-gray-600">Keine Personen verknüpft.</div>
{{- end -}}
</div>
<div data-role="relation-add-row" class="mt-2"></div>
<div data-role="relation-add-panel" class="mt-2 hidden">
<div class="border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div class="min-w-0">
<label for="agents-add-select" class="sr-only">Akteur suchen</label>
<single-select-remote
id="agents-add-select"
data-role="relation-add-select"
name="entries_agents_new_id"
placeholder="Akteur suchen..."
data-endpoint="/api/agents/search"
data-result-key="agents"
data-minchars="1"
data-limit="15">
</single-select-remote>
</div>
<div>
<label for="entries_agents_new_type" class="sr-only">Beziehung</label>
<select data-role="relation-type-select" name="entries_agents_new_type" id="entries_agents_new_type" autocomplete="off" class="inputselect font-bold w-full">
{{- range $t := $model.agent_relations -}}
<option value="{{- $t -}}">{{- $t -}}</option>
{{- end -}}
</select>
</div>
<div class="flex items-center gap-2">
<input data-role="relation-uncertain" type="checkbox" name="entries_agents_new_uncertain" id="entries_agents_new_uncertain" />
<label for="entries_agents_new_uncertain" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<div class="flex items-center gap-3 text-lg">
<button type="button" data-role="relation-add-apply" class="text-gray-700 hover:text-gray-900" id="agents-add-apply" aria-label="Akteur hinzufügen">
<i class="ri-check-line"></i>
</button>
<button type="button" data-role="relation-add-close" class="text-gray-700 hover:text-gray-900" id="agents-add-close" aria-label="Ausblenden">
<i class="ri-close-line"></i>
</button>
</div>
</div>
</div>
<div data-role="relation-add-error" class="text-xs text-red-700 mt-2 hidden">Bitte Akteur auswählen.</div>
</div>
</div>
<template data-role="relation-new-template">
<div data-rel-row class="border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div data-rel-strike class="relation-strike flex flex-col min-w-0">
<div class="text-base font-bold text-gray-800 truncate">
<a data-rel-link class="no-underline hover:text-slate-900">
<span data-rel-name></span>
</a>
<em data-rel-new class="text-sm text-gray-600 ml-1"></em>
</div>
<div data-rel-detail-container class="text-xs text-gray-600 truncate"><span data-rel-detail></span></div>
</div>
<div data-rel-strike class="relation-strike">
<select data-rel-input="type" class="inputselect font-bold w-full"></select>
</div>
<div data-rel-strike class="relation-strike flex items-center gap-2">
<input data-rel-input="uncertain" type="checkbox" />
<label data-rel-uncertain-label class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<button type="button" class="text-sm text-red-700 hover:text-red-900" data-role="relation-new-delete">
<i class="ri-delete-bin-line mr-1"></i> Entfernen
</button>
</div>
</div>
<input type="hidden" data-rel-input="id" />
</div>
</template>
</div>
</relations-editor>
</div>
<div class="flex flex-col gap-4 mt-4">
<div class="inputwrapper">
<label for="places" class="inputlabel">Erscheinungs- und Verlagsorte</label>
@@ -291,268 +554,20 @@ type AlmanachResult struct {
id="places"
name="places[]"
placeholder="Orte suchen..."
data-toggle-label='<i class="ri-add-circle-line"></i>'
data-empty-text="Keine Orte ausgewählt..."
show-create-button="false"
data-endpoint="/api/places/search"
data-result-key="places"
data-minchars="1"
data-limit="15">
data-limit="15"
data-initial-options='[{{- range $i, $place := $model.result.Places -}}{{- if $i }},{{ end -}}{"id":"{{ $place.Id }}","name":{{ printf "%q" $place.Name }},"additional_data":{{ printf "%q" $place.Pseudonyms }}}}{{- end -}}]'
data-initial-values='[{{- range $i, $place := $model.result.Places -}}{{- if $i }},{{ end -}}"{{ $place.Id }}"{{- end -}}]'>
</multi-select-simple>
</div>
</div>
</div>
<script type="module">
const placesSelect = document.getElementById("places");
if (placesSelect) {
const initialPlaces = [
{{- range $i, $place := $model.result.Places }}
{ id: "{{ $place.Id }}", name: {{ printf "%q" $place.Name }}, additional_data: {{ printf "%q" $place.Pseudonyms }} },
{{- end -}}
];
const initialPlaceIds = [
{{- range $i, $place := $model.result.Places -}}
{{- if $i }},{{ end }}"{{ $place.Id }}"
{{- end -}}
];
if (initialPlaces.length > 0) {
placesSelect.setOptions(initialPlaces);
}
placesSelect.value = initialPlaceIds;
}
</script>
<div class="mt-3">
<div class="text-base font-semibold text-gray-700">
<span>Personen &amp; Körperschaften</span>
</div>
<div class="flex flex-col gap-2 mt-4">
{{- if $model.result.EntriesAgents -}}
{{- range $i, $r := $model.result.EntriesAgents -}}
{{- $a := index $model.result.Agents $r.Agent -}}
<div class="border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div class="flex flex-col min-w-0">
{{- if $a -}}
<a href="/person/{{ $a.Id }}" class="text-base font-bold text-gray-800 no-underline hover:text-slate-900 truncate">
{{- $a.Name -}}
</a>
{{- if $a.BiographicalData -}}
<div class="text-xs text-gray-600 truncate">{{- $a.BiographicalData -}}</div>
{{- end -}}
{{- else -}}
<div class="text-base font-bold text-gray-800">Unbekannte Person</div>
{{- end -}}
</div>
<div>
<select name="entries_agents_type[{{ $r.Id }}]" id="entries_agents_type_{{ $r.Id }}" autocomplete="off" class="inputselect font-bold w-full">
{{- range $t := $model.agent_relations -}}
<option value="{{- $t -}}" {{ if eq $r.Type $t }}selected{{ end }}>{{- $t -}}</option>
{{- end -}}
</select>
</div>
<div class="flex items-center gap-2">
<input
type="checkbox"
name="entries_agents_uncertain[{{ $r.Id }}]"
id="entries_agents_uncertain_{{ $r.Id }}"
{{ if $r.Uncertain }}checked{{ end }} />
<label for="entries_agents_uncertain_{{ $r.Id }}" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<button
type="button"
class="text-sm text-red-700 hover:text-red-900"
data-delete-toggle="entries_agents_delete_{{ $r.Id }}">
<i class="ri-delete-bin-line mr-1"></i> Entfernen
</button>
<input type="checkbox" class="hidden" name="entries_agents_delete[{{ $r.Id }}]" id="entries_agents_delete_{{ $r.Id }}" />
</div>
</div>
<input type="hidden" name="entries_agents_id[{{ $r.Id }}]" value="{{ $r.Id }}" />
<input type="hidden" name="entries_agents_agent[{{ $r.Id }}]" value="{{ $r.Agent }}" />
</div>
{{- end -}}
{{- else -}}
<div class="text-sm text-gray-600">Keine Personen verknüpft.</div>
{{- end -}}
</div>
<div id="agents-add-row" class="mt-2"></div>
<div id="agents-add-panel" class="mt-2 hidden">
<div class="border border-stone-200 rounded-xs bg-stone-50 px-3 py-2">
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div class="min-w-0">
<label for="agents-add-select" class="sr-only">Akteur suchen</label>
<single-select-remote
id="agents-add-select"
name="entries_agents_new_id"
placeholder="Akteur suchen..."
data-endpoint="/api/agents/search"
data-result-key="agents"
data-minchars="1"
data-limit="15">
</single-select-remote>
</div>
<div>
<label for="entries_agents_new_type" class="sr-only">Beziehung</label>
<select name="entries_agents_new_type" id="entries_agents_new_type" autocomplete="off" class="inputselect font-bold w-full">
{{- range $t := $model.agent_relations -}}
<option value="{{- $t -}}">{{- $t -}}</option>
{{- end -}}
</select>
</div>
<div class="flex items-center gap-2">
<input type="checkbox" name="entries_agents_new_uncertain" id="entries_agents_new_uncertain" />
<label for="entries_agents_new_uncertain" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<div class="flex items-center gap-3 text-lg">
<button type="button" class="text-gray-700 hover:text-gray-900" id="agents-add-apply" aria-label="Akteur hinzufügen">
<i class="ri-check-line"></i>
</button>
<button type="button" class="text-gray-700 hover:text-gray-900" id="agents-add-close" aria-label="Ausblenden">
<i class="ri-close-line"></i>
</button>
</div>
</div>
</div>
<div id="agents-add-error" class="text-xs text-red-700 mt-2 hidden">Bitte Akteur auswählen.</div>
</div>
</div>
<script type="module">
const agentsAddToggle = document.getElementById("agents-add-toggle");
const agentsAddPanel = document.getElementById("agents-add-panel");
const agentsAddClose = document.getElementById("agents-add-close");
const agentsAddApply = document.getElementById("agents-add-apply");
const agentsAddError = document.getElementById("agents-add-error");
const agentsAddRow = document.getElementById("agents-add-row");
const agentsAddSelect = document.getElementById("agents-add-select");
const relationSelect = document.getElementById("entries_agents_new_type");
const uncertainCheckbox = document.getElementById("entries_agents_new_uncertain");
let pendingAgent = null;
if (agentsAddToggle && agentsAddPanel) {
agentsAddToggle.addEventListener("click", () => {
agentsAddPanel.classList.toggle("hidden");
});
}
if (agentsAddClose && agentsAddPanel) {
agentsAddClose.addEventListener("click", () => {
agentsAddPanel.classList.add("hidden");
});
}
const clearAddPanel = () => {
if (agentsAddSelect) {
const clearButton = agentsAddSelect.querySelector(".ssr-clear-button");
if (clearButton) {
clearButton.click();
}
}
if (relationSelect) {
relationSelect.selectedIndex = 0;
}
if (uncertainCheckbox) {
uncertainCheckbox.checked = false;
}
};
const removeNewRow = () => {
if (agentsAddRow) {
agentsAddRow.innerHTML = "";
}
pendingAgent = null;
clearAddPanel();
};
if (agentsAddApply && agentsAddPanel) {
agentsAddApply.addEventListener("click", () => {
const idInput = agentsAddPanel.querySelector("input[name='entries_agents_new_id']");
const hasSelection = idInput && idInput.value.trim().length > 0;
if (!hasSelection) {
if (agentsAddError) {
agentsAddError.classList.remove("hidden");
}
return;
}
if (agentsAddError) {
agentsAddError.classList.add("hidden");
}
if (!pendingAgent || !agentsAddRow) {
return;
}
const row = document.createElement("div");
row.className = "border border-stone-200 rounded-xs bg-stone-50 px-3 py-2";
row.innerHTML = `
<div class="grid grid-cols-[1fr_14rem_8rem_7rem] gap-3 items-center">
<div class="flex flex-col min-w-0">
<div class="text-base font-bold text-gray-800 truncate">
<a href="/person/${pendingAgent.id}" class="no-underline hover:text-slate-900">
${pendingAgent.name || ""}
</a>
<em class="text-sm text-gray-600 ml-1">(Neu)</em>
</div>
${pendingAgent.bio ? `<div class="text-xs text-gray-600 truncate">${pendingAgent.bio}</div>` : ""}
</div>
<div>
<select name="entries_agents_new_type" class="inputselect font-bold w-full"></select>
</div>
<div class="flex items-center gap-2">
<input type="checkbox" name="entries_agents_new_uncertain" id="entries_agents_new_uncertain_row" />
<label for="entries_agents_new_uncertain_row" class="text-sm text-gray-700">Unsicher</label>
</div>
<div class="flex justify-end">
<button type="button" class="text-sm text-red-700 hover:text-red-900" data-new-delete>
<i class="ri-delete-bin-line mr-1"></i> Entfernen
</button>
</div>
</div>
<input type="hidden" name="entries_agents_new_id" value="${pendingAgent.id}" />
`;
const rowSelect = row.querySelector("select[name='entries_agents_new_type']");
if (rowSelect && relationSelect) {
rowSelect.innerHTML = relationSelect.innerHTML;
rowSelect.value = relationSelect.value;
}
const rowUncertain = row.querySelector("input[name='entries_agents_new_uncertain']");
if (rowUncertain && uncertainCheckbox) {
rowUncertain.checked = uncertainCheckbox.checked;
}
const deleteButton = row.querySelector("[data-new-delete]");
if (deleteButton) {
deleteButton.addEventListener("click", () => {
removeNewRow();
if (agentsAddPanel) {
agentsAddPanel.classList.remove("hidden");
}
});
}
agentsAddRow.innerHTML = "";
agentsAddRow.appendChild(row);
agentsAddPanel.classList.add("hidden");
clearAddPanel();
});
}
if (agentsAddSelect) {
agentsAddSelect.addEventListener("ssrchange", (event) => {
pendingAgent = event.detail?.item || null;
if (pendingAgent && agentsAddError) {
agentsAddError.classList.add("hidden");
}
});
}
document.querySelectorAll("[data-delete-toggle]").forEach((button) => {
button.addEventListener("click", () => {
const targetId = button.getAttribute("data-delete-toggle");
const checkbox = document.getElementById(targetId);
if (!checkbox) {
return;
}
checkbox.checked = !checkbox.checked;
button.classList.toggle("opacity-60", checkbox.checked);
});
});
</script>
</div>
</div>
<!-- End Left Column -->
@@ -638,11 +653,13 @@ type AlmanachResult struct {
<!-- Languages -->
<div class="inputwrapper">
<label for="languages" class="inputlabel">Sprachen</label>
<multi-select-simple id="languages" show-create-button="false" placeholder="Sprachen suchen..."></multi-select-simple>
<script type="module">
const smlang = document.getElementById("languages");
smlang.value = {{ $model.result.Entry.Language }};
</script>
<multi-select-simple
id="languages"
show-create-button="false"
placeholder="Sprachen suchen..."
data-toggle-label='<i class="ri-add-circle-line"></i>'
data-empty-text="Keine Sprachen ausgewählt..."
value='[{{- range $i, $lang := $model.result.Entry.Language -}}{{- if $i }},{{ end -}}"{{ $lang }}"{{- end -}}]'></multi-select-simple>
</div>
<!-- Nachweise - Always visible -->
@@ -675,11 +692,12 @@ type AlmanachResult struct {
<input type="hidden" name="items_id[]" value="{{ $item.Id }}" />
<div class="items-summary flex flex-col gap-2">
<div class="flex items-center justify-between bg-stone-100 px-3 py-2 rounded-xs">
<div class="text-base font-bold" data-summary-container>
<span data-summary-field="owner" data-summary-hide-empty="true">{{ $item.Owner }}</span>
<div class="text-base font-bold" data-summary-container>
<span data-items-strike data-summary-field="owner" data-summary-hide-empty="true">{{ $item.Owner }}</span>
<span data-new-badge class="items-new-badge hidden text-sm text-gray-600 ml-1">(Neu)</span>
</div>
<div class="px-2 py-0.5 bg-stone-200 text-sm font-bold rounded-sm" data-summary-container>
<span data-summary-field="identifier" data-summary-hide-empty="true">{{ $item.Identifier }}</span>
<span data-items-strike data-summary-field="identifier" data-summary-hide-empty="true">{{ $item.Identifier }}</span>
</div>
</div>
<div class="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4 px-3
@@ -688,23 +706,23 @@ type AlmanachResult struct {
<div class="flex flex-col gap-1 text-base">
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">Standort</span>
<span class="items-summary-value" data-summary-field="location" data-summary-hide-empty="true">{{ $item.Location }}</span>
<span class="items-summary-value" data-items-strike data-summary-field="location" data-summary-hide-empty="true">{{ $item.Location }}</span>
</div>
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">Vorhanden als</span>
<span class="items-summary-value" data-summary-field="media" data-summary-hide-empty="true">
<span class="items-summary-value" data-items-strike data-summary-field="media" data-summary-hide-empty="true">
{{- range $j, $m := $item.Media -}}{{- if $j -}}, {{- end -}}{{- $m -}}{{- end -}}
</span>
</div>
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">URL</span>
<span class="items-summary-value" data-summary-field="uri" data-summary-hide-empty="true">
<span class="items-summary-value" data-items-strike data-summary-field="uri" data-summary-hide-empty="true">
<a class="no-underline" data-summary-link href="{{ $item.Uri }}" target="_blank" rel="noopener">{{ $item.Uri }}</a>
</span>
</div>
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">Annotationen</span>
<span class="items-summary-value" data-summary-field="annotation" data-summary-hide-empty="true">{{ $item.Annotation }}</span>
<span class="items-summary-value" data-items-strike data-summary-field="annotation" data-summary-hide-empty="true">{{ $item.Annotation }}</span>
</div>
</div>
</div>
@@ -716,6 +734,7 @@ type AlmanachResult struct {
</button>
<button type="button" class="items-remove-button text-red-700 hover:text-red-900" aria-label="Entfernen">
<i class="ri-delete-bin-line"></i>
<span class="ml-1 text-sm no-underline" data-delete-label data-delete-default="Entfernen" data-delete-active="Wird entfernt" data-delete-hover="Rückgängig">Entfernen</span>
</button>
</div>
</div>
@@ -725,19 +744,19 @@ type AlmanachResult struct {
<div class="flex flex-col gap-3 mt-3">
<div class="inputwrapper">
<label class="inputlabel" data-field-label="owner">Besitzer</label>
<input class="inputinput" data-field="owner" name="items_owner[]" autocomplete="off" value="{{ $item.Owner }}" />
<input class="inputinput" data-items-strike data-field="owner" name="items_owner[]" autocomplete="off" value="{{ $item.Owner }}" />
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="identifier">Signatur</label>
<input class="inputinput" data-field="identifier" name="items_identifier[]" autocomplete="off" value="{{ $item.Identifier }}" />
<input class="inputinput" data-items-strike data-field="identifier" name="items_identifier[]" autocomplete="off" value="{{ $item.Identifier }}" />
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="location">Standort</label>
<input class="inputinput" data-field="location" name="items_location[]" autocomplete="off" value="{{ $item.Location }}" />
<input class="inputinput" data-items-strike data-field="location" name="items_location[]" autocomplete="off" value="{{ $item.Location }}" />
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="media">Vorhanden als</label>
<select class="inputselect" data-field="media" name="items_media[]" autocomplete="off">
<select class="inputselect" data-items-strike data-field="media" name="items_media[]" autocomplete="off">
<option value=""></option>
{{- range $t := $model.item_types -}}
<option value="{{- $t -}}" {{ if Contains $item.Media $t }}selected{{ end }}>{{- $t -}}</option>
@@ -746,11 +765,11 @@ type AlmanachResult struct {
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="annotation">Annotationen</label>
<textarea class="inputtextarea min-h-[8rem]" data-field="annotation" name="items_annotation[]" autocomplete="off">{{- $item.Annotation -}}</textarea>
<textarea class="inputtextarea min-h-[8rem]" data-items-strike data-field="annotation" name="items_annotation[]" autocomplete="off">{{- $item.Annotation -}}</textarea>
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="uri">URI</label>
<input class="inputinput" data-field="uri" name="items_uri[]" autocomplete="off" value="{{ $item.Uri }}" />
<input class="inputinput" data-items-strike data-field="uri" name="items_uri[]" autocomplete="off" value="{{ $item.Uri }}" />
</div>
</div>
<div class="flex justify-end gap-3 mt-3 px-3 py-2">
@@ -761,7 +780,8 @@ type AlmanachResult struct {
<i class="ri-close-line mr-2"></i> Abbrechen
</button>
<button type="button" class="items-remove-button resetbutton w-auto px-2 py-1 text-base text-red-700 hover:text-red-900">
<i class="ri-delete-bin-line mr-2"></i> Entfernen
<i class="ri-delete-bin-line mr-2"></i>
<span class="no-underline" data-delete-label data-delete-default="Entfernen" data-delete-active="Wird entfernt" data-delete-hover="Rückgängig">Entfernen</span>
</button>
</div>
</div>
@@ -775,10 +795,11 @@ type AlmanachResult struct {
<div class="items-summary hidden flex flex-col gap-2">
<div class="flex items-center justify-between bg-stone-100 px-3 py-2 rounded-xs">
<div class="text-base font-bold" data-summary-container>
<span data-summary-field="owner" data-summary-hide-empty="true">—</span>
<span data-items-strike data-summary-field="owner" data-summary-hide-empty="true">—</span>
<span data-new-badge class="items-new-badge hidden text-sm text-gray-600 ml-1">(Neu)</span>
</div>
<div class="px-2 py-0.5 bg-stone-200 text-sm font-bold rounded-sm" data-summary-container>
<span data-summary-field="identifier" data-summary-hide-empty="true">—</span>
<span data-items-strike data-summary-field="identifier" data-summary-hide-empty="true">—</span>
</div>
</div>
<div class="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4 px-3 py-1">
@@ -786,21 +807,21 @@ type AlmanachResult struct {
<div class="flex flex-col gap-1 text-base">
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">Standort</span>
<span class="items-summary-value" data-summary-field="location" data-summary-hide-empty="true">—</span>
<span class="items-summary-value" data-items-strike data-summary-field="location" data-summary-hide-empty="true">—</span>
</div>
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">Vorh. als</span>
<span class="items-summary-value" data-summary-field="media" data-summary-hide-empty="true">—</span>
<span class="items-summary-value" data-items-strike data-summary-field="media" data-summary-hide-empty="true">—</span>
</div>
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">URL</span>
<span class="items-summary-value" data-summary-field="uri" data-summary-hide-empty="true">
<span class="items-summary-value" data-items-strike data-summary-field="uri" data-summary-hide-empty="true">
<a class="no-underline" data-summary-link href="#" target="_blank" rel="noopener">—</a>
</span>
</div>
<div class="grid grid-cols-[6rem_1fr] gap-x-4 items-baseline" data-summary-container>
<span class="text-xs uppercase tracking-wide text-gray-500">Annotationen</span>
<span class="items-summary-value" data-summary-field="annotation" data-summary-hide-empty="true">—</span>
<span class="items-summary-value" data-items-strike data-summary-field="annotation" data-summary-hide-empty="true">—</span>
</div>
</div>
</div>
@@ -812,6 +833,7 @@ type AlmanachResult struct {
</button>
<button type="button" class="items-remove-button text-red-700 hover:text-red-900" aria-label="Entfernen">
<i class="ri-delete-bin-line"></i>
<span class="ml-1 text-sm no-underline" data-delete-label data-delete-default="Entfernen" data-delete-active="Wird entfernt" data-delete-hover="Rückgängig">Entfernen</span>
</button>
</div>
</div>
@@ -820,19 +842,19 @@ type AlmanachResult struct {
<div class="flex flex-col gap-3 mt-3">
<div class="inputwrapper">
<label class="inputlabel" data-field-label="owner">Besitzer</label>
<input class="inputinput" data-field="owner" name="items_owner[]" autocomplete="off" value="" />
<input class="inputinput" data-items-strike data-field="owner" name="items_owner[]" autocomplete="off" value="" />
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="identifier">Signatur</label>
<input class="inputinput" data-field="identifier" name="items_identifier[]" autocomplete="off" value="" />
<input class="inputinput" data-items-strike data-field="identifier" name="items_identifier[]" autocomplete="off" value="" />
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="location">Standort</label>
<input class="inputinput" data-field="location" name="items_location[]" autocomplete="off" value="" />
<input class="inputinput" data-items-strike data-field="location" name="items_location[]" autocomplete="off" value="" />
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="media">Vorhanden als</label>
<select class="inputselect" data-field="media" name="items_media[]" autocomplete="off">
<select class="inputselect" data-items-strike data-field="media" name="items_media[]" autocomplete="off">
<option value=""></option>
{{- range $t := $model.item_types -}}
<option value="{{- $t -}}">{{- $t -}}</option>
@@ -841,11 +863,11 @@ type AlmanachResult struct {
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="annotation">Annotationen</label>
<textarea class="inputtextarea min-h-[8rem]" data-field="annotation" name="items_annotation[]" autocomplete="off"></textarea>
<textarea class="inputtextarea min-h-[8rem]" data-items-strike data-field="annotation" name="items_annotation[]" autocomplete="off"></textarea>
</div>
<div class="inputwrapper">
<label class="inputlabel" data-field-label="uri">URI</label>
<input class="inputinput" data-field="uri" name="items_uri[]" autocomplete="off" value="" />
<input class="inputinput" data-items-strike data-field="uri" name="items_uri[]" autocomplete="off" value="" />
</div>
</div>
<div class="flex justify-end gap-3 mt-3 px-3 py-1">
@@ -867,3 +889,4 @@ type AlmanachResult struct {
<!-- End Right Column -->
</form>
</div>
</almanach-edit-page>