@extends('layouts.dashboard')
@section('title', __('Report Builder'))
@section('page_title', __('Report Builder'))

@section('content')
    <div class="row g-3">
        <div class="col-xl-4">
            <form method="GET" action="{{ route('admin.reports.builder') }}" id="rbForm" class="card mb-3">
                <input type="hidden" name="run" value="1">
                <div class="card-header"><i class="bi bi-sliders text-primary me-2"></i>{{ __('Build a report') }}</div>
                <div class="card-body d-grid gap-3">
                    <div>
                        <label class="form-label">{{ __('Dataset') }}</label>
                        <select name="dataset" class="form-select" onchange="this.form.run.value=0;this.form.submit()">
                            @foreach($datasets as $k => $d)<option value="{{ $k }}" @selected($k === $key)>{{ __($d['label']) }}</option>@endforeach
                        </select>
                    </div>
                    <div class="row g-2">
                        <div class="col-6"><label class="form-label">{{ __('From') }}</label><input type="date" name="from" class="form-control" value="{{ $cfg['from'] }}"></div>
                        <div class="col-6"><label class="form-label">{{ __('To') }}</label><input type="date" name="to" class="form-control" value="{{ $cfg['to'] }}"></div>
                    </div>
                    @foreach($filterOptions as $col => $f)
                        <div>
                            <label class="form-label">{{ __($f['label']) }}</label>
                            <select name="filters[{{ $col }}]" class="form-select form-select-sm">
                                <option value="">{{ __('Any') }}</option>
                                @foreach($f['options'] as $v => $l)<option value="{{ $v }}" @selected((string) ($cfg['filters'][$col] ?? '') === (string) $v)>{{ __($l) }}</option>@endforeach
                            </select>
                        </div>
                    @endforeach
                    <div>
                        <label class="form-label d-flex justify-content-between">{{ __('Columns') }} <a href="#" class="small" onclick="document.querySelectorAll('.rb-col').forEach(c=>c.checked=true);return false;">{{ __('all') }}</a></label>
                        <div class="border rounded-3 p-2" style="max-height:220px;overflow:auto">
                            @foreach($ds['columns'] as $col => $meta)
                                <div class="form-check"><input class="form-check-input rb-col" type="checkbox" name="columns[]" value="{{ $col }}" id="col-{{ $loop->index }}" @checked(in_array($col, $cfg['columns'], true))><label class="form-check-label small" for="col-{{ $loop->index }}">{{ __($meta['label']) }}</label></div>
                            @endforeach
                        </div>
                    </div>
                    <div class="border-top pt-3">
                        <label class="form-label fw-bold">{{ __('Summarise (optional)') }}</label>
                        <div class="row g-2">
                            <div class="col-6"><select name="period" class="form-select form-select-sm"><option value="">{{ __('No time grouping') }}</option>@foreach(['day' => 'Per day', 'week' => 'Per week', 'month' => 'Per month', 'year' => 'Per year'] as $v => $l)<option value="{{ $v }}" @selected($cfg['period'] === $v)>{{ __($l) }}</option>@endforeach</select></div>
                            <div class="col-6"><select name="group" class="form-select form-select-sm"><option value="">{{ __('No grouping') }}</option>@foreach($ds['groups'] as $v => $l)<option value="{{ $v }}" @selected($cfg['group'] === $v)>{{ __('By :field', ['field' => __($l)]) }}</option>@endforeach</select></div>
                            @if($ds['sums'])<div class="col-12"><select name="sum" class="form-select form-select-sm"><option value="">{{ __('Count only') }}</option>@foreach($ds['sums'] as $v => $l)<option value="{{ $v }}" @selected($cfg['sum'] === $v)>{{ __('Sum & average of :field', ['field' => __($l)]) }}</option>@endforeach</select></div>@endif
                        </div>
                    </div>
                    <div class="row g-2">
                        <div class="col-6"><label class="form-label small">{{ __('Sort by') }}</label><select name="sort" class="form-select form-select-sm"><option value="">{{ __('Date') }}</option>@foreach($ds['columns'] as $col => $meta)<option value="{{ $col }}" @selected($cfg['sort'] === $col)>{{ __($meta['label']) }}</option>@endforeach</select></div>
                        <div class="col-3"><label class="form-label small">{{ __('Sort order') }}</label><select name="dir" class="form-select form-select-sm"><option value="desc" @selected($cfg['dir'] === 'desc') title="{{ __('Descending') }}">↓</option><option value="asc" @selected($cfg['dir'] === 'asc') title="{{ __('Ascending') }}">↑</option></select></div>
                        <div class="col-3"><label class="form-label small">{{ __('Rows') }}</label><input type="number" name="limit" class="form-control form-control-sm" min="10" max="5000" value="{{ $cfg['limit'] }}"></div>
                    </div>
                </div>
                <div class="card-footer d-flex gap-2"><button class="btn btn-primary flex-grow-1"><i class="bi bi-play-fill me-1"></i>{{ __('Run report') }}</button><button class="btn btn-light" type="button" data-bs-toggle="modal" data-bs-target="#saveModal" title="{{ __('Save') }}"><i class="bi bi-bookmark-plus"></i></button></div>
            </form>

            <div class="card">
                <div class="card-header"><i class="bi bi-bookmarks text-primary me-2"></i>{{ __('Saved reports') }}</div>
                <div class="list-group list-group-flush">
                    @forelse($saved as $r)
                        <div class="list-group-item d-flex align-items-center gap-2">
                            <a href="{{ route('admin.reports.builder', ['report' => $r->id]) }}" class="flex-grow-1 min-w-0 text-reset"><div class="fw-semibold text-truncate">{{ $r->name }}</div><div class="small text-muted">{{ __($datasets[$r->dataset]['label'] ?? $r->dataset) }} · {{ $r->user->name ?? '' }}</div></a>
                            <form action="{{ route('admin.reports.builder.destroy', $r) }}" method="POST" data-confirm="{{ __('Remove saved report?') }}">@csrf @method('DELETE')<button class="btn btn-sm btn-light text-danger"><i class="bi bi-trash"></i></button></form>
                        </div>
                    @empty
                        <div class="lf-empty py-3"><i class="bi bi-bookmarks"></i>{{ __('Save any report configuration to reuse it later.') }}</div>
                    @endforelse
                </div>
            </div>
        </div>

        <div class="col-xl-8">
            @if($error)<div class="alert alert-danger">{{ $error }}</div>@endif
            @if(!$result)
                <div class="card"><div class="lf-empty py-5"><i class="bi bi-bar-chart-line"></i>{{ __('Choose a dataset, filters and columns, then run the report. Group by time or a field to get counts, sums and a chart.') }}</div></div>
            @else
                @php($money = fn ($v) => money($v, false))
                <div class="card mb-3">
                    <div class="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
                        <span><i class="bi {{ $ds['icon'] }} text-primary me-2"></i>{{ __($ds['label']) }} <span class="text-muted small fw-normal">{{ $cfg['from'] }} → {{ $cfg['to'] }} · {{ $result['grouped'] ? count($result['rows']).' '.__('groups') : number_format($result['total']).' '.__('records').(count($result['rows']) < $result['total'] ? ' ('.__('showing').' '.count($result['rows']).')' : '') }}</span></span>
                        <div class="d-flex gap-2">
                            <a href="{{ route('admin.reports.builder.csv', request()->query()) }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-filetype-csv me-1"></i>{{ __('Export CSV') }}</a>
                            <button onclick="window.print()" class="btn btn-sm btn-outline-secondary"><i class="bi bi-printer me-1"></i>{{ __('Print') }}</button>
                        </div>
                    </div>
                    @if($result['grouped'] && count($result['rows']) > 1)
                        <div class="card-body pb-0"><canvas id="rbChart" style="max-height:280px"></canvas></div>
                    @endif
                    <div class="table-responsive">
                        <table class="table table-sm table-hover align-middle mb-0">
                            <thead><tr>@foreach($result['headers'] as $alias => $h)<th class="{{ in_array($h['type'] ?? '', ['money', 'number']) ? 'text-end' : '' }}">{{ __($h['label']) }}</th>@endforeach</tr></thead>
                            <tbody>
                                @forelse($result['rows'] as $row)
                                    <tr>
                                        @foreach($result['headers'] as $alias => $h)
                                            @php($v = $row[$alias] ?? null)
                                            <td class="{{ in_array($h['type'] ?? '', ['money', 'number']) ? 'text-end' : '' }} small">
                                                @if($v === null || $v === '') <span class="text-muted">—</span>
                                                @elseif(($h['type'] ?? '') === 'money') {{ $money($v) }}
                                                @elseif(($h['type'] ?? '') === 'datetime') {{ \Carbon\Carbon::parse($v)->format('M d, Y H:i') }}
                                                @elseif(($h['type'] ?? '') === 'bool') {{ $v ? __('Yes') : __('No') }}
                                                @elseif(($h['type'] ?? '') === 'number') {{ is_numeric($v) ? rtrim(rtrim(number_format((float) $v, 2), '0'), '.') : $v }}
                                                @else {{ \Illuminate\Support\Str::limit((string) $v, 80) }}
                                                @endif
                                            </td>
                                        @endforeach
                                    </tr>
                                @empty
                                    <tr><td colspan="{{ count($result['headers']) }}"><div class="lf-empty"><i class="bi bi-inbox"></i>{{ __('No data for this selection.') }}</div></td></tr>
                                @endforelse
                            </tbody>
                            @if($result['sums'])
                                <tfoot><tr class="fw-bold">@foreach($result['headers'] as $alias => $h)<td class="{{ in_array($h['type'] ?? '', ['money', 'number']) ? 'text-end' : '' }}">@if(isset($result['sums'][$alias])){{ ($h['type'] ?? '') === 'money' ? $money($result['sums'][$alias]) : number_format($result['sums'][$alias], is_int($result['sums'][$alias]) ? 0 : 2) }}@elseif($loop->first){{ __('Total') }}@endif</td>@endforeach</tr></tfoot>
                            @endif
                        </table>
                    </div>
                </div>
            @endif
        </div>
    </div>

    <div class="modal fade" id="saveModal" tabindex="-1"><div class="modal-dialog"><form class="modal-content" method="POST" action="{{ route('admin.reports.builder.save') }}" id="saveForm">@csrf
        <div class="modal-header"><h5 class="modal-title">{{ __('Save report') }}</h5><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
        <div class="modal-body"><label class="form-label">{{ __('Name') }}</label><input type="text" name="name" class="form-control" placeholder="{{ __('Monthly paid orders') }}" required><div class="form-check form-switch mt-3"><input class="form-check-input" type="checkbox" role="switch" name="is_shared" value="1" id="shared" checked><label class="form-check-label" for="shared">{{ __('Visible to other admins') }}</label></div><div id="saveHidden"></div></div>
        <div class="modal-footer"><button type="button" class="btn btn-light" data-bs-dismiss="modal">{{ __('Cancel') }}</button><button class="btn btn-primary">{{ __('Save') }}</button></div>
    </form></div></div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
<script>
(function () {
    // copy the current builder form into the save modal as hidden inputs
    var save = document.getElementById('saveForm'), holder = document.getElementById('saveHidden');
    save.addEventListener('submit', function () {
        holder.innerHTML = '';
        new FormData(document.getElementById('rbForm')).forEach(function (v, k) { if (k === 'run') return; var i = document.createElement('input'); i.type = 'hidden'; i.name = k; i.value = v; holder.appendChild(i); });
    });
    var el = document.getElementById('rbChart'); if (!el || !window.Chart) return;
    var rows = @json($result['rows'] ?? []), headers = @json($result['headers'] ?? []);
    var labelKey = headers.period ? 'period' : (headers.group_value ? 'group_value' : null); if (!labelKey) return;
    var dark = document.documentElement.getAttribute('data-bs-theme') === 'dark';
    Chart.defaults.font.family = "'Plus Jakarta Sans', system-ui, sans-serif"; Chart.defaults.color = dark ? '#8b95ab' : '#64748b';
    var datasets = [{ type: 'bar', label: @json(__('Count')), data: rows.map(function (r) { return r.count; }), backgroundColor: LEARNIFY.theme.alpha(.45), borderRadius: 6, yAxisID: 'y' }];
    if (headers.sum_value) datasets.push({ type: 'line', label: headers.sum_value.label, data: rows.map(function (r) { return Number(r.sum_value || 0); }), borderColor: '#10b981', backgroundColor: 'rgba(16,185,129,.15)', fill: true, tension: .35, yAxisID: 'y1' });
    new Chart(el, { data: { labels: rows.map(function (r) { return r[labelKey] == null ? '—' : String(r[labelKey]); }), datasets: datasets }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'top', align: 'end' } }, scales: { x: { grid: { display: false } }, y: { beginAtZero: true, ticks: { precision: 0 } }, y1: { display: !!headers.sum_value, position: 'right', grid: { display: false }, beginAtZero: true } } } });
})();
</script>
@endpush