feat: Status-Filter + bessere Ampel-Anzeige im Explorer
- Status-Dropdown im Explorer (in_beratung, beschlossen, versandet etc.) - Ampel-Punkt größer (3x3) + Status-Label in Ketten-Liste - Backend status-Filter war schon vorhanden
This commit is contained in:
parent
d0f838a50a
commit
5a6a4850fb
@ -19,6 +19,7 @@
|
|||||||
// Filters
|
// Filters
|
||||||
let suche = $state('');
|
let suche = $state('');
|
||||||
let strangFilter = $state('');
|
let strangFilter = $state('');
|
||||||
|
let statusFilter = $state('');
|
||||||
let currentPage = $state(1);
|
let currentPage = $state(1);
|
||||||
const PAGE_SIZE = 30;
|
const PAGE_SIZE = 30;
|
||||||
|
|
||||||
@ -38,6 +39,18 @@
|
|||||||
{ value: 'mitteilung', label: 'Mitteilungen' },
|
{ value: 'mitteilung', label: 'Mitteilungen' },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
const STATUS_OPTIONS = [
|
||||||
|
{ value: '', label: 'Alle Status' },
|
||||||
|
{ value: 'in_beratung', label: '⏳ In Beratung' },
|
||||||
|
{ value: 'beschlossen', label: '🟡 Beschlossen' },
|
||||||
|
{ value: 'umgesetzt', label: '🟢 Umgesetzt' },
|
||||||
|
{ value: 'teilweise_umgesetzt', label: '🟡 Teilweise' },
|
||||||
|
{ value: 'versandet', label: '🔴 Versandet' },
|
||||||
|
{ value: 'abgelehnt', label: '🔴 Abgelehnt' },
|
||||||
|
{ value: 'beantwortet', label: '🟢 Beantwortet' },
|
||||||
|
{ value: 'angefragt', label: '⏳ Angefragt' },
|
||||||
|
];
|
||||||
|
|
||||||
const FARB_MAP: Record<string, string> = {
|
const FARB_MAP: Record<string, string> = {
|
||||||
gruen: '#22c55e',
|
gruen: '#22c55e',
|
||||||
gelb: '#eab308',
|
gelb: '#eab308',
|
||||||
@ -56,6 +69,7 @@
|
|||||||
};
|
};
|
||||||
if (suche) params.suche = suche;
|
if (suche) params.suche = suche;
|
||||||
if (strangFilter) params.typ = strangFilter;
|
if (strangFilter) params.typ = strangFilter;
|
||||||
|
if (statusFilter) params.status = statusFilter;
|
||||||
params = mergeFilterParams(params);
|
params = mergeFilterParams(params);
|
||||||
const data = await fetchKetten(params);
|
const data = await fetchKetten(params);
|
||||||
ketten = data.items;
|
ketten = data.items;
|
||||||
@ -196,6 +210,14 @@
|
|||||||
</button>
|
</button>
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
|
<select
|
||||||
|
bind:value={statusFilter}
|
||||||
|
onchange={() => { currentPage = 1; loadKetten(); }}
|
||||||
|
class="w-full border border-gray-300 rounded-lg px-2 py-1.5 text-xs focus:ring-2 focus:ring-green-500 bg-white">
|
||||||
|
{#each STATUS_OPTIONS as opt}
|
||||||
|
<option value={opt.value}>{opt.label}</option>
|
||||||
|
{/each}
|
||||||
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Count -->
|
<!-- Count -->
|
||||||
@ -222,11 +244,13 @@
|
|||||||
{kette.ursprung?.aktenzeichen || `#${kette.id}`}
|
{kette.ursprung?.aktenzeichen || `#${kette.id}`}
|
||||||
</span>
|
</span>
|
||||||
{#if kette.ampel}
|
{#if kette.ampel}
|
||||||
|
<span class="flex items-center gap-1 shrink-0">
|
||||||
<span
|
<span
|
||||||
class="w-2.5 h-2.5 rounded-full shrink-0"
|
class="w-3 h-3 rounded-full"
|
||||||
style="background-color: {FARB_MAP[kette.ampel.farbe] || FARB_MAP.grau}"
|
style="background-color: {FARB_MAP[kette.ampel.farbe] || FARB_MAP.grau}"
|
||||||
title="{kette.ampel.schritt}"
|
|
||||||
></span>
|
></span>
|
||||||
|
<span class="text-[10px] text-gray-500">{kette.ampel.label}</span>
|
||||||
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
<p class="text-xs text-gray-600 line-clamp-2 leading-snug">
|
<p class="text-xs text-gray-600 line-clamp-2 leading-snug">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user