179 lines
No EOL
11 KiB
TypeScript
179 lines
No EOL
11 KiB
TypeScript
"use client";
|
|
import { useState, useEffect } from 'react';
|
|
import { API_URL } from "@/config/constants";
|
|
import Link from 'next/link';
|
|
|
|
export default function MembershipWasher() {
|
|
const [drafts, setDrafts] = useState<any[]>([]);
|
|
const [loading, setLoading] = useState(true);
|
|
const [selectedIds, setSelectedIds] = useState<number[]>([]);
|
|
const [saving, setSaving] = useState(false);
|
|
|
|
const fetchDrafts = () => {
|
|
setLoading(true);
|
|
fetch(`${API_URL}/admin/membership/drafts`)
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
// Konverter innkommende drafts til editerbare felter lokalt
|
|
const editableDrafts = data.map((f: any) => ({
|
|
...f,
|
|
edit_standard_navn: f.membership_draft?.foreslatt_standard_navn || f.navn_standard_medlemskap || "",
|
|
edit_standard_pris: f.membership_draft?.foreslatt_standard_pris || f.standard_medlemskap || "",
|
|
edit_standard_kommentar: f.membership_draft?.foreslatt_standard_kommentar || "",
|
|
edit_rimeligste_navn: f.membership_draft?.foreslatt_rimeligste_navn || f.navn_rimeligste_alternativ || "",
|
|
edit_rimeligste_pris: f.membership_draft?.foreslatt_rimeligste_pris || f.rimeligste_alternativ || "",
|
|
}));
|
|
setDrafts(editableDrafts);
|
|
setLoading(false);
|
|
})
|
|
.catch(() => setLoading(false));
|
|
};
|
|
|
|
useEffect(() => {
|
|
fetchDrafts();
|
|
}, []);
|
|
|
|
const toggleSelectAll = (checked: boolean) => {
|
|
if (checked) setSelectedIds(drafts.map(d => d.id));
|
|
else setSelectedIds([]);
|
|
};
|
|
|
|
const toggleOne = (id: number) => {
|
|
if (selectedIds.includes(id)) setSelectedIds(selectedIds.filter(i => i !== id));
|
|
else setSelectedIds([...selectedIds, id]);
|
|
};
|
|
|
|
const updateDraftField = (id: number, field: string, value: any) => {
|
|
setDrafts(drafts.map(d => d.id === id ? { ...d, [field]: value } : d));
|
|
};
|
|
|
|
const handleApprove = async () => {
|
|
const toApprove = drafts.filter(d => selectedIds.includes(d.id)).map(d => ({
|
|
facility_id: d.id,
|
|
navn_standard_medlemskap: d.edit_standard_navn,
|
|
standard_medlemskap: Number(d.edit_standard_pris) || null,
|
|
standard_medlemskap_kommentarer: d.edit_standard_kommentar,
|
|
navn_rimeligste_alternativ: d.edit_rimeligste_navn,
|
|
rimeligste_alternativ: Number(d.edit_rimeligste_pris) || null,
|
|
}));
|
|
|
|
if (toApprove.length === 0) return alert("Velg minst ett anlegg å godkjenne.");
|
|
|
|
setSaving(true);
|
|
try {
|
|
const res = await fetch(`${API_URL}/admin/membership/approve-bulk`, {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ approvals: toApprove })
|
|
});
|
|
if (res.ok) {
|
|
alert(`${toApprove.length} anlegg ble oppdatert og lagret til live!`);
|
|
setSelectedIds([]);
|
|
fetchDrafts(); // Oppdaterer listen (fjerner de godkjente)
|
|
} else {
|
|
alert("Noe gikk galt under lagring.");
|
|
}
|
|
} catch (e) {
|
|
alert("Nettverksfeil");
|
|
}
|
|
setSaving(false);
|
|
};
|
|
|
|
if (loading) return <div className="p-20 text-center font-black animate-pulse">Laster utkast...</div>;
|
|
|
|
return (
|
|
<div className="min-h-screen bg-[#f1f7ed] p-8 text-[#11280f]">
|
|
<div className="max-w-[1400px] mx-auto">
|
|
<div className="flex justify-between items-end mb-10 border-b border-gray-200 pb-6">
|
|
<div>
|
|
<Link href="/admin" className="text-sm font-bold text-gray-500 hover:text-[#8bc34a] mb-2 block">← Tilbake til oversikten</Link>
|
|
<h1 className="text-4xl font-black">Medlemskaps-Vaskeriet</h1>
|
|
<p className="text-sm text-gray-600 mt-2">Gå gjennom AI-ens forslag, juster hvis nødvendig, og godkjenn for å publisere. Oppdatert-dato settes automatisk i dag.</p>
|
|
</div>
|
|
<button
|
|
onClick={handleApprove}
|
|
disabled={saving || selectedIds.length === 0}
|
|
className="bg-[#8bc34a] text-white px-8 py-4 rounded-xl font-black uppercase tracking-widest shadow-lg hover:scale-105 transition-all disabled:opacity-50 disabled:scale-100"
|
|
>
|
|
{saving ? 'Lagrer...' : `Godkjenn Valgte (${selectedIds.length})`}
|
|
</button>
|
|
</div>
|
|
|
|
{drafts.length === 0 ? (
|
|
<div className="bg-white p-20 rounded-[2rem] text-center shadow-sm">
|
|
<span className="text-6xl mb-4 block">🧹</span>
|
|
<h2 className="text-2xl font-black text-gray-400">Alt er rent og pent!</h2>
|
|
<p className="text-gray-500">Ingen ventende forslag fra AI-skraperen akkurat nå.</p>
|
|
</div>
|
|
) : (
|
|
<div className="space-y-6">
|
|
<div className="bg-white p-4 rounded-2xl shadow-sm flex items-center gap-4">
|
|
<input
|
|
type="checkbox"
|
|
className="w-5 h-5 accent-[#8bc34a] ml-2"
|
|
checked={selectedIds.length === drafts.length}
|
|
onChange={(e) => toggleSelectAll(e.target.checked)}
|
|
/>
|
|
<span className="font-black uppercase tracking-widest text-xs text-gray-500">Velg Alle</span>
|
|
</div>
|
|
|
|
{drafts.map(draft => (
|
|
<div key={draft.id} className={`bg-white p-6 rounded-3xl shadow-sm border-2 transition-all ${selectedIds.includes(draft.id) ? 'border-[#8bc34a] bg-[#8bc34a]/5' : 'border-transparent'}`}>
|
|
<div className="flex gap-6 items-start">
|
|
<div className="pt-2">
|
|
<input
|
|
type="checkbox"
|
|
className="w-6 h-6 accent-[#8bc34a] cursor-pointer"
|
|
checked={selectedIds.includes(draft.id)}
|
|
onChange={() => toggleOne(draft.id)}
|
|
/>
|
|
</div>
|
|
<div className="flex-grow space-y-4">
|
|
|
|
{/* OPPDATERT: Navn + ID Badge */}
|
|
<div className="flex justify-between items-center border-b pb-4">
|
|
<h3 className="text-2xl font-black flex items-center gap-3">
|
|
{draft.name}
|
|
<span className="text-xs font-mono font-bold bg-gray-100 text-gray-400 px-2 py-1 rounded-md">ID: {draft.id}</span>
|
|
</h3>
|
|
<a href={draft.medlemskap_url} target="_blank" className="text-xs font-bold text-blue-600 hover:underline bg-blue-50 px-4 py-2 rounded-lg">Sjekk Klubbens Nettside ↗</a>
|
|
</div>
|
|
|
|
{draft.membership_draft?.ai_begrunnelse && (
|
|
<div className="bg-blue-50/50 p-4 rounded-xl text-sm italic text-blue-900 border border-blue-100">
|
|
<strong>🤖 AI Begrunnelse:</strong> {draft.membership_draft.ai_begrunnelse}
|
|
</div>
|
|
)}
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 pt-2">
|
|
{/* Standard */}
|
|
<div className="space-y-3">
|
|
<h4 className="text-xs font-black uppercase tracking-widest text-gray-400">Standard Medlemskap (Ubegrenset)</h4>
|
|
<div className="flex gap-2">
|
|
<input className="w-2/3 p-3 rounded-xl border border-gray-200 font-bold focus:border-[#8bc34a] outline-none" value={draft.edit_standard_navn} onChange={e => updateDraftField(draft.id, 'edit_standard_navn', e.target.value)} placeholder="Navn (eks. Hovedmedlem)" />
|
|
<input className="w-1/3 p-3 rounded-xl border border-gray-200 font-bold text-right focus:border-[#8bc34a] outline-none" type="number" value={draft.edit_standard_pris} onChange={e => updateDraftField(draft.id, 'edit_standard_pris', e.target.value)} placeholder="Pris" />
|
|
</div>
|
|
<input className="w-full p-3 rounded-xl border border-gray-200 text-sm focus:border-[#8bc34a] outline-none" value={draft.edit_standard_kommentar} onChange={e => updateDraftField(draft.id, 'edit_standard_kommentar', e.target.value)} placeholder="Kommentar (F.eks: Inkluderer ikke treningsavgift)" />
|
|
<p className="text-[10px] text-gray-400">Gammel pris var: {draft.standard_medlemskap ? `kr ${draft.standard_medlemskap} (${draft.navn_standard_medlemskap})` : 'Ikke registrert'}</p>
|
|
</div>
|
|
|
|
{/* Rimeligste */}
|
|
<div className="space-y-3">
|
|
<h4 className="text-xs font-black uppercase tracking-widest text-gray-400">Rimeligste (Betaler Greenfee)</h4>
|
|
<div className="flex gap-2">
|
|
<input className="w-2/3 p-3 rounded-xl border border-gray-200 font-bold focus:border-[#8bc34a] outline-none" value={draft.edit_rimeligste_navn} onChange={e => updateDraftField(draft.id, 'edit_rimeligste_navn', e.target.value)} placeholder="Navn (eks. Greenfeemedlem)" />
|
|
<input className="w-1/3 p-3 rounded-xl border border-gray-200 font-bold text-right focus:border-[#8bc34a] outline-none" type="number" value={draft.edit_rimeligste_pris} onChange={e => updateDraftField(draft.id, 'edit_rimeligste_pris', e.target.value)} placeholder="Pris" />
|
|
</div>
|
|
<p className="text-[10px] text-gray-400 mt-2">Gammel pris var: {draft.rimeligste_alternativ ? `kr ${draft.rimeligste_alternativ} (${draft.navn_rimeligste_alternativ})` : 'Ikke registrert'}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
} |