134 lines
4.2 KiB
Svelte
134 lines
4.2 KiB
Svelte
<script lang="ts">
|
|
import { resolve } from '$app/paths';
|
|
import AppIcon from '#lib/components/AppIcon.svelte';
|
|
import RssSelectionDialog from '#lib/components/RssSelectionDialog.svelte';
|
|
import type { PageProps } from './$types';
|
|
let { data, form }: PageProps = $props();
|
|
let rssDialog: { showModal: () => void };
|
|
</script>
|
|
|
|
<svelte:head><title>Eingang | Sendewerk</title></svelte:head>
|
|
|
|
<div class="page-wrap narrow-page">
|
|
<header class="page-heading">
|
|
<h1>Eingang</h1>
|
|
<p class="page-intro">Gedanken und Fundstücke schnell festhalten und später ausarbeiten.</p>
|
|
</header>
|
|
<section class="quiet-panel capture-panel">
|
|
<div>
|
|
<p class="eyebrow">Schnellaufnahme</p>
|
|
<h2>Was soll nicht verloren gehen?</h2>
|
|
</div>
|
|
{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
|
|
{#if form?.captured}<div class="form-message success" role="status">
|
|
Im Eingang gespeichert.
|
|
<a href={resolve('/fundus/[id]', { id: form.capturedId })}>Jetzt ausarbeiten</a>
|
|
</div>{/if}
|
|
<form method="POST" action="?/capture" class="capture-form">
|
|
<label
|
|
>Gedanke <span>optional bei URL</span><input
|
|
name="title"
|
|
maxlength="200"
|
|
value={form?.title ?? ''}
|
|
placeholder="Kurze Idee festhalten"
|
|
/></label
|
|
>
|
|
<label
|
|
>Link <span>optional</span><input
|
|
name="url"
|
|
type="url"
|
|
maxlength="2000"
|
|
value={form?.url ?? ''}
|
|
placeholder="https://…"
|
|
/></label
|
|
>
|
|
<button class="primary-button" type="submit">Im Eingang ablegen</button>
|
|
</form>
|
|
</section>
|
|
<section class="quiet-panel rss-inbox-panel">
|
|
<div class="panel-heading">
|
|
<div>
|
|
<p class="eyebrow">RSS-Importeingang</p>
|
|
<h2>RSS-Beiträge</h2>
|
|
</div>
|
|
<span class="catalog-entry-icon"><AppIcon name="rss" /></span>
|
|
</div>
|
|
<p class="catalog-note">
|
|
{data.feedEntries.length}
|
|
{data.feedEntries.length === 1 ? 'Beitrag ist' : 'Beiträge sind'}
|
|
verfügbar. Erst deine ausdrückliche Auswahl übernimmt sie in den redaktionellen Eingang.
|
|
</p>
|
|
{#if form?.feedError}<div class="form-message error" role="alert">{form.feedError}</div>{/if}
|
|
{#if form?.feedSuccess}<div class="form-message success" role="status">
|
|
{form.feedSuccess}
|
|
</div>{/if}
|
|
<button
|
|
class="compact-add-button"
|
|
type="button"
|
|
disabled={!data.feedEntries.length}
|
|
onclick={() => rssDialog.showModal()}
|
|
>
|
|
<AppIcon name="list" />
|
|
{data.feedEntries.length ? 'RSS-Beiträge auswählen' : 'Keine neuen RSS-Beiträge'}
|
|
</button>
|
|
</section>
|
|
<RssSelectionDialog
|
|
bind:this={rssDialog}
|
|
entries={data.feedEntries}
|
|
categories={data.taxonomy.categories}
|
|
{form}
|
|
/>
|
|
{#if data.pieces.length}
|
|
<section class="inbox-list">
|
|
<h2>{data.pieces.length} {data.pieces.length === 1 ? 'offener Inhalt' : 'offene Inhalte'}</h2>
|
|
{#each data.pieces as piece (piece.id)}<article class="inbox-item">
|
|
<a href={resolve('/fundus/[id]', { id: piece.id })}
|
|
><span
|
|
><strong>{piece.title}</strong><small
|
|
>{piece.sourceCount ? `${piece.sourceCount} Quelle` : 'Gedanke ohne Link'}</small
|
|
></span
|
|
><span>Ausarbeiten <AppIcon name="arrow-right" /></span></a
|
|
>
|
|
<details class="piece-actions">
|
|
<summary aria-label={`Aktionen für ${piece.title}`}><AppIcon name="ellipsis" /></summary
|
|
>
|
|
<div class="piece-actions-popover">
|
|
<form
|
|
method="POST"
|
|
action="?/delete"
|
|
onsubmit={(event) =>
|
|
!confirm(`„${piece.title}“ löschen?`) && event.preventDefault()}
|
|
>
|
|
<input type="hidden" name="pieceId" value={piece.id} /><input
|
|
type="hidden"
|
|
name="revision"
|
|
value={piece.revision}
|
|
/>
|
|
<button class="text-button danger-text" type="submit">Piece löschen</button>
|
|
</form>
|
|
</div>
|
|
</details>
|
|
</article>{/each}
|
|
</section>
|
|
{:else}<section class="quiet-panel planned-panel">
|
|
<div class="planned-icon" aria-hidden="true"><AppIcon name="plus" /></div>
|
|
<h2>Eingang ist leer</h2>
|
|
<p>Neue Gedanken und Links können oben direkt aufgenommen werden.</p>
|
|
</section>{/if}
|
|
</div>
|
|
|
|
<style>
|
|
.rss-inbox-panel {
|
|
display: grid;
|
|
gap: 0.75rem;
|
|
margin-block: 1.5rem;
|
|
padding: clamp(0.85rem, 2vw, 1.2rem);
|
|
}
|
|
.rss-inbox-panel .panel-heading {
|
|
margin: 0;
|
|
}
|
|
.rss-inbox-panel .catalog-note {
|
|
margin: 0;
|
|
}
|
|
</style>
|