@extends('admin.admin_dashboard')
@section('admin')

@php
    $classOptions = ['Baby','Top','Primary One','Primary Two','Primary Three','Primary Four','Primary Five','Primary Six','Primary Seven','Senior One','Senior Two','Senior Three','Senior Four','Vocational'];
    $childCategories = ['children','sponsorship','education','welfare','coffee','graduation'];
    $presetLabels = ['basic' => 'Basic columns', 'contact' => 'Contact info', 'sponsorship' => 'Sponsorship info', 'financial' => 'Financial', 'all' => 'All columns'];
@endphp

<div class="page-content chm-cfdp-reports">
    <div class="container-fluid">
        <div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-4">
            <div>
                <h4 class="mb-1 fw-bold">CFDP Reports</h4>
                <p class="text-muted mb-0">Generate, filter and export reports across sponsorship, education, welfare, generosity and communications.</p>
            </div>
            @if(($report['count'] ?? 0) > 0)
                <div class="d-flex flex-wrap gap-2">
                    <button type="button" class="btn btn-sm btn-outline-secondary" id="cfdpPrintReport">
                        <i class="bx bx-printer me-1"></i> Print
                    </button>
                </div>
            @endif
        </div>

        {{-- Category hub --}}
        <div class="row g-3 mb-4">
            @foreach($categories as $key => $meta)
                <div class="col-xl-3 col-md-4 col-sm-6">
                    <a href="{{ route('cfdpReports.index', ['category' => $key]) }}"
                       class="card h-100 text-decoration-none {{ $category === $key ? 'border-primary shadow-sm' : 'border-light' }}">
                        <div class="card-body">
                            <div class="d-flex align-items-start gap-3">
                                <span class="rounded-circle bg-light d-inline-flex align-items-center justify-content-center flex-shrink-0" style="width:42px;height:42px;">
                                    <i class="bx {{ $meta['icon'] }} fs-5 {{ $category === $key ? 'text-primary' : 'text-secondary' }}"></i>
                                </span>
                                <div>
                                    <h6 class="mb-1 {{ $category === $key ? 'text-primary' : 'text-dark' }}">{{ $meta['label'] }}</h6>
                                    <p class="text-muted small mb-0">{{ $meta['description'] }}</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            @endforeach
        </div>

        {{-- Filters --}}
        <form method="GET" action="{{ route('cfdpReports.index') }}" id="cfdpReportForm" class="card shadow-sm mb-4 chm-filter-panel">
            <div class="card-header bg-transparent d-flex flex-wrap justify-content-between align-items-center gap-2">
                <div>
                    <h5 class="mb-0">{{ $categories[$category]['label'] ?? 'Report' }}</h5>
                    <small class="text-muted">Configure filters and columns, then run the report.</small>
                </div>
                <button type="button" class="btn btn-sm btn-outline-secondary" id="cfdpClearFilters">
                    <i class="bx bx-x me-1"></i> Clear filters
                </button>
            </div>

            <div class="card-body">
                <input type="hidden" name="category" value="{{ $category }}">
                <input type="hidden" name="run" value="1">

                <div class="row g-3 align-items-end">
                    @if(in_array($category, $childCategories))
                        <div class="col-md-3">
                            <label class="form-label">Child Status</label>
                            <select name="report_type" class="form-select chm-select" data-placeholder="All statuses" data-allow-clear="true">
                                <option value=""></option>
                                <option value="sponsored" @selected(($filters['report_type'] ?? '') === 'sponsored')>Sponsored</option>
                                <option value="non sponsored" @selected(($filters['report_type'] ?? '') === 'non sponsored')>Non-Sponsored</option>
                                <option value="graduated" @selected(($filters['report_type'] ?? '') === 'graduated')>Graduated</option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Gender</label>
                            <select name="sex" class="form-select chm-select" data-placeholder="All genders" data-allow-clear="true">
                                <option value=""></option>
                                <option value="male" @selected(($filters['sex'] ?? '') === 'male')>Male</option>
                                <option value="female" @selected(($filters['sex'] ?? '') === 'female')>Female</option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Age Range</label>
                            <input type="text" name="age_range" class="form-control" placeholder="e.g. 5-12" value="{{ $filters['age_range'] ?? '' }}">
                        </div>
                        <div class="col-md-3">
                            <label class="form-label">Cluster</label>
                            <select name="cluster" class="form-select chm-select" data-placeholder="All clusters" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($clusters as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['cluster'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label">Country</label>
                            <select name="country" class="form-select chm-select" data-placeholder="All countries" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($countries as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['country'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label">Search Child</label>
                            <input type="text" name="search" class="form-control" placeholder="Name or child number" value="{{ $filters['search'] ?? '' }}">
                        </div>
                    @endif

                    @if(in_array($category, ['sponsorship','graduation']))
                        <div class="col-md-3">
                            <label class="form-label">Pipeline Stage</label>
                            <select name="pipeline" class="form-select chm-select" data-placeholder="All stages" data-allow-clear="true">
                                <option value=""></option>
                                <option value="mid_pending" @selected(($filters['pipeline'] ?? '') === 'mid_pending')>Mid-term pending</option>
                                <option value="mid_done" @selected(($filters['pipeline'] ?? '') === 'mid_done')>Mid-term completed</option>
                                <option value="grad_pending" @selected(($filters['pipeline'] ?? '') === 'grad_pending')>Graduation pending</option>
                                <option value="grad_done" @selected(($filters['pipeline'] ?? '') === 'grad_done')>Graduation completed</option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Graduation Year</label>
                            <select name="graduation_year" class="form-select chm-select" data-placeholder="All years" data-allow-clear="true">
                                <option value=""></option>
                                @foreach(range(date('Y'), 2018) as $y)
                                    <option value="{{ $y }}" @selected(($filters['graduation_year'] ?? '') == $y)>{{ $y }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Start Date From</label>
                            <input type="date" name="date_from" class="form-control chm-datepicker" value="{{ $filters['date_from'] ?? '' }}">
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Start Date To</label>
                            <input type="date" name="date_to" class="form-control chm-datepicker" value="{{ $filters['date_to'] ?? '' }}">
                        </div>
                    @endif

                    @if($category === 'sponsors')
                        <div class="col-md-3">
                            <label class="form-label">Sponsor Country</label>
                            <select name="country" class="form-select chm-select" data-placeholder="All countries" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($countries as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['country'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Search Sponsor</label>
                            <input type="text" name="search" class="form-control" placeholder="Name or sponsor number" value="{{ $filters['search'] ?? '' }}">
                        </div>
                    @endif

                    @if(in_array($category, ['education','children']))
                        <div class="col-md-3">
                            <label class="form-label">School</label>
                            <select name="school_name" class="form-select chm-select" data-placeholder="All schools" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($schools as $id => $school)
                                    <option value="{{ $id }}" @selected(($filters['school_name'] ?? '') == $id)>{{ $school }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Class</label>
                            <select name="class" class="form-select chm-select" data-placeholder="All classes" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($classOptions as $class)
                                    <option value="{{ $class }}" @selected(($filters['class'] ?? '') === $class)>{{ $class }}</option>
                                @endforeach
                            </select>
                        </div>
                    @endif

                    @if($category === 'education')
                        <div class="col-md-2">
                            <label class="form-label">Schooling</label>
                            <select name="schooling" class="form-select chm-select" data-placeholder="All" data-allow-clear="true">
                                <option value=""></option>
                                <option value="yes" @selected(($filters['schooling'] ?? '') === 'yes')>In school</option>
                                <option value="no" @selected(($filters['schooling'] ?? '') === 'no')>Not in school</option>
                            </select>
                        </div>
                    @endif

                    @if($category === 'coffee')
                        <div class="col-md-3">
                            <label class="form-label">Cluster</label>
                            <select name="cluster" class="form-select chm-select" data-placeholder="All clusters" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($clusters as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['cluster'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Received Coffee</label>
                            <select name="coffee" class="form-select chm-select" data-placeholder="All" data-allow-clear="true">
                                <option value=""></option>
                                <option value="yes" @selected(($filters['coffee'] ?? '') === 'yes')>Yes</option>
                                <option value="no" @selected(($filters['coffee'] ?? '') === 'no')>No</option>
                            </select>
                        </div>
                    @endif

                    @if(in_array($category, ['gifts','donations','letters','status_audit','welfare']))
                        @if($category !== 'letters' && $category !== 'status_audit')
                            <div class="col-md-3">
                                <label class="form-label">Cluster</label>
                                <select name="cluster" class="form-select chm-select" data-placeholder="All clusters" data-allow-clear="true">
                                    <option value=""></option>
                                    @foreach($clusters as $id => $name)
                                        <option value="{{ $id }}" @selected(($filters['cluster'] ?? '') == $id)>{{ $name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        @endif
                    @endif

                    @if(in_array($category, ['gifts','donations']))
                        <div class="col-md-2">
                            <label class="form-label">Date From</label>
                            <input type="date" name="date_from" class="form-control chm-datepicker" value="{{ $filters['date_from'] ?? '' }}">
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Date To</label>
                            <input type="date" name="date_to" class="form-control chm-datepicker" value="{{ $filters['date_to'] ?? '' }}">
                        </div>
                    @endif

                    @if($category === 'donations')
                        <div class="col-md-2">
                            <label class="form-label">Donation Status</label>
                            <select name="donation_status" class="form-select chm-select" data-placeholder="All statuses" data-allow-clear="true">
                                <option value=""></option>
                                <option value="Pending" @selected(($filters['donation_status'] ?? '') === 'Pending')>Pending</option>
                                <option value="Completed" @selected(($filters['donation_status'] ?? '') === 'Completed')>Completed</option>
                            </select>
                        </div>
                    @endif

                    @if($category === 'letters')
                        <div class="col-md-3">
                            <label class="form-label">Cluster</label>
                            <select name="cluster" class="form-select chm-select" data-placeholder="All clusters" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($clusters as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['cluster'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label">Letter Status</label>
                            <select name="letter_status" class="form-select chm-select" data-placeholder="All statuses" data-allow-clear="true">
                                <option value=""></option>
                                @foreach(['received','reply_written','sent_to_sponsor','completed'] as $st)
                                    <option value="{{ $st }}" @selected(($filters['letter_status'] ?? '') === $st)>{{ ucwords(str_replace('_', ' ', $st)) }}</option>
                                @endforeach
                            </select>
                        </div>
                    @endif

                    @if($category === 'status_audit')
                        <div class="col-md-3">
                            <label class="form-label">Cluster</label>
                            <select name="cluster" class="form-select chm-select" data-placeholder="All clusters" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($clusters as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['cluster'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label">Status Type</label>
                            <select name="id_status" class="form-select chm-select" data-placeholder="All status types" data-allow-clear="true">
                                <option value=""></option>
                                @foreach($statuses as $id => $name)
                                    <option value="{{ $id }}" @selected(($filters['id_status'] ?? '') == $id)>{{ $name }}</option>
                                @endforeach
                            </select>
                        </div>
                    @endif

                    {{-- Column picker --}}
                    <div class="col-12">
                        <hr class="my-1">
                    </div>

                    <div class="col-md-3">
                        <label class="form-label">Column Preset</label>
                        <select id="cfdpColumnPreset" name="column_preset" class="form-select chm-select" data-placeholder="Choose a preset…" data-allow-clear="true">
                            <option value=""></option>
                            @foreach($columnPresets as $presetKey => $presetFields)
                                <option value="{{ $presetKey }}" @selected(($filters['column_preset'] ?? '') === $presetKey)>
                                    {{ $presetLabels[$presetKey] ?? ucfirst($presetKey) }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label d-flex justify-content-between align-items-center">
                            <span>Columns to Display <span class="text-danger">*</span></span>
                            <span class="small">
                                <button type="button" class="btn btn-link btn-sm p-0 me-2" data-column-action="all">Select all</button>
                                <button type="button" class="btn btn-link btn-sm p-0" data-column-action="reset">Reset</button>
                            </span>
                        </label>
                        <select name="fields[]" id="cfdpReportColumns" class="form-select chm-select" multiple required
                                data-placeholder="Choose columns to include in the report">
                            @foreach($fieldCatalog as $fieldKey => $fieldLabel)
                                <option value="{{ $fieldKey }}" @selected(in_array($fieldKey, $selectedFields, true))>{{ $fieldLabel }}</option>
                            @endforeach
                        </select>
                        <div class="form-text">Selected columns appear in the table and exports. At least one column is required.</div>
                    </div>

                    <div class="col-md-2 d-grid">
                        <button type="submit" class="btn btn-primary">
                            <i class="bx bx-play me-1"></i> Run Report
                        </button>
                    </div>
                </div>
            </div>
        </form>

        @if(!empty($summaryCards))
            <div class="row g-3 mb-4">
                @foreach($summaryCards as $card)
                    <div class="col-md-3 col-sm-6">
                        <div class="card border-0 shadow-sm h-100">
                            <div class="card-body d-flex align-items-center gap-3">
                                <span class="rounded-circle bg-primary bg-opacity-10 text-primary d-inline-flex align-items-center justify-content-center" style="width:44px;height:44px;">
                                    <i class="bx {{ $card['icon'] }} fs-5"></i>
                                </span>
                                <div>
                                    <div class="text-muted small">{{ $card['label'] }}</div>
                                    <div class="fs-5 fw-semibold">{{ $card['value'] }}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        @endif

        @if(($report['count'] ?? 0) > 0)
            <div class="d-flex flex-wrap gap-2 mb-3">
                @foreach([route('reports.cfdp.pdf') => ['PDF', 'outline-secondary', 'bx-download'], route('reports.cfdp.excel') => ['Excel', 'success', 'bx-file']] as $exportRoute => [$exportLabel, $variant, $icon])
                    <form method="GET" action="{{ $exportRoute }}" target="_blank" class="d-inline">
                        @foreach(request()->all() as $key => $value)
                            @if(is_array($value))
                                @foreach($value as $v)
                                    <input type="hidden" name="{{ $key }}[]" value="{{ $v }}">
                                @endforeach
                            @else
                                <input type="hidden" name="{{ $key }}" value="{{ $value }}">
                            @endif
                        @endforeach
                        <button type="submit" class="btn btn-sm btn-{{ $variant }}">
                            <i class="bx {{ $icon }} me-1"></i> Download {{ $exportLabel }}
                        </button>
                    </form>
                @endforeach
            </div>

            <div class="card chm-card shadow-sm" id="cfdpReportResults">
                <div class="card-header bg-transparent border-bottom">
                    <h5 class="mb-0">{{ $report['label'] }} <span class="text-muted fw-normal">({{ number_format($report['count']) }} records)</span></h5>
                </div>

                <x-chm.table-toolbar
                    :title="$report['label']"
                    :datatable="true"
                    :export="true"
                    :sticky="true"
                    :state-save="false"
                    class="border-0 shadow-none rounded-0"
                >
                    <thead>
                        <tr>
                            <th style="width:48px;">#</th>
                            @foreach($report['columns'] as $label)
                                <th>{{ $label }}</th>
                            @endforeach
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($report['rows'] as $index => $row)
                            <tr>
                                <td class="text-muted">{{ $index + 1 }}</td>
                                @foreach(array_keys($report['columns']) as $key)
                                    <td>{{ $row[$key] ?? 'N/A' }}</td>
                                @endforeach
                            </tr>
                        @endforeach
                    </tbody>
                </x-chm.table-toolbar>
            </div>
        @else
            <div class="alert alert-info mb-0">
                <i class="bx bx-info-circle me-1"></i>
                Choose a report type, select your columns, set any filters, then click <strong>Run Report</strong>.
            </div>
        @endif
    </div>
</div>

@push('styles')
<style>
    .chm-cfdp-reports .chm-table-wrap {
        border: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }
</style>
@endpush

@push('scripts')
<script>
    window.chmCfdpReportConfig = {
        baseUrl: @json(route('cfdpReports.index', ['category' => $category])),
        columnPresets: @json($columnPresets),
        defaultFields: @json($defaultFields),
        category: @json($category),
    };
</script>
<script src="{{ asset('backend/assets/js/chm-cfdp-reports.js') }}"></script>
@endpush

@endsection