TicketAssistent/resources/views/livewire/admin/article-manager.blade.php

<div class="space-y-6">
    <div class="bg-white rounded-xl p-4 shadow">
        <h2 class="font-semibold mb-3">Nieuw Artikel</h2>
        @if (session('success'))
            <div class="mb-3 text-green-700 bg-green-100 p-2 rounded">{{ session('success') }}</div>
        @endif
        <form wire:submit="save" class="space-y-3">
            <input wire:model="title" type="text" class="w-full border rounded p-2" placeholder="Titel">
            @error('title') <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
            <textarea wire:model="content" class="w-full border rounded p-2 min-h-40" placeholder="Content"></textarea>
            @error('content') <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
            <textarea wire:model="note" class="w-full border rounded p-2 min-h-24" placeholder="Interne notitie voor de LLM (niet gebruikt voor embeddings)"></textarea>
            @error('note') <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
            <label class="flex items-start gap-2 text-sm">
                <input wire:model="allowedActions" type="checkbox" value="domain_inf" class="mt-1 rounded border-slate-300">
                <span>
                    <span class="font-medium">domain_inf toestaan</span>
                    <span class="block text-slate-500">Alleen uitvoeren wanneer de LLM deze action aanvraagt en sld/tld aanwezig zijn.</span>
                </span>
            </label>
            @error('allowedActions.*') <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
            <button class="bg-slate-900 text-white px-4 py-2 rounded" type="submit">Opslaan</button>
        </form>
    </div>

    <div class="bg-white rounded-xl p-4 shadow">
        <h2 class="font-semibold mb-3">Artikelen</h2>
        <div class="space-y-3">
            @foreach($articles as $article)
                <div class="border rounded p-3">
                    <div class="flex items-start justify-between gap-3">
                        <div>
                            <div class="font-medium">#{{ $article->id }} {{ $article->title }}</div>
                            @if(($article->status ?? 'published') === 'draft')
                                <span class="inline-block mt-1 text-xs px-2 py-0.5 rounded bg-amber-100 text-amber-800">Concept (AI)</span>
                            @endif
                        </div>
                        <div class="flex items-center gap-3">
                            @if(($article->status ?? 'published') === 'draft')
                                <button
                                    type="button"
                                    wire:click="approveDraft({{ $article->id }})"
                                    class="text-sm text-green-700 hover:underline"
                                >
                                    Valideren & publiceren
                                </button>
                            @endif
                            <button
                                type="button"
                                wire:click="deleteArticle({{ $article->id }})"
                                wire:confirm="Weet je zeker dat je dit artikel wilt verwijderen?"
                                class="text-sm text-red-600 hover:underline"
                            >
                                Verwijderen
                            </button>
                        </div>
                    </div>
                    @if($article->note)
                        <div class="mt-2 text-xs rounded bg-slate-50 p-2 text-slate-600">
                            <span class="font-semibold">LLM note:</span> {{ \Illuminate\Support\Str::limit($article->note, 180) }}
                        </div>
                    @endif
                    @if(($article->allowed_actions ?? []) !== [])
                        <div class="mt-2 flex flex-wrap gap-1">
                            @foreach($article->allowed_actions as $action)
                                <span class="text-xs px-2 py-0.5 rounded bg-blue-100 text-blue-800">{{ $action }}</span>
                            @endforeach
                        </div>
                    @endif
                    <div class="text-sm text-slate-600">{{ \Illuminate\Support\Str::limit($article->content, 140) }}</div>
                    <div class="mt-3 rounded bg-slate-50 p-3 space-y-2">
                        <label class="block text-xs font-semibold text-slate-500">LLM note</label>
                        <textarea wire:model="articleNotes.{{ $article->id }}" class="w-full border rounded p-2 min-h-20 text-sm" placeholder="Interne aanwijzingen voor dit artikel"></textarea>
                        @error("articleNotes.{$article->id}") <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
                        <label class="flex items-start gap-2 text-sm">
                            <input wire:model="articleAllowedActions.{{ $article->id }}" type="checkbox" value="domain_inf" class="mt-1 rounded border-slate-300">
                            <span>domain_inf toestaan</span>
                        </label>
                        @error("articleAllowedActions.{$article->id}.*") <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
                        <div>
                            <label class="block text-xs font-semibold text-slate-500 mb-1">Gekoppelde snelantwoorden</label>
                            @if($quickReplyOptions->isEmpty())
                                <p class="text-xs text-slate-500">Nog geen actieve snelantwoorden beschikbaar.</p>
                            @else
                                <div class="grid gap-1 sm:grid-cols-2">
                                    @foreach($quickReplyOptions as $quickReply)
                                        <label class="flex items-center gap-2 text-sm">
                                            <input
                                                wire:model="articleQuickReplies.{{ $article->id }}"
                                                type="checkbox"
                                                value="{{ $quickReply->id }}"
                                                class="rounded border-slate-300"
                                            >
                                            <span>{{ $quickReply->title }}</span>
                                        </label>
                                    @endforeach
                                </div>
                            @endif
                            @error("articleQuickReplies.{$article->id}.*") <p class="text-red-600 text-sm">{{ $message }}</p> @enderror
                        </div>
                        <button
                            type="button"
                            wire:click="saveMetadata({{ $article->id }})"
                            class="text-sm px-3 py-1 rounded bg-slate-900 text-white"
                        >
                            Metadata opslaan
                        </button>
                    </div>
                </div>
            @endforeach
        </div>
        <div class="mt-4">{{ $articles->links() }}</div>
    </div>
</div>