@extends('layouts.master')
@section('title') Follow-ups @endsection
@section('content')
@component('components.breadcrumb')
@slot('li_1') Supplier Management @endslot
@slot('title') CRM Follow-ups @endslot
@endcomponent

@if(session('success'))
<div class="alert alert-success alert-dismissible fade show">{{ session('success') }}<button type="button" class="btn-close" data-bs-dismiss="alert"></button></div>
@endif

<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header d-flex align-items-center flex-wrap gap-2">
                <h5 class="card-title mb-0 flex-grow-1">Follow-ups</h5>
                <div class="btn-group btn-group-sm">
                    <a href="{{ route('followups.index') }}" class="btn btn-{{ !request('filter') ? '' : 'soft-' }}secondary">All</a>
                    <a href="{{ route('followups.index', ['filter'=>'open']) }}" class="btn btn-{{ request('filter')==='open' ? '' : 'soft-' }}primary">Open ({{ $counts['open'] }})</a>
                    <a href="{{ route('followups.index', ['filter'=>'overdue']) }}" class="btn btn-{{ request('filter')==='overdue' ? '' : 'soft-' }}danger">Overdue ({{ $counts['overdue'] }})</a>
                    <a href="{{ route('followups.index', ['filter'=>'done']) }}" class="btn btn-{{ request('filter')==='done' ? '' : 'soft-' }}success">Done ({{ $counts['done'] }})</a>
                </div>
                <button class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#followupModal"><i class="ri-add-line align-bottom"></i> New Follow-up</button>
            </div>
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-hover align-middle mb-0">
                        <thead class="table-light">
                            <tr><th>Title</th><th>Supplier</th><th>Requisition</th><th>Priority</th><th>Due</th><th>Assignee</th><th>Status</th><th class="text-end">Action</th></tr>
                        </thead>
                        <tbody>
                            @forelse($followups as $f)
                            <tr>
                                <td class="fw-medium">{{ $f->title }}@if($f->notes)<small class="text-muted d-block">{{ \Illuminate\Support\Str::limit($f->notes,60) }}</small>@endif</td>
                                <td>{{ $f->supplier?->name }}</td>
                                <td>{{ $f->requisition?->reference_no ?? '—' }}</td>
                                <td>@php $pc=['high'=>'danger','normal'=>'secondary','low'=>'light'][$f->priority]??'secondary'; @endphp<span class="badge bg-{{ $pc }} text-uppercase">{{ $f->priority }}</span></td>
                                <td>
                                    @if($f->due_date)<span class="{{ $f->isOverdue() ? 'text-danger fw-semibold' : '' }}">{{ $f->due_date->format('d M Y') }}</span>@if($f->isOverdue()) <i class="ri-alarm-warning-line text-danger"></i>@endif @else — @endif
                                </td>
                                <td>{{ $f->assignee?->name ?? '—' }}</td>
                                <td>@if($f->status==='done')<span class="badge bg-success-subtle text-success">Done</span>@else<span class="badge bg-warning-subtle text-warning">Open</span>@endif</td>
                                <td class="text-end">
                                    @if($f->status==='open')
                                    <form method="POST" action="{{ route('followups.complete', $f) }}" class="d-inline">@csrf<button class="btn btn-sm btn-soft-success">Complete</button></form>
                                    @else
                                    <form method="POST" action="{{ route('followups.reopen', $f) }}" class="d-inline">@csrf<button class="btn btn-sm btn-soft-secondary">Reopen</button></form>
                                    @endif
                                </td>
                            </tr>
                            @empty
                            <tr><td colspan="8" class="text-center text-muted py-4">No follow-ups. <a href="#" data-bs-toggle="modal" data-bs-target="#followupModal">Create one</a>.</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
                <div class="mt-3">{{ $followups->links('pagination::bootstrap-5') }}</div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="followupModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <form method="POST" action="{{ route('followups.store') }}" class="modal-content">
            @csrf
            <div class="modal-header"><h5 class="modal-title">New Follow-up</h5><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
            <div class="modal-body">
                <div class="mb-3">
                    <label class="form-label">Supplier <span class="text-danger">*</span></label>
                    <select name="supplier_id" class="form-select" required>
                        <option value="">Select supplier…</option>
                        @foreach($suppliers as $s)<option value="{{ $s->id }}" @selected(request('supplier')==$s->id)>{{ $s->name }}</option>@endforeach
                    </select>
                </div>
                <div class="mb-3">
                    <label class="form-label">Title <span class="text-danger">*</span></label>
                    <input type="text" name="title" class="form-control" placeholder="e.g. Chase outstanding delivery" required>
                </div>
                <div class="row g-2">
                    <div class="col-6 mb-3">
                        <label class="form-label">Priority</label>
                        <select name="priority" class="form-select"><option value="normal">Normal</option><option value="high">High</option><option value="low">Low</option></select>
                    </div>
                    <div class="col-6 mb-3">
                        <label class="form-label">Due Date</label>
                        <input type="date" name="due_date" class="form-control">
                    </div>
                </div>
                <div class="mb-0">
                    <label class="form-label">Notes</label>
                    <textarea name="notes" class="form-control" rows="2"></textarea>
                </div>
            </div>
            <div class="modal-footer"><button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button><button type="submit" class="btn btn-primary">Create</button></div>
        </form>
    </div>
</div>
@endsection